@abstractframework/observer 0.1.3

package/dist/icon.svg

@@ -0,0 +1,61 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
+  <defs>
+    <linearGradient id="planet" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#60a5fa" />
+      <stop offset="1" stop-color="#e94560" />
+    </linearGradient>
+    <linearGradient id="orbit" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#60a5fa" stop-opacity="0.95" />
+      <stop offset="1" stop-color="#a78bfa" stop-opacity="0.95" />
+    </linearGradient>
+    <clipPath id="orbitFront">
+      <rect x="0" y="128" width="256" height="128" />
+    </clipPath>
+  </defs>
+
+  <rect width="256" height="256" rx="56" fill="#0b1220" />
+
+  <!-- subtle stars -->
+  <circle cx="56" cy="72" r="2" fill="#ffffff" opacity="0.22" />
+  <circle cx="208" cy="64" r="2" fill="#ffffff" opacity="0.18" />
+  <circle cx="196" cy="188" r="2" fill="#ffffff" opacity="0.16" />
+  <circle cx="70" cy="196" r="2" fill="#ffffff" opacity="0.18" />
+
+  <!-- orbit (behind) -->
+  <ellipse
+    cx="128"
+    cy="128"
+    rx="98"
+    ry="46"
+    transform="rotate(-18 128 128)"
+    fill="none"
+    stroke="url(#orbit)"
+    stroke-width="14"
+    stroke-linecap="round"
+    opacity="0.45"
+  />
+
+  <!-- planet -->
+  <circle cx="128" cy="128" r="52" fill="url(#planet)" />
+  <circle cx="110" cy="112" r="18" fill="#ffffff" opacity="0.14" />
+
+  <!-- orbit (front) -->
+  <g clip-path="url(#orbitFront)">
+    <ellipse
+      cx="128"
+      cy="128"
+      rx="98"
+      ry="46"
+      transform="rotate(-18 128 128)"
+      fill="none"
+      stroke="url(#orbit)"
+      stroke-width="14"
+      stroke-linecap="round"
+      opacity="0.95"
+    />
+  </g>
+
+  <!-- satellite -->
+  <circle cx="212" cy="146" r="9" fill="#f59e0b" />
+</svg>
+

package/dist/index.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <!-- PWA Manifest -->
+    <link rel="manifest" href="/manifest.webmanifest" />
+
+    <meta name="theme-color" content="#111827" />
+    <meta name="color-scheme" content="dark" />
+
+    <!-- iOS PWA / Home Screen -->
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="apple-mobile-web-app-title" content="AbstractObserver" />
+    <link rel="apple-touch-icon" href="/icon.svg" />
+
+    <!-- Favicon -->
+    <link rel="icon" type="image/svg+xml" href="/icon.svg" />
+    <title>AbstractObserver</title>
+    <script type="module" crossorigin src="/assets/index-DvFDLf0J.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-CvWzMSqL.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

package/dist/manifest.webmanifest

@@ -0,0 +1,16 @@
+{
+  "name": "AbstractObserver",
+  "short_name": "Observer",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#111827",
+  "theme_color": "#111827",
+  "icons": [
+    {
+      "src": "/icon.svg",
+      "sizes": "any",
+      "type": "image/svg+xml"
+    }
+  ]
+}
+

package/dist/sw.js

@@ -0,0 +1,80 @@
+// Minimal service worker (PWA shell cache).
+// Note: PWA on iOS requires HTTPS (except localhost) and has platform-specific limitations.
+
+const CACHE_NAME = "abstractobserver-pwa-v1";
+
+function isHtmlRequest(req) {
+  const accept = req.headers.get("accept") || "";
+  return req.mode === "navigate" || accept.includes("text/html");
+}
+
+self.addEventListener("install", (event) => {
+  event.waitUntil(
+    (async () => {
+      const cache = await caches.open(CACHE_NAME);
+      // Cache only the root shell for offline fallback. Navigation requests are still network-first.
+      await cache.addAll(["/"]);
+      self.skipWaiting();
+    })()
+  );
+});
+
+self.addEventListener("activate", (event) => {
+  event.waitUntil(
+    (async () => {
+      const keys = await caches.keys();
+      await Promise.all(keys.map((k) => (k === CACHE_NAME ? Promise.resolve() : caches.delete(k))));
+      self.clients.claim();
+    })()
+  );
+});
+
+self.addEventListener("fetch", (event) => {
+  const req = event.request;
+  const url = new URL(req.url);
+
+  // Never cache API calls.
+  if (url.pathname.startsWith("/api/")) {
+    return;
+  }
+
+  // Only handle same-origin GET requests.
+  if (req.method !== "GET" || url.origin !== self.location.origin) {
+    return;
+  }
+
+  event.respondWith(
+    (async () => {
+      const cache = await caches.open(CACHE_NAME);
+      const cached = await cache.match(req);
+
+      // HTML (SPA navigations): network-first so UI updates on normal refresh.
+      if (isHtmlRequest(req)) {
+        try {
+          const resp = await fetch(req);
+          if (resp && resp.status === 200) cache.put(req, resp.clone());
+          return resp;
+        } catch {
+          return cached || (await cache.match("/")) || new Response("Offline", { status: 503 });
+        }
+      }
+
+      // Other assets: stale-while-revalidate to avoid "sticky" old bundles.
+      const fetchPromise = fetch(req)
+        .then((resp) => {
+          if (resp && resp.status === 200) cache.put(req, resp.clone());
+          return resp;
+        })
+        .catch(() => undefined);
+
+      if (cached) {
+        event.waitUntil(fetchPromise);
+        return cached;
+      }
+
+      const resp = await fetchPromise;
+      return resp || new Response("Offline", { status: 503 });
+    })()
+  );
+});
+

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@abstractframework/observer",
+  "version": "0.1.3",
+  "description": "Gateway-only observability UI for AbstractFramework - connect to a Run Gateway, replay/stream the ledger, and submit durable commands",
+  "type": "module",
+  "author": "Laurent-Philippe Albou",
+  "license": "MIT",
+  "keywords": [
+    "abstractframework",
+    "observability",
+    "workflow",
+    "gateway",
+    "ui",
+    "pwa",
+    "monitoring"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lpalbou/abstractobserver.git"
+  },
+  "homepage": "https://github.com/lpalbou/abstractobserver#readme",
+  "publishConfig": {
+    "access": "public"
+  },
+  "bin": {
+    "abstractobserver": "./bin/cli.js"
+  },
+  "files": [
+    "dist",
+    "bin",
+    "README.md"
+  ],
+  "scripts": {
+    "dev": "vite --host --port 3001",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "start": "node ./bin/cli.js",
+    "test": "vitest run",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "reactflow": "^11.10.4"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.48",
+    "@types/react-dom": "^18.2.18",
+    "@vitejs/plugin-react": "^4.7.0",
+    "typescript": "^5.3.3",
+    "vite": "^6.4.1",
+    "vitest": "^3.2.4"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}