@octane-xplat/ui 0.4.0 → 0.6.0

package/dist/native/RadioGroup.native.tsrx.js

@@ -0,0 +1,85 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { defineUniversalComponent, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
+//#region src/RadioGroup.native.tsrx
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-radio-dot" }
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"props": { "className": "vx-radio-label" },
+	"bindings": [["text", 0]]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"propsSlot": 0,
+	"children": [{
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": { "className": "vx-radio" },
+		"children": [{
+			"kind": "slot",
+			"slot": 1
+		}]
+	}, {
+		"kind": "slot",
+		"slot": 2
+	}]
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["flexDirection", 2],
+		["className", 3],
+		["style", 4],
+		["accessibilityLabel", 5]
+	],
+	"children": [{
+		"kind": "slot",
+		"slot": 6
+	}]
+});
+var RadioGroup = defineUniversalComponent("nativescript", function RadioGroup(props) {
+	return universalValue(__octaneUniversalPlan3, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		props.horizontal ? "row" : "column",
+		cx("vx-radio-group", props.horizontal && "vx-radio-group--row", props.className),
+		props.style,
+		props.accessibilityLabel,
+		props.options.map((opt) => {
+			const selected = props.value === opt.value;
+			const disabled = props.disabled || opt.disabled;
+			return universalValue(__octaneUniversalPlan2, [
+				universalProps([
+					[
+						"set",
+						"key",
+						opt.value
+					],
+					[
+						"set",
+						"className",
+						cx("vx-radio-row", selected && "vx-radio--on", disabled && "vx-radio--disabled")
+					],
+					[
+						"set",
+						"onTap",
+						disabled ? void 0 : () => props.onValueChange?.(opt.value)
+					]
+				]),
+				selected ? universalValue(__octaneUniversalPlan0, []) : null,
+				opt.label != null ? universalValue(__octaneUniversalPlan1, [opt.label]) : null
+			]);
+		})
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { RadioGroup };

package/dist/native/{ui15.js → RichText.native.tsrx.js}

@@ -1,6 +1,6 @@
-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, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
 //#region src/RichText.native.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
@@ -19,7 +19,12 @@ var __octaneUniversalPlan0 = universalPlan("nativescript", {
 var __octaneUniversalPlan1 = universalPlan("nativescript", {
 	"kind": "host",
 	"type": "span",
-	"propsSlot": 0
+	"bindings": [
+		["text", 0],
+		["className", 1],
+		["style", 2],
+		["onLinkTap", 3]
+	]
 });
 var RichText = defineUniversalComponent("nativescript", function RichText(props) {
 	return universalValue(__octaneUniversalPlan0, [universalProps([
@@ -57,24 +62,12 @@ function runText(props) {
 	return "";
 }
 var RichTextSpan = defineUniversalComponent("nativescript", function RichTextSpan(props) {
-	return universalValue(__octaneUniversalPlan1, [universalProps([
-		[
-			"set",
-			"text",
-			runText(props)
-		],
-		[
-			"set",
-			"className",
-			cx(props.className)
-		],
-		["spread", props.style],
-		[
-			"set",
-			"onLinkTap",
-			props.onPress
-		]
-	])]);
+	return universalValue(__octaneUniversalPlan1, [
+		runText(props),
+		cx(props.className),
+		props.style,
+		props.onPress
+	]);
 }, { "module": "@nativescript-community/octane" });
 //#endregion
 export { RichText, RichTextSpan };

package/dist/native/Row.native.tsrx.js

@@ -0,0 +1,98 @@
+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/Row.native.tsrx
+var _h$0 = /* @__PURE__ */ Symbol(/* @__PURE__ */ hookSlots(1));
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"propsSlot": 0,
+	"children": [{
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var Row = defineUniversalComponent("nativescript", function Row(props) {
+	return universalValue(__octaneUniversalPlan0, [universalProps([
+		[
+			"set",
+			"id",
+			props.id
+		],
+		[
+			"set",
+			"ref",
+			(v) => {
+				if (v) {
+					applyEscapeProps(v, props);
+					props.bind?.(v);
+				}
+			}
+		],
+		[
+			"set",
+			"flexDirection",
+			"row"
+		],
+		[
+			"set",
+			"className",
+			cx(props.className)
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		["spread", layoutChildProps(props)],
+		[
+			"set",
+			"accessible",
+			props.accessible
+		],
+		[
+			"set",
+			"accessibilityLabel",
+			props.accessibilityLabel
+		],
+		[
+			"set",
+			"accessibilityRole",
+			nativeAccessibilityRole(props.accessibilityRole)
+		],
+		[
+			"set",
+			"accessibilityHint",
+			props.accessibilityHint
+		],
+		[
+			"set",
+			"accessibilityValue",
+			props.accessibilityValue
+		],
+		[
+			"set",
+			"accessibilityState",
+			nativeAccessibilityState(props.accessibilityState)
+		],
+		[
+			"set",
+			"accessibilityLiveRegion",
+			props.accessibilityLiveRegion
+		],
+		[
+			"set",
+			"onPan",
+			withSlot(_h$0, usePan, props.onPan)
+		],
+		[
+			"set",
+			"onSwipe",
+			props.onSwipe
+		]
+	]), props.children]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { Row };

package/dist/native/{ui47.js → SafeArea.native.tsrx.js}

@@ -1,5 +1,5 @@
-import { cx } from "./ui2.js";
-import { useSafeAreaInsets } from "./ui46.js";
+import { cx } from "./cx.js";
+import { useSafeAreaInsets } from "./safeAreaInsets.native.tsrx.js";
 import { defineUniversalComponent, hookSlots, universalPlan, universalValue, withSlot } from "@nativescript-community/octane";
 import { Application } from "@nativescript/core";
 //#region src/SafeArea.native.tsrx

package/dist/native/{ui43.js → Screen.native.tsrx.js}

@@ -1,6 +1,6 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps } from "./ui3.js";
-import { registerRootLayout, unregisterRootLayout } from "./ui34.js";
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { registerRootLayout, unregisterRootLayout } from "./root-layout.native.js";
 import { defineUniversalComponent, universalPlan, universalValue } from "@nativescript-community/octane";
 //#region src/Screen.native.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {

package/dist/native/{ui26.js → ScrollBox.native.tsrx.js}

@@ -1,4 +1,4 @@
-import { View } from "./ui6.js";
+import { View } from "./View.native.tsrx.js";
 import { defineUniversalComponent, universalComponent, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
 //#region src/ScrollBox.native.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {

package/dist/native/ScrollView.native.tsrx.js

@@ -0,0 +1,233 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState } from "./escape-props.native.js";
+import { layoutChildProps } from "./layout-child.native.js";
+import { ActivityIndicator } from "./ActivityIndicator.native.tsrx.js";
+import { createPullToRefresh } from "./refresh.native.js";
+import { defineUniversalComponent, hookSlots, markWarm, universalComponent, universalIf, universalPlan, universalProps, universalValue, useBatch, useEffect, useRef, warmChild } from "@nativescript-community/octane";
+//#region src/ScrollView.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",
+	"propsSlot": 0,
+	"children": [{
+		"kind": "host",
+		"type": "scrollview",
+		"props": { "className": "vx-scroll" },
+		"bindings": [
+			["ref", 1],
+			["id", 2],
+			["orientation", 3],
+			["accessible", 4],
+			["accessibilityLabel", 5],
+			["accessibilityRole", 6],
+			["accessibilityHint", 7],
+			["accessibilityValue", 8],
+			["accessibilityState", 9],
+			["accessibilityLiveRegion", 10]
+		],
+		"children": [{
+			"kind": "host",
+			"type": "flexboxlayout",
+			"bindings": [["flexDirection", 11]],
+			"children": [{
+				"kind": "slot",
+				"slot": 12
+			}]
+		}]
+	}, {
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": {
+			"className": "vx-refresh",
+			"verticalAlignment": "top"
+		},
+		"bindings": [
+			["ref", 13],
+			["height", 14],
+			["translateY", 15]
+		],
+		"children": [{
+			"kind": "slot",
+			"slot": 16
+		}]
+	}]
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "scrollview",
+	"propsSlot": 0,
+	"children": [{
+		"kind": "host",
+		"type": "flexboxlayout",
+		"bindings": [["flexDirection", 1]],
+		"children": [{
+			"kind": "slot",
+			"slot": 2
+		}]
+	}]
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var ScrollViewRefreshable = defineUniversalComponent("nativescript", markWarm(function ScrollViewRefreshable(props) {
+	const cfg = useRef({}, _h$0);
+	cfg.current = {
+		onRefresh: props.onRefresh,
+		refreshing: props.refreshing,
+		threshold: props.refreshThreshold
+	};
+	const ctl = useRef(null, _h$1);
+	const scroller = useRef(null, _h$2);
+	const indicator = useRef(null, _h$3);
+	useEffect(() => {
+		if (!scroller.current || !indicator.current) return;
+		ctl.current = createPullToRefresh({
+			scroller: scroller.current,
+			indicator: indicator.current,
+			isAtTop: () => scroller.current?.verticalOffset <= 0,
+			cfg
+		});
+		return () => {
+			ctl.current?.detach();
+			ctl.current = null;
+		};
+	}, [], _h$4);
+	useEffect(() => {
+		ctl.current?.sync();
+	}, [props.refreshing], _h$5);
+	useBatch([], () => {
+		warmChild(ActivityIndicator, {});
+	});
+	return universalValue(__octaneUniversalPlan0, [
+		universalProps([
+			[
+				"set",
+				"ref",
+				(v) => {
+					if (v?.ios) v.ios.clipsToBounds = true;
+				}
+			],
+			["spread", layoutChildProps(props)],
+			[
+				"set",
+				"className",
+				cx("vx-refresh-wrap", props.className)
+			],
+			[
+				"set",
+				"style",
+				props.style
+			]
+		]),
+		(v) => {
+			scroller.current = v;
+			applyEscapeProps(v, props);
+		},
+		props.id,
+		props.horizontal ? "horizontal" : "vertical",
+		props.accessible,
+		props.accessibilityLabel,
+		nativeAccessibilityRole(props.accessibilityRole),
+		props.accessibilityHint,
+		props.accessibilityValue,
+		nativeAccessibilityState(props.accessibilityState),
+		props.accessibilityLiveRegion,
+		props.horizontal ? "row" : "column",
+		props.children,
+		(v) => {
+			indicator.current = v;
+		},
+		64,
+		-64,
+		universalComponent("nativescript", ActivityIndicator, universalProps([]))
+	]);
+}, (__wp) => {
+	warmChild(ActivityIndicator, {});
+}), { "module": "@nativescript-community/octane" });
+var ScrollView = defineUniversalComponent("nativescript", function ScrollView(props) {
+	return universalValue(__octaneUniversalPlan3, [universalIf(!props.horizontal && (props.onRefresh != null || props.refreshing != null), () => {
+		return universalValue(__octaneUniversalPlan1, [universalComponent("nativescript", ScrollViewRefreshable, universalProps([["spread", props]]))]);
+	}, () => {
+		return universalValue(__octaneUniversalPlan2, [
+			universalProps([
+				[
+					"set",
+					"ref",
+					(v) => applyEscapeProps(v, props)
+				],
+				[
+					"set",
+					"id",
+					props.id
+				],
+				["spread", layoutChildProps(props)],
+				[
+					"set",
+					"className",
+					cx(props.className)
+				],
+				[
+					"set",
+					"style",
+					props.style
+				],
+				[
+					"set",
+					"orientation",
+					props.horizontal ? "horizontal" : "vertical"
+				],
+				[
+					"set",
+					"accessible",
+					props.accessible
+				],
+				[
+					"set",
+					"accessibilityLabel",
+					props.accessibilityLabel
+				],
+				[
+					"set",
+					"accessibilityRole",
+					nativeAccessibilityRole(props.accessibilityRole)
+				],
+				[
+					"set",
+					"accessibilityHint",
+					props.accessibilityHint
+				],
+				[
+					"set",
+					"accessibilityValue",
+					props.accessibilityValue
+				],
+				[
+					"set",
+					"accessibilityState",
+					nativeAccessibilityState(props.accessibilityState)
+				],
+				[
+					"set",
+					"accessibilityLiveRegion",
+					props.accessibilityLiveRegion
+				]
+			]),
+			props.horizontal ? "row" : "column",
+			props.children
+		]);
+	})]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { ScrollView };

package/dist/native/SearchInput.native.tsrx.js

@@ -0,0 +1,151 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { Icon } from "./Icon.native.tsrx.js";
+import { writeText } from "./text-write.native.js";
+import { defineUniversalComponent, hookSlots, markWarm, universalComponent, universalPlan, universalProps, universalValue, useBatch, useEffect, useRef, useState, warmChild } from "@nativescript-community/octane";
+//#region src/SearchInput.native.tsrx
+var _hs$ = /* @__PURE__ */ hookSlots(3);
+var _h$0 = /* @__PURE__ */ Symbol(_hs$);
+var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
+var _h$2 = /* @__PURE__ */ Symbol(_hs$ + 2);
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"className": "vx-search-clear",
+		"accessibilityLabel": "Clear search"
+	},
+	"bindings": [["onTap", 0]],
+	"children": [{
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "flexDirection": "row" },
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3],
+		["accessibilityLabel", 4]
+	],
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 5
+		},
+		{
+			"kind": "host",
+			"type": "textfield",
+			"props": {
+				"className": "vx-search-field",
+				"returnKeyType": "search"
+			},
+			"bindings": [
+				["ref", 6],
+				["hint", 7],
+				["editable", 8],
+				["onTextChange", 9],
+				["onReturnPress", 10],
+				["onFocus", 11],
+				["onBlur", 12]
+			]
+		},
+		{
+			"kind": "slot",
+			"slot": 13
+		}
+	]
+});
+var SearchInput = defineUniversalComponent("nativescript", markWarm(function SearchInput(props) {
+	const el = useRef(null, _h$0);
+	const [internal, setInternal] = useState(props.defaultValue ?? "", _h$1);
+	const value = props.value ?? internal;
+	useEffect(() => writeText(el.current, value), [value], _h$2);
+	const setValue = (next) => {
+		if (props.value === void 0) setInternal(next);
+		props.onChange?.(next);
+	};
+	const clear = () => {
+		setValue("");
+		props.onClear?.();
+	};
+	useBatch([], () => {
+		warmChild(Icon, {
+			name: props.icon ?? "xplat-search",
+			size: 16,
+			className: "vx-search-icon"
+		});
+		warmChild(Icon, {
+			name: "xplat-clear",
+			size: 12
+		});
+	});
+	return universalValue(__octaneUniversalPlan2, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-search", props.editable === false && "vx-search--disabled", props.className),
+		props.style,
+		props.accessibilityLabel,
+		props.icon !== false ? universalValue(__octaneUniversalPlan0, [universalComponent("nativescript", Icon, universalProps([
+			[
+				"set",
+				"name",
+				props.icon ?? "xplat-search"
+			],
+			[
+				"set",
+				"size",
+				16
+			],
+			[
+				"set",
+				"className",
+				"vx-search-icon"
+			]
+		]))]) : null,
+		(v) => {
+			el.current = v;
+			if (!v) return;
+			props.bind?.({
+				focus: () => v.focus(),
+				blur: () => v.dismissSoftInput?.() ?? v.blur(),
+				native: v
+			});
+		},
+		props.placeholder,
+		props.editable ?? true,
+		(e) => setValue(e.value),
+		props.onSubmit,
+		props.onFocus,
+		props.onBlur,
+		value !== "" && props.editable !== false ? universalValue(__octaneUniversalPlan1, [clear, universalComponent("nativescript", Icon, universalProps([[
+			"set",
+			"name",
+			"xplat-clear"
+		], [
+			"set",
+			"size",
+			12
+		]]))]) : null
+	]);
+}, (__wp) => {
+	warmChild(Icon, {
+		name: __wp.icon ?? "xplat-search",
+		size: 16,
+		className: "vx-search-icon"
+	});
+	warmChild(Icon, {
+		name: "xplat-clear",
+		size: 12
+	});
+}), { "module": "@nativescript-community/octane" });
+//#endregion
+export { SearchInput };