@kehto/paja 0.17.1 → 0.19.0

package/dist/{chunk-ESE55K3Q.js → chunk-GY5ET3PC.js}

@@ -374,6 +374,7 @@ function createPajaRuntimeHostConfig(options = {}, now = /* @__PURE__ */ new Dat
   const base = createPajaHostConfigBase(normalizePajaSimulation(options.simulation));
   return {
     ...base,
+    ...options.csp ? { csp: options.csp } : {},
     target: {
       mode: "runtime-pointer",
       url: "about:blank",
@@ -524,6 +525,7 @@ function renderPajaHtml(config) {
       .tabs { display: flex; align-items: stretch; align-self: flex-end; gap: 4px; min-width: 120px; max-width: min(100%, 760px); overflow-x: auto; scrollbar-width: thin; }
       .tabs:empty { display: none; }
       .tab { min-width: 116px; max-width: 240px; height: 30px; display: grid; grid-template-columns: minmax(0, 1fr) 24px 24px; align-items: center; gap: 2px; border: 1px solid var(--line); border-bottom-color: transparent; background: #151815; color: var(--muted); border-radius: 5px 5px 0 0; padding: 0 2px 0 9px; }
+      .tab[data-source="local"] { grid-template-columns: minmax(0, 1fr) 24px; }
       .tab[data-active="true"] { color: var(--text); border-color: var(--accent); border-bottom-color: #151815; background: #20241f; }
       .tab-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; text-align: left; }
       .tab-share, .tab-close { width: 20px; height: 20px; padding: 0; border: 0; background: transparent; color: var(--muted); display: inline-grid; place-items: center; }
@@ -533,9 +535,21 @@ function renderPajaHtml(config) {
       label { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); white-space: nowrap; }
       select, input, textarea { border: 1px solid var(--line); color: var(--text); background: #20241f; min-height: 26px; border-radius: 4px; font: inherit; }
       main { min-height: 0; display: grid; grid-template-columns: var(--paja-console-column) minmax(0, 1fr); }
-      .console { min-height: 0; overflow: auto; border-right: 1px solid var(--line); background: #121512; padding: 10px; display: flex; flex-direction: column; gap: 12px; }
-      .section { display: grid; gap: 8px; }
+      .console { min-height: 0; overflow: auto; border-right: 1px solid var(--line); background: #121512; padding: 0; display: flex; flex-direction: column; gap: 0; }
+      .section { flex-shrink: 0; margin: 0; border-radius: 0; border-bottom: 1px solid var(--line); }
+      .section > summary { display: flex; align-items: center; justify-content: space-between; padding: 12px; cursor: pointer; list-style: none; }
+      .section > summary::-webkit-details-marker { display: none; }
+      .section > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
+      .section-chevron { transition: transform 120ms; }
+      .section[open] > summary .section-chevron { transform: rotate(90deg); }
+      .section-body { padding: 0 12px 12px; display: grid; gap: 8px; }
+      .resource-servers { display: grid; gap: 8px; }
+      .resource-servers > label { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
       .section-title { color: var(--accent); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0; }
+      .resource-servers { min-width: 0; }
+      .resource-servers label { white-space: normal; }
+      .resource-servers textarea { width: 100%; min-width: 0; padding: 6px; resize: vertical; }
+      .resource-servers small, .resource-servers [role="status"] { color: var(--muted); overflow-wrap: anywhere; }
       .switch-grid, .acl-grid { display: flex; flex-wrap: wrap; gap: 6px; }
       .toggle { height: 24px; padding: 0 8px; color: var(--muted); }
       .toggle[data-enabled="true"] { color: var(--text); border-color: #5f724f; background: #24301f; }
@@ -545,7 +559,7 @@ function renderPajaHtml(config) {
       .signer-controls button[data-active="true"] { border-color: var(--accent); color: var(--text); background: #2a2a1d; }
       .signer-controls input { min-width: 0; padding: 0 8px; }
       .signer-consent-clear { width: 100%; margin-top: 6px; }
-      .pointer-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
+      .pointer-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 6px; }
       .pointer-status { min-width: 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
       .log-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
       .log-list { min-height: 160px; max-height: 38vh; overflow: auto; border: 1px solid var(--line); border-radius: 4px; background: #0b0d0b; }
@@ -559,6 +573,7 @@ function renderPajaHtml(config) {
       .stage { min-width: 0; min-height: 0; position: relative; background: #050705; }
       .empty-stage { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: 12px; }
       .empty-stage[hidden] { display: none; }
+      .stage.drop-active { outline: 2px dashed var(--accent); outline-offset: -6px; }
       .tab-panel { position: absolute; inset: 0; min-width: 0; min-height: 0; }
       .tab-panel[hidden] { display: none; }
       iframe { width: 100%; height: 100%; border: 0; background: white; display: block; }
@@ -644,28 +659,38 @@ function renderPajaHtml(config) {
     <main>
       <aside class="console" id="${PAJA_CONSOLE_PANEL_ID}" aria-label="Paja development controls">
         ${renderPointerControls(config)}
-        <section class="section">
-          <div class="section-title">Interfaces</div>
+        <details class="section" id="paja-section-interfaces" data-paja-section="interfaces" open>
+          <summary class="section-title">Interfaces<span class="section-chevron" aria-hidden="true">\u203A</span></summary><div class="section-body">
           <div class="switch-grid" id="interface-toggles"></div>
-        </section>
-        <section class="section">
-          <div class="section-title">ACL</div>
+        </div></details>
+        <details class="section" id="paja-section-acl" data-paja-section="acl" open>
+          <summary class="section-title">ACL<span class="section-chevron" aria-hidden="true">\u203A</span></summary><div class="section-body">
           <div class="acl-grid" id="acl-controls"></div>
-        </section>
-        <section class="section">
-          <div class="section-title">Signer</div>
+        </div></details>
+        <details class="section" id="paja-section-signer" data-paja-section="signer" open>
+          <summary class="section-title">Signer<span class="section-chevron" aria-hidden="true">\u203A</span></summary><div class="section-body">
           <div class="signer" id="signer-status">loading</div>
           <div class="signer-controls" id="signer-controls"></div>
           <button type="button" class="signer-consent-clear" id="signer-consent-clear" hidden>Forget remembered approvals</button>
-        </section>
-        <section class="section">
-          <div class="section-title">Messages</div>
+        </div></details>
+        <details class="section" id="paja-section-resource-servers" data-paja-section="resource-servers" open>
+          <summary class="section-title">Resource servers<span class="section-chevron" aria-hidden="true">\u203A</span></summary><div class="section-body">
+        <form class="resource-servers" id="paja-resource-servers-form">
+          <label class="section-title" for="paja-resource-servers-input">Resource servers</label>
+          <textarea id="paja-resource-servers-input" rows="3" aria-describedby="paja-resource-servers-help paja-resource-servers-status" spellcheck="false"></textarea>
+          <small id="paja-resource-servers-help">Extra Blossom lookup servers, one per line. Domains use HTTPS.</small>
+          <button type="submit" id="paja-resource-servers-save">Save</button>
+          <div id="paja-resource-servers-status" role="status" aria-live="polite"></div>
+        </form>
+        </div></details>
+        <details class="section" id="paja-section-messages" data-paja-section="messages" open>
+          <summary class="section-title">Messages<span class="section-chevron" aria-hidden="true">\u203A</span></summary><div class="section-body">
           <div class="log-tools">
             <input id="message-filter" type="search" autocomplete="off" placeholder="filter messages" aria-label="Filter message log">
             <button type="button" id="clear-log">Clear</button>
           </div>
           <div class="log-list" id="message-log" aria-live="polite"></div>
-        </section>
+        </div></details>
       </aside>
       ${renderStage(config, targetLabel)}
     </main>
@@ -733,7 +758,7 @@ function renderConfigDialog() {
 function renderStage(config, targetLabel) {
   if (config.target.mode === "runtime-pointer") {
     return `<section class="stage" id="napplet-stage" aria-label="Loaded napplet runtimes">
-        <div class="empty-stage" id="empty-runtime-stage">Load a napplet pointer to start a runtime tab.</div>
+        <div class="empty-stage" id="empty-runtime-stage">Load a napplet pointer or drop an index.html to start a runtime tab.</div>
       </section>`;
   }
   return `<section class="stage" id="napplet-stage">
@@ -755,14 +780,16 @@ function renderDuplicateDialog() {
 function renderPointerControls(config) {
   if (config.target.mode !== "runtime-pointer") return "";
   const value = escapeAttribute(config.target.pointer?.value ?? "");
-  return `<section class="section" id="runtime-pointer-section">
-          <div class="section-title">Pointer</div>
+  return `<details class="section" id="runtime-pointer-section" data-paja-section="pointer" open>
+          <summary class="section-title">Pointer<span class="section-chevron" aria-hidden="true">\u203A</span></summary><div class="section-body">
           <form class="pointer-controls" id="runtime-pointer-form">
             <input id="runtime-pointer-input" type="text" inputmode="url" autocomplete="off" spellcheck="false" placeholder="naddr or nevent" aria-label="Runtime napplet pointer" value="${value}">
             <button type="submit" id="runtime-pointer-load">Load</button>
+            <button type="button" id="runtime-local-open" title="Open a self-contained single-file index.html">Open file\u2026</button>
+            <input id="runtime-local-file" type="file" accept=".html,.htm,text/html" aria-label="Local napplet index.html" hidden>
           </form>
           <div class="pointer-status" id="runtime-pointer-status" aria-live="polite">idle</div>
-        </section>`;
+        </div></details>`;
 }
 function getModeLabel(config) {
   if (config.target.mode === "runtime-pointer") return "runtime-pointer";
@@ -785,6 +812,7 @@ function escapeJsonForHtml(value) {
 }
 
 // src/runtime-resolver.ts
+import { injectNappletCsp } from "@kehto/shell";
 import { SimplePool } from "nostr-tools/pool";
 import { decode } from "nostr-tools/nip19";
 import {
@@ -867,7 +895,7 @@ async function resolvePajaPointer(value, options = {}) {
     const resolved = await resolveNapplet({
       event,
       cache: await openNappletArtifactCache({ requireStorageEstimate: false }),
-      fetchBlob: (sha256Hex, servers) => fetchBlob([...servers, ...blossomServers], sha256Hex, async (url) => {
+      fetchBlob: (sha256Hex2, servers) => fetchBlob([...servers, ...blossomServers], sha256Hex2, async (url) => {
         const response = await (options.fetcher ?? fetch)(url);
         if (!response.ok) throw new Error(`[paja-runtime] blob ${url}: ${response.status}`);
         return new Uint8Array(await response.arrayBuffer());
@@ -905,34 +933,7 @@ function resolvePointerBlossomServers(event, configured) {
   return servers;
 }
 function injectPajaRuntimeCsp(html, origins) {
-  const grantedOrigins = [...new Set(origins)].sort();
-  const connectSrc = grantedOrigins.length > 0 ? `connect-src ${grantedOrigins.join(" ")}` : "connect-src 'none'";
-  const value = [
-    "default-src 'none'",
-    "script-src 'unsafe-inline' 'wasm-unsafe-eval'",
-    "style-src 'unsafe-inline'",
-    "img-src data: blob:",
-    "font-src data:",
-    connectSrc,
-    "worker-src 'none'",
-    "child-src 'none'",
-    "frame-src 'none'",
-    "media-src 'none'",
-    "object-src 'none'",
-    "manifest-src 'none'",
-    "prefetch-src 'none'",
-    "base-uri 'none'",
-    "form-action 'none'",
-    "frame-ancestors 'self'"
-  ].join("; ");
-  const meta = `<meta http-equiv="Content-Security-Policy" content="${escapeAttribute2(value)}">`;
-  if (/<head[^>]*>/i.test(html)) {
-    return html.replace(/<head[^>]*>/i, (open) => `${open}${meta}`);
-  }
-  if (/<html[^>]*>/i.test(html)) {
-    return html.replace(/<html[^>]*>/i, (open) => `${open}<head>${meta}</head>`);
-  }
-  return `${meta}${html}`;
+  return injectNappletCsp(html, { connectOrigins: origins });
 }
 async function resolvePointerEvent(pointer, pool, relays, maxWaitMs) {
   const filter = pointer.type === "naddr" ? addressableFilter(pointer) : eventFilter(pointer);
@@ -1078,9 +1079,6 @@ function normalizeRelayUrl(value) {
     return void 0;
   }
 }
-function escapeAttribute2(value) {
-  return value.replaceAll("&", "&amp;").replaceAll('"', "&quot;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
-}
 function formatNappletManifestKinds() {
   return PAJA_NAPPLET_MANIFEST_KINDS.join(" / ");
 }
@@ -1211,6 +1209,85 @@ function defaultSleep(ms) {
   });
 }
 
+// src/local-target.ts
+import { computeAggregateHash } from "@kehto/nip/5a";
+var PAJA_LOCAL_SINGLE_FILE_HINT = "Paja opens self-contained single-file index.html only; relative scripts, styles, and images do not load.";
+var MAX_DTAG_LENGTH = 128;
+var MAX_REPORTED_RELATIVE_ASSETS = 8;
+function isPajaLocalTarget(target) {
+  return typeof target === "object" && target !== null && target.source === "local";
+}
+function isPajaLocalHtmlFile(file) {
+  const type = (file.type ?? "").split(";")[0]?.trim().toLowerCase();
+  return type === "text/html" || /\.html?$/i.test(file.name.trim());
+}
+async function createPajaLocalTarget(file) {
+  const fileName = file.name.trim() || "index.html";
+  if (!isPajaLocalHtmlFile(file)) {
+    throw new Error(`"${fileName}" is not an HTML file. ${PAJA_LOCAL_SINGLE_FILE_HINT}`);
+  }
+  const bytes = "arrayBuffer" in file ? new Uint8Array(await file.arrayBuffer()) : new TextEncoder().encode(file.text);
+  const indexHtml = new TextDecoder().decode(bytes);
+  if (indexHtml.trim().length === 0) {
+    throw new Error(`"${fileName}" is empty.`);
+  }
+  const sha256 = await sha256Hex(bytes);
+  return Object.freeze({
+    source: "local",
+    fileName,
+    dTag: readNappletIdMeta(indexHtml) ?? localDTag(fileName),
+    aggregateHash: computeAggregateHash([{ path: "/index.html", sha256 }]),
+    sha256,
+    indexHtml,
+    relays: Object.freeze([]),
+    blossomServers: Object.freeze([]),
+    relativeAssets: Object.freeze(findRelativeAssetReferences(indexHtml))
+  });
+}
+function readNappletIdMeta(html) {
+  for (const match of html.matchAll(/<meta\b([^>]*)>/gi)) {
+    const attributes = parseAttributes(match[1] ?? "");
+    if (attributes.get("name")?.toLowerCase() !== "napplet-id") continue;
+    const value = attributes.get("content")?.trim();
+    if (value) return value.slice(0, MAX_DTAG_LENGTH);
+  }
+  return void 0;
+}
+function findRelativeAssetReferences(html) {
+  const found = /* @__PURE__ */ new Set();
+  for (const match of html.matchAll(/<(?:script|link|img|source|iframe)\b([^>]*)>/gi)) {
+    const attributes = parseAttributes(match[1] ?? "");
+    const reference = attributes.get("src") ?? attributes.get("href");
+    if (reference && isRelativeReference(reference)) found.add(reference.trim());
+    if (found.size >= MAX_REPORTED_RELATIVE_ASSETS) break;
+  }
+  return [...found];
+}
+function isRelativeReference(value) {
+  const trimmed = value.trim();
+  if (trimmed.length === 0 || trimmed.startsWith("#")) return false;
+  return !/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i.test(trimmed);
+}
+function parseAttributes(source) {
+  const attributes = /* @__PURE__ */ new Map();
+  const pattern = /([^\s=/>"']+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'=<>`]+)))?/g;
+  for (const match of source.matchAll(pattern)) {
+    const name = match[1]?.toLowerCase();
+    if (!name || attributes.has(name)) continue;
+    attributes.set(name, match[2] ?? match[3] ?? match[4] ?? "");
+  }
+  return attributes;
+}
+function localDTag(fileName) {
+  const stem = fileName.replace(/\.[^.]*$/, "");
+  const slug = stem.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+  return `local-${slug || "napplet"}`.slice(0, MAX_DTAG_LENGTH);
+}
+async function sha256Hex(bytes) {
+  const digest = await crypto.subtle.digest("SHA-256", bytes);
+  return Array.from(new Uint8Array(digest), (byte) => byte.toString(16).padStart(2, "0")).join("");
+}
+
 // src/installed-napplet-catalog.ts
 import { manifestToIntentCatalogEntry } from "@kehto/services";
 function matchesInstalledNappletRecord(record, target) {
@@ -1227,11 +1304,13 @@ var InstalledNappletCatalog = class {
       pointer: copyPointer(resolved.pointer),
       ...resolved.manifest.title === void 0 ? {} : { title: resolved.manifest.title },
       requires: [...resolved.manifest.requires],
+      optional: [...resolved.manifest.optional ?? []],
       archetypes: resolved.manifest.archetypes.map((archetype) => ({
         slug: archetype.slug,
         convention: archetype.convention
       }))
     });
+    if (!record.dTag) return record;
     this.records.set(record.dTag, record);
     this.notify(record.dTag);
     return record;
@@ -1263,9 +1342,14 @@ var InstalledNappletCatalog = class {
     if (this.records.get(selected.dTag) !== selected) return null;
     return matchesInstalledNappletRecord(selected, target) ? selected : null;
   }
-  /** Return exact handler candidates derived only from installed manifests. */
-  intentCatalog() {
-    return this.installed().filter((record) => record.requires.includes("inc")).map((record) => manifestToIntentCatalogEntry({
+  /**
+   * Return declared handlers whose host environment can receive intent delivery.
+   * @param canReceiveIntent - Resolve intent availability for each verified identity;
+   * without host policy, return declared candidates for the host to filter.
+   * @returns Named intent candidates usable under the supplied host policy.
+   */
+  intentCatalog(canReceiveIntent = () => true) {
+    return this.installed().filter(canReceiveIntent).map((record) => manifestToIntentCatalogEntry({
       dTag: record.dTag,
       ...record.title === void 0 ? {} : { title: record.title },
       archetypes: record.archetypes.map((archetype) => ({
@@ -1307,6 +1391,7 @@ function freezeRecord(record) {
   return Object.freeze({
     ...record,
     requires: Object.freeze([...record.requires]),
+    optional: Object.freeze([...record.optional ?? []]),
     archetypes: Object.freeze(record.archetypes.map((archetype) => Object.freeze({ ...archetype })))
   });
 }
@@ -1629,6 +1714,12 @@ export {
   getMissingServices,
   ReadinessError,
   waitForTargetUrl,
+  PAJA_LOCAL_SINGLE_FILE_HINT,
+  isPajaLocalTarget,
+  isPajaLocalHtmlFile,
+  createPajaLocalTarget,
+  readNappletIdMeta,
+  findRelativeAssetReferences,
   InstalledNappletCatalog,
   BrowserIntentController,
   PAJA_TARGET_CORS_HINT,
@@ -1636,4 +1727,4 @@ export {
   probeTargetCors,
   startPajaServer
 };
-//# sourceMappingURL=chunk-ESE55K3Q.js.map
+//# sourceMappingURL=chunk-GY5ET3PC.js.map