kizlo 0.6.1 → 0.7.0

package/dist/brand/icons.d.ts

@@ -7,29 +7,27 @@ interface IconDescriptor {
   type: string;
   /** `"any"` for scalable/single sources; omitted for `.ico`. */
   sizes?: string;
-  /** Media query for scheme-specific variants, e.g. `(prefers-color-scheme: dark)`. */
-  media?: string;
 }
 interface ManifestIcon {
   src: string;
   type: string;
   sizes: string;
-  /**
-   * `"maskable"` marks art with a safe zone the launcher may crop to any
-   * adaptive shape; omitted (default `"any"`) sources render uncropped.
-   */
-  purpose?: "any" | "maskable";
 }
 interface ResolvedIcons {
-  /** `rel="icon"` candidates: the light source plus an optional dark variant. */
+  /**
+   * `rel="icon"` candidate: a single scheme-agnostic source, or empty. Browsers
+   * disagree on scheme-swapping favicons (Safari ignores the `media` attribute
+   * and never re-evaluates an SVG's internal `@media`), so one icon that reads
+   * on both light and dark tab bars is the only cross-browser-safe surface.
+   */
   icon: IconDescriptor[];
   /** `rel="apple-touch-icon"` candidate (raster-guarded), or empty. */
   appleTouch: IconDescriptor[];
   /**
-   * Web-manifest icon entries (raster or SVG): the square brand icon as the
-   * default `"any"` source — expanded to one entry per real square rendition —
-   * plus the dedicated Android icon as `"maskable"` when provided. Either may
-   * be absent.
+   * Web-manifest icon entries (raster or SVG): a single square source —
+   * expanded to one entry per real square rendition — that every non-iOS
+   * install surface (Android, Chrome, macOS Safari) renders uncropped. Absent
+   * when no manifest-compatible source exists.
    */
   manifestIcons: ManifestIcon[];
 }

package/dist/brand/icons.js

@@ -32,12 +32,20 @@ function manifestSource(media) {
 function pixelSize(media) {
 	return media.width && media.height ? `${media.width}x${media.height}` : "any";
 }
-function toDescriptor(media, extra) {
+/**
+* Append the attachment id as a `?v=` cache-buster. Safari (and every browser)
+* keys its favicon cache by URL, so tying the version to the attachment id means
+* the URL changes when a different icon is chosen — busting the stale cache —
+* while staying stable across renders when the icon is unchanged.
+*/
+function versioned(src, id) {
+	return `${src}${src.includes("?") ? "&" : "?"}v=${id}`;
+}
+function toDescriptor(media) {
 	return {
-		url: media.src,
+		url: versioned(media.src, media.id),
 		type: media.mime ?? "",
-		sizes: media.mime && ICO_MIMES.has(media.mime) ? void 0 : pixelSize(media),
-		...extra
+		sizes: media.mime && ICO_MIMES.has(media.mime) ? void 0 : pixelSize(media)
 	};
 }
 /**
@@ -47,14 +55,12 @@ function toDescriptor(media, extra) {
 * or above the floor so browsers get genuine 192/512-ish icons; if none qualify
 * (e.g. a non-square upload) the original is used as-is.
 */
-function toManifestIcons(media, purpose) {
+function toManifestIcons(media) {
 	const type = media.mime ?? "";
-	const withPurpose = purpose ? { purpose } : {};
 	if (media.mime === SVG_MIME) return [{
 		src: media.src,
 		type,
-		sizes: "any",
-		...withPurpose
+		sizes: "any"
 	}];
 	const square = [{
 		src: media.src,
@@ -75,8 +81,7 @@ function toManifestIcons(media, purpose) {
 		icons.push({
 			src: r.src,
 			type,
-			sizes,
-			...withPurpose
+			sizes
 		});
 	}
 	return icons;
@@ -87,16 +92,13 @@ function toManifestIcons(media, purpose) {
 */
 function resolveIcons(brand) {
 	const icon = [];
-	const light = brand.favicon ?? brand.logo_icon;
-	if (light) icon.push(toDescriptor(light));
-	if (brand.favicon_dark) icon.push(toDescriptor(brand.favicon_dark, { media: "(prefers-color-scheme: dark)" }));
-	const apple = raster(brand.ios_app_icon) ?? raster(brand.favicon);
+	const primary = brand.favicon ?? brand.logo_icon;
+	if (primary) icon.push(toDescriptor(primary));
+	const apple = raster(brand.app_icon) ?? raster(brand.favicon);
 	const appleTouch = apple ? [toDescriptor(apple)] : [];
 	const manifestIcons = [];
-	const anySource = manifestSource(brand.logo_icon) ?? manifestSource(brand.favicon);
+	const anySource = manifestSource(brand.app_icon) ?? manifestSource(brand.logo_icon) ?? manifestSource(brand.favicon);
 	if (anySource) manifestIcons.push(...toManifestIcons(anySource));
-	const maskable = manifestSource(brand.android_app_icon);
-	if (maskable) manifestIcons.push(...toManifestIcons(maskable, "maskable"));
 	return {
 		icon,
 		appleTouch,

package/dist/cli/commands/dev.js

@@ -11,7 +11,6 @@ import { join } from "node:path";
 import { existsSync, readFileSync, rmSync, writeFileSync } from "node:fs";
 import { defineCommand } from "citty";
 import { randomBytes } from "node:crypto";
-import { networkInterfaces } from "node:os";
 
 //#region src/cli/commands/dev.ts
 async function resolve$1(cwd) {
@@ -26,22 +25,17 @@ function note(text) {
 	const { dim, reset } = palette();
 	process.stdout.write(`   ${dim}${text}${reset}\n`);
 }
-/** First non-internal IPv4 address, for the LAN-reachable "Network" URL (undefined when offline). */
-function lanAddress() {
-	for (const ifaces of Object.values(networkInterfaces())) for (const iface of ifaces ?? []) if (iface.family === "IPv4" && !iface.internal) return iface.address;
-}
 /**
-* Print the connection summary as an aligned, Next.js-style block. Shows the wp-admin
-* URL on localhost ("Local") and — when a LAN address exists — on the network, so the
-* stack can be opened from other devices. On a fresh install, also show the one-time
-* wp-admin password (it's never stored, so this is the only chance to see it).
+* Print the connection summary as an aligned, Next.js-style block. Shows the wp-admin URL on
+* the loopback ("Local") and — when the stack is installed on a LAN address rather than
+* localhost — on the network, so it can be opened from other devices. On a fresh install, also
+* show the one-time wp-admin password (it's never stored, so this is the only chance to see it).
 */
 function printSummary(info) {
 	const { cyan, dim, reset } = palette();
-	const port = new URL(info.url).port;
-	const lan = lanAddress();
-	const rows = [["WP Local", `${info.url}/wp-admin`]];
-	if (lan) rows.push(["WP Network", `http://${lan}:${port}/wp-admin`]);
+	const { port, hostname } = new URL(info.url);
+	const rows = [["WP Local", `http://localhost:${port}/wp-admin`]];
+	if (hostname !== "localhost") rows.push(["WP Network", `${info.url}/wp-admin`]);
 	rows.push(["Database Connection", `127.0.0.1:${info.dbPort}`]);
 	const width = Math.max(...rows.map(([label]) => label.length)) + 1;
 	const lines = ["", ...rows.map(([label, value]) => `   ${dim}- ${`${label}:`.padEnd(width)}${reset} ${cyan}${value}${reset}`)];
@@ -104,6 +98,23 @@ function updateWpEnv(cfg, info) {
 	};
 }
 /**
+* Re-point `KIZLO_DEV_WORDPRESS_URL` at the current dev URL on a warm resume, so a LAN address that
+* changed since the last session (a new DHCP lease, a different network) doesn't leave the app talking
+* to a dead IP. Only this one key is rewritten — the credentials and secret from the fresh install are
+* preserved — and it's a no-op when `.env` is absent (nothing provisioned yet) or already current.
+* The full fresh-install write goes through {@link updateWpEnv} instead; this covers the resume path it
+* skips. Returns true when it changed the file. The app still needs a restart to read the new value.
+*/
+function syncDevUrl(cfg, url) {
+	const envPath = join(cfg.configDir, ".env");
+	if (!existsSync(envPath)) return false;
+	const existing = readFileSync(envPath, "utf8");
+	if (readEnvValue(existing, "KIZLO_DEV_WORDPRESS_URL") === url) return false;
+	const { content } = mergeEnv(existing, { KIZLO_DEV_WORDPRESS_URL: url }, new Set(["KIZLO_DEV_WORDPRESS_URL"]), envGroups("KIZLO_BACKEND_URL"));
+	writeFileSync(envPath, content);
+	return true;
+}
+/**
 * Arm the foreground teardown — call this *before* the containers start, so a cancel at
 * any point (even mid-startup, with mysql up but wordpress still booting) stops whatever
 * already came up. The teardown is owned by a detached **watchdog** process, not by this
@@ -189,7 +200,7 @@ async function startForeground(cfg) {
 			});
 			if (!sync.ok) note(`Could not sync the site settings to WordPress (${sync.error}) — make sure the kizlo plugin is active, then set them from the Kizlo settings.`);
 		}
-	}
+	} else if (syncDevUrl(ready, creds.url)) note("Updated .env WordPress URL to the current network address — restart your app to pick it up");
 	printSummary(creds);
 	const { green, dim, bold, reset } = palette();
 	const ms = Date.now() - start;

package/dist/cli/wp/dev.js

@@ -7,12 +7,27 @@ import { prepareByo } from "./byo.js";
 import { join } from "node:path";
 import { existsSync, rmSync } from "node:fs";
 import { randomBytes } from "node:crypto";
+import { networkInterfaces } from "node:os";
 
 //#region src/cli/wp/dev.ts
 /** A strong random admin password (144 bits, URL/JSON/CLI-safe characters). */
 function generatePassword() {
 	return randomBytes(18).toString("base64url");
 }
+/** First non-internal IPv4 address — the router-assigned LAN address (undefined when offline). */
+function lanAddress() {
+	for (const ifaces of Object.values(networkInterfaces())) for (const iface of ifaces ?? []) if (iface.family === "IPv4" && !iface.internal) return iface.address;
+}
+/**
+* The URL the dev stack is provisioned at. We prefer the router-assigned LAN address over `localhost`
+* so it's reachable from off the host (the app in a container or on another device). Serving WordPress
+* under the request host is already handled by the container's `WORDPRESS_CONFIG_EXTRA` (it derives
+* `WP_HOME`/`WP_SITEURL` from `HTTP_HOST` per request), so this is only the address we write into `.env`
+* and print. Falls back to `localhost` when the machine is offline, so bare local dev still works.
+*/
+function devUrl(port) {
+	return `http://${lanAddress() ?? "localhost"}:${port}`;
+}
 /**
 * Seed `dev.fixtures` into a freshly installed dev stack, reusing the test seeding
 * primitives: seed the default subscriber so `ctx.userId` exists, then run each `seed`
@@ -58,7 +73,7 @@ async function seedDevFixtures(cfg, url) {
 * concern.
 */
 async function bootstrapDev(cfg) {
-	const url = `http://localhost:${cfg.port}`;
+	const url = devUrl(cfg.port);
 	const byo = !existsSync(join(cfg.wordpressDir, "wp-includes", "version.php")) && cfg.byo ? await prepareByo(cfg.byo, cfg.wordpressDir, cfg.configDir) : void 0;
 	await composeUp();
 	const installed = (await compose([

package/dist/integrations/nextjs/metadata.js

@@ -45,8 +45,7 @@ function toNextIcon(icon) {
 	return {
 		url: icon.url,
 		type: icon.type,
-		sizes: icon.sizes,
-		media: icon.media
+		sizes: icon.sizes
 	};
 }
 function createPageMetadata(head) {

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
-var version = "0.6.1";
+var version = "0.7.0";
 
 //#endregion
 export { version };

package/dist/router.d.ts

@@ -779,9 +779,7 @@ declare const ROUTER_MAP: {
       logo_wordmark?: number | null | undefined;
       logo_wordmark_dark?: number | null | undefined;
       favicon?: number | null | undefined;
-      favicon_dark?: number | null | undefined;
-      ios_app_icon?: number | null | undefined;
-      android_app_icon?: number | null | undefined;
+      app_icon?: number | null | undefined;
       theme_color?: number | null | undefined;
       theme_color_dark?: number | null | undefined;
       background_color?: number | null | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kizlo",
-  "version": "0.6.1",
+  "version": "0.7.0",
   "type": "module",
   "description": "A headless WordPress toolkit for TypeScript.",
   "keywords": [
@@ -76,7 +76,7 @@
   },
   "dependencies": {
     "@clack/prompts": "^1.5.1",
-    "@kizlo/shared": "0.3.1",
+    "@kizlo/shared": "0.4.0",
     "@orpc/client": "^1.14.3",
     "@orpc/contract": "^1.14.3",
     "@orpc/openapi": "^1.14.3",