@octane-xplat/ui 0.9.0 → 0.11.0

package/dist/web/dialog-context.js

@@ -0,0 +1,8 @@
+import { createContext } from "octane";
+//#region src/dialog-context.ts
+var DialogContext = /* @__PURE__ */ createContext(null);
+/** JSX-provider form — the universal renderer's context is a callable
+*  rather than a `.Provider` member (same aliasing as FieldProvider). */
+var DialogProvider = DialogContext;
+//#endregion
+export { DialogContext, DialogProvider };

package/dist/web/field-context.js

@@ -0,0 +1,57 @@
+import { FormLayoutContext } from "./form-layout-context.js";
+import { InputGroupContext } from "./input-group-context.js";
+import { createContext, useContext } from "octane";
+//#region src/field-context.ts
+var FieldContext = /* @__PURE__ */ createContext(null);
+var FieldProvider = FieldContext;
+/** Resolve wrapper defaults and the accessibility links for a field control. */
+function useFieldControlProps(props) {
+	const field = useContext(FieldContext);
+	const form = useContext(FormLayoutContext);
+	const group = useContext(InputGroupContext);
+	const status = field?.status ?? props.status;
+	const description = field?.description ?? props.description;
+	const ownLabel = props.accessibilityLabel ?? (props.label && props.label !== field?.label ? props.label : void 0);
+	const ariaDescribedBy = [
+		props.web?.["aria-describedby"],
+		field?.descriptionId,
+		field?.statusId
+	].filter(Boolean).join(" ") || void 0;
+	const disabledReason = (field?.isDisabled ?? props.isDisabled) || props.isDisabled ? field?.disabledMessage ?? props.disabledMessage : void 0;
+	const hint = [
+		props.accessibilityHint,
+		description,
+		status?.message,
+		disabledReason
+	].filter(Boolean).join(". ") || void 0;
+	const isOptional = field?.isOptional ?? props.isOptional;
+	const isRequired = !isOptional && Boolean(field?.isRequired ?? props.isRequired ?? form.defaultOptionality === "required");
+	return {
+		...props,
+		isDisabled: Boolean(field?.isDisabled || group?.isDisabled || props.isDisabled),
+		isReadOnly: Boolean(field?.isReadOnly || props.isReadOnly),
+		isLoading: field?.isLoading ?? props.isLoading,
+		isRequired,
+		isOptional,
+		size: field?.size ?? group?.size ?? props.size,
+		inInputGroup: group != null,
+		status,
+		id: props.id ?? field?.controlId,
+		fieldLabel: field?.label,
+		ariaLabel: ownLabel ?? (field ? void 0 : props.label),
+		ariaLabelledBy: ownLabel ? void 0 : props.web?.["aria-labelledby"] ?? field?.labelId,
+		ariaDescribedBy,
+		accessibilityHint: hint
+	};
+}
+/** Resolve field-control props and report whether a surrounding Field owns
+*  the label, so third-party controls can compose with Field without nesting. */
+function useFieldControl(props) {
+	const inField = useContext(FieldContext) != null;
+	return {
+		props: useFieldControlProps(props),
+		inField
+	};
+}
+//#endregion
+export { FieldContext, FieldProvider, useFieldControl, useFieldControlProps };

package/dist/web/form-layout-context.js

@@ -0,0 +1,10 @@
+import { createContext } from "octane";
+//#region src/form-layout-context.ts
+/** Layered arrangement context: `Field`/`FormField` switches to a
+*  horizontal-labels render under `direction === 'horizontal-labels'`, and
+*  `useFieldControlProps` resolves `aria-required` from
+*  `defaultOptionality`. Nested FormLayouts shadow the outer value. */
+var FormLayoutContext = /* @__PURE__ */ createContext({ direction: "vertical" });
+var FormLayoutProvider = FormLayoutContext;
+//#endregion
+export { FormLayoutContext, FormLayoutProvider };

package/dist/web/hash-image.js

@@ -0,0 +1,285 @@
+//#region src/hash-image.ts
+/** `blurhash:<hash>` / `thumbhash:<base64>` → PNG bytes as base64, or null. */
+function hashToPngBase64(src) {
+	if (src.startsWith("blurhash:")) {
+		const rgba = decodeBlurHash(src.slice(9), 32, 32);
+		return rgba ? base64Encode(rgbaToPng(32, 32, rgba)) : null;
+	}
+	if (src.startsWith("thumbhash:")) {
+		const hash = base64Decode(src.slice(10));
+		const decoded = hash ? thumbHashToRGBA(hash) : null;
+		return decoded ? base64Encode(rgbaToPng(decoded.w, decoded.h, decoded.rgba)) : null;
+	}
+	return null;
+}
+var BASE83 = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz#$%*+,-.:;=?@[]^_{|}~";
+function decode83(str, start, end) {
+	let value = 0;
+	for (let i = start; i < end; i++) {
+		const digit = BASE83.indexOf(str[i]);
+		if (digit === -1) return -1;
+		value = value * 83 + digit;
+	}
+	return value;
+}
+function srgbToLinear(value) {
+	const v = value / 255;
+	return v <= .04045 ? v / 12.92 : Math.pow((v + .055) / 1.055, 2.4);
+}
+function linearToSrgb(value) {
+	const v = Math.max(0, Math.min(1, value));
+	return v <= .0031308 ? Math.round(v * 12.92 * 255 + .5) : Math.round((1.055 * Math.pow(v, 1 / 2.4) - .055) * 255 + .5);
+}
+function signPow(value, exp) {
+	return Math.sign(value) * Math.pow(Math.abs(value), exp);
+}
+function decodeBlurHash(hash, width, height) {
+	if (hash.length < 6) return null;
+	const sizeFlag = decode83(hash, 0, 1);
+	const quantisedMax = decode83(hash, 1, 2);
+	const dcValue = decode83(hash, 2, 6);
+	if (sizeFlag < 0 || quantisedMax < 0 || dcValue < 0) return null;
+	const numY = Math.floor(sizeFlag / 9) + 1;
+	const numX = sizeFlag % 9 + 1;
+	if (hash.length !== 4 + 2 * numX * numY) return null;
+	const maximumValue = (quantisedMax + 1) / 166;
+	const colors = new Array(numX * numY);
+	colors[0] = [
+		srgbToLinear(dcValue >> 16),
+		srgbToLinear(dcValue >> 8 & 255),
+		srgbToLinear(dcValue & 255)
+	];
+	for (let i = 1; i < numX * numY; i++) {
+		const value = decode83(hash, 4 + i * 2, 6 + i * 2);
+		if (value < 0) return null;
+		const quantR = Math.floor(value / 361);
+		const quantG = Math.floor(value / 19) % 19;
+		const quantB = value % 19;
+		colors[i] = [
+			signPow((quantR - 9) / 9, 2) * maximumValue,
+			signPow((quantG - 9) / 9, 2) * maximumValue,
+			signPow((quantB - 9) / 9, 2) * maximumValue
+		];
+	}
+	const pixels = new Uint8ClampedArray(width * height * 4);
+	for (let y = 0; y < height; y++) for (let x = 0; x < width; x++) {
+		let r = 0;
+		let g = 0;
+		let b = 0;
+		for (let j = 0; j < numY; j++) for (let i = 0; i < numX; i++) {
+			const basis = Math.cos(Math.PI * x * i / width) * Math.cos(Math.PI * y * j / height);
+			const color = colors[i + j * numX];
+			r += color[0] * basis;
+			g += color[1] * basis;
+			b += color[2] * basis;
+		}
+		const o = (x + y * width) * 4;
+		pixels[o] = linearToSrgb(r);
+		pixels[o + 1] = linearToSrgb(g);
+		pixels[o + 2] = linearToSrgb(b);
+		pixels[o + 3] = 255;
+	}
+	return pixels;
+}
+function thumbHashToApproximateAspectRatio(hash) {
+	const header = hash[3];
+	const hasAlpha = (hash[2] & 128) !== 0;
+	const isLandscape = (hash[4] & 128) !== 0;
+	return (isLandscape ? hasAlpha ? 5 : 7 : header & 7) / (isLandscape ? header & 7 : hasAlpha ? 5 : 7);
+}
+function thumbHashToRGBA(hash) {
+	if (hash.length < 5) return null;
+	const { PI, min, max, cos, round } = Math;
+	const header24 = hash[0] | hash[1] << 8 | hash[2] << 16;
+	const header16 = hash[3] | hash[4] << 8;
+	const l_dc = (header24 & 63) / 63;
+	const p_dc = (header24 >> 6 & 63) / 31.5 - 1;
+	const q_dc = (header24 >> 12 & 63) / 31.5 - 1;
+	const l_scale = (header24 >> 18 & 31) / 31;
+	const hasAlpha = header24 >> 23 !== 0;
+	const p_scale = (header16 >> 3 & 63) / 63;
+	const q_scale = (header16 >> 9 & 63) / 63;
+	const isLandscape = header16 >> 15 !== 0;
+	const lx = max(3, isLandscape ? hasAlpha ? 5 : 7 : header16 & 7);
+	const ly = max(3, isLandscape ? header16 & 7 : hasAlpha ? 5 : 7);
+	const a_dc = hasAlpha ? (hash[5] & 15) / 15 : 1;
+	const a_scale = (hash[5] >> 4) / 15;
+	const ac_start = hasAlpha ? 6 : 5;
+	let ac_index = 0;
+	const decodeChannel = (nx, ny, scale) => {
+		const ac = [];
+		for (let cy = 0; cy < ny; cy++) for (let cx = cy ? 0 : 1; cx * ny < nx * (ny - cy); cx++) {
+			const byte = hash[ac_start + (ac_index >> 1)];
+			if (byte === void 0) return null;
+			ac.push(((byte >> ((ac_index++ & 1) << 2) & 15) / 7.5 - 1) * scale);
+		}
+		return ac;
+	};
+	const l_ac = decodeChannel(lx, ly, l_scale);
+	const p_ac = decodeChannel(3, 3, p_scale * 1.25);
+	const q_ac = decodeChannel(3, 3, q_scale * 1.25);
+	const a_ac = hasAlpha ? decodeChannel(5, 5, a_scale) : null;
+	if (!l_ac || !p_ac || !q_ac || hasAlpha && !a_ac) return null;
+	const ratio = thumbHashToApproximateAspectRatio(hash);
+	const w = round(ratio > 1 ? 32 : 32 * ratio);
+	const h = round(ratio > 1 ? 32 / ratio : 32);
+	const rgba = new Uint8Array(w * h * 4);
+	const fx = [];
+	const fy = [];
+	for (let y = 0, i = 0; y < h; y++) for (let x = 0; x < w; x++, i += 4) {
+		let l = l_dc;
+		let p = p_dc;
+		let q = q_dc;
+		let a = a_dc;
+		for (let cx = 0, n = max(lx, hasAlpha ? 5 : 3); cx < n; cx++) fx[cx] = cos(PI / w * (x + .5) * cx);
+		for (let cy = 0, n = max(ly, hasAlpha ? 5 : 3); cy < n; cy++) fy[cy] = cos(PI / h * (y + .5) * cy);
+		for (let cy = 0, j = 0; cy < ly; cy++) for (let cx = cy ? 0 : 1, fy2 = fy[cy] * 2; cx * ly < lx * (ly - cy); cx++, j++) l += l_ac[j] * fx[cx] * fy2;
+		for (let cy = 0, j = 0; cy < 3; cy++) for (let cx = cy ? 0 : 1, fy2 = fy[cy] * 2; cx < 3 - cy; cx++, j++) {
+			const f = fx[cx] * fy2;
+			p += p_ac[j] * f;
+			q += q_ac[j] * f;
+		}
+		if (hasAlpha && a_ac) for (let cy = 0, j = 0; cy < 5; cy++) for (let cx = cy ? 0 : 1, fy2 = fy[cy] * 2; cx < 5 - cy; cx++, j++) a += a_ac[j] * fx[cx] * fy2;
+		const b = l - 2 / 3 * p;
+		const r = (3 * l - b + q) / 2;
+		const g = r - q;
+		rgba[i] = max(0, 255 * min(1, r));
+		rgba[i + 1] = max(0, 255 * min(1, g));
+		rgba[i + 2] = max(0, 255 * min(1, b));
+		rgba[i + 3] = max(0, 255 * min(1, a));
+	}
+	return {
+		w,
+		h,
+		rgba
+	};
+}
+var PNG_CRC_TABLE = [
+	0,
+	498536548,
+	997073096,
+	651767980,
+	1994146192,
+	1802195444,
+	1303535960,
+	1342533948,
+	-306674912,
+	-267414716,
+	-690576408,
+	-882789492,
+	-1687895376,
+	-2032938284,
+	-1609899400,
+	-1111625188
+];
+/** Uncompressed PNG (zlib store blocks) — correctness over size; inputs are
+*  ~32px placeholders so the payload stays small. */
+function rgbaToPng(w, h, rgba) {
+	const row = w * 4 + 1;
+	const idat = 6 + h * (5 + row);
+	const bytes = [
+		137,
+		80,
+		78,
+		71,
+		13,
+		10,
+		26,
+		10,
+		0,
+		0,
+		0,
+		13,
+		73,
+		72,
+		68,
+		82,
+		0,
+		0,
+		w >> 8,
+		w & 255,
+		0,
+		0,
+		h >> 8,
+		h & 255,
+		8,
+		6,
+		0,
+		0,
+		0,
+		0,
+		0,
+		0,
+		0,
+		idat >>> 24,
+		idat >> 16 & 255,
+		idat >> 8 & 255,
+		idat & 255,
+		73,
+		68,
+		65,
+		84,
+		120,
+		1
+	];
+	let a = 1;
+	let b = 0;
+	for (let y = 0, i = 0, end = row - 1; y < h; y++, end += row - 1) {
+		bytes.push(y + 1 < h ? 0 : 1, row & 255, row >> 8, ~row & 255, row >> 8 ^ 255, 0);
+		for (b = (b + a) % 65521; i < end; i++) {
+			const u = rgba[i] & 255;
+			bytes.push(u);
+			a = (a + u) % 65521;
+			b = (b + a) % 65521;
+		}
+	}
+	bytes.push(b >> 8, b & 255, a >> 8, a & 255, 0, 0, 0, 0, 0, 0, 0, 0, 73, 69, 78, 68, 174, 66, 96, 130);
+	for (let [start, end] of [[12, 29], [37, 41 + idat]]) {
+		let c = -1;
+		for (let i = start; i < end; i++) {
+			c ^= bytes[i];
+			c = c >>> 4 ^ PNG_CRC_TABLE[c & 15];
+			c = c >>> 4 ^ PNG_CRC_TABLE[c & 15];
+		}
+		c = ~c;
+		bytes[end++] = c >>> 24;
+		bytes[end++] = c >> 16 & 255;
+		bytes[end++] = c >> 8 & 255;
+		bytes[end++] = c & 255;
+	}
+	return bytes;
+}
+var BASE64_CHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
+function base64Encode(bytes) {
+	let out = "";
+	for (let i = 0; i < bytes.length; i += 3) {
+		const b0 = bytes[i];
+		const b1 = i + 1 < bytes.length ? bytes[i + 1] : 0;
+		const b2 = i + 2 < bytes.length ? bytes[i + 2] : 0;
+		out += BASE64_CHARS[b0 >> 2];
+		out += BASE64_CHARS[(b0 & 3) << 4 | b1 >> 4];
+		out += i + 1 < bytes.length ? BASE64_CHARS[(b1 & 15) << 2 | b2 >> 6] : "=";
+		out += i + 2 < bytes.length ? BASE64_CHARS[b2 & 63] : "=";
+	}
+	return out;
+}
+function base64Decode(text) {
+	const clean = text.replace(/-/g, "+").replace(/_/g, "/").replace(/[\s=]/g, "");
+	const bytes = new Uint8Array(Math.floor(clean.length * 3 / 4));
+	let out = 0;
+	let acc = 0;
+	let bits = 0;
+	for (const ch of clean) {
+		const digit = BASE64_CHARS.indexOf(ch);
+		if (digit === -1) return null;
+		acc = acc << 6 | digit;
+		bits += 6;
+		if (bits >= 8) {
+			bits -= 8;
+			if (out < bytes.length) bytes[out++] = acc >> bits & 255;
+		}
+	}
+	return bytes.subarray(0, out);
+}
+//#endregion
+export { hashToPngBase64 };

package/dist/web/icons.js

@@ -17,9 +17,31 @@ function getIcon(name) {
 }
 if (!icons.has("xplat-search")) icons.set("xplat-search", { svg: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" });
 if (!icons.has("xplat-clear")) icons.set("xplat-clear", { svg: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" });
+if (!icons.has("xplat-copy")) icons.set("xplat-copy", { svg: "M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z" });
+if (!icons.has("xplat-check")) icons.set("xplat-check", { svg: "M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" });
+if (!icons.has("xplat-chevron-down")) icons.set("xplat-chevron-down", { svg: "M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z" });
+if (!icons.has("xplat-chevron-up")) icons.set("xplat-chevron-up", { svg: "M12 8l-6 6 1.41 1.41L12 9.83l4.59 4.58L18 14z" });
+if (!icons.has("xplat-doc-image")) icons.set("xplat-doc-image", { svg: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" });
+if (!icons.has("xplat-more-horizontal")) icons.set("xplat-more-horizontal", { svg: "M5 10a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4z" });
 if (!icons.has("xplat-play")) icons.set("xplat-play", { svg: "M8 5v14l11-7z" });
 if (!icons.has("xplat-pause")) icons.set("xplat-pause", { svg: "M6 19h4V5H6v14zm8-14v14h4V5h-4z" });
 if (!icons.has("xplat-volume")) icons.set("xplat-volume", { svg: "M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z" });
+if (!icons.has("xplat-calendar")) icons.set("xplat-calendar", { svg: "M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V10h14v10zM9 14H7v-2h2v2zm4 0h-2v-2h2v2zm4 0h-2v-2h2v2z" });
+if (!icons.has("xplat-clock")) icons.set("xplat-clock", { svg: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z" });
+if (!icons.has("xplat-upload")) icons.set("xplat-upload", { svg: "M9 16h6v-6h4l-7-7-7 7h4v6zm-4 2h14v2H5v-2z" });
+if (!icons.has("xplat-close")) icons.set("xplat-close", { svg: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" });
+if (!icons.has("xplat-chevron-left")) icons.set("xplat-chevron-left", { svg: "M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z" });
+if (!icons.has("xplat-chevron-right")) icons.set("xplat-chevron-right", { svg: "M8.59 16.59 10 18l6-6-6-6-1.41 1.41L13.17 12z" });
 if (!icons.has("xplat-volume-off")) icons.set("xplat-volume-off", { svg: "M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.45-.54 2.78-1.32 3.97-2.27L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z" });
+if (!icons.has("xplat-send")) icons.set("xplat-send", { svg: "M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z" });
+if (!icons.has("xplat-stop")) icons.set("xplat-stop", { svg: "M6 6h12v12H6z" });
+if (!icons.has("xplat-chevron-down")) icons.set("xplat-chevron-down", { svg: "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" });
+if (!icons.has("xplat-clock")) icons.set("xplat-clock", { svg: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z" });
+if (!icons.has("xplat-check")) icons.set("xplat-check", { svg: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" });
+if (!icons.has("xplat-check-double")) icons.set("xplat-check-double", { svg: "M0.41 13.41L6 19l1.41-1.42L1.83 12zM22.24 5.58L11.66 16.17 7.5 12l-1.43 1.41 5.59 5.59L23.66 7zM18 7l-1.41-1.42-6.35 6.35 1.41 1.41L18 7z" });
+if (!icons.has("xplat-error")) icons.set("xplat-error", { svg: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" });
+if (!icons.has("xplat-warning")) icons.set("xplat-warning", { svg: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" });
+if (!icons.has("xplat-wrench")) icons.set("xplat-wrench", { svg: "M22.7 19l-9.1-9.1c.9-2.3.4-5-1.5-6.9-2-2-5-2.4-7.4-1.3L9 6 6 9 1.6 4.7C.4 7.1.9 10.1 2.9 12.1c1.9 1.9 4.6 2.4 6.9 1.5l9.1 9.1c.4.4 1 .4 1.4 0l2.3-2.3c.5-.4.5-1.1.1-1.4z" });
+if (!icons.has("xplat-mic")) icons.set("xplat-mic", { svg: "M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm5.3-3c0 3-2.54 5.1-5.3 5.1S6.7 14 6.7 11H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c3.28-.48 6-3.3 6-6.72h-1.7z" });
 //#endregion
 export { getIcon, registerIcon, registerIcons };

package/dist/web/image-content.js

@@ -0,0 +1,133 @@
+//#region src/image-content.ts
+/** Shared `contentFit`/`contentPosition` + multi-source math for `Image` —
+*  pure functions used by every leaf (docs/notes/expo-image-study.md L7/L8).
+*  Semantics mirror CSS `object-fit`/`object-position`, which is also
+*  expo-image's contract: the leaves compute the drawn-content rect
+*  themselves instead of delegating to platform scaleType/contentMode,
+*  so all platforms get the same answer.
+*
+*  The default fit is 'cover' everywhere (the expo/RN default). Today's
+*  platform defaults disagree — web <img> is 'fill' and NS stretch is
+*  'aspectFit' — so an un-propped Image was silently divergent. */
+var DEFAULT_CONTENT_FIT = "cover";
+function resolveContentFit(fit) {
+	return fit ?? "cover";
+}
+/** expo-image's keyword shorthands; the object form positions relative to
+*  any corner pair ({top,left}, {top,right}, {bottom,left}, {bottom,right}). */
+var POSITION_KEYWORDS = {
+	center: {
+		top: "50%",
+		left: "50%"
+	},
+	top: {
+		top: 0,
+		left: "50%"
+	},
+	right: {
+		top: "50%",
+		right: 0
+	},
+	bottom: {
+		bottom: 0,
+		left: "50%"
+	},
+	left: {
+		top: "50%",
+		left: 0
+	},
+	"top center": {
+		top: 0,
+		left: "50%"
+	},
+	"top right": {
+		top: 0,
+		right: 0
+	},
+	"top left": {
+		top: 0,
+		left: 0
+	},
+	"right center": {
+		top: "50%",
+		right: 0
+	},
+	"right top": {
+		top: 0,
+		right: 0
+	},
+	"right bottom": {
+		bottom: 0,
+		right: 0
+	},
+	"bottom center": {
+		bottom: 0,
+		left: "50%"
+	},
+	"bottom right": {
+		bottom: 0,
+		right: 0
+	},
+	"bottom left": {
+		bottom: 0,
+		left: 0
+	},
+	"left center": {
+		top: "50%",
+		left: 0
+	},
+	"left top": {
+		top: 0,
+		left: 0
+	},
+	"left bottom": {
+		bottom: 0,
+		left: 0
+	}
+};
+function resolveContentPosition(position) {
+	if (typeof position === "string") return POSITION_KEYWORDS[position] ?? POSITION_KEYWORDS.center;
+	return position ?? POSITION_KEYWORDS.center;
+}
+function ensureWebUnits(value) {
+	const text = String(value).trim();
+	return text.endsWith("%") ? text : `${text}px`;
+}
+/** Browser `object-position` for a resolved position — mirrors expo-image
+*  web's `getObjectPositionFromContentPositionObject`. */
+function objectPositionCSSValue(position) {
+	const resolved = { ...position };
+	if (resolved.top == null && resolved.bottom == null) resolved.top = "50%";
+	if (resolved.left == null && resolved.right == null) resolved.left = "50%";
+	return [
+		"top",
+		"bottom",
+		"left",
+		"right"
+	].map((edge) => resolved[edge] != null ? `${edge} ${ensureWebUnits(resolved[edge])}` : "").filter((part) => part !== "").join(" ") || "50% 50%";
+}
+/** Browser `srcset` candidates for a source array: `w` descriptors (real
+*  file px = width·scale) when every source is sized, `x` descriptors when
+*  every source only carries density. `src` falls back to the largest
+*  declared pixel count — guaranteed coverage where srcset is ignored. */
+function imageSrcSet(sources) {
+	if (sources.length === 0) return { src: "" };
+	const everyWidth = sources.every((source) => typeof source.width === "number" && source.width > 0);
+	const everyScale = !everyWidth && sources.every((source) => typeof source.scale === "number" && source.scale > 0);
+	const srcSet = everyWidth ? sources.map((source) => `${source.uri} ${Math.round(source.width * (source.scale ?? 1))}w`).join(", ") : everyScale ? sources.map((source) => `${source.uri} ${source.scale}x`).join(", ") : void 0;
+	let fallback = sources[0];
+	let bestCount = -Infinity;
+	for (const source of sources) {
+		const count = (source.width ?? 0) * (source.height ?? 0) * (source.scale ?? 1) ** 2;
+		if (count > bestCount) {
+			bestCount = count;
+			fallback = source;
+		}
+	}
+	return {
+		src: fallback.uri,
+		srcSet
+	};
+}
+//#endregion
+export { DEFAULT_CONTENT_FIT, imageSrcSet, objectPositionCSSValue, resolveContentFit, resolveContentPosition };