@octane-xplat/ui 0.4.0 → 0.6.0

package/dist/native/Table.native.tsrx.js

@@ -0,0 +1,103 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { defineUniversalComponent, universalFor, universalPlan, universalValue } from "@nativescript-community/octane";
+//#region src/Table.native.tsrx
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-table-cell vx-table-th" },
+	"bindings": [["style", 0]],
+	"children": [{
+		"kind": "host",
+		"type": "label",
+		"bindings": [["text", 1]]
+	}]
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-table-empty" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"bindings": [["text", 0]]
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-table-cell" },
+	"bindings": [["style", 0]],
+	"children": [{
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan4 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"bindings": [["className", 0], ["onTap", 1]],
+	"children": [{
+		"kind": "slot",
+		"slot": 2
+	}]
+});
+var __octaneUniversalPlan5 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan6 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [{
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": { "className": "vx-table-head" },
+		"children": [{
+			"kind": "slot",
+			"slot": 4
+		}]
+	}, {
+		"kind": "slot",
+		"slot": 5
+	}]
+});
+var Table = defineUniversalComponent("nativescript", function Table(props) {
+	const cellStyle = (col) => ({
+		...col.width != null ? { width: col.width } : { flexGrow: 1 },
+		...col.align ? { textAlignment: col.align } : {}
+	});
+	return universalValue(__octaneUniversalPlan6, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-table", props.className),
+		props.style,
+		universalFor(props.columns, (col, __octaneUniversalIndex) => col.key, (col, __octaneUniversalIndex) => {
+			return universalValue(__octaneUniversalPlan0, [cellStyle(col), col.label ?? col.key]);
+		}),
+		props.rows.length === 0 && props.empty != null ? universalValue(__octaneUniversalPlan1, [props.empty]) : universalValue(__octaneUniversalPlan5, [universalFor(props.rows.map((row, ri) => ({
+			row,
+			ri
+		})), (e, __octaneUniversalIndex$) => props.keyFor ? props.keyFor(e.row, e.ri) : String(e.ri), (e, __octaneUniversalIndex$) => {
+			return universalValue(__octaneUniversalPlan4, [
+				cx("vx-table-row", props.onRowPress && "vx-table-row--pressable"),
+				props.onRowPress ? () => props.onRowPress(e.row, e.ri) : void 0,
+				universalFor(props.columns, (col, __octaneUniversalIndex$$) => col.key, (col, __octaneUniversalIndex$$) => {
+					return universalValue(__octaneUniversalPlan3, [cellStyle(col), props.renderCell ? props.renderCell(e.row, col, e.ri) : universalValue(__octaneUniversalPlan2, [String(e.row[col.key] ?? "")])]);
+				})
+			]);
+		})])
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { Table };

package/dist/native/Tabs.native.tsrx.js

@@ -0,0 +1,163 @@
+import { cx } from "./cx.js";
+import { Text } from "./Text.native.tsrx.js";
+import { Pressable } from "./Pressable.native.tsrx.js";
+import { Icon } from "./Icon.native.tsrx.js";
+import { RouteHost } from "./RouteHost.native.tsrx.js";
+import { layoutsForRoute, screenFor, useRoute } from "./route.native.js";
+import { defineUniversalComponent, hookSlots, universalChildren, universalComponent, universalFor, universalIf, universalPlan, universalProps, universalValue, useState, withSlot } from "@nativescript-community/octane";
+//#region src/Tabs.native.tsrx
+var _hs$ = /* @__PURE__ */ hookSlots(2);
+var _h$0 = /* @__PURE__ */ Symbol(_hs$);
+var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan4 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan5 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "gridlayout",
+	"props": { "rows": "auto,*" },
+	"bindings": [
+		["id", 0],
+		["className", 1],
+		["style", 2]
+	],
+	"children": [{
+		"kind": "host",
+		"type": "gridlayout",
+		"props": {
+			"row": 0,
+			"className": "vx-tabbar"
+		},
+		"bindings": [["columns", 3]],
+		"children": [{
+			"kind": "slot",
+			"slot": 4
+		}]
+	}, {
+		"kind": "host",
+		"type": "gridlayout",
+		"props": { "row": 1 },
+		"bindings": [["className", 5]],
+		"children": [{
+			"kind": "slot",
+			"slot": 6
+		}]
+	}]
+});
+function screenParams(route) {
+	const params = {
+		...route.params,
+		...route.context ?? {},
+		_stack: route.stack,
+		_pushed: true
+	};
+	if (Object.prototype.hasOwnProperty.call(route, "loaderData")) params.data = route.loaderData;
+	if (Object.prototype.hasOwnProperty.call(route, "loaderError")) params.error = route.loaderError;
+	return params;
+}
+var Tabs = defineUniversalComponent("nativescript", function Tabs(props) {
+	const [internal, setInternal] = useState(0, _h$0);
+	const active = props.selectedIndex ?? internal;
+	const tab = props.tabs[active];
+	const route = withSlot(_h$1, useRoute, tab?.stack ?? "");
+	const Screen = route ? screenFor(route.name) : void 0;
+	const columns = props.tabs.map(() => "*").join(",");
+	return universalValue(__octaneUniversalPlan5, [
+		props.id,
+		cx(props.className),
+		props.style,
+		columns,
+		universalFor(props.tabs, (t, i) => t.title, (t, i) => {
+			return universalValue(__octaneUniversalPlan2, [universalComponent("nativescript", Pressable, universalProps([
+				[
+					"set",
+					"col",
+					i
+				],
+				[
+					"set",
+					"className",
+					cx("vx-tab", active === i ? "active" : "")
+				],
+				[
+					"set",
+					"onPress",
+					() => {
+						setInternal(i);
+						props.onSelectedIndexChanged?.(i);
+					}
+				]
+			], universalChildren("nativescript", () => {
+				return universalValue(__octaneUniversalPlan1, [universalIf(t.icon, () => {
+					return universalValue(__octaneUniversalPlan0, [universalComponent("nativescript", Icon, universalProps([
+						[
+							"set",
+							"name",
+							t.icon
+						],
+						[
+							"set",
+							"className",
+							"vx-tabicon"
+						],
+						[
+							"set",
+							"size",
+							18
+						]
+					]))]);
+				}), universalComponent("nativescript", Text, universalProps([], t.title))]);
+			})))]);
+		}),
+		cx("vx-tabpane", route?.presentation === "fade" ? "vx-route--fade" : ""),
+		universalIf(route && Screen, () => {
+			return universalValue(__octaneUniversalPlan3, [universalComponent("nativescript", RouteHost, universalProps([
+				[
+					"set",
+					"screen",
+					Screen
+				],
+				[
+					"set",
+					"layouts",
+					layoutsForRoute(route.name)
+				],
+				[
+					"set",
+					"params",
+					screenParams(route)
+				]
+			]))]);
+		}, () => {
+			return universalValue(__octaneUniversalPlan4, [tab?.render()]);
+		})
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { Tabs };

package/dist/native/{ui14.js → Text.native.tsrx.js}

@@ -1,6 +1,6 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps, nativeAccessibilityState } from "./ui3.js";
-import { layoutChildProps } from "./ui5.js";
+import { cx } from "./cx.js";
+import { applyEscapeProps, nativeAccessibilityRole, nativeAccessibilityState } from "./escape-props.native.js";
+import { layoutChildProps } from "./layout-child.native.js";
 import { createContext, defineUniversalComponent, universalComponent, universalIf, universalPlan, universalProps, universalValue, useContext } from "@nativescript-community/octane";
 //#region src/Text.native.tsrx
 var __octaneUniversalPlan0 = universalPlan("nativescript", {
@@ -36,6 +36,7 @@ var Text = defineUniversalComponent("nativescript", function Text(props) {
 	const inText = useContext(InText);
 	const textStyle = {
 		...props.style,
+		...props.ellipsize || props.numberOfLines ? { flexShrink: 1 } : {},
 		...props.ellipsize ? {
 			whiteSpace: "nowrap",
 			textOverflow: "ellipsis"
@@ -98,6 +99,21 @@ var Text = defineUniversalComponent("nativescript", function Text(props) {
 				"textOverflow",
 				props.ellipsize ? "ellipsis" : void 0
 			],
+			[
+				"set",
+				"accessible",
+				props.accessible
+			],
+			[
+				"set",
+				"accessibilityLabel",
+				props.accessibilityLabel
+			],
+			[
+				"set",
+				"accessibilityRole",
+				nativeAccessibilityRole(props.accessibilityRole)
+			],
 			[
 				"set",
 				"accessibilityHint",

package/dist/native/{ui24.js → TextArea.native.tsrx.js}

@@ -1,11 +1,13 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps } from "./ui3.js";
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { writeText } from "./text-write.native.js";
 import { defineUniversalComponent, hookSlots, universalPlan, universalValue, useEffect, useRef } from "@nativescript-community/octane";
 import { Utils } from "@nativescript/core";
 //#region src/TextArea.native.tsrx
-var _hs$ = /* @__PURE__ */ hookSlots(2);
+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": "host",
 	"type": "textview",
@@ -14,20 +16,20 @@ var __octaneUniversalPlan0 = universalPlan("nativescript", {
 		["ref", 1],
 		["className", 2],
 		["style", 3],
-		["text", 4],
-		["hint", 5],
-		["keyboardType", 6],
-		["returnKeyType", 7],
-		["editable", 8],
-		["onLoaded", 9],
-		["onTextChange", 10],
-		["onReturnPress", 11],
-		["onFocus", 12],
-		["onBlur", 13]
+		["hint", 4],
+		["keyboardType", 5],
+		["returnKeyType", 6],
+		["editable", 7],
+		["onLoaded", 8],
+		["onTextChange", 9],
+		["onReturnPress", 10],
+		["onFocus", 11],
+		["onBlur", 12]
 	]
 });
 var TextArea = defineUniversalComponent("nativescript", function TextArea(props) {
 	const el = useRef(null, _h$0);
+	const submitOnReturn = props.returnKeyType === "done" || props.returnKeyType === "send";
 	const lineDip = (v) => {
 		const ios = v?.ios?.font?.lineHeight;
 		if (ios > 0) return ios;
@@ -50,6 +52,7 @@ var TextArea = defineUniversalComponent("nativescript", function TextArea(props)
 		props.maxRows,
 		props.style
 	], _h$1);
+	useEffect(() => writeText(el.current, props.value), [props.value], _h$2);
 	return universalValue(__octaneUniversalPlan0, [
 		props.id,
 		(v) => {
@@ -62,19 +65,18 @@ var TextArea = defineUniversalComponent("nativescript", function TextArea(props)
 				native: v
 			});
 		},
-		cx(props.className),
+		cx("vx-textarea", props.className),
 		{
 			...props.style,
 			...props.placeholderTextColor ? { placeholderColor: props.placeholderTextColor } : {}
 		},
-		props.value,
-		props.placeholder ?? props.hint,
+		props.placeholder,
 		props.keyboardType === "default" ? void 0 : props.keyboardType,
 		props.returnKeyType,
 		props.editable ?? true,
 		(e) => fit(e.object),
 		(e) => props.onChange?.(e.value),
-		props.onSubmit,
+		submitOnReturn ? props.onSubmit : void 0,
 		props.onFocus,
 		props.onBlur
 	]);

package/dist/native/{ui23.js → TextInput.native.tsrx.js}

@@ -1,7 +1,11 @@
-import { cx } from "./ui2.js";
-import { applyEscapeProps } from "./ui3.js";
-import { defineUniversalComponent, universalPlan, universalValue } from "@nativescript-community/octane";
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { writeText } from "./text-write.native.js";
+import { defineUniversalComponent, hookSlots, universalPlan, universalValue, useEffect, useRef } from "@nativescript-community/octane";
 //#region src/TextInput.native.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": "textfield",
@@ -10,21 +14,23 @@ var __octaneUniversalPlan0 = universalPlan("nativescript", {
 		["id", 1],
 		["className", 2],
 		["style", 3],
-		["text", 4],
-		["hint", 5],
-		["secure", 6],
-		["keyboardType", 7],
-		["returnKeyType", 8],
-		["editable", 9],
-		["onTextChange", 10],
-		["onReturnPress", 11],
-		["onFocus", 12],
-		["onBlur", 13]
+		["hint", 4],
+		["secure", 5],
+		["keyboardType", 6],
+		["returnKeyType", 7],
+		["editable", 8],
+		["onTextChange", 9],
+		["onReturnPress", 10],
+		["onFocus", 11],
+		["onBlur", 12]
 	]
 });
 var TextInput = defineUniversalComponent("nativescript", function TextInput(props) {
+	const el = useRef(null, _h$0);
+	useEffect(() => writeText(el.current, props.value), [props.value], _h$1);
 	return universalValue(__octaneUniversalPlan0, [
 		(v) => {
+			el.current = v;
 			if (!v) return;
 			applyEscapeProps(v, props);
 			props.bind?.({
@@ -34,13 +40,12 @@ var TextInput = defineUniversalComponent("nativescript", function TextInput(prop
 			});
 		},
 		props.id,
-		cx(props.className),
+		cx("vx-input", props.className),
 		{
 			...props.style,
 			...props.placeholderTextColor ? { placeholderColor: props.placeholderTextColor } : {}
 		},
-		props.value,
-		props.placeholder ?? props.hint,
+		props.placeholder,
 		props.secure,
 		props.keyboardType === "default" ? void 0 : props.keyboardType,
 		props.returnKeyType,

package/dist/native/Timeline.native.tsrx.js

@@ -0,0 +1,112 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.native.js";
+import { Icon } from "./Icon.native.tsrx.js";
+import { defineUniversalComponent, universalComponent, universalFor, universalPlan, universalProps, universalValue } from "@nativescript-community/octane";
+//#region src/Timeline.native.tsrx
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-timeline-line" }
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"props": { "className": "vx-timeline-time" },
+	"bindings": [["text", 0]]
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"props": { "className": "vx-timeline-title" },
+	"bindings": [["text", 0]]
+});
+var __octaneUniversalPlan4 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "label",
+	"props": { "className": "vx-timeline-desc" },
+	"bindings": [["text", 0]]
+});
+var __octaneUniversalPlan5 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-timeline-item" },
+	"children": [{
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": { "className": "vx-timeline-rail" },
+		"children": [{
+			"kind": "host",
+			"type": "flexboxlayout",
+			"props": { "className": "vx-timeline-dot" },
+			"children": [{
+				"kind": "slot",
+				"slot": 0
+			}]
+		}, {
+			"kind": "slot",
+			"slot": 1
+		}]
+	}, {
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": { "className": "vx-timeline-body" },
+		"children": [
+			{
+				"kind": "slot",
+				"slot": 2
+			},
+			{
+				"kind": "slot",
+				"slot": 3
+			},
+			{
+				"kind": "slot",
+				"slot": 4
+			}
+		]
+	}]
+});
+var __octaneUniversalPlan6 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [{
+		"kind": "slot",
+		"slot": 4
+	}]
+});
+var Timeline = defineUniversalComponent("nativescript", function Timeline(props) {
+	return universalValue(__octaneUniversalPlan6, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-timeline", props.className),
+		props.style,
+		universalFor(props.items.map((item, i) => ({
+			item,
+			i
+		})), (e, __octaneUniversalIndex) => e.item.key, (e, __octaneUniversalIndex) => {
+			return universalValue(__octaneUniversalPlan5, [
+				e.item.icon ? universalValue(__octaneUniversalPlan0, [universalComponent("nativescript", Icon, universalProps([[
+					"set",
+					"name",
+					e.item.icon
+				]]))]) : null,
+				e.i < props.items.length - 1 ? universalValue(__octaneUniversalPlan1, []) : null,
+				e.item.time != null ? universalValue(__octaneUniversalPlan2, [e.item.time]) : null,
+				e.item.title != null ? universalValue(__octaneUniversalPlan3, [e.item.title]) : null,
+				e.item.description != null ? universalValue(__octaneUniversalPlan4, [e.item.description]) : null
+			]);
+		})
+	]);
+}, { "module": "@nativescript-community/octane" });
+//#endregion
+export { Timeline };