@octane-xplat/ui 0.6.0 → 0.7.0

package/dist/web/Tabs.web.tsrx.js

@@ -1,6 +1,6 @@
 import { Icon } from "./Icon.web.tsrx.js";
 import { canGoBack, layoutsFor, popRoute, screenFor, useModalRoute, useRoute } from "./route.web.js";
-import { __s, bag3, bag4, bag6, bag9, child, clone, componentSlot, createScopedElement, createScopedValue, delegateEvents, evt0, evt0u, forBlock, hookSlots, ifBlock, setEventHandler, setStyle, sibling, template, useState, withSlot } from "octane";
+import { __s, bag2, bag3, bag4, bag6, bag9, child, clone, componentSlot, createContext, createScopedElement, createScopedValue, delegateEvents, drainFrag, evt0, evt0u, forBlock, hookSlots, ifBlock, markChildrenBlock, setEventHandler, setStyle, sibling, template, useContext, useState, withSlot } from "octane";
 import { bindSignalAttribute, bindSignalChild, childTextHoleUpdate, compilerMemoRegion, createElementFromConfig, enableSignalBindings, hookMemoCreate, hookMemoPublishInvariant, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
 //#region src/Tabs.web.tsrx
 enableSignalBindings(1, true);
@@ -8,38 +8,48 @@ delegateEvents(["click"]);
 var _t$0 = /* @__PURE__ */ template("<div class=\"vx-route\"></div>");
 var _t$1 = /* @__PURE__ */ template("<button><!><!></button>");
 var _t$2 = /* @__PURE__ */ template("<div><div class=\"vx-tabbar\"><!></div><div class=\"vx-tabpane\"></div></div>");
-var _t$3 = /* @__PURE__ */ template("<div class=\"vx-modalroute\"><button class=\"vx-modalroute-shade\" aria-label=\"Dismiss\"></button><div class=\"vx-modalroute-body\"></div></div>");
-var _t$4 = /* @__PURE__ */ template("<div class=\"vx-tabsroot\" style=\"display: contents;\"><!><!></div>");
-var _hs$ = /* @__PURE__ */ hookSlots(6);
+var _t$3 = /* @__PURE__ */ template("<!>", 0, 1);
+var _t$4 = /* @__PURE__ */ template("<div class=\"vx-modalroute\"><button class=\"vx-modalroute-shade\" aria-label=\"Dismiss\"></button><div class=\"vx-modalroute-body\"></div></div>");
+var _t$5 = /* @__PURE__ */ template("<div class=\"vx-tabsroot\" style=\"display: contents;\"><!><!></div>");
+var _hs$ = /* @__PURE__ */ hookSlots(8);
 var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
 var _h$2 = /* @__PURE__ */ Symbol(_hs$ + 2);
 var _h$3 = /* @__PURE__ */ Symbol(_hs$ + 3);
+var __childrenBody = {};
 function __then$0(__props, __s, __extra) {
-	const routed = __extra[5];
-	let _b = __s.slots[0];
-	if (_b === void 0) {
-		let _m0;
-		const _root = clone(_t$0);
-		_m0 = _root;
-		_b = bag3(__s, _root, _m0, null, void 0);
-	}
-	{
-		const _v = routed;
-		_b.b = childTextHoleUpdate(__s, 1, _b.a, _v, _b.b, _b.c);
-		_b.c = _v;
+	const __block = __s.block;
+	const presentedWith = __extra[3];
+	const routed = __extra[7];
+	function __children$2(__props, __s, __extra) {
+		let _b = __s.slots[0];
+		if (_b === void 0) {
+			let _m0;
+			const _root = clone(_t$0);
+			_m0 = _root;
+			_b = bag3(__s, _root, _m0, null, void 0);
+		}
+		{
+			const _v = routed;
+			_b.b = childTextHoleUpdate(__s, 1, _b.a, _v, _b.b, _b.c);
+			_b.c = _v;
+		}
 	}
+	componentSlot(__s, 0, __block.parentNode, PresentedStacks, {
+		"value": presentedWith("root"),
+		"children": markChildrenBlock(__children$2, __childrenBody)
+	}, __block.endMarker, void 0, void 0, void 0, void 0, "c:7a015cf0");
 }
-var _key$3 = (t) => t.title;
-function __then$5(__props, __s, __extra) {
+var _key$5 = (t) => t.title;
+function __then$7(__props, __s, __extra) {
 	const __block = __s.block;
 	const t = __extra[0];
 	componentSlot(__s, 0, __block.parentNode, Icon, {
 		"name": t.icon,
 		"className": "vx-tabicon",
 		"size": 16
-	}, __block.endMarker, void 0, 2, void 0, void 0, "c:25a5cba3");
+	}, __block.endMarker, void 0, 2, void 0, void 0, "c:5a13679d");
 }
-function __item$4(t, __s, __extra) {
+function __item$6(t, __s, __extra) {
 	const active = __extra[0];
 	const props = __extra[1];
 	const setInternal = __extra[2];
@@ -65,17 +75,19 @@ function __item$4(t, __s, __extra) {
 	_b.a = updateFreshClassName(["vx-tab", active === props.tabs.indexOf(t) ? "active" : ""], _b.a, _b.b);
 	{
 		const __ifCondition = t.icon;
-		ifBlock(__s, 1, _b.b, __ifCondition, __then$5, null, _b.c, __ifCondition ? [t] : void 0);
+		ifBlock(__s, 1, _b.b, __ifCondition, __then$7, null, _b.c, __ifCondition ? [t] : void 0);
 	}
-	_b.g = bindSignalChild(__s, _b.g, 2, _b.b, t.title, "b:54d128e4", _b.d, true, void 0, void 0, void 0);
+	_b.g = bindSignalChild(__s, _b.g, 2, _b.b, t.title, "b:5f50892f", _b.d, true, void 0, void 0, void 0);
 }
-function __else$2(__props, __s, __extra) {
+function __else$4(__props, __s, __extra) {
 	const active = __extra[0];
 	const paneRoute = __extra[1];
-	const props = __extra[2];
-	const resolve = __extra[3];
-	const routeProps = __extra[4];
-	const setInternal = __extra[6];
+	const presented = __extra[2];
+	const presentedWith = __extra[3];
+	const props = __extra[4];
+	const resolve = __extra[5];
+	const routeProps = __extra[6];
+	const setInternal = __extra[8];
 	let _b = __s.slots[0];
 	if (_b === void 0) {
 		let _m1, _m4, _m5, _m6;
@@ -87,48 +99,73 @@ function __else$2(__props, __s, __extra) {
 		_m6 = sibling(_el0, 1);
 		_b = bag9(__s, _root, void 0, _m1, void 0, void 0, _m4, _m5, _m6, null, void 0);
 	}
-	_b.a = bindSignalAttribute(__s, _b.a, _b.b, "id", props.id, "b:f33794e1", setPlainAttribute);
+	_b.a = bindSignalAttribute(__s, _b.a, _b.b, "id", props.id, "b:23681381", setPlainAttribute);
 	_b.c = updateFreshClassName(["vx-tabs", props.className], _b.c, _b.b);
 	{
-		const _v = props.style;
+		const _v = {
+			...props.style?.height != null ? { flex: "none" } : {},
+			...props.style
+		};
 		if (_b.d !== _v) {
 			setStyle(_b.b, _v, _b.d);
 			_b.d = _v;
 		}
 	}
-	forBlock(__s, 1, _b.e, props.tabs, _key$3, __item$4, 58, [
+	forBlock(__s, 1, _b.e, props.tabs, _key$5, __item$6, 58, [
 		active,
 		props,
 		setInternal
-	], null, _b.f, true, "f3hhxyt");
-	_b.j = bindSignalChild(__s, _b.j, 2, _b.g, (paneRoute ? resolve(paneRoute.name, routeProps(paneRoute)) : null) ?? props.tabs[active]?.render(), "b:d9280e21", null, void 0, void 0, void 0, true);
+	], null, _b.f, true, "f3hin68");
+	_b.j = bindSignalChild(__s, _b.j, 2, _b.g, (paneRoute && !presented.has(paneRoute.stack) ? createScopedValue(() => createScopedElement(PresentedStacks, { value: presentedWith(paneRoute.stack) }, () => resolve(paneRoute.name, routeProps(paneRoute)), "c:7b618eb2")) : null) ?? props.tabs[active]?.render(), "b:27ad6965", null, void 0, void 0, void 0, true);
 }
-function __then$12(__props, __s, __extra) {
-	const modalContent = __extra[0];
+var __childrenBody$ = {};
+function __then$14(__props, __s, __extra) {
+	__s.block;
+	const modal = __extra[0];
+	const modalContent = __extra[1];
+	const presentedWith = __extra[2];
+	function __children$16(__props, __s, __extra) {
+		const __block = __s.block;
+		let _b = __s.slots[0];
+		if (_b === void 0) {
+			let _m0, _m1;
+			const _root = clone(_t$3);
+			_m0 = __block.parentNode;
+			_m1 = child(_root);
+			drainFrag(_root, __block.parentNode, __block.endMarker);
+			_b = bag4(__s, null, _m0, _m1, null, void 0);
+		}
+		_b.e = bindSignalChild(__s, _b.e, 1, _b.a, modalContent, "b:0eced3e6", _b.b, true, void 0, true, void 0);
+	}
 	let _b = __s.slots[0];
 	if (_b === void 0) {
 		let _m0, _m1;
-		const _root = clone(_t$3);
+		const _root = clone(_t$4);
 		const _el0 = child(_root);
 		_m0 = evt0(_el0, "$$click", popRoute);
 		_m1 = sibling(_el0, 1);
-		_b = bag4(__s, _root, _m0, _m1, null, void 0);
+		_b = bag2(__s, _root, _m0, _m1);
 	} else evt0u(_b.a, popRoute);
-	_b.e = bindSignalChild(__s, _b.e, 1, _b.b, modalContent, "b:2e0d7259", null, void 0, void 0, void 0, true);
+	componentSlot(__s, 1, _b.b, PresentedStacks, {
+		"value": presentedWith(modal?.stack ?? ""),
+		"children": markChildrenBlock(__children$16, __childrenBody$)
+	}, void 0, void 0, void 0, void 0, void 0, "c:2a85fb6f");
 }
+var PresentedStacks = /* @__PURE__ */ createContext(null);
 var Tabs = /* @__PURE__ */ __s(function Tabs(props, __s, __extra) {
 	const __memoRegion = compilerMemoRegion(__s, _hs$ + 0);
 	let __hk = __memoRegion.hooks;
 	if (__hk === void 0) __memoRegion.hooks = __hk = hookMemoCreate(1);
 	const [internal, setInternal] = useState(0, _hs$ + 0);
 	const active = props.selectedIndex ?? internal;
+	const presented = useContext(PresentedStacks) ?? /* @__PURE__ */ new Set();
 	const rootRoute = withSlot(_h$1, useRoute, "root");
 	const paneRoute = withSlot(_h$2, useRoute, props.tabs[active]?.stack ?? "");
 	const modal = withSlot(_h$3, useModalRoute);
 	const resolve = (name, params) => {
 		const C = screenFor(name);
-		const el = props.resolveScreen ? props.resolveScreen(name, params) : C ? createScopedValue(() => createElementFromConfig("c:15b283b3", C, { ...params })) : null;
-		return layoutsFor(name).reduceRight((child, L) => createScopedElement(L, {}, () => child, "c:c25ae6f8"), el);
+		const el = props.resolveScreen ? props.resolveScreen(name, params) : C ? createScopedValue(() => createElementFromConfig("c:d99ad905", C, { ...params })) : null;
+		return layoutsFor(name).reduceRight((child, L) => createScopedElement(L, {}, () => child, "c:3182bbb8"), el);
 	};
 	const routeProps = __hk[0] ?? hookMemoPublishInvariant(__hk, 0, (route) => ({
 		...route.params,
@@ -137,8 +174,9 @@ var Tabs = /* @__PURE__ */ __s(function Tabs(props, __s, __extra) {
 		...Object.prototype.hasOwnProperty.call(route, "loaderData") ? { data: route.loaderData } : {},
 		...Object.prototype.hasOwnProperty.call(route, "loaderError") ? { error: route.loaderError } : {}
 	}));
-	const routed = rootRoute ? resolve(rootRoute.name, routeProps(rootRoute)) : null;
-	const modalContent = modal ? resolve(modal.name, {
+	const presentedWith = (stack) => new Set(presented).add(stack);
+	const routed = rootRoute && !presented.has("root") ? resolve(rootRoute.name, routeProps(rootRoute)) : null;
+	const modalContent = modal && !presented.has(modal.stack) ? resolve(modal.name, {
 		...routeProps(modal),
 		close: () => popRoute()
 	}) : null;
@@ -146,16 +184,18 @@ var Tabs = /* @__PURE__ */ __s(function Tabs(props, __s, __extra) {
 	let _b = __s.slots[0];
 	if (_b === void 0) {
 		let _m0, _m1, _m2;
-		const _root = clone(_t$4);
+		const _root = clone(_t$5);
 		_m0 = _root;
 		const _el0 = child(_root);
 		_m1 = _el0;
 		_m2 = sibling(_el0, 1);
 		_b = bag3(__s, _root, _m0, _m1, _m2);
 	}
-	ifBlock(__s, 1, _b.a, routed, __then$0, __else$2, _b.b, [
+	ifBlock(__s, 1, _b.a, routed, __then$0, __else$4, _b.b, [
 		active,
 		paneRoute,
+		presented,
+		presentedWith,
 		props,
 		resolve,
 		routeProps,
@@ -164,7 +204,11 @@ var Tabs = /* @__PURE__ */ __s(function Tabs(props, __s, __extra) {
 	]);
 	{
 		const __ifCondition$ = modalContent;
-		ifBlock(__s, 2, _b.a, __ifCondition$, __then$12, null, _b.c, __ifCondition$ ? [modalContent] : void 0);
+		ifBlock(__s, 2, _b.a, __ifCondition$, __then$14, null, _b.c, __ifCondition$ ? [
+			modal,
+			modalContent,
+			presentedWith
+		] : void 0);
 	}
 });
 //#endregion

package/dist/web/{web/Tooltip.web.tsrx.js → Tooltip.web.tsrx.js}

@@ -1,9 +1,9 @@
-import { View } from "../View.web.tsrx.js";
-import { cx } from "../cx.js";
-import { Popover } from "../Popover.web.tsrx.js";
+import { View } from "./View.web.tsrx.js";
+import { cx } from "./cx.js";
+import { Popover } from "./Popover.web.tsrx.js";
 import { bag4, bag5, child, clone, componentSlotVoid, drainFrag, hookSlots, markChildrenBlock, sibling, template, useEffect, useRef, useState } from "octane";
 import { compilerMemoRegion, hookMemoCreate, hookMemoPublishInvariant, textHoleUpdate } from "octane/internal/client";
-//#region src/web/Tooltip.web.tsrx
+//#region src/Tooltip.web.tsrx
 var _t$0 = /* @__PURE__ */ template("<!>", 0, 1);
 var _t$1 = /* @__PURE__ */ template("<!><!>", 3, 1);
 var _hs$ = /* @__PURE__ */ hookSlots(9);
@@ -169,15 +169,16 @@ var Tooltip = function Tooltip(props, __s, __extra) {
 				id: tooltipId.current
 			},
 			"children": markChildrenBlock(__children$4, __childrenBody)
-		}, _b.e, void 0, void 0, void 0, void 0, "c:268467ce");
+		}, _b.e, void 0, void 0, void 0, void 0, "c:dd7a8b68");
 	}
 	componentSlotVoid(__s, 0, __block.parentNode, View, {
+		"id": props.id,
 		"className": props.className,
 		"style": props.style,
 		"bind": bindAnchor,
 		"web": props.web,
 		"children": markChildrenBlock(__children$1, __childrenBody$)
-	}, __block.endMarker, void 0, void 0, true, void 0, "c:624a85e5");
+	}, __block.endMarker, void 0, void 0, true, void 0, "c:aa5da45c");
 };
 //#endregion
 export { Tooltip };