@peers-app/peers-ui 0.25.2 → 0.25.4

package/README.md

@@ -35,7 +35,8 @@ Hooks that bridge `@peers-app/peers-sdk` observables to React 18 with concurrent
 - **`OperatorConsolePanel`** — The presentational console chrome (header toolbar + body) that fills its container; the host layout owns sizing, the resize divider, the collapsed strip, and placement. Toggle the console with Ctrl+` while on the Tabs + Console layout.
 - **`SortableList`** — Drag-and-drop list powered by SortableJS
 - **`InverseLazyList`** — Bottom-anchored lazy-loading list for chat-style UIs
-- **`Tabs`** / **`ScreenTabBody`** — Tab strip and content container
+- **`Tabs`** / **`ScreenTabBody`** — Horizontal tab strip and content container for settings and detail pages
+- **`ResponsiveSectionNav`** — Section navigation inside one app. Wide screens get a left sidebar (`nav-pills`); narrow screens get a non-wrapping horizontal strip (`nav-tabs`). Its optional toolbar stays fixed while one constrained content pane owns vertical scrolling. The parent owns the route and passes the selected id. Identity uses it for persistent, route-backed quick actions.
 
 ### Communication
 

package/dist/components/markdown-editor/mention-node.d.ts

@@ -1,8 +1,10 @@
 import type { IMentionData } from "@peers-app/peers-sdk";
 import { type DOMConversionMap, type DOMExportOutput, type EditorConfig, type LexicalNode, type NodeKey, type SerializedTextNode, type Spread, TextNode } from "lexical";
+/** Serialized Lexical payload for a Peers mention node. */
 export type SerializedMentionNode = Spread<{
     data: IMentionData;
 }, SerializedTextNode>;
+/** Lexical text entity that renders and navigates a typed Peers mention. */
 export declare class MentionNode extends TextNode {
     readonly data: IMentionData;
     static getType(): string;
@@ -17,5 +19,7 @@ export declare class MentionNode extends TextNode {
     canInsertTextBefore(): boolean;
     canInsertTextAfter(): boolean;
 }
+/** Create a segmented Lexical mention node from mention data. */
 export declare function $createMentionNode(data: IMentionData): MentionNode;
+/** Return whether a Lexical node is a {@link MentionNode}. */
 export declare function $isMentionNode(node: LexicalNode | null | undefined): node is MentionNode;

package/dist/components/markdown-editor/mention-node.js

@@ -25,6 +25,7 @@ function $convertMentionElement(domNode) {
     }
     return null;
 }
+/** Lexical text entity that renders and navigates a typed Peers mention. */
 class MentionNode extends lexical_1.TextNode {
     data;
     static getType() {
@@ -81,7 +82,7 @@ class MentionNode extends lexical_1.TextNode {
             }
             else {
                 const id = this.data.id;
-                const href = `#${kind}s/${id}`;
+                const href = kind === "user" ? `identity/people/${id}` : `${kind}s/${id}`;
                 (0, globals_1.mainContentPath)(href);
             }
         });
@@ -150,11 +151,13 @@ class MentionNode extends lexical_1.TextNode {
     }
 }
 exports.MentionNode = MentionNode;
+/** Create a segmented Lexical mention node from mention data. */
 function $createMentionNode(data) {
     const mentionNode = new MentionNode(data);
     mentionNode.setMode("segmented").toggleDirectionless();
     return (0, lexical_1.$applyNodeReplacement)(mentionNode);
 }
+/** Return whether a Lexical node is a {@link MentionNode}. */
 function $isMentionNode(node) {
     return node instanceof MentionNode;
 }

package/dist/components/responsive-section-nav.d.ts

@@ -0,0 +1,34 @@
+import type { ReactNode } from "react";
+/** One destination in {@link ResponsiveSectionNav}. */
+export interface ISectionNavItem {
+    /** Stable id passed to {@link ResponsiveSectionNavProps.onSelect}. */
+    id: string;
+    /** Visible label. */
+    label: string;
+    /** Bootstrap icon class, without a leading markup wrapper. */
+    iconClassName?: string;
+    /** Optional count. Hidden when zero or omitted. */
+    badge?: number;
+}
+/** Props for {@link ResponsiveSectionNav}. */
+export interface ResponsiveSectionNavProps {
+    /** Accessible name for the section navigation. */
+    label: string;
+    /** Sections in display order. */
+    sections: ISectionNavItem[];
+    /** Id of the selected section. */
+    activeSectionId: string;
+    /** Called when a section button is activated. */
+    onSelect: (sectionId: string) => void;
+    /** Optional controls that remain visible above the scrolling section body. */
+    toolbar?: ReactNode;
+    /** Selected section body. */
+    children: ReactNode;
+}
+/**
+ * Section navigation that uses a left sidebar on a wide screen and a
+ * non-wrapping horizontal strip on a narrow one.
+ *
+ * The parent owns the route. This component only reports the selected id.
+ */
+export declare function ResponsiveSectionNav(props: ResponsiveSectionNavProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/responsive-section-nav.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResponsiveSectionNav = ResponsiveSectionNav;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const globals_1 = require("../globals");
+const hooks_1 = require("../hooks");
+/**
+ * Section navigation that uses a left sidebar on a wide screen and a
+ * non-wrapping horizontal strip on a narrow one.
+ *
+ * The parent owns the route. This component only reports the selected id.
+ */
+function ResponsiveSectionNav(props) {
+    const [desktop] = (0, hooks_1.useObservable)(globals_1.isDesktop);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: `d-flex h-100 overflow-hidden ${desktop ? "flex-row" : "flex-column"}`, style: { minHeight: 0, minWidth: 0 }, children: [(0, jsx_runtime_1.jsx)("nav", { "aria-label": props.label, className: desktop ? "border-end p-3 overflow-auto" : "border-bottom px-2 pt-2 pb-1", style: desktop ? { flex: "0 0 220px", width: 220 } : undefined, children: (0, jsx_runtime_1.jsx)("ul", { className: `nav ${desktop ? "nav-pills flex-column" : "nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden"}`, children: props.sections.map((section) => {
+                        const selected = section.id === props.activeSectionId;
+                        return ((0, jsx_runtime_1.jsx)("li", { className: "nav-item", children: (0, jsx_runtime_1.jsxs)("button", { type: "button", className: `nav-link d-flex align-items-center gap-2 w-100 text-start ${selected ? "active" : ""}`, "aria-current": selected ? "page" : undefined, onClick: () => props.onSelect(section.id), children: [section.iconClassName ? (0, jsx_runtime_1.jsx)("i", { className: section.iconClassName }) : null, (0, jsx_runtime_1.jsx)("span", { children: section.label }), section.badge ? ((0, jsx_runtime_1.jsx)("span", { className: `badge ${selected ? "bg-light text-primary" : "bg-primary"}`, children: section.badge })) : null] }) }, section.id));
+                    }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "d-flex flex-column flex-grow-1 overflow-hidden", style: { minHeight: 0, minWidth: 0 }, children: [props.toolbar ? (0, jsx_runtime_1.jsx)("div", { className: "flex-shrink-0", children: props.toolbar }) : null, (0, jsx_runtime_1.jsx)("div", { className: "flex-grow-1 overflow-auto", style: { minHeight: 0, minWidth: 0 }, "data-section-scroll-container": true, children: props.children })] })] }));
+}

package/dist/components/responsive-section-nav.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/responsive-section-nav.test.js

@@ -0,0 +1,45 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const user_event_1 = __importDefault(require("@testing-library/user-event"));
+const responsive_section_nav_1 = require("./responsive-section-nav");
+jest.mock("../globals", () => {
+    const { observable: createObservable } = jest.requireActual("@peers-app/peers-sdk");
+    return { isDesktop: createObservable(true) };
+});
+const globals_1 = require("../globals");
+const sections = [
+    { id: "activity", label: "Activity", iconClassName: "bi-inbox", badge: 2 },
+    { id: "people", label: "People", iconClassName: "bi-person" },
+    { id: "groups", label: "Groups" },
+    { id: "devices", label: "Devices" },
+];
+describe("ResponsiveSectionNav", () => {
+    beforeEach(() => {
+        (0, globals_1.isDesktop)(true);
+    });
+    it("uses a vertical sidebar on desktop and marks the selected section", () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(responsive_section_nav_1.ResponsiveSectionNav, { label: "Identity", sections: sections, activeSectionId: "people", onSelect: () => undefined, toolbar: (0, jsx_runtime_1.jsx)("div", { children: "Quick actions" }), children: (0, jsx_runtime_1.jsx)("div", { children: "People body" }) }));
+        expect(react_1.screen.getByRole("navigation", { name: "Identity" }).querySelector("ul")).toHaveClass("nav-pills", "flex-column");
+        expect(react_1.screen.getByRole("button", { name: /People/ })).toHaveAttribute("aria-current", "page");
+        expect(react_1.screen.getByText("People body")).toBeInTheDocument();
+        expect(react_1.screen.getByText("Quick actions")).toBeInTheDocument();
+        expect(react_1.screen.getByText("Quick actions").closest("[data-section-scroll-container]")).toBeNull();
+        expect(react_1.screen.getByText("People body").closest("[data-section-scroll-container]")).toHaveClass("overflow-auto");
+    });
+    it("uses a non-wrapping horizontal strip on a narrow screen", () => {
+        (0, globals_1.isDesktop)(false);
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(responsive_section_nav_1.ResponsiveSectionNav, { label: "Identity", sections: sections, activeSectionId: "activity", onSelect: () => undefined, children: (0, jsx_runtime_1.jsx)("div", { children: "Activity body" }) }));
+        expect(react_1.screen.getByRole("navigation", { name: "Identity" }).querySelector("ul")).toHaveClass("nav-tabs", "flex-nowrap", "overflow-x-auto", "overflow-y-hidden");
+    });
+    it("reports the section chosen from the keyboard-focusable button", async () => {
+        const onSelect = jest.fn();
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(responsive_section_nav_1.ResponsiveSectionNav, { label: "Identity", sections: sections, activeSectionId: "activity", onSelect: onSelect, children: (0, jsx_runtime_1.jsx)("div", { children: "Activity body" }) }));
+        await user_event_1.default.click(react_1.screen.getByRole("button", { name: /Groups/ }));
+        expect(onSelect).toHaveBeenCalledWith("groups");
+    });
+});

package/dist/components/router.d.ts

@@ -1,9 +1,8 @@
 import "../screens/console-logs/console-logs-list";
-import "../screens/groups";
-import "../screens/contacts";
-import "../screens/invites";
+import "../screens/identity";
 import "../screens/network-viewer";
 import "../screens/data-explorer";
+/** Render the built-in or registered UI that owns a canonicalized route. */
 export declare function Router({ path: providedPath }?: {
     path?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/router.js

@@ -37,9 +37,9 @@ exports.Router = Router;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const globals = __importStar(require("../globals"));
 const hooks_1 = require("../hooks");
-const account_screen_1 = require("../screens/account/account-screen");
 const assistant_details_1 = require("../screens/assistants/assistant-details");
 const assistant_list_1 = require("../screens/assistants/assistant-list");
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const package_details_1 = require("../screens/packages/package-details");
 const package_list_1 = require("../screens/packages/package-list");
 const package_new_local_1 = require("../screens/packages/package-new-local");
@@ -60,17 +60,17 @@ const ui_loader_1 = require("../ui-router/ui-loader");
 const channel_view_1 = require("./messages/channel-view");
 const thread_message_list_1 = require("./messages/thread-message-list");
 require("../screens/console-logs/console-logs-list");
-require("../screens/groups");
-require("../screens/contacts");
-require("../screens/invites");
+require("../screens/identity");
 require("../screens/network-viewer");
 require("../screens/data-explorer");
+/** Render the built-in or registered UI that owns a canonicalized route. */
 function Router({ path: providedPath } = {}) {
     // Hooks must run unconditionally (same order every render)
     const [globalPath] = (0, hooks_1.useObservable)(globals.mainContentPath);
     try {
-        // Use provided path or fall back to global mainContentPath
-        let path = providedPath ?? globalPath;
+        // Use provided path or fall back to global mainContentPath.
+        // Legacy contacts, groups, devices, invites, and account paths render as Identity.
+        let path = (0, identity_routes_1.canonicalizeRoute)(providedPath ?? globalPath);
         const originalPath = path;
         path = path.toLowerCase().trim();
         path = path.split("?")[0]; // remove query string
@@ -88,9 +88,6 @@ function Router({ path: providedPath } = {}) {
         if (path === "settings" || path === "profile") {
             return (0, jsx_runtime_1.jsx)(settings_page_1.SettingsPage, {});
         }
-        if (path === "account") {
-            return (0, jsx_runtime_1.jsx)(account_screen_1.AccountScreen, {});
-        }
         if (path === "threads" || path === "") {
             return (0, jsx_runtime_1.jsx)(channel_view_1.ChannelMessages, {});
         }

package/dist/globals-hash.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/globals-hash.test.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+jest.mock("./tabs-layout/tabs-state", () => ({
+    handleMainPathChanged: (_oldPath, newPath, storage) => storage(newPath),
+    openNewTab: jest.fn(),
+}));
+const globals_1 = require("./globals");
+describe("initial hash navigation", () => {
+    it("lets an incoming legacy deep link win and canonicalizes it", () => {
+        (0, globals_1.mainContentPath)("identity/activity");
+        window.history.replaceState(null, "", "/#contacts/abcdefghijklmnopqrstuvwxy?from=link");
+        (0, globals_1.initializeHashNavigation)();
+        expect((0, globals_1.mainContentPath)()).toBe("identity/people/abcdefghijklmnopqrstuvwxy?from=link");
+        expect(window.location.hash).toBe("#identity/people/abcdefghijklmnopqrstuvwxy?from=link");
+    });
+});

package/dist/globals.d.ts

@@ -1,14 +1,25 @@
 import { type IMessage, type IUser } from "@peers-app/peers-sdk";
+/** Counter incremented when installed package UI should reload. */
 export declare const packageReloaded: import("@peers-app/peers-sdk").Observable<number>;
+/** Persisted route for the active data context. Prefer {@link mainContentPath}. */
 export declare const _mainContentPath: import("@peers-app/peers-sdk").PersistentVar<string>;
+/** Canonical navigation observable backed by the active tab state. */
 export declare const mainContentPath: import("@peers-app/peers-sdk").Observable<string>;
+/** Read or update one query parameter on {@link mainContentPath}. */
 export declare function queryParam(name: string, value?: string): string;
+/** Open a message thread in its owning app tab. */
 export declare function openThread(thread: string | IMessage): Promise<void>;
+/** Resolve a message and open its root thread in a new tab. */
 export declare function openThreadInTab(thread: string | IMessage): Promise<void>;
+/** Signed profile for the active user after {@link loadGlobals}. */
 export declare let me: IUser;
+/** Current browser viewport width. */
 export declare const windowWidth: import("@peers-app/peers-sdk").Observable<number>;
+/** Current browser viewport height. */
 export declare const windowHeight: import("@peers-app/peers-sdk").Observable<number>;
+/** True when the viewport uses wide-screen navigation. */
 export declare const isDesktop: import("@peers-app/peers-sdk").Observable<boolean>;
+/** Enabled groups available to the active user. */
 export declare const groups: import("@peers-app/peers-sdk").Observable<{
     name: string;
     description: string;
@@ -21,4 +32,12 @@ export declare const groups: import("@peers-app/peers-sdk").Observable<{
     iconClassName?: string | undefined;
     publicRole?: import("@peers-app/peers-sdk").GroupMemberRole | undefined;
 }[]>;
+/**
+ * Start two-way hash synchronization after routes and persisted tabs are restored.
+ *
+ * A non-empty startup hash wins over persisted navigation so canonical and legacy
+ * deep links open the destination the user requested.
+ */
+export declare function initializeHashNavigation(): void;
+/** Load global user state required before the root layout renders. */
 export declare function loadGlobals(): Promise<boolean>;

package/dist/globals.js

@@ -4,12 +4,17 @@ exports.groups = exports.isDesktop = exports.windowHeight = exports.windowWidth
 exports.queryParam = queryParam;
 exports.openThread = openThread;
 exports.openThreadInTab = openThreadInTab;
+exports.initializeHashNavigation = initializeHashNavigation;
 exports.loadGlobals = loadGlobals;
 const peers_sdk_1 = require("@peers-app/peers-sdk");
+const identity_routes_1 = require("./screens/identity/identity-routes");
 const tabs_state_1 = require("./tabs-layout/tabs-state");
 const utils_1 = require("./utils");
+/** Counter incremented when installed package UI should reload. */
 exports.packageReloaded = (0, peers_sdk_1.observable)(0);
+/** Persisted route for the active data context. Prefer {@link mainContentPath}. */
 exports._mainContentPath = (0, peers_sdk_1.groupUserVar)("mainContentPath", { defaultValue: "" });
+/** Canonical navigation observable backed by the active tab state. */
 exports.mainContentPath = (0, peers_sdk_1.computed)({
     read: () => {
         return (0, exports._mainContentPath)();
@@ -41,6 +46,7 @@ const queryParams = (0, peers_sdk_1.computed)({
         (0, exports.mainContentPath)(`${(0, exports.mainContentPath)().split("?")[0]}?${params.toString()}`);
     },
 });
+/** Read or update one query parameter on {@link mainContentPath}. */
 function queryParam(name, value) {
     const params = queryParams();
     if (value !== undefined) {
@@ -57,9 +63,11 @@ function queryParam(name, value) {
     }
     return params[name];
 }
+/** Open a message thread in its owning app tab. */
 async function openThread(thread) {
     openThreadInTab(thread);
 }
+/** Resolve a message and open its root thread in a new tab. */
 async function openThreadInTab(thread) {
     const threadId = typeof thread === "string" ? thread : thread.messageId;
     const message = await (0, peers_sdk_1.Messages)().get(threadId);
@@ -89,20 +97,63 @@ peers_sdk_1.rpcClientCalls.openThread = async (threadId) => {
     console.warn("Opening thread:", threadId);
     openThread(threadId);
 };
+/** Signed profile for the active user after {@link loadGlobals}. */
 exports.me = null;
+/** Current browser viewport width. */
 exports.windowWidth = (0, peers_sdk_1.observable)(window.innerWidth); //.extend({ rateLimit: 500 });
+/** Current browser viewport height. */
 exports.windowHeight = (0, peers_sdk_1.observable)(window.innerHeight); //.extend({ rateLimit: 500 });
 window.addEventListener("resize", (_ev) => {
     (0, exports.windowWidth)(window.innerWidth);
     (0, exports.windowHeight)(window.innerHeight);
 });
+/** True when the viewport uses wide-screen navigation. */
 exports.isDesktop = (0, peers_sdk_1.computed)(() => {
     // return windowWidth() > 1200;
     return (0, exports.windowWidth)() > 992;
     // return windowWidth() > 768;
 });
+/** Enabled groups available to the active user. */
 exports.groups = (0, peers_sdk_1.observable)([]);
 let globalsLoaded = false;
+let hashNavigationInitialized = false;
+/**
+ * Start two-way hash synchronization after routes and persisted tabs are restored.
+ *
+ * A non-empty startup hash wins over persisted navigation so canonical and legacy
+ * deep links open the destination the user requested.
+ */
+function initializeHashNavigation() {
+    if (hashNavigationInitialized) {
+        return;
+    }
+    hashNavigationInitialized = true;
+    const updateWindowHash = () => {
+        const currentPath = window.location.hash.substring(1);
+        const expectedPath = (0, exports.mainContentPath)() || "";
+        if (currentPath !== expectedPath) {
+            window.location.hash = expectedPath;
+        }
+    };
+    const navigateFromHash = () => {
+        const requestedPath = (0, identity_routes_1.canonicalizeRoute)(window.location.hash.substring(1));
+        if (requestedPath !== (0, exports.mainContentPath)()) {
+            (0, exports.mainContentPath)(requestedPath);
+        }
+        else {
+            updateWindowHash();
+        }
+    };
+    exports.mainContentPath.subscribe(updateWindowHash);
+    window.addEventListener("hashchange", navigateFromHash);
+    if (window.location.hash.substring(1)) {
+        navigateFromHash();
+    }
+    else {
+        updateWindowHash();
+    }
+}
+/** Load global user state required before the root layout renders. */
 async function loadGlobals() {
     if (globalsLoaded)
         return true;
@@ -119,18 +170,6 @@ async function loadGlobals() {
         exports._mainContentPath.loadingPromise,
         (0, peers_sdk_1.sleep)(100),
     ]);
-    function updateWindowHash() {
-        const currentPath = window.location.hash.substring(1);
-        const expectedPath = (0, exports.mainContentPath)() || "";
-        // console.log({ expectedPath, currentPath });
-        if (currentPath !== expectedPath) {
-            window.location.hash = expectedPath;
-        }
-        (0, exports.mainContentPath)(expectedPath);
-    }
-    exports.mainContentPath.subscribe(updateWindowHash);
-    updateWindowHash();
-    window.addEventListener("hashchange", () => (0, exports.mainContentPath)(window.location.hash.substring(1)));
     return true;
 }
 if (typeof window !== "undefined") {

package/dist/hooks/use-host-contract.d.ts

@@ -0,0 +1,18 @@
+import { type IContractConsumerBase, type IHostContractConsumer } from "@peers-app/peers-sdk";
+/** Live consumer for one host contract, plus the last failure to obtain it. */
+export interface IUseHostContractResult<T extends IContractConsumerBase> {
+    /** Current consumer, or `undefined` while the host transport is down. */
+    consumer: T | undefined;
+    /** Set when `get` rejects, for example when the transport wait times out. */
+    error: Error | undefined;
+}
+/**
+ * Resolve a cached local-host contract consumer and keep it current across reconnects.
+ *
+ * The handle owns caching and disposal. This hook re-reads it when the host transport
+ * changes. Read `consumer.observables.*` with `useObservable`.
+ *
+ * @param accessor Handle from `hostContractConsumer`, stable for the lifetime of the screen module.
+ * @returns The current consumer and the last error.
+ */
+export declare function useHostContract<T extends IContractConsumerBase>(accessor: IHostContractConsumer<T>): IUseHostContractResult<T>;

package/dist/hooks/use-host-contract.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useHostContract = useHostContract;
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const react_1 = require("react");
+/**
+ * Resolve a cached local-host contract consumer and keep it current across reconnects.
+ *
+ * The handle owns caching and disposal. This hook re-reads it when the host transport
+ * changes. Read `consumer.observables.*` with `useObservable`.
+ *
+ * @param accessor Handle from `hostContractConsumer`, stable for the lifetime of the screen module.
+ * @returns The current consumer and the last error.
+ */
+function useHostContract(accessor) {
+    const [consumer, setConsumer] = (0, react_1.useState)();
+    const [error, setError] = (0, react_1.useState)();
+    (0, react_1.useEffect)(() => {
+        let cancelled = false;
+        const apply = (next) => {
+            if (cancelled) {
+                return;
+            }
+            setConsumer(next);
+            setError(undefined);
+        };
+        const fail = (cause) => {
+            if (cancelled) {
+                return;
+            }
+            setError(cause instanceof Error ? cause : new Error(String(cause)));
+        };
+        const load = () => {
+            accessor.get().then(apply, fail);
+        };
+        load();
+        const unsubscribe = (0, peers_sdk_1.subscribeHostContractTransport)((transport) => {
+            if (cancelled) {
+                return;
+            }
+            if (!transport) {
+                setConsumer(undefined);
+                return;
+            }
+            load();
+        }, { emitCurrent: false });
+        return () => {
+            cancelled = true;
+            unsubscribe();
+        };
+    }, [accessor]);
+    return { consumer, error };
+}

package/dist/index.d.ts

@@ -3,6 +3,7 @@ export type { IEditorEffects, IMarkdownEditorProps } from "./components/markdown
 export { MarkdownEditor } from "./components/markdown-editor/editor";
 export * from "./components/markdown-editor/editor-inline";
 export * from "./components/markdown-with-mentions";
+export * from "./components/responsive-section-nav";
 export * from "./components/sortable-list";
 export * from "./components/tabs";
 export { Typeahead, type TypeaheadItem } from "./components/typeahead";

package/dist/index.js

@@ -20,6 +20,7 @@ var editor_1 = require("./components/markdown-editor/editor");
 Object.defineProperty(exports, "MarkdownEditor", { enumerable: true, get: function () { return editor_1.MarkdownEditor; } });
 __exportStar(require("./components/markdown-editor/editor-inline"), exports);
 __exportStar(require("./components/markdown-with-mentions"), exports);
+__exportStar(require("./components/responsive-section-nav"), exports);
 __exportStar(require("./components/sortable-list"), exports);
 __exportStar(require("./components/tabs"), exports);
 var typeahead_1 = require("./components/typeahead");

package/dist/peers-services-registration.d.ts

@@ -1,5 +1 @@
-/** Set when the user has completed challenge-response registration (ISO timestamp). */
-export declare const registrationStatusPvar: import("@peers-app/peers-sdk").PersistentVar<string>;
-export declare const servicesTokenPvar: import("@peers-app/peers-sdk").PersistentVar<string>;
-/** Store JWT and local "registered" flag after a successful `registerWithPeersServices` call. */
-export declare function persistPeersServicesRegistration(token: string): void;
+export { persistPeersServicesRegistration, registrationStatusPvar, servicesTokenPvar, } from "@peers-app/peers-sdk";

package/dist/peers-services-registration.js

@@ -1,18 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.servicesTokenPvar = exports.registrationStatusPvar = void 0;
-exports.persistPeersServicesRegistration = persistPeersServicesRegistration;
-const peers_sdk_1 = require("@peers-app/peers-sdk");
-/** Set when the user has completed challenge-response registration (ISO timestamp). */
-exports.registrationStatusPvar = (0, peers_sdk_1.userVar)("PEERS_SERVICES_REGISTERED", {
-    defaultValue: "",
-});
-exports.servicesTokenPvar = (0, peers_sdk_1.userVar)("PEERS_SERVICES_TOKEN", {
-    isSecret: true,
-    defaultValue: "",
-});
-/** Store JWT and local "registered" flag after a successful `registerWithPeersServices` call. */
-function persistPeersServicesRegistration(token) {
-    (0, exports.servicesTokenPvar)(token);
-    (0, exports.registrationStatusPvar)(new Date().toISOString());
-}
+exports.servicesTokenPvar = exports.registrationStatusPvar = exports.persistPeersServicesRegistration = void 0;
+// The pvar definitions live in peers-sdk so headless hosts and UIs share one set of names.
+var peers_sdk_1 = require("@peers-app/peers-sdk");
+Object.defineProperty(exports, "persistPeersServicesRegistration", { enumerable: true, get: function () { return peers_sdk_1.persistPeersServicesRegistration; } });
+Object.defineProperty(exports, "registrationStatusPvar", { enumerable: true, get: function () { return peers_sdk_1.registrationStatusPvar; } });
+Object.defineProperty(exports, "servicesTokenPvar", { enumerable: true, get: function () { return peers_sdk_1.servicesTokenPvar; } });

package/dist/root-layout/root-layout-host.js

@@ -20,6 +20,8 @@ const react_1 = require("react");
 const command_palette_ui_1 = require("../command-palette/command-palette-ui");
 const globals_1 = require("../globals");
 const hooks_1 = require("../hooks");
+const identity_ipc_1 = require("../screens/device-pairing/identity-ipc");
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const invite_capture_1 = require("../screens/invites/invite-capture");
 const color_mode_dropdown_1 = require("../screens/settings/color-mode-dropdown");
 const setup_user_1 = require("../screens/setup-user");
@@ -41,8 +43,8 @@ function RootLayoutHost() {
     });
     const userIdRef = (0, react_1.useRef)(undefined);
     const userId = (0, hooks_1.usePromise)(async () => {
-        const _userId = await peers_sdk_1.rpcServerCalls.getUserId();
-        return _userId || null;
+        const session = await (await (0, identity_ipc_1.identityTools)()).getSession();
+        return session.userId || null;
     });
     userIdRef.current = userId;
     (0, react_1.useEffect)(() => {
@@ -54,7 +56,7 @@ function RootLayoutHost() {
         const stopOpenUrl = (0, invite_capture_1.listenForOpenUrlInvites)();
         const sub = invite_capture_1.inviteCaptured.subscribe(() => {
             if (userIdRef.current && (0, invite_capture_1.peekPendingInvite)()) {
-                (0, globals_1.mainContentPath)(invite_capture_1.ACCEPT_INVITE_PATH);
+                (0, globals_1.mainContentPath)(identity_routes_1.IDENTITY_ACCEPT_PATH);
             }
         });
         return () => {
@@ -92,8 +94,9 @@ function RootLayoutBootstrap(props) {
             tabs_state_1.recentlyUsedApps.loadingPromise,
             peers_sdk_1.hasShownWelcomeModal.loadingPromise,
         ]);
+        (0, globals_1.initializeHashNavigation)();
         if ((0, invite_capture_1.peekPendingInvite)()) {
-            (0, globals_1.mainContentPath)(invite_capture_1.ACCEPT_INVITE_PATH);
+            (0, globals_1.mainContentPath)(identity_routes_1.IDENTITY_ACCEPT_PATH);
         }
         return true;
     });

package/dist/root-layout/root-layout-host.test.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("@testing-library/react");
 const globals_1 = require("../globals");
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const invite_capture_1 = require("../screens/invites/invite-capture");
 const root_layout_host_1 = require("./root-layout-host");
 const TOKEN = "eyJhbGciOiJub25lIn0-_abcdefghijklmnopqrstuvwxyz0123456789";
@@ -13,10 +14,6 @@ jest.mock("@peers-app/peers-sdk", () => {
         hasShownWelcomeModal: Object.assign(jest.fn(() => true), {
             loadingPromise: Promise.resolve(),
         }),
-        rpcServerCalls: {
-            ...actual.rpcServerCalls,
-            getUserId: jest.fn(async () => "local-user"),
-        },
         setDefaultClientUserContext: jest.fn(),
     };
 });
@@ -31,7 +28,7 @@ jest.mock("../hooks", () => ({
     useObservable: (observable) => [observable(), observable],
     usePromise: (promiseOrFactory) => {
         if (typeof promiseOrFactory === "function" &&
-            Function.prototype.toString.call(promiseOrFactory).includes("getUserId")) {
+            Function.prototype.toString.call(promiseOrFactory).includes("getSession")) {
             return "local-user";
         }
         return true;
@@ -76,7 +73,7 @@ describe("RootLayoutHost", () => {
         (0, react_1.fireEvent)(window, new HashChangeEvent("hashchange"));
         expect(window.location.hash).toBe("");
         expect((0, invite_capture_1.peekPendingInvite)()).toBe(TOKEN);
-        expect(globals_1.mainContentPath).toHaveBeenCalledWith(invite_capture_1.ACCEPT_INVITE_PATH);
+        expect(globals_1.mainContentPath).toHaveBeenCalledWith(identity_routes_1.IDENTITY_ACCEPT_PATH);
         expect(globals_1.mainContentPath).not.toHaveBeenCalledWith(expect.stringContaining(TOKEN));
     });
     it("ignores ordinary hash routes", () => {

package/dist/screens/account/account-screen.d.ts

@@ -1 +1,2 @@
+/** Identity profile, public identifiers, device shortcuts, and service registration. */
 export declare function AccountScreen(): import("react/jsx-runtime").JSX.Element;