@octane-xplat/ui 0.7.3 → 0.10.0

package/dist/native/TopNav.tsrx.js

@@ -0,0 +1,1315 @@
+import { cx } from "./cx.js";
+import { applyEscapeProps } from "./escape-props.js";
+import { Text } from "./Text.tsrx.js";
+import { Pressable } from "./Pressable.tsrx.js";
+import { Icon } from "./Icon.tsrx.js";
+import { Popover } from "./Popover.tsrx.js";
+import { Image } from "./Image.tsrx.js";
+import { NavHeadingCloseProvider, TopNavRenderContext, TopNavSlotProvider, useTopNavMobileContent, useTopNavRenderMode } from "./nav-contexts.js";
+import { MobileNav, MobileNavToggle } from "./MobileNav.tsrx.js";
+import { followHref } from "./nav-href.js";
+import { defineUniversalComponent, hookSlots, markWarm, universalChildren, universalComponent, universalFor, universalIf, universalPlan, universalProps, universalValue, useBatch, useCallback, useMemo, useRef, useState, warmChild, withSlot } from "@nativescript-community/octane";
+//#region src/TopNav.tsrx
+var _hs$ = /* @__PURE__ */ hookSlots(11);
+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 _h$6 = /* @__PURE__ */ Symbol(_hs$ + 6);
+var _h$7 = /* @__PURE__ */ Symbol(_hs$ + 7);
+var _h$8 = /* @__PURE__ */ Symbol(_hs$ + 8);
+var _h$9 = /* @__PURE__ */ Symbol(_hs$ + 9);
+var _h$10 = /* @__PURE__ */ Symbol(_hs$ + 10);
+var __octaneUniversalPlan0 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan1 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center"
+	},
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3],
+		["accessibilityLabel", 4]
+	],
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 5
+		},
+		{
+			"kind": "host",
+			"type": "flexboxlayout",
+			"props": {
+				"className": "vx-topnav-mobilebar-end",
+				"flexDirection": "row",
+				"alignItems": "center",
+				"flexGrow": 1,
+				"justifyContent": "flex-end"
+			},
+			"children": [{
+				"kind": "slot",
+				"slot": 6
+			}]
+		},
+		{
+			"kind": "slot",
+			"slot": 7
+		}
+	]
+});
+var __octaneUniversalPlan2 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 0
+		},
+		{
+			"kind": "slot",
+			"slot": 1
+		},
+		{
+			"kind": "slot",
+			"slot": 2
+		},
+		{
+			"kind": "slot",
+			"slot": 3
+		},
+		{
+			"kind": "slot",
+			"slot": 4
+		}
+	]
+});
+var __octaneUniversalPlan3 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan4 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"col": 0,
+		"flexDirection": "row",
+		"alignItems": "center",
+		"className": "vx-topnav-start"
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan5 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"col": 1,
+		"flexDirection": "row",
+		"alignItems": "center",
+		"justifyContent": "center",
+		"className": "vx-topnav-center"
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan6 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"col": 2,
+		"flexDirection": "row",
+		"alignItems": "center",
+		"justifyContent": "flex-end",
+		"className": "vx-topnav-end"
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan7 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "gridlayout",
+	"props": { "columns": "*,auto,*" },
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3],
+		["accessibilityLabel", 4]
+	],
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 5
+		},
+		{
+			"kind": "slot",
+			"slot": 6
+		},
+		{
+			"kind": "slot",
+			"slot": 7
+		}
+	]
+});
+var __octaneUniversalPlan8 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"flexGrow": 1,
+		"className": "vx-topnav-start"
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan9 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"justifyContent": "flex-end",
+		"className": "vx-topnav-end"
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan10 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center"
+	},
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3],
+		["accessibilityLabel", 4]
+	],
+	"children": [{
+		"kind": "slot",
+		"slot": 5
+	}, {
+		"kind": "slot",
+		"slot": 6
+	}]
+});
+var __octaneUniversalPlan11 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan12 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan13 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan14 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan15 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan16 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan17 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan18 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan19 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan20 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 0
+		},
+		{
+			"kind": "slot",
+			"slot": 1
+		},
+		{
+			"kind": "slot",
+			"slot": 2
+		}
+	]
+});
+var __octaneUniversalPlan21 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-topnav-heading-logo" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan22 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan23 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"gap": 8
+	},
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 0
+		},
+		{
+			"kind": "host",
+			"type": "flexboxlayout",
+			"props": { "flexDirection": "column" },
+			"children": [{
+				"kind": "slot",
+				"slot": 1
+			}]
+		},
+		{
+			"kind": "slot",
+			"slot": 2
+		}
+	]
+});
+var __octaneUniversalPlan24 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan25 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": { "flexDirection": "column" },
+		"children": [{
+			"kind": "slot",
+			"slot": 1
+		}]
+	}]
+});
+var __octaneUniversalPlan26 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan27 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan28 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan29 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center"
+	},
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [
+		{
+			"kind": "slot",
+			"slot": 4
+		},
+		{
+			"kind": "slot",
+			"slot": 5
+		},
+		{
+			"kind": "slot",
+			"slot": 6
+		},
+		{
+			"kind": "slot",
+			"slot": 7
+		}
+	]
+});
+var __octaneUniversalPlan30 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-topnav-item-icon" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan31 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan32 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"gap": 6
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan33 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan34 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"gap": 4
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan35 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-topnavmenu-item-icon" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan36 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan37 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"gap": 8
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": {
+			"flexDirection": "column",
+			"flexGrow": 1
+		},
+		"children": [{
+			"kind": "slot",
+			"slot": 1
+		}, {
+			"kind": "slot",
+			"slot": 2
+		}]
+	}]
+});
+var __octaneUniversalPlan38 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan39 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "column",
+		"className": "vx-topnavmenu"
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan40 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan41 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"gap": 4
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan42 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-topnavmegamenu-featured" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan43 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"className": "vx-topnavmegamenu"
+	},
+	"children": [{
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": {
+			"flexDirection": "column",
+			"className": "vx-topnavmegamenu-items"
+		},
+		"children": [{
+			"kind": "slot",
+			"slot": 0
+		}]
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan44 = universalPlan("nativescript", {
+	"kind": "range",
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "slot",
+		"slot": 1
+	}]
+});
+var __octaneUniversalPlan45 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "className": "vx-topnavmegamenu-item-icon" },
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}]
+});
+var __octaneUniversalPlan46 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan47 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": {
+		"flexDirection": "row",
+		"alignItems": "center",
+		"gap": 8
+	},
+	"children": [{
+		"kind": "slot",
+		"slot": 0
+	}, {
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": {
+			"flexDirection": "column",
+			"flexGrow": 1
+		},
+		"children": [{
+			"kind": "slot",
+			"slot": 1
+		}, {
+			"kind": "slot",
+			"slot": 2
+		}]
+	}]
+});
+var __octaneUniversalPlan48 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan49 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan50 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan51 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan52 = universalPlan("nativescript", {
+	"kind": "slot",
+	"slot": 0
+});
+var __octaneUniversalPlan53 = universalPlan("nativescript", {
+	"kind": "host",
+	"type": "flexboxlayout",
+	"props": { "flexDirection": "column" },
+	"bindings": [
+		["ref", 0],
+		["id", 1],
+		["className", 2],
+		["style", 3]
+	],
+	"children": [{
+		"kind": "slot",
+		"slot": 4
+	}, {
+		"kind": "host",
+		"type": "flexboxlayout",
+		"props": {
+			"flexDirection": "column",
+			"className": "vx-topnavmegamenu-card-body"
+		},
+		"children": [
+			{
+				"kind": "slot",
+				"slot": 5
+			},
+			{
+				"kind": "slot",
+				"slot": 6
+			},
+			{
+				"kind": "slot",
+				"slot": 7
+			},
+			{
+				"kind": "slot",
+				"slot": 8
+			}
+		]
+	}]
+});
+var navIcon = defineUniversalComponent("nativescript", function navIcon(icon, size = 16) {
+	useBatch([], () => {
+		warmChild(Icon, {
+			name: icon,
+			size
+		});
+	});
+	return typeof icon === "string" ? universalValue(__octaneUniversalPlan0, [universalComponent("nativescript", Icon, universalProps([[
+		"set",
+		"name",
+		icon
+	], [
+		"set",
+		"size",
+		size
+	]]))]) : icon;
+}, { "module": "@nativescript-community/octane" });
+var TopNav = defineUniversalComponent("nativescript", function TopNav(props) {
+	const renderMode = withSlot(_h$0, useTopNavRenderMode);
+	const mobileContent = withSlot(_h$1, useTopNavMobileContent);
+	const label = props.label ?? "Top navigation";
+	const startContent = props.startContent ?? props.children;
+	const hasCenter = props.centerContent != null;
+	return universalValue(__octaneUniversalPlan13, [universalIf(renderMode === "mobile-bar", () => {
+		return universalValue(__octaneUniversalPlan1, [
+			(v) => applyEscapeProps(v, props),
+			props.id,
+			cx("vx-topnav", "vx-topnav--mobilebar", props.className),
+			props.style,
+			label,
+			props.heading,
+			props.endContent,
+			universalComponent("nativescript", MobileNavToggle, universalProps([]))
+		]);
+	}, () => {
+		return universalValue(__octaneUniversalPlan12, [universalIf(renderMode === "drawer", () => {
+			return universalValue(__octaneUniversalPlan3, [universalComponent("nativescript", MobileNav, universalProps([
+				[
+					"set",
+					"label",
+					label
+				],
+				[
+					"set",
+					"className",
+					cx("vx-topnav", "vx-topnav--drawer", props.className)
+				],
+				[
+					"set",
+					"style",
+					props.style
+				]
+			], universalChildren("nativescript", () => {
+				return universalValue(__octaneUniversalPlan2, [
+					props.heading,
+					startContent,
+					props.centerContent,
+					props.endContent,
+					mobileContent
+				]);
+			})))]);
+		}, () => {
+			return universalValue(__octaneUniversalPlan11, [universalIf(hasCenter, () => {
+				return universalValue(__octaneUniversalPlan7, [
+					(v) => applyEscapeProps(v, props),
+					props.id,
+					cx("vx-topnav", "vx-topnav--grid", props.className),
+					props.style,
+					label,
+					universalComponent("nativescript", TopNavSlotProvider, universalProps([[
+						"set",
+						"value",
+						"start"
+					]], universalChildren("nativescript", () => {
+						return universalValue(__octaneUniversalPlan4, [props.heading, startContent]);
+					}))),
+					universalComponent("nativescript", TopNavSlotProvider, universalProps([[
+						"set",
+						"value",
+						"center"
+					]], universalChildren("nativescript", () => {
+						return universalValue(__octaneUniversalPlan5, [props.centerContent]);
+					}))),
+					universalComponent("nativescript", TopNavSlotProvider, universalProps([[
+						"set",
+						"value",
+						"end"
+					]], universalChildren("nativescript", () => {
+						return universalValue(__octaneUniversalPlan6, [props.endContent]);
+					})))
+				]);
+			}, () => {
+				return universalValue(__octaneUniversalPlan10, [
+					(v) => applyEscapeProps(v, props),
+					props.id,
+					cx("vx-topnav", props.className),
+					props.style,
+					label,
+					universalComponent("nativescript", TopNavSlotProvider, universalProps([[
+						"set",
+						"value",
+						"start"
+					]], universalChildren("nativescript", () => {
+						return universalValue(__octaneUniversalPlan8, [props.heading, startContent]);
+					}))),
+					universalComponent("nativescript", TopNavSlotProvider, universalProps([[
+						"set",
+						"value",
+						"end"
+					]], universalChildren("nativescript", () => {
+						return universalValue(__octaneUniversalPlan9, [props.endContent]);
+					})))
+				]);
+			})]);
+		})]);
+	})]);
+}, { "module": "@nativescript-community/octane" });
+var TopNavHeading = defineUniversalComponent("nativescript", function TopNavHeading(props) {
+	const anchor = useRef(null, _h$2);
+	const [menuOpen, setMenuOpen] = useState(false, _h$3);
+	const hasLinks = !!(props.headingHref || props.superheadingHref || props.subheadingHref);
+	const hasMenu = props.menu != null;
+	const headerIsTrigger = hasMenu && !hasLinks;
+	const closeMenu = useCallback(() => setMenuOpen(false), [], _h$4);
+	const closeCtx = useMemo(() => ({ closeMenu }), [closeMenu], _h$5);
+	const activate = (href) => {
+		if (href) followHref(href);
+	};
+	const lines = universalValue(__octaneUniversalPlan20, [
+		props.superheading ? universalValue(__octaneUniversalPlan15, [universalComponent("nativescript", Pressable, universalProps([[
+			"set",
+			"disabled",
+			!props.superheadingHref
+		], [
+			"set",
+			"onPress",
+			() => activate(props.superheadingHref)
+		]], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan14, [universalComponent("nativescript", Text, universalProps([[
+				"set",
+				"className",
+				"vx-topnav-heading-super"
+			]], props.superheading))]);
+		})))]) : null,
+		props.heading ? universalValue(__octaneUniversalPlan17, [universalComponent("nativescript", Pressable, universalProps([[
+			"set",
+			"disabled",
+			!props.headingHref
+		], [
+			"set",
+			"onPress",
+			() => activate(props.headingHref)
+		]], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan16, [universalComponent("nativescript", Text, universalProps([[
+				"set",
+				"className",
+				"vx-topnav-heading-title"
+			]], props.heading))]);
+		})))]) : null,
+		props.subheading ? universalValue(__octaneUniversalPlan19, [universalComponent("nativescript", Pressable, universalProps([[
+			"set",
+			"disabled",
+			!props.subheadingHref
+		], [
+			"set",
+			"onPress",
+			() => activate(props.subheadingHref)
+		]], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan18, [universalComponent("nativescript", Text, universalProps([[
+				"set",
+				"className",
+				"vx-topnav-heading-sub"
+			]], props.subheading))]);
+		})))]) : null
+	]);
+	const logo = props.logo != null ? universalValue(__octaneUniversalPlan22, [universalComponent("nativescript", Pressable, universalProps([
+		[
+			"set",
+			"disabled",
+			!props.headingHref
+		],
+		[
+			"set",
+			"accessibilityLabel",
+			props.logoLabel
+		],
+		[
+			"set",
+			"onPress",
+			() => activate(props.headingHref)
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan21, [props.logo]);
+	})))]) : null;
+	return universalValue(__octaneUniversalPlan29, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-topnav-heading", props.className),
+		props.style,
+		headerIsTrigger ? universalValue(__octaneUniversalPlan24, [universalComponent("nativescript", Pressable, universalProps([
+			[
+				"set",
+				"ref",
+				(v) => {
+					anchor.current = v;
+				}
+			],
+			[
+				"set",
+				"className",
+				"vx-topnav-heading-trigger"
+			],
+			[
+				"set",
+				"onPress",
+				() => setMenuOpen(!menuOpen)
+			],
+			[
+				"set",
+				"accessibilityLabel",
+				props.heading ?? props.logoLabel
+			]
+		], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan23, [
+				logo,
+				lines,
+				universalComponent("nativescript", Icon, universalProps([[
+					"set",
+					"name",
+					"xplat-chevron-down"
+				], [
+					"set",
+					"size",
+					16
+				]]))
+			]);
+		})))]) : universalValue(__octaneUniversalPlan25, [logo, lines]),
+		hasMenu && !headerIsTrigger ? universalValue(__octaneUniversalPlan27, [universalComponent("nativescript", Pressable, universalProps([
+			[
+				"set",
+				"ref",
+				(v) => {
+					anchor.current = v;
+				}
+			],
+			[
+				"set",
+				"className",
+				"vx-topnav-heading-menubtn"
+			],
+			[
+				"set",
+				"onPress",
+				() => setMenuOpen(!menuOpen)
+			],
+			[
+				"set",
+				"accessibilityLabel",
+				"Open heading menu"
+			]
+		], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan26, [universalComponent("nativescript", Icon, universalProps([[
+				"set",
+				"name",
+				"xplat-chevron-down"
+			], [
+				"set",
+				"size",
+				16
+			]]))]);
+		})))]) : null,
+		props.headerEndContent,
+		universalComponent("nativescript", NavHeadingCloseProvider, universalProps([[
+			"set",
+			"value",
+			closeCtx
+		]], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan28, [universalComponent("nativescript", Popover, universalProps([
+				[
+					"set",
+					"anchor",
+					anchor
+				],
+				[
+					"set",
+					"open",
+					menuOpen
+				],
+				[
+					"set",
+					"placement",
+					"bottom"
+				],
+				[
+					"set",
+					"onDismiss",
+					() => setMenuOpen(false)
+				],
+				[
+					"set",
+					"className",
+					"vx-headingmenu-pop"
+				]
+			], props.menu))]);
+		})))
+	]);
+}, { "module": "@nativescript-community/octane" });
+var TopNavItem = defineUniversalComponent("nativescript", function TopNavItem(props) {
+	const isDrawer = withSlot(_h$6, useTopNavRenderMode) === "drawer";
+	const isDisabled = props.isDisabled ?? false;
+	const size = props.size ?? "md";
+	const activate = () => {
+		if (isDisabled) return;
+		props.onClick?.();
+		if (props.href) followHref(props.href);
+	};
+	return universalValue(__octaneUniversalPlan33, [universalComponent("nativescript", Pressable, universalProps([
+		[
+			"set",
+			"ref",
+			(v) => applyEscapeProps(v, props)
+		],
+		[
+			"set",
+			"id",
+			props.id
+		],
+		[
+			"set",
+			"className",
+			cx("vx-topnav-item", "vx-topnav-item--" + size, isDrawer && "vx-topnav-item--drawer", props.isSelected && "vx-topnav-item--selected", props.isIconOnly && "vx-topnav-item--icon", isDisabled && "vx-topnav-item--disabled", props.className)
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		[
+			"set",
+			"disabled",
+			isDisabled
+		],
+		[
+			"set",
+			"accessibilityRole",
+			"link"
+		],
+		[
+			"set",
+			"accessibilityLabel",
+			props.isIconOnly ? props.label : void 0
+		],
+		[
+			"set",
+			"accessibilityState",
+			{
+				disabled: isDisabled,
+				selected: props.isSelected
+			}
+		],
+		[
+			"set",
+			"onPress",
+			activate
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan32, [props.icon != null ? universalValue(__octaneUniversalPlan30, [navIcon(props.icon)]) : null, props.isIconOnly ? null : props.children ?? universalValue(__octaneUniversalPlan31, [universalComponent("nativescript", Text, universalProps([[
+			"set",
+			"className",
+			"vx-topnav-item-label"
+		]], props.label))])]);
+	})))]);
+}, { "module": "@nativescript-community/octane" });
+var TopNavMenu = defineUniversalComponent("nativescript", function TopNavMenu(props) {
+	const anchor = useRef(null, _h$7);
+	const [open, setOpen] = useState(false, _h$8);
+	const pick = (item) => {
+		item.onClick?.();
+		if (item.href) followHref(item.href);
+		setOpen(false);
+	};
+	return universalValue(__octaneUniversalPlan40, [universalComponent("nativescript", Pressable, universalProps([
+		[
+			"set",
+			"ref",
+			(v) => {
+				anchor.current = v;
+				applyEscapeProps(v, props);
+			}
+		],
+		[
+			"set",
+			"id",
+			props.id
+		],
+		[
+			"set",
+			"className",
+			cx("vx-topnav-item", "vx-topnavmenu-trigger", props.className)
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		[
+			"set",
+			"onPress",
+			() => setOpen(!open)
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan34, [universalComponent("nativescript", Text, universalProps([[
+			"set",
+			"className",
+			"vx-topnav-item-label"
+		]], props.label)), universalComponent("nativescript", Icon, universalProps([[
+			"set",
+			"name",
+			open ? "xplat-chevron-up" : "xplat-chevron-down"
+		], [
+			"set",
+			"size",
+			16
+		]]))]);
+	}))), universalComponent("nativescript", Popover, universalProps([
+		[
+			"set",
+			"anchor",
+			anchor
+		],
+		[
+			"set",
+			"open",
+			open
+		],
+		[
+			"set",
+			"placement",
+			"bottom"
+		],
+		[
+			"set",
+			"onDismiss",
+			() => setOpen(false)
+		],
+		[
+			"set",
+			"className",
+			"vx-topnavmenu-pop"
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan39, [universalFor(props.items, (item, __octaneUniversalIndex) => item.title, (item, __octaneUniversalIndex) => {
+			return universalValue(__octaneUniversalPlan38, [universalComponent("nativescript", Pressable, universalProps([[
+				"set",
+				"className",
+				"vx-topnavmenu-item"
+			], [
+				"set",
+				"onPress",
+				() => pick(item)
+			]], universalChildren("nativescript", () => {
+				return universalValue(__octaneUniversalPlan37, [
+					item.icon != null ? universalValue(__octaneUniversalPlan35, [navIcon(item.icon)]) : null,
+					universalComponent("nativescript", Text, universalProps([[
+						"set",
+						"className",
+						"vx-topnavmenu-item-title"
+					]], item.title)),
+					item.description != null ? universalValue(__octaneUniversalPlan36, [universalComponent("nativescript", Text, universalProps([[
+						"set",
+						"className",
+						"vx-topnavmenu-item-desc"
+					]], item.description))]) : null
+				]);
+			})))]);
+		})]);
+	})))]);
+}, { "module": "@nativescript-community/octane" });
+var TopNavMegaMenu = defineUniversalComponent("nativescript", function TopNavMegaMenu(props) {
+	const anchor = useRef(null, _h$9);
+	const [open, setOpen] = useState(false, _h$10);
+	const setOpenTracked = (next) => {
+		if (next !== open) props.onOpenChange?.(next);
+		setOpen(next);
+	};
+	return universalValue(__octaneUniversalPlan44, [universalComponent("nativescript", Pressable, universalProps([
+		[
+			"set",
+			"ref",
+			(v) => {
+				anchor.current = v;
+				applyEscapeProps(v, props);
+			}
+		],
+		[
+			"set",
+			"id",
+			props.id
+		],
+		[
+			"set",
+			"className",
+			cx("vx-topnav-item", "vx-topnavmegamenu-trigger", props.className)
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		[
+			"set",
+			"onPress",
+			() => setOpenTracked(!open)
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan41, [universalComponent("nativescript", Text, universalProps([[
+			"set",
+			"className",
+			"vx-topnav-item-label"
+		]], props.label)), universalComponent("nativescript", Icon, universalProps([[
+			"set",
+			"name",
+			open ? "xplat-chevron-up" : "xplat-chevron-down"
+		], [
+			"set",
+			"size",
+			16
+		]]))]);
+	}))), universalComponent("nativescript", Popover, universalProps([
+		[
+			"set",
+			"anchor",
+			anchor
+		],
+		[
+			"set",
+			"open",
+			open
+		],
+		[
+			"set",
+			"placement",
+			"bottom"
+		],
+		[
+			"set",
+			"onDismiss",
+			() => setOpenTracked(false)
+		],
+		[
+			"set",
+			"className",
+			"vx-topnavmegamenu-pop"
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan43, [props.items, props.featured != null ? universalValue(__octaneUniversalPlan42, [props.featured]) : null]);
+	})))]);
+}, { "module": "@nativescript-community/octane" });
+var TopNavMegaMenuItem = defineUniversalComponent("nativescript", function TopNavMegaMenuItem(props) {
+	const activate = () => {
+		props.onClick?.();
+		if (props.href) followHref(props.href);
+	};
+	return universalValue(__octaneUniversalPlan48, [universalComponent("nativescript", Pressable, universalProps([
+		[
+			"set",
+			"ref",
+			(v) => applyEscapeProps(v, props)
+		],
+		[
+			"set",
+			"id",
+			props.id
+		],
+		[
+			"set",
+			"className",
+			cx("vx-topnavmegamenu-item", props.className)
+		],
+		[
+			"set",
+			"style",
+			props.style
+		],
+		[
+			"set",
+			"accessibilityRole",
+			"link"
+		],
+		[
+			"set",
+			"onPress",
+			activate
+		]
+	], universalChildren("nativescript", () => {
+		return universalValue(__octaneUniversalPlan47, [
+			props.icon != null ? universalValue(__octaneUniversalPlan45, [navIcon(props.icon, 20)]) : null,
+			universalComponent("nativescript", Text, universalProps([[
+				"set",
+				"className",
+				"vx-topnavmegamenu-item-title"
+			]], props.title)),
+			props.description != null ? universalValue(__octaneUniversalPlan46, [universalComponent("nativescript", Text, universalProps([[
+				"set",
+				"className",
+				"vx-topnavmegamenu-item-desc"
+			]], props.description))]) : null
+		]);
+	})))]);
+}, { "module": "@nativescript-community/octane" });
+var TopNavMegaMenuFeaturedCard = defineUniversalComponent("nativescript", markWarm(function TopNavMegaMenuFeaturedCard(props) {
+	useBatch([], () => {
+		warmChild(Image, {
+			src: props.image,
+			className: "vx-topnavmegamenu-card-image"
+		});
+	});
+	return universalValue(__octaneUniversalPlan53, [
+		(v) => applyEscapeProps(v, props),
+		props.id,
+		cx("vx-topnavmegamenu-card", props.className),
+		props.style,
+		props.image != null ? universalValue(__octaneUniversalPlan49, [universalComponent("nativescript", Image, universalProps([[
+			"set",
+			"src",
+			props.image
+		], [
+			"set",
+			"className",
+			"vx-topnavmegamenu-card-image"
+		]]))]) : null,
+		universalComponent("nativescript", Text, universalProps([[
+			"set",
+			"className",
+			"vx-topnavmegamenu-card-title"
+		]], props.title)),
+		props.description != null ? universalValue(__octaneUniversalPlan50, [universalComponent("nativescript", Text, universalProps([[
+			"set",
+			"className",
+			"vx-topnavmegamenu-card-desc"
+		]], props.description))]) : null,
+		props.linkHref != null && props.linkLabel != null ? universalValue(__octaneUniversalPlan52, [universalComponent("nativescript", Pressable, universalProps([[
+			"set",
+			"onPress",
+			() => followHref(props.linkHref)
+		]], universalChildren("nativescript", () => {
+			return universalValue(__octaneUniversalPlan51, [universalComponent("nativescript", Text, universalProps([[
+				"set",
+				"className",
+				"vx-topnavmegamenu-card-link"
+			]], props.linkLabel))]);
+		})))]) : null,
+		props.children
+	]);
+}, (__wp) => {
+	warmChild(Image, {
+		src: __wp.image,
+		className: "vx-topnavmegamenu-card-image"
+	});
+}), { "module": "@nativescript-community/octane" });
+//#endregion
+export { TopNav, TopNavHeading, TopNavItem, TopNavMegaMenu, TopNavMegaMenuFeaturedCard, TopNavMegaMenuItem, TopNavMenu, TopNavRenderContext, useTopNavMobileContent, useTopNavRenderMode };