spaday-regular-layout 0.2.6__tar.gz → 0.3.0__tar.gz

{spaday_regular_layout-0.2.6 → spaday_regular_layout-0.3.0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.5
 Name: spaday-regular-layout
-Version: 0.2.6
+Version: 0.3.0
 Summary: regular-layout for spaday
 Project-URL: Repository, https://github.com/1kbgz/spaday-regular-layout
 Project-URL: Homepage, https://github.com/1kbgz/spaday-regular-layout
@@ -17,7 +17,7 @@ Classifier: Programming Language :: Python :: 3.14
 Classifier: Programming Language :: Python :: Implementation :: CPython
 Classifier: Programming Language :: Python :: Implementation :: PyPy
 Requires-Python: >=3.11
-Requires-Dist: spaday<1.0,>=0.6.0
+Requires-Dist: spaday<1.0,>=0.11.1
 Provides-Extra: develop
 Requires-Dist: build; extra == 'develop'
 Requires-Dist: bump-my-version; extra == 'develop'
@@ -50,8 +50,8 @@ Description-Content-Type: text/markdown
 
 <a href="https://github.com/1kbgz/spaday-regular-layout">
   <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-dark.png?raw=true">
-    <img alt="spaday-regular-layout logo, a picnic blanket and basket inside a browser window" src="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-light.png?raw=true" width="800">
+    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-dark.webp?raw=true">
+    <img alt="spaday-regular-layout logo, a picnic blanket and basket inside a browser window" src="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-light.webp?raw=true" width="800">
   </picture>
 </a>
 
@@ -100,6 +100,8 @@ Each frame's content area (`regular-layout-frame::part(container)`) is `display:
 
 ## Run the local example
 
+[Run the complete example in your browser](https://1kbgz.github.io/spaday-regular-layout/lite/) — Python runs locally through Pyodide; no install or server required.
+
 ```bash
 python -m pip install -e ".[examples]"
 python -m spaday_regular_layout.example
@@ -108,3 +110,6 @@ python -m spaday_regular_layout.example
 Open `http://127.0.0.1:8013` to resize and rearrange the [complete three-panel example](spaday_regular_layout/example.py). It
 receives a new server layout every five seconds and persists browser rearrangements back to Python. It passes
 the local package descriptor directly, so it does not install or resolve the integration from GitHub.
+
+> [!NOTE]
+> This library was generated using [copier](https://copier.readthedocs.io/en/stable/) from the [Base Python Project Template repository](https://github.com/python-project-templates/base).

{spaday_regular_layout-0.2.6 → spaday_regular_layout-0.3.0}/README.md

@@ -1,7 +1,7 @@
 <a href="https://github.com/1kbgz/spaday-regular-layout">
   <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-dark.png?raw=true">
-    <img alt="spaday-regular-layout logo, a picnic blanket and basket inside a browser window" src="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-light.png?raw=true" width="800">
+    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-dark.webp?raw=true">
+    <img alt="spaday-regular-layout logo, a picnic blanket and basket inside a browser window" src="https://github.com/1kbgz/spaday-regular-layout/raw/main/docs/img/logo-light.webp?raw=true" width="800">
   </picture>
 </a>
 
@@ -50,6 +50,8 @@ Each frame's content area (`regular-layout-frame::part(container)`) is `display:
 
 ## Run the local example
 
+[Run the complete example in your browser](https://1kbgz.github.io/spaday-regular-layout/lite/) — Python runs locally through Pyodide; no install or server required.
+
 ```bash
 python -m pip install -e ".[examples]"
 python -m spaday_regular_layout.example
@@ -58,3 +60,6 @@ python -m spaday_regular_layout.example
 Open `http://127.0.0.1:8013` to resize and rearrange the [complete three-panel example](spaday_regular_layout/example.py). It
 receives a new server layout every five seconds and persists browser rearrangements back to Python. It passes
 the local package descriptor directly, so it does not install or resolve the integration from GitHub.
+
+> [!NOTE]
+> This library was generated using [copier](https://copier.readthedocs.io/en/stable/) from the [Base Python Project Template repository](https://github.com/python-project-templates/base).

{spaday_regular_layout-0.2.6 → spaday_regular_layout-0.3.0}/js/build.mjs

@@ -44,6 +44,23 @@ async function build() {
 
   await Promise.all(BUNDLES.map(bundle)).catch(() => process.exit(1));
 
+  // the exact version of every library this package serves, read by the Python package as its
+  // ComponentPackage.provides, so spaday can reconcile it with the other packages on a page
+  const { dependencies = {} } = JSON.parse(
+    fs.readFileSync("package.json", "utf8"),
+  );
+  const served = Object.fromEntries(
+    Object.keys(dependencies).map((name) => [
+      name,
+      JSON.parse(fs.readFileSync(`node_modules/${name}/package.json`, "utf8"))
+        .version,
+    ]),
+  );
+  fs.writeFileSync(
+    "dist/versions.json",
+    `${JSON.stringify(served, null, 2)}\n`,
+  );
+
   // Copy servable assets to python extension (exclude esm/)
   fs.mkdirSync("../spaday_regular_layout/extension", { recursive: true });
   await cpy("dist/**/*", "../spaday_regular_layout/extension", {

spaday_regular_layout-0.3.0/js/examples/build_pyodide_example.py

@@ -0,0 +1,50 @@
+"""Assemble the static Pyodide example from locally built and downloaded wheels."""
+
+import json
+import shutil
+import sys
+import zipfile
+from pathlib import Path
+
+
+def copy_wheel(wheel: Path, output: Path) -> str:
+    target = output / "pypi" / wheel.name
+    target.parent.mkdir(parents=True, exist_ok=True)
+    shutil.copy2(wheel, target)
+    return f"pypi/{wheel.name}"
+
+
+def extract_assets(wheel: Path, package: str, output: Path) -> None:
+    prefix = f"{package}/extension/"
+    with zipfile.ZipFile(wheel) as archive:
+        assets = [name for name in archive.namelist() if name.startswith(prefix) and not name.endswith("/")]
+        if not assets:
+            raise RuntimeError(f"{wheel.name} contains no browser assets")
+        for name in assets:
+            target = output / name.removeprefix(prefix)
+            target.parent.mkdir(parents=True, exist_ok=True)
+            target.write_bytes(archive.read(name))
+
+
+def one_wheel(directory: Path, distribution: str) -> Path:
+    wheels = list(directory.glob(f"{distribution}-*.whl"))
+    if len(wheels) != 1:
+        raise RuntimeError(f"expected one {distribution} wheel in {directory}, found {len(wheels)}")
+    return wheels[0]
+
+
+def main(output: Path, layout_wheel: Path, dependency_dir: Path) -> None:
+    spaday_wheel = one_wheel(dependency_dir, "spaday")
+    transports_wheel = one_wheel(dependency_dir, "transports")
+    wheels = {
+        "layout": copy_wheel(layout_wheel, output),
+        "spaday": copy_wheel(spaday_wheel, output),
+        "transports": copy_wheel(transports_wheel, output),
+    }
+    extract_assets(layout_wheel, "spaday_regular_layout", output / "components" / "regular-layout")
+    extract_assets(spaday_wheel, "spaday", output / "runtime" / "spaday")
+    (output / "wheels.json").write_text(json.dumps(wheels, indent=2) + "\n")
+
+
+if __name__ == "__main__":
+    main(*(Path(value) for value in sys.argv[1:]))

spaday_regular_layout-0.3.0/js/examples/pyodide-worker.js

@@ -0,0 +1,105 @@
+const PYODIDE_VERSION = "314.0.4";
+let pyodide;
+
+const ready = (async () => {
+  self.postMessage({ type: "status", message: "Loading Pyodide…" });
+  const { loadPyodide } = await import(
+    `https://cdn.jsdelivr.net/pyodide/v${PYODIDE_VERSION}/full/pyodide.mjs`
+  );
+  pyodide = await loadPyodide();
+  await pyodide.loadPackage(["micropip", "anyio"]);
+
+  self.postMessage({ type: "status", message: "Installing example…" });
+  const response = await fetch(new URL("./wheels.json", self.location.href));
+  if (!response.ok)
+    throw new Error(`wheel manifest returned ${response.status}`);
+  const wheels = await response.json();
+  const urls = Object.fromEntries(
+    Object.entries(wheels).map(([name, path]) => [
+      name,
+      new URL(path, self.location.href).href,
+    ]),
+  );
+  pyodide.globals.set("wheels_json", JSON.stringify(urls));
+  return pyodide.runPythonAsync(`
+import asyncio
+import json
+import micropip
+
+wheels = json.loads(wheels_json)
+await micropip.install([
+    wheels["spaday"],
+    wheels["transports"],
+    "starlette",
+    "uvicorn",
+])
+await micropip.install(wheels["layout"], deps=False)
+
+from spaday_regular_layout import example
+
+connection = "browser"
+
+def local_wires(messages):
+    return list(messages.get(connection, []))
+
+def receive_wire(frame):
+    return json.dumps(local_wires(example.server.recv(connection, frame)))
+
+def flush_server():
+    return json.dumps(local_wires(example.server.flush()))
+
+class LocalRequest:
+    def __init__(self, body):
+        self._body = body
+
+    async def json(self):
+        return self._body
+
+async def call_endpoint(body_json):
+    response = await example.save_layout(LocalRequest(json.loads(body_json)))
+    return json.dumps({
+        "status": response.status_code,
+        "body": json.loads(bytes(response.body).decode()),
+        "wires": local_wires(example.server.flush()),
+    })
+
+opening = example.server.open(connection, "json")
+asyncio.create_task(example.rotate_layout())
+
+json.dumps({
+    "tree": example.page.to_node(),
+    "style": "",
+    "wires": opening,
+})
+`);
+})();
+
+let queue = Promise.resolve();
+
+async function handle(message) {
+  const snapshot = await ready;
+  if (message.type === "start") {
+    self.postMessage({ type: "snapshot", payload: JSON.parse(snapshot) });
+  } else if (message.type === "wire") {
+    pyodide.globals.set("wire_frame", message.frame);
+    const wires = JSON.parse(pyodide.runPython("receive_wire(wire_frame)"));
+    if (wires.length) self.postMessage({ type: "wires", wires });
+  } else if (message.type === "flush") {
+    const wires = JSON.parse(pyodide.runPython("flush_server()"));
+    if (wires.length) self.postMessage({ type: "wires", wires });
+  } else if (message.type === "endpoint") {
+    pyodide.globals.set("body_json", JSON.stringify(message.body));
+    const result = JSON.parse(
+      await pyodide.runPythonAsync("await call_endpoint(body_json)"),
+    );
+    self.postMessage({ type: "endpoint", id: message.id, ...result });
+  }
+}
+
+self.addEventListener("message", (event) => {
+  queue = queue
+    .then(() => handle(event.data))
+    .catch((error) => {
+      self.postMessage({ type: "error", message: String(error) });
+    });
+});

spaday_regular_layout-0.3.0/js/examples/pyodide.html

@@ -0,0 +1,136 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>spaday-regular-layout in Pyodide</title>
+    <link rel="stylesheet" href="./components/regular-layout/css/index.css" />
+    <link rel="stylesheet" href="./components/regular-layout/css/spa.css" />
+    <style>
+      #pyodide-status {
+        position: sticky;
+        z-index: 10000;
+        top: 0;
+        box-sizing: border-box;
+        min-height: 3rem;
+        padding: 0.75rem 1rem;
+        border-bottom: 1px solid #cbd5e1;
+        color: #475569;
+        background: #fffffff2;
+        font:
+          14px/1.4 system-ui,
+          sans-serif;
+        backdrop-filter: blur(12px);
+      }
+      #pyodide-error {
+        margin: 1rem;
+        color: #b91c1c;
+        white-space: pre-wrap;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="pyodide-status">Loading Python in the browser…</div>
+    <div id="example-root"></div>
+    <pre id="pyodide-error" hidden></pre>
+    <script type="module">
+      import {
+        connectStore,
+        init,
+        mount,
+        Store,
+      } from "./runtime/spaday/cdn/index.js";
+      import "./components/regular-layout/cdn/index.js";
+      import * as transports from "./runtime/spaday/transports/cdn/index.js";
+
+      const status = document.querySelector("#pyodide-status");
+      const pendingEndpoints = new Map();
+      let nextEndpointId = 0;
+      let receiveWires = () => {};
+
+      function fail(error) {
+        status.textContent = "Unable to start";
+        const output = document.querySelector("#pyodide-error");
+        output.hidden = false;
+        output.textContent = String(error);
+      }
+
+      try {
+        await Promise.all([
+          init({ module_or_path: "./runtime/spaday/pkg/spaday_bg.wasm" }),
+          transports.wasm.default({
+            module_or_path:
+              "./runtime/spaday/transports/pkg/transports_bg.wasm",
+          }),
+        ]);
+
+        const worker = new Worker("./pyodide-worker.js", { type: "module" });
+        const nativeFetch = globalThis.fetch.bind(globalThis);
+        globalThis.fetch = async (input, options = {}) => {
+          const url = new URL(
+            input instanceof Request ? input.url : input,
+            location.href,
+          );
+          if (url.pathname !== "/api/layout")
+            return nativeFetch(input, options);
+
+          const id = ++nextEndpointId;
+          const response = new Promise((resolve) => {
+            pendingEndpoints.set(id, resolve);
+          });
+          worker.postMessage({
+            type: "endpoint",
+            id,
+            body: options.body ? JSON.parse(String(options.body)) : null,
+          });
+          return response;
+        };
+
+        worker.addEventListener("message", (event) => {
+          if (event.data.type === "status")
+            status.textContent = event.data.message;
+          if (event.data.type === "error") fail(event.data.message);
+          if (event.data.type === "wires") receiveWires(event.data.wires);
+          if (event.data.type === "endpoint") {
+            receiveWires(event.data.wires);
+            const resolve = pendingEndpoints.get(event.data.id);
+            if (resolve) {
+              pendingEndpoints.delete(event.data.id);
+              resolve(
+                new Response(JSON.stringify(event.data.body), {
+                  status: event.data.status,
+                  headers: { "content-type": "application/json" },
+                }),
+              );
+            }
+          }
+          if (event.data.type === "snapshot") {
+            const { tree, wires } = event.data.payload;
+            const store = new Store();
+            const client = new transports.Client();
+            const link = connectStore(
+              store,
+              client,
+              (frame) => worker.postMessage({ type: "wire", frame }),
+              transports,
+            );
+            receiveWires = (frames) => {
+              for (const frame of frames) link.receive(frame);
+            };
+            receiveWires(wires);
+            mount(document.querySelector("#example-root"), tree, store);
+            window.setInterval(
+              () => worker.postMessage({ type: "flush" }),
+              100,
+            );
+            status.textContent = "Ready · Python model running in this browser";
+            document.documentElement.dataset.ready = "true";
+          }
+        });
+        worker.postMessage({ type: "start" });
+      } catch (error) {
+        fail(error);
+      }
+    </script>
+  </body>
+</html>

{spaday_regular_layout-0.2.6 → spaday_regular_layout-0.3.0}/js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spaday-regular-layout",
-  "version": "0.2.6",
+  "version": "0.3.0",
   "description": "regular-layout for spaday",
   "repository": "git@github.com:1kbgz/spaday-regular-layout.git",
   "author": "1kbgz <dev@1kbgz.com>",
@@ -31,8 +31,8 @@
     "build": "npm-run-all build:prod build:types",
     "clean": "rm -rf dist playwright-report ../spaday_regular_layout/extension",
     "dev": "npm-run-all -p start watch",
-    "lint": "oxlint . && oxfmt --check \"src/**/*.{js,ts,jsx,tsx,css}\" \"tests/**/*.{js,ts,jsx,tsx}\" \"*.mjs\" \"*.json\"",
-    "fix": "oxlint --fix . && oxfmt --write \"src/**/*.{js,ts,jsx,tsx,css}\" \"tests/**/*.{js,ts,jsx,tsx}\" \"*.mjs\" \"*.json\"",
+    "lint": "oxlint . && oxfmt --check \"examples/**/*.{js,html}\" \"src/**/*.{js,ts,jsx,tsx,css}\" \"tests/**/*.{js,ts,jsx,tsx}\" \"*.mjs\" \"*.json\"",
+    "fix": "oxlint --fix . && oxfmt --write \"examples/**/*.{js,html}\" \"src/**/*.{js,ts,jsx,tsx,css}\" \"tests/**/*.{js,ts,jsx,tsx}\" \"*.mjs\" \"*.json\"",
     "preinstall": "npx only-allow pnpm",
     "prepack": "npm run build",
     "start": "http-server -p 3000 -o examples/",
@@ -44,15 +44,15 @@
     "regular-layout": "=0.6.1"
   },
   "devDependencies": {
-    "@playwright/test": "^1.62.0",
-    "cpy": "^13.2.2",
-    "esbuild": "^0.28.1",
+    "@playwright/test": "^1.63.0",
+    "cpy": "^13.2.3",
+    "esbuild": "^0.28.2",
     "http-server": "^14.1.1",
     "lightningcss": "^1.33.0",
-    "nodemon": "^3.1.10",
+    "nodemon": "^3.1.14",
     "npm-run-all": "^4.1.5",
-    "oxfmt": "^0.63.0",
-    "oxlint": "^1.78.0",
+    "oxfmt": "^0.66.0",
+    "oxlint": "^1.81.0",
     "typescript": "^7.0.2"
   }
 }

{spaday_regular_layout-0.2.6 → spaday_regular_layout-0.3.0}/js/playwright.config.js

@@ -1,5 +1,7 @@
 import { defineConfig, devices } from "@playwright/test";
 
+const pyodideOnly = process.env.SPADAY_REGULAR_LAYOUT_PYODIDE_ONLY === "1";
+
 export default defineConfig({
   testDir: "tests",
   fullyParallel: true,
@@ -28,11 +30,15 @@ export default defineConfig({
       reuseExistingServer: !process.env.CI,
       timeout: 120 * 1000,
     },
-    {
-      command: "python -m spaday_regular_layout.example",
-      url: "http://127.0.0.1:8013",
-      reuseExistingServer: !process.env.CI,
-      timeout: 120 * 1000,
-    },
+    ...(pyodideOnly
+      ? []
+      : [
+          {
+            command: "python -m spaday_regular_layout.example",
+            url: "http://127.0.0.1:8013",
+            reuseExistingServer: !process.env.CI,
+            timeout: 120 * 1000,
+          },
+        ]),
   ],
 });