@octane-xplat/ui 0.4.0 → 0.6.0

package/dist/native/android/openModal.android.js

@@ -0,0 +1,39 @@
+import { applyThemeClasses } from "../theme/theme-scheme.js";
+import { modalPresenter } from "../modal-presenter.native.js";
+import { createNativeScriptRoot } from "@nativescript-community/octane";
+import { Frame, GridLayout } from "@nativescript/core";
+//#region src/android/openModal.android.ts
+/** Open a component in its own NativeScript modal root and resolve on close. */
+var openModal = (Component, params, options = {}) => new Promise((resolve, reject) => {
+	const presenter = modalPresenter(Frame.topmost());
+	if (!presenter) {
+		reject(/* @__PURE__ */ new Error("openModal dropped — no live presenter. The topmost frame has no loaded currentPage (a page mid-navigation), or no frame is active yet."));
+		return;
+	}
+	const host = new GridLayout();
+	const unbindTheme = applyThemeClasses(host, "vx-modal-host");
+	const root = createNativeScriptRoot(host);
+	let finished = false;
+	const finish = (result) => {
+		if (finished) return;
+		finished = true;
+		unbindTheme();
+		root.unmount?.();
+		host.removeChildren?.();
+		resolve(result);
+	};
+	const close = (result) => host.closeModal(result);
+	root.render(Component, {
+		params,
+		close
+	});
+	const fullscreen = options.presentation ? options.presentation === "fullscreen" : options.fullscreen ?? true;
+	presenter.showModal(host, {
+		context: {},
+		closeCallback: finish,
+		fullscreen,
+		animated: options.animated ?? true
+	});
+});
+//#endregion
+export { openModal };

package/dist/native/camera-permission.native.js

@@ -0,0 +1,47 @@
+import { Application, isAndroid, isIOS } from "@nativescript/core";
+//#region src/camera-permission.native.ts
+var cameraRequestCode = 7719;
+function cameraHardwarePresent() {
+	if (isIOS) return typeof globalThis.AVCaptureDevice !== "undefined";
+	if (isAndroid) try {
+		return (Application.android?.context ?? Application.android?.startActivity)?.packageManager?.hasSystemFeature("android.hardware.camera.any") !== false;
+	} catch {
+		return true;
+	}
+	return false;
+}
+async function ensureCameraPermission() {
+	try {
+		if (isIOS) {
+			const av = globalThis.AVCaptureDevice;
+			const video = globalThis.AVMediaTypeVideo;
+			const status = av?.authorizationStatusForMediaType?.(video);
+			if (status === 3) return true;
+			if (status === 1 || status === 2) return false;
+			return await new Promise((resolve) => {
+				av.requestAccessForMediaTypeCompletionHandler(video, (granted) => resolve(granted));
+			});
+		}
+		if (isAndroid) {
+			const perm = "android.permission.CAMERA";
+			const activity = Application.android.foregroundActivity ?? Application.android.startActivity;
+			if (activity?.checkSelfPermission?.(perm) === android.content.pm.PackageManager.PERMISSION_GRANTED) return true;
+			if (!activity) return false;
+			return await new Promise((resolve) => {
+				const requestCode = cameraRequestCode++;
+				const onResult = (args) => {
+					if (args.requestCode !== requestCode) return;
+					Application.android.off(Application.android.activityRequestPermissionsEvent, onResult);
+					resolve(args.grantResults?.[0] === android.content.pm.PackageManager.PERMISSION_GRANTED);
+				};
+				Application.android.on(Application.android.activityRequestPermissionsEvent, onResult);
+				activity.requestPermissions([perm], requestCode);
+			});
+		}
+		return false;
+	} catch {
+		return false;
+	}
+}
+//#endregion
+export { cameraHardwarePresent, ensureCameraPermission };

package/dist/native/child-array.js

@@ -0,0 +1,15 @@
+//#region src/child-array.ts
+/** Normalize a JSX children value to a flat array — children may be a
+*  single node, an array, or nested arrays from `.map` calls. */
+function toChildArray(children) {
+	const out = [];
+	const walk = (node) => {
+		if (node == null || node === false) return;
+		if (Array.isArray(node)) for (const child of node) walk(child);
+		else out.push(node);
+	};
+	walk(children);
+	return out;
+}
+//#endregion
+export { toChildArray };

package/dist/native/{ui3.js → escape-props.native.js}

@@ -6,6 +6,27 @@ function applyEscapeProps(view, props) {
 	const bag = isIOS ? props.ios : isAndroid ? props.android : void 0;
 	if (bag) Object.assign(view, bag);
 }
+var NATIVE_ACCESSIBILITY_ROLES = {
+	button: "button",
+	link: "link",
+	search: "search",
+	image: "image",
+	heading: "header",
+	adjustable: "adjustable",
+	summary: "summary",
+	text: "text",
+	none: "none",
+	progressbar: "progressBar",
+	checkbox: "checkbox",
+	switch: "switch",
+	radio: "radioButton",
+	spinbutton: "spinButton",
+	tab: "button"
+};
+/** Translate the shared/ARIA spelling to NativeScript's narrower role enum. */
+function nativeAccessibilityRole(role) {
+	return role ? NATIVE_ACCESSIBILITY_ROLES[role] : void 0;
+}
 /** NativeScript's AccessibilityState is a single enum value, unlike the
 *  web's independent ARIA booleans. Priority follows the strongest state. */
 function nativeAccessibilityState(state) {
@@ -15,4 +36,4 @@ function nativeAccessibilityState(state) {
 	if (state?.checked === false) return "unchecked";
 }
 //#endregion
-export { applyEscapeProps, nativeAccessibilityState };
+export { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState };

package/dist/native/icons.js

@@ -0,0 +1,25 @@
+//#region src/icons.ts
+/**
+* App-owned icon registry. `svg` is SVG path `d` data (not a full SVG
+* markup string). `src` can carry an image or an SVG source; the leaves only
+* infer SVG from inline markup, SVG data URIs, and `.svg` paths/URLs. Native
+* `font` glyphs render only when the app ships and registers that font.
+*/
+var icons = /* @__PURE__ */ new Map();
+function registerIcon(name, glyph) {
+	icons.set(name, glyph);
+}
+function registerIcons(record) {
+	for (const [name, glyph] of Object.entries(record)) icons.set(name, glyph);
+}
+function getIcon(name) {
+	return icons.get(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-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-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" });
+//#endregion
+export { getIcon, registerIcon, registerIcons };

package/dist/native/{ui11.js → ios/LiquidGlass.ios.tsrx.js}

@@ -1,9 +1,9 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps } from "./ui3.js";
-import { layoutChildProps } from "./ui5.js";
+import { cx } from "../cx.js";
+import { applyEscapeProps } from "../escape-props.native.js";
+import { layoutChildProps } from "../layout-child.native.js";
 import { defineUniversalComponent, registerElement, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
 import { LiquidGlass } from "@nativescript/core";
-//#region src/LiquidGlass.native.tsrx
+//#region src/ios/LiquidGlass.ios.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "liquidglass",

package/dist/native/{ui12.js → ios/LiquidGlassContainer.ios.tsrx.js}

@@ -1,9 +1,9 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps } from "./ui3.js";
-import { layoutChildProps } from "./ui5.js";
+import { cx } from "../cx.js";
+import { applyEscapeProps } from "../escape-props.native.js";
+import { layoutChildProps } from "../layout-child.native.js";
 import { defineUniversalComponent, registerElement, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
 import { LiquidGlassContainer } from "@nativescript/core";
-//#region src/LiquidGlassContainer.native.tsrx
+//#region src/ios/LiquidGlassContainer.ios.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "liquidglasscontainer",

package/dist/native/ios/SideDrawer.ios.tsrx.js

@@ -0,0 +1,64 @@
+import { cx } from "../cx.js";
+import { defineUniversalComponent, hookSlots, registerElement, universalIf, universalPlan, universalValue, useEffect, useRef } from "@nativescript-community/octane";
+import { Drawer, install } from "@nativescript-community/ui-drawer";
+//#region src/ios/SideDrawer.ios.tsrx
+var _hs$ = /* @__PURE__ */ hookSlots(2);
+var _h$0 = /* @__PURE__ */ Symbol(_hs$);
+var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "gridlayout",
+	"props": { "hostSlot": "leftDrawer" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "drawer",
+	"bindings": [
+		["id", 0],
+		["ref", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [{
+		"kind": "host",
+		"type": "gridlayout",
+		"props": { "hostSlot": "mainContent" },
+		"children": [{
+			"kind": "slot",
+			"slot": 4
+		}]
+	}, {
+		"kind": "slot",
+		"slot": 5
+	}]
+});
+install();
+registerElement("drawer", Drawer);
+var SideDrawer = defineUniversalComponent("nativescript", function SideDrawer(props) {
+	const host = useRef(null, _h$0);
+	useEffect(() => {
+		const d = host.current;
+		if (!d) return;
+		if (props.open && !d.isOpened("left")) d.open("left").catch(() => {});
+		else if (!props.open && d.isOpened("left")) d.close("left").catch(() => {});
+	}, [props.open], _h$1);
+	return universalValue(__octaneUniversalPlan1, [
+		props.id,
+		(d) => {
+			host.current = d;
+			if (d && props.ios) Object.assign(d, props.ios);
+		},
+		cx("vx-drawer", props.className),
+		props.style,
+		props.main,
+		universalIf(props.drawer != null, () => {
+			return universalValue(__octaneUniversalPlan0, [props.drawer]);
+		})
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { SideDrawer };

package/dist/native/{ui50.js → ios/UIActivityIndicatorView.ios.tsrx.js}

@@ -1,7 +1,7 @@
-import { cx } from "./ui2.js";
-import { applyNativeProps } from "./ui36.js";
+import { cx } from "../cx.js";
+import { applyNativeProps } from "../platformProps.native.js";
 import { defineUniversalComponent, universalPlan, universalValue } from "@nativescript-community/octane";
-//#region src/ActivityIndicator.native.tsrx
+//#region src/ios/UIActivityIndicatorView.ios.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "activityindicator",
@@ -13,7 +13,7 @@ var __octaneUniversalPlan0 = universalPlan("nativescript", {
 		["ref", 4]
 	]
 });
-var ActivityIndicator = defineUniversalComponent("nativescript", function ActivityIndicator(props) {
+var UIActivityIndicatorView = defineUniversalComponent("nativescript", function UIActivityIndicatorView(props) {
 	if (props.busy === false) return null;
 	return universalValue(__octaneUniversalPlan0, [
 		props.id,
@@ -24,4 +24,4 @@ var ActivityIndicator = defineUniversalComponent("nativescript", function Activi
 	]);
 }, { "module": "@nativescript-community/octane" });
 //#endregion
-export { ActivityIndicator };
+export { UIActivityIndicatorView };

package/dist/native/{ui32.js → ios/UIModal.ios.tsrx.js}

@@ -1,7 +1,8 @@
-import { applyThemeClasses } from "./ui31.js";
+import { applyThemeClasses } from "../theme/theme-scheme.js";
+import { modalPresenter } from "../modal-presenter.native.js";
 import { createNativeScriptRoot, defineUniversalComponent, hookSlots, universalPlan, universalValue, useEffect, useRef } from "@nativescript-community/octane";
 import { Frame, GridLayout } from "@nativescript/core";
-//#region src/Modal.native.tsrx
+//#region src/ios/UIModal.ios.tsrx
 var _hs$ = /* @__PURE__ */ hookSlots(2);
 var _h$0 = /* @__PURE__ */ Symbol(_hs$);
 var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
@@ -19,12 +20,15 @@ var __octaneUniversalPlan1 = universalPlan("nativescript", {
 var Panel = defineUniversalComponent("nativescript", function Panel(props) {
 	return universalValue(__octaneUniversalPlan0, [props.children]);
 }, { "module": "@nativescript-community/octane" });
-var Modal = defineUniversalComponent("nativescript", function Modal(props) {
+var UIModal = defineUniversalComponent("nativescript", function UIModal(props) {
 	const shown = useRef(null, _h$0);
 	useEffect(() => {
 		if (props.open && !shown.current) {
-			const presenter = Frame.topmost()?.currentPage ?? Frame.topmost();
-			if (!presenter) return;
+			const presenter = modalPresenter(Frame.topmost());
+			if (!presenter) {
+				console.warn("[Modal] open dropped — no live presenter (currentPage mid-navigation or no active frame).");
+				return;
+			}
 			const host = new GridLayout();
 			const unbindTheme = applyThemeClasses(host, "vx-modal-host");
 			const root = createNativeScriptRoot(host);
@@ -55,4 +59,4 @@ var Modal = defineUniversalComponent("nativescript", function Modal(props) {
 	return universalValue(__octaneUniversalPlan1, []);
 }, { "module": "@nativescript-community/octane" });
 //#endregion
-export { Modal };
+export { UIModal };

package/dist/native/{ui53.js → ios/UISlider.ios.tsrx.js}

@@ -1,7 +1,7 @@
-import { cx } from "./ui2.js";
-import { applyNativeProps } from "./ui36.js";
+import { cx } from "../cx.js";
+import { applyNativeProps } from "../platformProps.native.js";
 import { defineUniversalComponent, universalPlan, universalValue } from "@nativescript-community/octane";
-//#region src/Slider.native.tsrx
+//#region src/ios/UISlider.ios.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "slider",
@@ -17,7 +17,7 @@ var __octaneUniversalPlan0 = universalPlan("nativescript", {
 		["ref", 8]
 	]
 });
-var Slider = defineUniversalComponent("nativescript", function Slider(props) {
+var UISlider = defineUniversalComponent("nativescript", function UISlider(props) {
 	return universalValue(__octaneUniversalPlan0, [
 		props.id,
 		cx(props.className),
@@ -31,4 +31,4 @@ var Slider = defineUniversalComponent("nativescript", function Slider(props) {
 	]);
 }, { "module": "@nativescript-community/octane" });
 //#endregion
-export { Slider };
+export { UISlider };

package/dist/native/{ui45.js → ios/UISwitch.ios.tsrx.js}

@@ -1,7 +1,7 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps } from "./ui3.js";
+import { cx } from "../cx.js";
+import { applyEscapeProps } from "../escape-props.native.js";
 import { defineUniversalComponent, universalPlan, universalValue } from "@nativescript-community/octane";
-//#region src/Switch.native.tsrx
+//#region src/ios/UISwitch.ios.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "switch",
@@ -14,7 +14,7 @@ var __octaneUniversalPlan0 = universalPlan("nativescript", {
 		["onCheckedChange", 5]
 	]
 });
-var Switch = defineUniversalComponent("nativescript", function Switch(props) {
+var UISwitch = defineUniversalComponent("nativescript", function UISwitch(props) {
 	return universalValue(__octaneUniversalPlan0, [
 		(v) => applyEscapeProps(v, props),
 		props.id,
@@ -25,4 +25,4 @@ var Switch = defineUniversalComponent("nativescript", function Switch(props) {
 	]);
 }, { "module": "@nativescript-community/octane" });
 //#endregion
-export { Switch };
+export { UISwitch };

package/dist/native/ios/UITabBar.ios.tsrx.js

@@ -0,0 +1,166 @@
+import { cx } from "../cx.js";
+import { getIcon } from "../icons.js";
+import { registerStack } from "../stacks.native.js";
+import { createNativeScriptRoot, defineUniversalComponent, markWarm, memo, universalComponent, universalPlan, universalProps, universalValue, useBatch, warmChild } from "@nativescript-community/octane";
+import { Frame, GridLayout, Page, TabViewItem } from "@nativescript/core";
+//#region src/ios/UITabBar.ios.tsrx
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "tabview",
+	"bindings": [
+		["id", 0],
+		["className", 1],
+		["style", 2],
+		["items", 3],
+		["selectedIndex", 4],
+		["onSelectedIndexChanged", 5],
+		["onLoaded", 6]
+	]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var TabPane = defineUniversalComponent("nativescript", function TabPane(props) {
+	return universalValue(__octaneUniversalPlan0, [props.render()]);
+}, { "module": "@nativescript-community/octane" });
+var paneRoots = /* @__PURE__ */ new WeakMap();
+var tabsByView = /* @__PURE__ */ new WeakMap();
+var itemsCache = /* @__PURE__ */ new WeakMap();
+var iconWarned = /* @__PURE__ */ new Set();
+function applyIcon(item, name) {
+	const glyph = getIcon(name);
+	if (!glyph) {
+		warnIconOnce(name, `tab icon '${name}' isn't registered — call registerIcons() at boot.`);
+		return;
+	}
+	if (glyph.src) item.iconSource = glyph.src;
+	else if (glyph.font) {
+		item.iconSource = "font://" + glyph.font.glyph;
+		item.iconFontFamily = glyph.font.family;
+	} else if (glyph.text) item.iconSource = "font://" + glyph.text;
+	else warnIconOnce(name, `tab icon '${name}' has no src/font/text representation — UITabBarItem can't render svg/markup glyphs.`);
+}
+function warnIconOnce(name, msg) {
+	if (iconWarned.has(name)) return;
+	iconWarned.add(name);
+	console.warn("[octane-xplat] " + msg);
+}
+function itemsFor(tabs) {
+	let items = itemsCache.get(tabs);
+	if (items !== void 0) return items;
+	items = tabs.map((t) => {
+		const item = new TabViewItem();
+		item.title = t.title;
+		if (t.icon) applyIcon(item, t.icon);
+		if (t.stack) {
+			const frame = new Frame();
+			frame.once("loaded", () => {
+				frame.navigate({ create: () => {
+					const page = new Page();
+					page.actionBarHidden = true;
+					const pane = new GridLayout();
+					page.content = pane;
+					createNativeScriptRoot(pane).render(TabPane, { render: t.render });
+					return page;
+				} });
+			});
+			registerStack(t.stack, frame);
+			item.view = frame;
+			return item;
+		}
+		const cv = new GridLayout();
+		tabsByView.set(cv, t.render);
+		item.view = cv;
+		return item;
+	});
+	itemsCache.set(tabs, items);
+	return items;
+}
+function mountPanes(e) {
+	const tv = e.object;
+	for (const item of tv.items) {
+		const cv = item.view;
+		if (!(cv instanceof GridLayout) || paneRoots.has(cv)) continue;
+		const render = tabsByView.get(cv);
+		if (!render) continue;
+		const root = createNativeScriptRoot(cv);
+		paneRoots.set(cv, root);
+		root.render(TabPane, { render });
+	}
+}
+var TabBarInner = defineUniversalComponent("nativescript", function TabBarInner(props) {
+	return universalValue(__octaneUniversalPlan1, [
+		props.id,
+		cx(props.className),
+		props.style,
+		itemsFor(props.tabs),
+		props.selectedIndex,
+		(e) => props.onSelectedIndexChanged?.(e.value),
+		mountPanes
+	]);
+}, { "module": "@nativescript-community/octane" });
+var MemoTabBar = memo(TabBarInner, (a, b) => a.tabs === b.tabs && a.selectedIndex === b.selectedIndex);
+var UITabBar = defineUniversalComponent("nativescript", markWarm(function UITabBar(props) {
+	useBatch([], () => {
+		warmChild(MemoTabBar, {
+			id: props.id,
+			className: props.className,
+			style: props.style,
+			tabs: props.tabs,
+			selectedIndex: props.selectedIndex,
+			onSelectedIndexChanged: props.onSelectedIndexChanged
+		});
+	});
+	return universalValue(__octaneUniversalPlan2, [universalComponent("nativescript", MemoTabBar, universalProps([
+		[
+			"set",
+			"id",
+			props.id
+		],
+		[
+			"set",
+			"className",
+			props.className
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		[
+			"set",
+			"tabs",
+			props.tabs
+		],
+		[
+			"set",
+			"selectedIndex",
+			props.selectedIndex
+		],
+		[
+			"set",
+			"onSelectedIndexChanged",
+			props.onSelectedIndexChanged
+		]
+	]))]);
+}, (__wp) => {
+	const props = __wp;
+	warmChild(MemoTabBar, {
+		id: props.id,
+		className: props.className,
+		style: props.style,
+		tabs: props.tabs,
+		selectedIndex: props.selectedIndex,
+		onSelectedIndexChanged: props.onSelectedIndexChanged
+	});
+}), { "module": "@nativescript-community/octane" });
+//#endregion
+export { UITabBar };