@octane-xplat/ui 0.5.0 → 0.6.0

package/dist/native/Pager.native.tsrx.js

@@ -0,0 +1,282 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState } from "./escape-props.native.js";
+import { layoutChildProps } from "./layout-child.native.js";
+import { NATIVESCRIPT_RENDERER_ID, createNativeScriptRoot, defineUniversalComponent, hookSlots, memo, registerElement, universalComponent, universalIf, universalPlan, universalProps, universalValue, useCallback, useEffect, useRef } from "@nativescript-community/octane";
+import { GridLayout } from "@nativescript/core";
+import { __methodDep } from "octane";
+import { Pager } from "@nativescript-community/ui-pager";
+//#region src/Pager.native.tsrx
+var _hs$ = /* @__PURE__ */ hookSlots(6);
+var _h$0 = /* @__PURE__ */ Symbol(_hs$);
+var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
+var _h$2 = /* @__PURE__ */ Symbol(_hs$ + 2);
+var _h$3 = /* @__PURE__ */ Symbol(_hs$ + 3);
+var _h$4 = /* @__PURE__ */ Symbol(_hs$ + 4);
+var _h$5 = /* @__PURE__ */ Symbol(_hs$ + 5);
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "gridlayout",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "pager",
+	"propsSlot": 0
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan4 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+registerElement("pager", Pager);
+var cellsByHost = /* @__PURE__ */ new WeakMap();
+var cellsByPager = /* @__PURE__ */ new WeakMap();
+var PagerCell = defineUniversalComponent(NATIVESCRIPT_RENDERER_ID, (props) => props.renderItem(props.item, props.index));
+function cellFor(host) {
+	let cell = cellsByHost.get(host);
+	if (!cell) {
+		cell = {
+			host,
+			root: createNativeScriptRoot(host),
+			pager: null,
+			renderItem: null,
+			item: void 0,
+			index: -1
+		};
+		cellsByHost.set(host, cell);
+	}
+	return cell;
+}
+function createPageHost() {
+	const host = new GridLayout();
+	cellFor(host);
+	return host;
+}
+var PAGER_TEMPLATES = [{
+	key: "xplat-page",
+	createView: createPageHost
+}];
+var selectPageTemplate = () => "xplat-page";
+function releasePagerCells(pager) {
+	const cells = cellsByPager.get(pager);
+	if (!cells) return;
+	for (const cell of cells) {
+		cellsByHost.delete(cell.host);
+		cell.root.unmount();
+	}
+	cellsByPager.delete(pager);
+}
+var PagerInner = defineUniversalComponent("nativescript", function PagerInner(props) {
+	const host = useRef(null, _h$0);
+	const suppressEcho = useRef(false, _h$1);
+	const pageSeeded = useRef(false, _h$2);
+	const bindHost = useCallback((v) => {
+		host.current = v;
+	}, [], _h$3);
+	const bindCell = (args) => {
+		const cell = cellFor(args.view);
+		cell.pager = args.object;
+		let owned = cellsByPager.get(cell.pager);
+		if (!owned) {
+			owned = /* @__PURE__ */ new Set();
+			cellsByPager.set(cell.pager, owned);
+		}
+		owned.add(cell);
+		const item = args.bindingContext ?? props.items?.[args.index];
+		if (cell.renderItem === props.renderItem && cell.index === args.index && Object.is(cell.item, item)) return;
+		cell.renderItem = props.renderItem;
+		cell.item = item;
+		cell.index = args.index;
+		cell.root.render(PagerCell, {
+			renderItem: (it, i) => universalValue(__octaneUniversalPlan0, [props.renderItem(it, i)]),
+			item,
+			index: args.index
+		});
+	};
+	const disposeCell = (args) => {
+		const cell = args.view && cellsByHost.get(args.view);
+		if (cell) {
+			cellsByHost.delete(args.view);
+			if (cell.pager) cellsByPager.get(cell.pager)?.delete(cell);
+			cell.root.unmount();
+		}
+	};
+	useEffect(() => {
+		const pager = host.current;
+		if (!pager) return;
+		pager.itemTemplates = PAGER_TEMPLATES;
+		pager.itemTemplateSelector = selectPageTemplate;
+		return () => releasePagerCells(pager);
+	}, [], _h$4);
+	useEffect(() => {
+		const pager = host.current;
+		if (!pager) return;
+		applyEscapeProps(pager, props);
+		if (pager.items !== props.items) pager.items = props.items;
+		const target = props.page ?? (pageSeeded.current ? void 0 : props.defaultPage);
+		if (target !== void 0 && pager.selectedIndex !== target) {
+			suppressEcho.current = true;
+			try {
+				pager.selectedIndex = target;
+			} finally {
+				suppressEcho.current = false;
+			}
+		}
+		pageSeeded.current = true;
+	}, [
+		props,
+		__methodDep(props, "items", true),
+		__methodDep(props, "page", true),
+		__methodDep(props, "defaultPage", true)
+	], _h$5);
+	return universalValue(__octaneUniversalPlan1, [universalProps([
+		[
+			"set",
+			"ref",
+			bindHost
+		],
+		[
+			"set",
+			"id",
+			props.id
+		],
+		["spread", layoutChildProps(props)],
+		[
+			"set",
+			"className",
+			cx("vx-pager", props.className)
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		[
+			"set",
+			"onItemLoading",
+			bindCell
+		],
+		[
+			"set",
+			"onItemDisposing",
+			disposeCell
+		],
+		[
+			"set",
+			"onSelectedIndexChange",
+			(args) => {
+				if (!suppressEcho.current) props.onPageChange?.(args.value);
+			}
+		],
+		[
+			"set",
+			"accessibilityRole",
+			nativeAccessibilityRole(props.accessibilityRole)
+		],
+		[
+			"set",
+			"accessibilityLabel",
+			props.accessibilityLabel
+		],
+		[
+			"set",
+			"accessibilityHint",
+			props.accessibilityHint
+		],
+		[
+			"set",
+			"accessibilityValue",
+			props.accessibilityValue
+		],
+		[
+			"set",
+			"accessibilityState",
+			nativeAccessibilityState(props.accessibilityState)
+		],
+		[
+			"set",
+			"accessible",
+			props.accessible
+		],
+		[
+			"set",
+			"accessibilityLiveRegion",
+			props.accessibilityLiveRegion
+		]
+	])]);
+}, { "module": "@nativescript-community/octane" });
+var MemoPager = memo(PagerInner, (a, b) => a.items === b.items && a.className === b.className && a.style === b.style && a.id === b.id && a.page === b.page && a.onPageChange === b.onPageChange && a.ios === b.ios && a.android === b.android);
+var Pager$1 = defineUniversalComponent("nativescript", function Pager(props) {
+	return universalValue(__octaneUniversalPlan4, [universalIf(props.items.length > 0, () => {
+		return universalValue(__octaneUniversalPlan2, [universalComponent("nativescript", MemoPager, universalProps([
+			[
+				"set",
+				"id",
+				props.id
+			],
+			[
+				"set",
+				"className",
+				props.className
+			],
+			[
+				"set",
+				"style",
+				props.style
+			],
+			[
+				"set",
+				"items",
+				props.items
+			],
+			[
+				"set",
+				"renderItem",
+				props.renderItem
+			],
+			[
+				"set",
+				"page",
+				props.page
+			],
+			[
+				"set",
+				"defaultPage",
+				props.defaultPage
+			],
+			[
+				"set",
+				"onPageChange",
+				props.onPageChange
+			],
+			[
+				"set",
+				"ios",
+				props.ios
+			],
+			[
+				"set",
+				"android",
+				props.android
+			],
+			["spread", layoutChildProps(props)]
+		]))]);
+	}, () => {
+		return universalValue(__octaneUniversalPlan3, [props.renderEmpty?.()]);
+	})]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { Pager$1 as Pager };

package/dist/native/Pagination.native.tsrx.js

@@ -0,0 +1,107 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { defineUniversalComponent, universalFor, universalPlan, universalValue } from "@nativescript-community/octane";
+//#region src/Pagination.native.tsrx
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": []
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"props": {
+		"className": "vx-page-ellipsis",
+		"text": "…"
+	}
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"bindings": [["className", 0], ["onTap", 1]],
+	"children": [{
+		"kind": "host",
+		"type": "label",
+		"bindings": [["text", 2]]
+	}]
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "flexDirection": "row" },
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [
+		{
+			"kind": "host",
+			"type": "flexboxlayout",
+			"props": { "className": "vx-page-btn" },
+			"bindings": [["onTap", 4]],
+			"children": [{
+				"kind": "host",
+				"type": "label",
+				"props": { "text": "‹" }
+			}]
+		},
+		{
+			"kind": "slot",
+			"slot": 5
+		},
+		{
+			"kind": "host",
+			"type": "flexboxlayout",
+			"props": { "className": "vx-page-btn" },
+			"bindings": [["onTap", 6]],
+			"children": [{
+				"kind": "host",
+				"type": "label",
+				"props": { "text": "›" }
+			}]
+		}
+	]
+});
+var Pagination = defineUniversalComponent("nativescript", function Pagination(props) {
+	const sibling = props.siblingCount ?? 1;
+	const count = Math.max(0, props.pageCount);
+	const current = Math.min(Math.max(1, props.page), Math.max(1, count));
+	const pages = [];
+	let lastEllipsis = false;
+	for (let p = 1; p <= count; p++) if (p === 1 || p === count || Math.abs(p - current) <= sibling) {
+		pages.push({
+			key: String(p),
+			page: p
+		});
+		lastEllipsis = false;
+	} else if (!lastEllipsis) {
+		pages.push({
+			key: "e" + p,
+			page: null
+		});
+		lastEllipsis = true;
+	}
+	const go = (p) => {
+		if (props.disabled || p < 1 || p > count || p === current) return;
+		props.onPageChange?.(p);
+	};
+	return universalValue(__octaneUniversalPlan3, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-pagination", props.disabled && "vx-pagination--disabled", props.className),
+		props.style,
+		() => go(current - 1),
+		universalFor(pages, (e, __octaneUniversalIndex) => e.key, (e, __octaneUniversalIndex) => {
+			e.page == null ? universalValue(__octaneUniversalPlan1, []) : universalValue(__octaneUniversalPlan2, [
+				cx("vx-page-btn", e.page === current && "vx-page-btn--on"),
+				() => go(e.page),
+				String(e.page)
+			]);
+			return universalValue(__octaneUniversalPlan0, []);
+		}),
+		() => go(current + 1)
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { Pagination };

package/dist/native/PinInput.native.tsrx.js

@@ -0,0 +1,94 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { TextInput } from "./TextInput.native.tsrx.js";
+import { defineUniversalComponent, hookSlots, universalComponent, universalFor, universalPlan, universalProps, universalValue, useState } from "@nativescript-community/octane";
+//#region src/PinInput.native.tsrx
+var _h$0 = /* @__PURE__ */ Symbol(/* @__PURE__ */ hookSlots(1));
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "flexDirection": "row" },
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [{
+		"kind": "slot",
+		"slot": 4
+	}]
+});
+var PinInput = defineUniversalComponent("nativescript", function PinInput(props) {
+	const length = props.length ?? 4;
+	const [internal, setInternal] = useState("", _h$0);
+	const controlled = props.value !== void 0;
+	const value = controlled ? props.value : internal;
+	const handles = [];
+	const setValue = (next) => {
+		const clipped = next.slice(0, length);
+		if (!controlled) setInternal(clipped);
+		props.onValueChange?.(clipped);
+		if (clipped.length === length) props.onComplete?.(clipped);
+	};
+	const cellValue = (i) => value[i] ?? "";
+	const enter = (i, text) => {
+		const ch = text.slice(-1);
+		const next = (value.slice(0, i) + ch + value.slice(i + 1)).slice(0, length);
+		setValue(next);
+		if (ch && i < length - 1) handles[i + 1]?.focus();
+	};
+	return universalValue(__octaneUniversalPlan1, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-pininput", props.disabled && "vx-pininput--disabled", props.className),
+		props.style,
+		universalFor(Array.from({ length }, (_, k) => k), (i, __octaneUniversalIndex) => i, (i, __octaneUniversalIndex) => {
+			return universalValue(__octaneUniversalPlan0, [universalComponent("nativescript", TextInput, universalProps([
+				[
+					"set",
+					"className",
+					"vx-pininput-cell"
+				],
+				[
+					"set",
+					"keyboardType",
+					"number"
+				],
+				[
+					"set",
+					"secure",
+					props.secure
+				],
+				[
+					"set",
+					"editable",
+					!props.disabled
+				],
+				[
+					"set",
+					"value",
+					cellValue(i)
+				],
+				[
+					"set",
+					"onChange",
+					(text) => enter(i, text)
+				],
+				[
+					"set",
+					"bind",
+					(h) => {
+						handles[i] = h;
+					}
+				]
+			]))]);
+		})
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { PinInput };

package/dist/native/{ui38.js → Popover.native.tsrx.js}

@@ -1,8 +1,8 @@
-import { cx } from "./ui2.js";
-import { applyThemeClasses, useThemeScheme } from "./ui31.js";
-import { rootLayoutFor } from "./ui34.js";
-import { applyNativeProps } from "./ui36.js";
-import { positionPopover } from "./ui37.js";
+import { cx } from "./cx.js";
+import { applyNativeProps } from "./platformProps.native.js";
+import { positionPopover } from "./popover-position.js";
+import { applyThemeClasses, useThemeScheme } from "./theme/theme-scheme.js";
+import { rootLayoutFor } from "./root-layout.native.js";
 import { createNativeScriptRoot, defineUniversalComponent, hookSlots, universalPlan, universalValue, useEffect, useRef, useState, withSlot } from "@nativescript-community/octane";
 import { GridLayout } from "@nativescript/core";
 //#region src/Popover.native.tsrx

package/dist/native/{ui16.js → Pressable.native.tsrx.js}

@@ -1,9 +1,10 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState } from "./ui3.js";
-import { glassClassOf, glassConfigOf } from "./ui4.js";
-import { layoutChildProps } from "./ui5.js";
-import { defineUniversalComponent, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
+import { cx } from "./cx.js";
+import { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState } from "./escape-props.native.js";
+import { layoutChildProps } from "./layout-child.native.js";
+import { usePan } from "./pan.native.tsrx.js";
+import { defineUniversalComponent, hookSlots, universalPlan, universalProps, universalValue, withSlot } from "@nativescript-community/octane";
 //#region src/Pressable.native.tsrx
+var _h$0 = /* @__PURE__ */ Symbol(/* @__PURE__ */ hookSlots(1));
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "flexboxlayout",
@@ -18,7 +19,12 @@ var Pressable = defineUniversalComponent("nativescript", function Pressable(prop
 		[
 			"set",
 			"ref",
-			(v) => applyEscapeProps(v, props)
+			(v) => {
+				if (v) {
+					applyEscapeProps(v, props);
+					props.bind?.(v);
+				}
+			}
 		],
 		[
 			"set",
@@ -29,12 +35,7 @@ var Pressable = defineUniversalComponent("nativescript", function Pressable(prop
 		[
 			"set",
 			"className",
-			cx("vx-pressable", glassClassOf(props.glass), props.className)
-		],
-		[
-			"set",
-			"iosGlassEffect",
-			glassConfigOf(props.glass)
+			cx("vx-pressable", props.className)
 		],
 		[
 			"set",
@@ -84,8 +85,13 @@ var Pressable = defineUniversalComponent("nativescript", function Pressable(prop
 		],
 		[
 			"set",
-			"ignoreTouchAnimation",
-			props.ignoreTouchAnimation
+			"onPan",
+			withSlot(_h$0, usePan, props.disabled ? void 0 : props.onPan)
+		],
+		[
+			"set",
+			"onSwipe",
+			props.disabled ? void 0 : props.onSwipe
 		],
 		[
 			"set",

package/dist/native/ProgressGroup.native.tsrx.js

@@ -0,0 +1,66 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { Meter } from "./Meter.native.tsrx.js";
+import { defineUniversalComponent, universalComponent, universalFor, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
+//#region src/ProgressGroup.native.tsrx
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"props": { "className": "vx-progressgroup-label" },
+	"bindings": [["text", 0]]
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-progressgroup-row" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [{
+		"kind": "slot",
+		"slot": 4
+	}]
+});
+var ProgressGroup = defineUniversalComponent("nativescript", function ProgressGroup(props) {
+	return universalValue(__octaneUniversalPlan2, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-progressgroup", props.className),
+		props.style,
+		universalFor(props.items, (item, __octaneUniversalIndex) => item.key, (item, __octaneUniversalIndex) => {
+			return universalValue(__octaneUniversalPlan1, [universalComponent("nativescript", Meter, universalProps([
+				[
+					"set",
+					"value",
+					item.value
+				],
+				[
+					"set",
+					"max",
+					item.max
+				],
+				[
+					"set",
+					"accessibilityLabel",
+					item.label
+				]
+			])), item.label != null ? universalValue(__octaneUniversalPlan0, [item.label]) : null]);
+		})
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { ProgressGroup };