one/dist/esm/platform/widgets/view.mjs

One is a React framework for web, iOS, and Android apps.

import { Children, Fragment, isValidElement } from "react";

const WidgetUI = Object.freeze({
	Text: "one-widget-text",
	VStack: "one-widget-vstack",
	HStack: "one-widget-hstack",
	ZStack: "one-widget-zstack",
	Spacer: "one-widget-spacer",
	Divider: "one-widget-divider",
	Image: "one-widget-image",
	Progress: "one-widget-progress",
	Gauge: "one-widget-gauge",
	Circle: "one-widget-circle",
	Rectangle: "one-widget-rectangle",
	RoundedRectangle: "one-widget-rounded-rectangle",
	Link: "one-widget-link"
});
const hexColor = /^#[0-9a-fA-F]{6}$/;
const styleNumberKeys = [
	"fontSize",
	"padding",
	"borderRadius",
	"spacing",
	"width",
	"height",
	"opacity"
];
const styleStringKeys = [
	"fontWeight",
	"fontDesign",
	"alignment"
];
function checkStyle(style, fill) {
	if (fill != null && (typeof fill !== "string" || !hexColor.test(fill))) {
		throw new Error("WidgetUI fill must be six-digit hex like #1685B1");
	}
	if (style == null) return;
	if (typeof style !== "object" || Array.isArray(style)) {
		throw new Error("WidgetUI style must be an object");
	}
	for (const key of ["color", "backgroundColor"]) {
		const value = style[key];
		if (value != null && (typeof value !== "string" || !hexColor.test(value))) {
			throw new Error(`WidgetUI ${key} must be six-digit hex like #1685B1`);
		}
	}
	if (style.lineLimit != null && (typeof style.lineLimit !== "number" || !Number.isInteger(style.lineLimit))) {
		throw new Error("WidgetUI lineLimit must be an integer");
	}
	for (const key of styleNumberKeys) {
		if (style[key] != null && typeof style[key] !== "number") {
			throw new Error(`WidgetUI ${key} must be a number`);
		}
	}
	for (const key of styleStringKeys) {
		if (style[key] != null && typeof style[key] !== "string") {
			throw new Error(`WidgetUI ${key} must be a string`);
		}
	}
}
function node(view) {
	if (view == null || typeof view === "boolean") return null;
	if (typeof view === "string" || typeof view === "number") {
		return {
			type: "text",
			text: String(view)
		};
	}
	if (Array.isArray(view)) {
		return {
			type: "vstack",
			children: children(view)
		};
	}
	if (!isValidElement(view)) {
		throw new Error("Widget JSX needs a WidgetUI root");
	}
	if (view.type === Fragment) {
		return {
			type: "vstack",
			children: children(view.props.children)
		};
	}
	if (typeof view.type === "function") {
		if (view.type.prototype && "isReactComponent" in view.type.prototype) {
			throw new Error("Widget JSX supports pure function components");
		}
		return node(view.type(view.props));
	}
	const type = typeof view.type === "string" && view.type.startsWith("one-widget-") ? view.type.slice("one-widget-".length) : void 0;
	if (!type || ![
		"text",
		"vstack",
		"hstack",
		"zstack",
		"spacer",
		"divider",
		"image",
		"progress",
		"gauge",
		"circle",
		"rectangle",
		"rounded-rectangle",
		"link"
	].includes(type)) {
		throw new Error("Widget JSX only supports WidgetUI primitives and pure components");
	}
	const { children: content, style, ...props } = view.props;
	checkStyle(style, props.fill);
	if (props.cornerRadius != null && typeof props.cornerRadius !== "number") {
		throw new Error("WidgetUI cornerRadius must be a number");
	}
	if (type === "text") {
		const parts = Children.toArray(content);
		if (parts.some((part) => typeof part !== "string" && typeof part !== "number")) {
			throw new Error("WidgetUI.Text children must be text or numbers");
		}
		return {
			type,
			text: parts.join(""),
			style
		};
	}
	if (type === "image") {
		if (typeof props.systemName !== "string" || !props.systemName) {
			throw new Error("WidgetUI.Image needs a systemName");
		}
		return {
			type,
			style,
			systemName: props.systemName
		};
	}
	if (type === "progress" || type === "gauge") {
		if (!Number.isFinite(props.value) || !Number.isFinite(props.total ?? 1) || (props.total ?? 1) <= 0) {
			throw new Error("WidgetUI progress values must be finite and total must be positive");
		}
		return {
			type,
			style,
			value: props.value,
			total: props.total ?? 1
		};
	}
	if (type === "circle" || type === "rectangle" || type === "rounded-rectangle") {
		return {
			type,
			style,
			fill: props.fill,
			cornerRadius: props.cornerRadius
		};
	}
	if (type === "link") {
		let valid = false;
		try {
			valid = Boolean(new URL(props.url).protocol);
		} catch {}
		if (!valid) {
			throw new Error("WidgetUI.Link needs an absolute URL");
		}
		return {
			type,
			style,
			url: props.url,
			children: children(content)
		};
	}
	if (type === "spacer" || type === "divider") return {
		type,
		style
	};
	return {
		type,
		style,
		children: children(content)
	};
}
function children(content) {
	const nodes = [];
	for (const child of Children.toArray(content)) {
		const next = node(child);
		if (next) nodes.push(next);
	}
	return nodes;
}
function encodeWidgetView(view) {
	const root = node(view);
	if (!root) {
		throw new Error("Widget JSX needs a WidgetUI root");
	}
	return JSON.stringify(root);
}
function encodeActivityView(view) {
	const lockScreen = node(view.lockScreen);
	if (!lockScreen) {
		throw new Error("Live Activity JSX needs a lockScreen layout");
	}
	const encoded = JSON.stringify({
		lockScreen,
		compactLeading: view.compactLeading == null ? null : node(view.compactLeading),
		compactTrailing: view.compactTrailing == null ? null : node(view.compactTrailing),
		minimal: view.minimal == null ? null : node(view.minimal),
		expandedLeading: view.expandedLeading == null ? null : node(view.expandedLeading),
		expandedTrailing: view.expandedTrailing == null ? null : node(view.expandedTrailing),
		expandedBottom: view.expandedBottom == null ? null : node(view.expandedBottom)
	});
	if (new TextEncoder().encode(encoded).length > 3500) {
		throw new Error("Live Activity JSX must fit within 3500 UTF-8 bytes");
	}
	return encoded;
}

export { WidgetUI, encodeActivityView, encodeWidgetView };
//# sourceMappingURL=view.mjs.map