nudge-ui 0.2.1 → 0.2.2

package/dist/transport/editor.js

@@ -1,13 +1,17 @@
-import { NUDGE_UI_CLIENT_PATH, NUDGE_UI_DIRECT_QUERY_PARAM, NUDGE_UI_EDITOR_QUERY_PARAM, NUDGE_UI_EDITOR_QUERY_VALUE, NUDGE_UI_EDITOR_PATH, NUDGE_UI_MANIFEST_PATH, NUDGE_UI_MOUNT_ID, isReservedNudgeUiRoute, } from "./routes.js";
+import { NUDGE_UI_CLIENT_PATH, NUDGE_UI_DIRECT_QUERY_PARAM, NUDGE_UI_EDITOR_QUERY_PARAM, NUDGE_UI_EDITOR_QUERY_VALUE, NUDGE_UI_EDITOR_PATH, NUDGE_UI_MANIFEST_PATH, NUDGE_UI_MOUNT_ID, NUDGE_UI_OFF_QUERY_VALUE, NUDGE_UI_ON_QUERY_VALUE, isReservedNudgeUiRoute, } from "./routes.js";
 const TARGET_QUERY_PARAM = "url";
 const DIRECT_TAB_SESSION_KEY = "nudge-ui:direct-tab";
+const FORCED_TAB_SESSION_KEY = "nudge-ui:forced-tab";
 /** Returns the editor URL for one same-origin application location. */
 export function createNudgeUiEditorUrl(applicationHref) {
     const applicationUrl = new URL(applicationHref);
     assertApplicationUrl(applicationUrl);
     const retainedSegments = applicationUrl.search.slice(1).split("&").filter((segment) => {
         const entry = new URLSearchParams(segment);
-        return entry.get(NUDGE_UI_DIRECT_QUERY_PARAM) !== "1";
+        const value = entry.get(NUDGE_UI_EDITOR_QUERY_PARAM);
+        return entry.get(NUDGE_UI_DIRECT_QUERY_PARAM) !== "1"
+            && value !== NUDGE_UI_OFF_QUERY_VALUE
+            && value !== NUDGE_UI_ON_QUERY_VALUE;
     });
     applicationUrl.search = retainedSegments.join("&");
     if (applicationUrl.searchParams.getAll(NUDGE_UI_EDITOR_QUERY_PARAM).includes(NUDGE_UI_EDITOR_QUERY_VALUE)) {
@@ -72,36 +76,63 @@ export function createNudgeUiDirectUrl(applicationHref) {
     url.searchParams.set(NUDGE_UI_DIRECT_QUERY_PARAM, "1");
     return url.href;
 }
+/** Reads the public `nudge-ui=off` / `nudge-ui=on` switch from an application URL. */
+export function readNudgeUiQuerySwitch(href) {
+    const url = new URL(href);
+    const values = url.searchParams.getAll(NUDGE_UI_EDITOR_QUERY_PARAM);
+    if (values.includes(NUDGE_UI_OFF_QUERY_VALUE) || url.searchParams.get(NUDGE_UI_DIRECT_QUERY_PARAM) === "1") {
+        return "off";
+    }
+    return values.includes(NUDGE_UI_ON_QUERY_VALUE) ? "on" : null;
+}
 /** Returns whether this application location explicitly bypasses editor entry. */
 export function isNudgeUiDirectUrl(href) {
-    const url = new URL(href);
-    return url.searchParams.get(NUDGE_UI_DIRECT_QUERY_PARAM) === "1";
+    return readNudgeUiQuerySwitch(href) === "off";
 }
 /** Remembers that this browser tab was explicitly opened outside the editor. */
 export function rememberNudgeUiDirectTabIntent() {
+    rememberNudgeUiTabSwitch("off");
+}
+/** Remembers an explicit URL switch so later navigations in this tab keep it. */
+export function rememberNudgeUiTabSwitch(value) {
     try {
-        sessionStorage.setItem(DIRECT_TAB_SESSION_KEY, "1");
+        sessionStorage.setItem(value === "off" ? DIRECT_TAB_SESSION_KEY : FORCED_TAB_SESSION_KEY, "1");
+        sessionStorage.removeItem(value === "off" ? FORCED_TAB_SESSION_KEY : DIRECT_TAB_SESSION_KEY);
     }
     catch {
-        // Storage denial must not prevent a one-page direct application view.
+        // Storage denial must not prevent the current page from honoring the switch.
     }
 }
 /** Returns whether this browser tab should remain outside the editor. */
 export function hasNudgeUiDirectTabIntent() {
+    return readTabFlag(DIRECT_TAB_SESSION_KEY);
+}
+/** Returns whether this browser tab explicitly asked for the editor with `nudge-ui=on`. */
+export function hasNudgeUiForcedTabIntent() {
+    return readTabFlag(FORCED_TAB_SESSION_KEY);
+}
+function readTabFlag(key) {
     try {
-        return sessionStorage.getItem(DIRECT_TAB_SESSION_KEY) === "1";
+        return sessionStorage.getItem(key) === "1";
     }
     catch {
         return false;
     }
 }
 /** Chooses the browser-client role before any runtime manifest is fetched. */
-export function resolveNudgeUiClientEntry(href, editorDocument, canvasRenderer, directTab = false) {
-    if (editorDocument || canvasRenderer)
+export function resolveNudgeUiClientEntry(href, context) {
+    if (context.editorDocument || context.canvasRenderer)
         return { kind: "bootstrap" };
-    if (isNudgeUiDirectUrl(href) || directTab)
+    const urlSwitch = readNudgeUiQuerySwitch(href);
+    if (urlSwitch === "off")
+        return { kind: "direct" };
+    const forced = urlSwitch === "on" || context.forcedTab === true;
+    if (!forced && context.directTab === true)
         return { kind: "direct" };
-    return { kind: "redirect", href: createNudgeUiEditorUrl(href) };
+    const editorHref = createNudgeUiEditorUrl(href);
+    if (context.automated === true && !forced)
+        return { kind: "automated", href: editorHref };
+    return { kind: "redirect", href: editorHref };
 }
 function isApplicationUrl(url) {
     return (url.protocol === "http:" || url.protocol === "https:")

package/dist/transport/routes.d.ts

@@ -15,6 +15,9 @@ export declare const NUDGE_UI_MOUNT_ID = "nudge-ui-root";
 /** Query marker that presents an application route through the editor shell. */
 export declare const NUDGE_UI_EDITOR_QUERY_PARAM = "nudge-ui";
 export declare const NUDGE_UI_EDITOR_QUERY_VALUE = "editor";
-/** Query parameter that opens an application document without the editor. */
+/** Public `nudge-ui` values that turn the inspector off or on for one browser tab. */
+export declare const NUDGE_UI_OFF_QUERY_VALUE = "off";
+export declare const NUDGE_UI_ON_QUERY_VALUE = "on";
+/** Internal alias of `nudge-ui=off` kept for existing direct-view links. */
 export declare const NUDGE_UI_DIRECT_QUERY_PARAM = "__nudge_ui_direct";
 export declare function isReservedNudgeUiRoute(pathname: string): boolean;

package/dist/transport/routes.js

@@ -15,7 +15,10 @@ export const NUDGE_UI_MOUNT_ID = "nudge-ui-root";
 /** Query marker that presents an application route through the editor shell. */
 export const NUDGE_UI_EDITOR_QUERY_PARAM = "nudge-ui";
 export const NUDGE_UI_EDITOR_QUERY_VALUE = "editor";
-/** Query parameter that opens an application document without the editor. */
+/** Public `nudge-ui` values that turn the inspector off or on for one browser tab. */
+export const NUDGE_UI_OFF_QUERY_VALUE = "off";
+export const NUDGE_UI_ON_QUERY_VALUE = "on";
+/** Internal alias of `nudge-ui=off` kept for existing direct-view links. */
 export const NUDGE_UI_DIRECT_QUERY_PARAM = "__nudge_ui_direct";
 export function isReservedNudgeUiRoute(pathname) {
     return pathname === NUDGE_UI_ROUTE_PREFIX.slice(0, -1)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nudge-ui",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "Development-only visual UI inspector. One package, one subpath per host.",
   "license": "MIT",
   "repository": {

package/dist/inspector/shell/DomNavigation.d.ts

@@ -1,8 +0,0 @@
-import type { ReactElement } from "react";
-import type { SelectedElement } from "../selection/selectionStore.js";
-interface DomNavigationProps {
-    selected: SelectedElement;
-    hierarchy: HTMLElement[];
-}
-export declare function DomNavigation({ selected, hierarchy }: DomNavigationProps): ReactElement | null;
-export {};

package/dist/inspector/shell/DomNavigation.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { resolveSelectionFromElement } from "../selection/resolveSelection.js";
-import { setSelectedElement } from "../selection/selectionStore.js";
-import { computeDescendants } from "../selection/hierarchy.js";
-import { Button } from "../ui/Button.js";
-const MAX_PARENT_LEVELS = 2;
-const MAX_CHILD_NODES = 2;
-function nodeLabel(node) {
-    return node.getAttribute("data-cid") ?? node.localName;
-}
-function nodeDescription(node) {
-    const id = node.id ? `#${node.id}` : "";
-    const className = typeof node.className === "string"
-        ? node.className.trim().split(/\s+/).filter(Boolean).slice(0, 2).map((name) => `.${name}`).join("")
-        : "";
-    const source = node.getAttribute("data-src");
-    return `${node.localName}${id}${className}${source ? ` — ${source}` : ""}`;
-}
-function selectNode(node) {
-    const resolved = resolveSelectionFromElement(node);
-    if (resolved)
-        setSelectedElement(resolved);
-}
-export function DomNavigation({ selected, hierarchy }) {
-    const parents = hierarchy.slice(1, MAX_PARENT_LEVELS + 1);
-    const children = computeDescendants(selected.domElement, 2, MAX_CHILD_NODES);
-    if (parents.length === 0 && children.length === 0)
-        return null;
-    return (_jsxs("section", { className: "dom-navigation", "data-test": "dom-navigation", "aria-label": "DOM navigation", children: [_jsx("div", { className: "dom-navigation__header", children: _jsx("span", { className: "dom-navigation__title", children: "DOM" }) }), parents.length > 0 ? (_jsxs("div", { className: "dom-navigation__group", "data-test": "dom-parents", children: [_jsx("span", { className: "dom-navigation__label", children: "Parents" }), _jsx("div", { className: "dom-navigation__items", children: parents.map((node, index) => (_jsxs(Button, { size: "compact", variant: "quiet", className: "dom-navigation__item", "data-test": "dom-parent-step", "data-depth": index + 1, "data-cid": node.getAttribute("data-cid") ?? undefined, title: nodeDescription(node), onClick: () => selectNode(node), children: [_jsx("span", { "aria-hidden": "true", children: "\u2191" }), index === 0 ? "Parent" : "Grandparent", _jsx("span", { className: "dom-navigation__value", children: nodeLabel(node) })] }, `${index}-${nodeLabel(node)}`))) })] })) : null, children.length > 0 ? (_jsxs("div", { className: "dom-navigation__group", "data-test": "dom-children", children: [_jsx("span", { className: "dom-navigation__label", children: "Children" }), _jsx("div", { className: "dom-navigation__items", children: children.map(({ element, depth }, index) => (_jsxs(Button, { size: "compact", variant: "quiet", className: "dom-navigation__item", "data-test": "dom-child-step", "data-depth": depth, "data-cid": element.getAttribute("data-cid") ?? undefined, title: nodeDescription(element), onClick: () => selectNode(element), children: [_jsx("span", { "aria-hidden": "true", children: "\u2193" }), depth === 1 ? "Child" : "Descendant", _jsx("span", { className: "dom-navigation__value", children: nodeLabel(element) })] }, `${depth}-${index}-${nodeLabel(element)}`))) })] })) : null] }));
-}