@k2b/cloud 0.39.0 → 0.41.0

package/src/browser/panel-context-receiver.ts

@@ -0,0 +1,53 @@
+import { isPanelContextMessage } from "../contracts/panel-context-plain";
+import {
+  PANEL_CONTEXT_CHANGED,
+  PANEL_CONTEXT_ELEMENT,
+  PANEL_SHORTCUTS_CHANGED,
+  PANEL_SHORTCUTS_ELEMENT,
+  readProviderContext,
+} from "./panel-context-bridge";
+
+/** Installed only by an embedded PanelRuntime; the public page publisher never imports validation. */
+export function installPanelContextReceiver(): () => void {
+  let element = document.getElementById(PANEL_CONTEXT_ELEMENT);
+  if (!element) {
+    element = document.createElement("script");
+    element.id = PANEL_CONTEXT_ELEMENT;
+    element.setAttribute("type", "application/json");
+    element.textContent = "null";
+    document.body.append(element);
+  }
+  let shortcutsElement = document.getElementById(PANEL_SHORTCUTS_ELEMENT);
+  if (!shortcutsElement) {
+    shortcutsElement = document.createElement("script");
+    shortcutsElement.id = PANEL_SHORTCUTS_ELEMENT;
+    shortcutsElement.setAttribute("type", "application/json");
+    shortcutsElement.textContent = "[]";
+    document.body.append(shortcutsElement);
+  }
+  const first = readProviderContext();
+  let pageId = first?.pageId;
+  let seq = first?.seq ?? 0;
+  const receive = (event: MessageEvent<unknown>) => {
+    if (event.source !== window.parent || event.origin !== location.origin || !isPanelContextMessage(event.data)) return;
+    const context = event.data.context;
+    if (context) {
+      if ((pageId !== undefined && context.pageId !== pageId) || context.seq < seq) return;
+      pageId = context.pageId;
+      seq = context.seq;
+    }
+    // Null revokes the current context without forgetting document identity or ordering.
+    const contextJson = JSON.stringify(context);
+    const contextChanged = element.textContent !== contextJson;
+    element.textContent = contextJson;
+    const shortcuts = JSON.stringify(context ? (event.data.shortcuts ?? []) : []);
+    const shortcutsChanged = shortcutsElement.textContent !== shortcuts;
+    shortcutsElement.textContent = shortcuts;
+    // Remember accepted snapshots, including empty ones, across Help remounts.
+    shortcutsElement.setAttribute("data-received", "");
+    if (shortcutsChanged) window.dispatchEvent(new Event(PANEL_SHORTCUTS_CHANGED));
+    if (contextChanged || !shortcutsChanged) window.dispatchEvent(new Event(PANEL_CONTEXT_CHANGED));
+  };
+  window.addEventListener("message", receive);
+  return () => window.removeEventListener("message", receive);
+}

package/src/browser/panel-menu.tsx

@@ -0,0 +1,56 @@
+import { Dropdown } from "@k2b/ui";
+import { createSignal, onCleanup, onMount } from "solid-js";
+import { platformMessages } from "../ssr/platform-messages";
+import type { PanelState } from "./panel-context-bridge";
+
+/**
+ * The slot head's ⋯ menu for providers that need consent. The lazy slot controller mounts it over the server's
+ * placeholder button, so it costs no island and can never change an answer before the controller listens. Only
+ * document events cross the menu/controller boundary.
+ */
+export default function PanelMenu(props: { initial: PanelState; locale: string }) {
+  const t = () => platformMessages.resolve([props.locale]).t;
+  const [state, setState] = createSignal(props.initial);
+  const [open, setOpen] = createSignal(false);
+  onMount(() => {
+    const changed = (event: CustomEvent<PanelState>) => {
+      // A closed slot, another provider or one without consent leaves no reason for the menu to stay expanded.
+      if (!event.detail.open || event.detail.provider !== state().provider || !event.detail.consent) setOpen(false);
+      setState(event.detail);
+    };
+    window.addEventListener("cloud.panel.state", changed);
+    onCleanup(() => window.removeEventListener("cloud.panel.state", changed));
+  });
+  return (
+    <Dropdown.Root
+      open={open()}
+      onOpenChange={setOpen}
+      label={t().panelMenu}
+      position="bottom-left"
+      items={[
+        {
+          sectionLabel: t().panelFrom({ app: state().appName }),
+          items: [
+            {
+              label: t().panelShareContext,
+              choice: "checkbox",
+              // A getter: the menu keeps its rows, so a plain value would show the answer from when it opened.
+              checked: () => state().allowed,
+              disabled: state().saving,
+              action: () =>
+                window.dispatchEvent(
+                  new CustomEvent("cloud.panel.consent", {
+                    detail: { provider: state().provider, allowed: !state().allowed },
+                  }),
+                ),
+            },
+          ],
+        },
+      ]}
+    >
+      <Dropdown.Trigger iconOnly label={t().panelMenu} disabled={!state().consent}>
+        <i class="ti ti-dots" aria-hidden="true" />
+      </Dropdown.Trigger>
+    </Dropdown.Root>
+  );
+}

package/src/browser/panel-messages.ts

@@ -14,6 +14,17 @@ export function isPanelReadyMessage(value: unknown, provider: string): value is
   );
 }
 
+export function isPanelSearchMessage(value: unknown): value is { type: "cloud.panel.search"; v: 1 } {
+  return (
+    isRecord(value) &&
+    Reflect.ownKeys(value).length === 2 &&
+    Object.hasOwn(value, "type") &&
+    Object.hasOwn(value, "v") &&
+    value.type === "cloud.panel.search" &&
+    value.v === 1
+  );
+}
+
 export function isPanelCloseMessage(value: unknown): value is { type: "cloud.panel.close"; v?: 1 } {
   return (
     isRecord(value) &&

package/src/browser/panel-shortcuts.ts

@@ -0,0 +1,31 @@
+import { isPanelContextMessage } from "../contracts/panel-context-plain";
+import type { HelpShortcut } from "../ssr/layout-help-start";
+import { PANEL_SHORTCUTS_CHANGED, PANEL_SHORTCUTS_ELEMENT, readProviderContext } from "./panel-context-bridge";
+
+/** Only platform Help code imports this module; third-party providers never receive a list. */
+export function readPanelShortcuts(): HelpShortcut[] {
+  if (typeof document === "undefined") return [];
+  try {
+    const shortcuts: unknown = JSON.parse(document.getElementById(PANEL_SHORTCUTS_ELEMENT)?.textContent ?? "[]");
+    const message = {
+      type: "cloud.panel.context",
+      v: 1,
+      context: readProviderContext(),
+      shortcuts,
+    };
+    return isPanelContextMessage(message) ? (message.shortcuts ?? []) : [];
+  } catch {
+    return [];
+  }
+}
+
+export function panelShortcutsReceived(): boolean {
+  if (typeof document === "undefined") return false;
+  return document.getElementById(PANEL_SHORTCUTS_ELEMENT)?.hasAttribute("data-received") ?? false;
+}
+
+export function onPanelShortcutsChange(cb: (shortcuts: HelpShortcut[]) => void): () => void {
+  const changed = () => cb(readPanelShortcuts());
+  window.addEventListener(PANEL_SHORTCUTS_CHANGED, changed);
+  return () => window.removeEventListener(PANEL_SHORTCUTS_CHANGED, changed);
+}