@octane-xplat/pager 0.7.0

package/dist/native/Pager.tsrx.js

@@ -0,0 +1,282 @@
+import { cx } from "./cx.mobile.js";
+import { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState } from "./escape-props.mobile.js";
+import { layoutChildProps } from "./layout-child.js";
+import { __methodDep } from "octane/universal/native";
+import { NATIVESCRIPT_RENDERER_ID, createNativeScriptRoot, defineUniversalComponent, hookSlots, memo, registerElement, universalComponent, universalIf, universalPlan, universalProps, universalValue, useCallback, useEffect, useRef } from "@nativescript-community/octane";
+import { Pager } from "@nativescript-community/ui-pager";
+import { GridLayout } from "@nativescript/core";
+//#region src/Pager.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/cx.mobile.js

@@ -0,0 +1,11 @@
+//#region src/cx.mobile.ts
+/** NS `className` splits on ' ' only, and the universal driver applies the
+*  prop via `String(value)` — an array would arrive comma-joined and match
+*  no class at all. Native leaves normalize through cx() before handing
+*  className to an intrinsic. (The DOM renderer already flattens arrays,
+*  so web leaves don't need this.) */
+function cx(...parts) {
+	return parts.flat(Infinity).filter(Boolean).join(" ");
+}
+//#endregion
+export { cx };

package/dist/native/escape-props.mobile.js

@@ -0,0 +1,39 @@
+import { isAndroid, isIOS } from "@nativescript/core";
+//#region src/escape-props.mobile.ts
+/** Apply only the active device's escape bag after the primitive's own props. */
+function applyEscapeProps(view, props) {
+	if (!view) return;
+	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) {
+	if (state?.disabled) return "disabled";
+	if (state?.selected) return "selected";
+	if (state?.checked === true) return "checked";
+	if (state?.checked === false) return "unchecked";
+}
+//#endregion
+export { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState };

package/dist/native/index.js

@@ -0,0 +1,2 @@
+import { Pager } from "./Pager.tsrx.js";
+export { Pager };

package/dist/native/layout-child.js

@@ -0,0 +1,38 @@
+//#region src/layout-child.ts
+var FLEX_JUSTIFY = {
+	start: "flex-start",
+	end: "flex-end"
+};
+var FLEX_ALIGN = {
+	start: "flex-start",
+	end: "flex-end"
+};
+/** NativeScript reads these attributes from each child view during parent
+*  layout. Values are forwarded with NativeScript's own property names.
+*  The flex-container props (justifyContent/alignItems/flexWrap/gap) land on
+*  the host flexboxlayout itself — its own attributes, not child metadata. */
+function layoutChildProps(props) {
+	const result = {};
+	for (const key of [
+		"row",
+		"col",
+		"rowSpan",
+		"colSpan",
+		"dock",
+		"left",
+		"top",
+		"flexGrow",
+		"flexShrink",
+		"alignSelf",
+		"order"
+	]) if (props[key] !== void 0) result[key] = props[key];
+	if (props.justifyContent !== void 0) result.justifyContent = FLEX_JUSTIFY[props.justifyContent] ?? props.justifyContent;
+	if (props.alignItems !== void 0) result.alignItems = FLEX_ALIGN[props.alignItems] ?? props.alignItems;
+	if (props.flexWrap !== void 0) result.flexWrap = props.flexWrap === true ? "wrap" : props.flexWrap === false ? "nowrap" : props.flexWrap;
+	if (props.gap !== void 0) result.gap = props.gap;
+	if (props.rowGap !== void 0) result.rowGap = props.rowGap;
+	if (props.columnGap !== void 0) result.columnGap = props.columnGap;
+	return result;
+}
+//#endregion
+export { layoutChildProps };

package/dist/native/octane-client-build.json

@@ -0,0 +1,8 @@
+{
+  "version": 1,
+  "buildId": "38bb5b43-f242-46dd-982b-9c6b3220cdf6",
+  "mode": "production",
+  "capabilities": {
+    "independentHydration": false
+  }
+}