@octane-xplat/ui 0.5.0 → 0.6.0

package/dist/web/{ui15.js → Pressable.web.tsrx.js}

@@ -1,18 +1,22 @@
-import { applyEscapeProps } from "./ui2.js";
-import { glassClassOf, glassStyleOf } from "./ui3.js";
-import { layoutChildProps } from "./ui4.js";
-import { __s, bagOf, clone, snapshotSpread, template } from "octane";
+import { applyEscapeProps } from "./escape-props.web.js";
+import { layoutChildProps } from "./layout-child.web.js";
+import { usePan } from "./pan.web.tsrx.js";
+import { __s, bagOf, clone, hookSlots, snapshotSpread, template, useRef, withSlot } from "octane";
 import { bindSignalChild, bindSignalHostPropSources, enableSignalBindings } from "octane/internal/client";
 //#region src/Pressable.web.tsrx
 enableSignalBindings(1, true);
 var _t$0 = /* @__PURE__ */ template("<div></div>");
+var _hs$ = /* @__PURE__ */ hookSlots(2);
+var _h$1 = /* @__PURE__ */ Symbol(_hs$ + 1);
 var _rm$1 = [
 	"s",
-	"w",
-	"v"
+	"u",
+	"t"
 ];
 var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
+	const el = useRef(null, _hs$ + 0);
 	let timer = null;
+	withSlot(_h$1, usePan, el, props.disabled ? void 0 : props.onPan);
 	const cancel = () => {
 		if (timer !== null) {
 			clearTimeout(timer);
@@ -27,20 +31,21 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 			props.onLongPress?.();
 		}, 500);
 	};
+	if (__s.block.pending && !__s.block.crossRenderUpdate) return;
 	let _b = __s.slots[0];
 	if (_b === void 0) {
-		let _m0, _m1, _m2, _m3, _m4, _m5, _m6, _m7, _m8, _m9, _m10, _m11, _m12, _m13, _m14, _m15, _m16, _m17, _m18, _m19, _m20, _m21, _m22;
+		let _m0, _m1, _m2, _m3, _m4, _m5, _m6, _m7, _m8, _m9, _m10, _m11, _m12, _m13, _m14, _m15, _m16, _m17, _m18, _m19, _m20;
 		const _root = clone(_t$0);
-		_m0 = (el) => applyEscapeProps(el, props);
+		_m0 = (e) => {
+			el.current = e;
+			if (e) {
+				applyEscapeProps(e, props);
+				props.bind?.(e);
+			}
+		};
 		_m1 = props.id;
-		_m2 = [
-			"vx-pressable",
-			props.ignoreTouchAnimation ? "vx-pressable-no-feedback" : "",
-			glassClassOf(props.glass),
-			props.className
-		];
+		_m2 = ["vx-pressable", props.className];
 		_m3 = snapshotSpread(layoutChildProps(props, {
-			...glassStyleOf(props.glass),
 			...props.style,
 			...props.hitSlop ? {
 				margin: -props.hitSlop,
@@ -54,32 +59,30 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 		_m8 = props.accessibilityState?.disabled ?? props.disabled ?? void 0;
 		_m9 = props.accessibilityState?.selected;
 		_m10 = props.accessibilityState?.checked;
-		_m11 = props.accessibilityState?.busy;
-		_m12 = props.accessibilityState?.expanded;
-		_m13 = props.accessibilityLiveRegion === "none" ? "off" : props.accessibilityLiveRegion;
-		_m14 = props.accessible === false ? true : void 0;
-		_m15 = props.disabled ? void 0 : props.onPress;
-		_m16 = props.disabled ? void 0 : props.onDoublePress;
-		_m17 = (e) => {
+		_m11 = props.accessibilityLiveRegion === "none" ? "off" : props.accessibilityLiveRegion;
+		_m12 = props.accessible === false ? true : void 0;
+		_m13 = props.disabled ? void 0 : props.onPress;
+		_m14 = props.disabled ? void 0 : props.onDoublePress;
+		_m15 = (e) => {
 			if (!props.disabled) {
 				props.onPressIn?.();
 				down();
 			}
 		};
-		_m18 = () => {
+		_m16 = () => {
 			if (!props.disabled) props.onPressOut?.();
 			cancel();
 		};
-		_m19 = () => {
+		_m17 = () => {
 			if (!props.disabled) props.onPressOut?.();
 			cancel();
 		};
-		_m20 = () => {
+		_m18 = () => {
 			if (!props.disabled) props.onPressOut?.();
 			cancel();
 		};
-		_m21 = _root;
-		_m22 = bindSignalHostPropSources(__s, void 0, _root, [
+		_m19 = _root;
+		_m20 = bindSignalHostPropSources(__s, void 0, _root, [
 			[
 				false,
 				"ref",
@@ -131,57 +134,47 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 				"aria-checked",
 				_m10
 			],
-			[
-				false,
-				"aria-busy",
-				_m11
-			],
-			[
-				false,
-				"aria-expanded",
-				_m12
-			],
 			[
 				false,
 				"aria-live",
-				_m13
+				_m11
 			],
 			[
 				false,
 				"aria-hidden",
-				_m14
+				_m12
 			],
 			[
 				false,
 				"onClick",
-				_m15
+				_m13
 			],
 			[
 				false,
 				"onDoubleClick",
-				_m16
+				_m14
 			],
 			[
 				false,
 				"onPointerDown",
-				_m17
+				_m15
 			],
 			[
 				false,
 				"onPointerUp",
-				_m18
+				_m16
 			],
 			[
 				false,
 				"onPointerLeave",
-				_m19
+				_m17
 			],
 			[
 				false,
 				"onPointerCancel",
-				_m20
+				_m18
 			]
-		], "b:1e96e1c3", true);
+		], "b:85f49247", true);
 		_b = bagOf(__s, _root, {
 			a: _m0,
 			b: _m1,
@@ -204,15 +197,19 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 			s: _m18,
 			t: _m19,
 			u: _m20,
-			v: _m21,
-			w: _m22,
-			x: null,
-			y: void 0
+			v: null,
+			w: void 0
 		});
 		__s.refFields = _rm$1;
 	} else {
 		{
-			const _v = (el) => applyEscapeProps(el, props);
+			const _v = (e) => {
+				el.current = e;
+				if (e) {
+					applyEscapeProps(e, props);
+					props.bind?.(e);
+				}
+			};
 			if (_b.a !== _v) _b.a = _v;
 		}
 		{
@@ -220,16 +217,10 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 			if (_b.b !== _v) _b.b = _v;
 		}
 		{
-			const _v = [
-				"vx-pressable",
-				props.ignoreTouchAnimation ? "vx-pressable-no-feedback" : "",
-				glassClassOf(props.glass),
-				props.className
-			];
+			const _v = ["vx-pressable", props.className];
 			if (_b.c !== _v) _b.c = _v;
 		}
 		_b.d = snapshotSpread(layoutChildProps(props, {
-			...glassStyleOf(props.glass),
 			...props.style,
 			...props.hitSlop ? {
 				margin: -props.hitSlop,
@@ -264,29 +255,21 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 			const _v = props.accessibilityState?.checked;
 			if (_b.k !== _v) _b.k = _v;
 		}
-		{
-			const _v = props.accessibilityState?.busy;
-			if (_b.l !== _v) _b.l = _v;
-		}
-		{
-			const _v = props.accessibilityState?.expanded;
-			if (_b.m !== _v) _b.m = _v;
-		}
 		{
 			const _v = props.accessibilityLiveRegion === "none" ? "off" : props.accessibilityLiveRegion;
-			if (_b.n !== _v) _b.n = _v;
+			if (_b.l !== _v) _b.l = _v;
 		}
 		{
 			const _v = props.accessible === false ? true : void 0;
-			if (_b.o !== _v) _b.o = _v;
+			if (_b.m !== _v) _b.m = _v;
 		}
 		{
 			const _v = props.disabled ? void 0 : props.onPress;
-			if (_b.p !== _v) _b.p = _v;
+			if (_b.n !== _v) _b.n = _v;
 		}
 		{
 			const _v = props.disabled ? void 0 : props.onDoublePress;
-			if (_b.q !== _v) _b.q = _v;
+			if (_b.o !== _v) _b.o = _v;
 		}
 		{
 			const _v = (e) => {
@@ -295,30 +278,30 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 					down();
 				}
 			};
-			if (_b.r !== _v) _b.r = _v;
+			if (_b.p !== _v) _b.p = _v;
 		}
 		{
 			const _v = () => {
 				if (!props.disabled) props.onPressOut?.();
 				cancel();
 			};
-			if (_b.s !== _v) _b.s = _v;
+			if (_b.q !== _v) _b.q = _v;
 		}
 		{
 			const _v = () => {
 				if (!props.disabled) props.onPressOut?.();
 				cancel();
 			};
-			if (_b.t !== _v) _b.t = _v;
+			if (_b.r !== _v) _b.r = _v;
 		}
 		{
 			const _v = () => {
 				if (!props.disabled) props.onPressOut?.();
 				cancel();
 			};
-			if (_b.u !== _v) _b.u = _v;
+			if (_b.s !== _v) _b.s = _v;
 		}
-		_b.w = bindSignalHostPropSources(__s, _b.w, _b.v, [
+		_b.u = bindSignalHostPropSources(__s, _b.u, _b.t, [
 			[
 				false,
 				"ref",
@@ -370,59 +353,49 @@ var Pressable = /* @__PURE__ */ __s(function Pressable(props, __s, __extra) {
 				"aria-checked",
 				_b.k
 			],
-			[
-				false,
-				"aria-busy",
-				_b.l
-			],
-			[
-				false,
-				"aria-expanded",
-				_b.m
-			],
 			[
 				false,
 				"aria-live",
-				_b.n
+				_b.l
 			],
 			[
 				false,
 				"aria-hidden",
-				_b.o
+				_b.m
 			],
 			[
 				false,
 				"onClick",
-				_b.p
+				_b.n
 			],
 			[
 				false,
 				"onDoubleClick",
-				_b.q
+				_b.o
 			],
 			[
 				false,
 				"onPointerDown",
-				_b.r
+				_b.p
 			],
 			[
 				false,
 				"onPointerUp",
-				_b.s
+				_b.q
 			],
 			[
 				false,
 				"onPointerLeave",
-				_b.t
+				_b.r
 			],
 			[
 				false,
 				"onPointerCancel",
-				_b.u
+				_b.s
 			]
-		], "b:1e96e1c3", true);
+		], "b:85f49247", true);
 	}
-	_b.z = bindSignalChild(__s, _b.z, 1, _b.v, props.children, "b:42886232", null, void 0, void 0, void 0, true);
+	_b.x = bindSignalChild(__s, _b.x, 1, _b.t, props.children, "b:7567c2fe", null, void 0, void 0, void 0, true);
 });
 //#endregion
 export { Pressable };

package/dist/web/ProgressGroup.web.tsrx.js

@@ -0,0 +1,109 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { Meter } from "./Meter.web.tsrx.js";
+import { __s, bag3, bag6, child, clone, compilerCacheContext, componentSlotVoid, createScopedElement, createScopedValue, hookSlots, ifBlock, mapSlot, positionalChildren, queueRefAttach, queueRefDetach, setStyle, sibling, template } from "octane";
+import { bindSignalAttribute, bindSignalChild, compilerMemoRegion, createElementFromConfig, enableSignalBindings, hookMemoEqual, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/ProgressGroup.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<span class=\"vx-progressgroup-label\"></span>");
+var _t$1 = /* @__PURE__ */ template("<div class=\"vx-progressgroup-row\"><!><!></div>");
+var _t$2 = /* @__PURE__ */ template("<div role=\"group\"><!></div>");
+var _key$0 = (item) => item.key;
+function __then$3(__props, __s, __extra) {
+	const item = __extra[0];
+	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);
+	}
+	_b.d = bindSignalChild(__s, _b.d, 1, _b.a, item.label, "b:3825d7ed", null, void 0, void 0, void 0, true);
+}
+function __item$1(item, __s, __extra) {
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m2;
+		const _root = clone(_t$1);
+		_m0 = _root;
+		_m1 = sibling(child(_root), 1);
+		_m2 = child(_root);
+		_b = bag3(__s, _root, _m0, _m1, _m2);
+	}
+	componentSlotVoid(__s, 1, _b.a, Meter, {
+		"value": item.value,
+		"max": item.max,
+		"accessibilityLabel": item.label
+	}, _b.c, void 0, 2, void 0, void 0, "c:a026e418");
+	{
+		const __ifCondition = item.label != null;
+		ifBlock(__s, 2, _b.a, __ifCondition, __then$3, null, _b.b, __ifCondition ? [item] : void 0);
+	}
+}
+var _rm$7 = [
+	"r",
+	"b",
+	"a"
+];
+var _hs$ = /* @__PURE__ */ hookSlots(3);
+var ProgressGroup = /* @__PURE__ */ __s(function ProgressGroup(props, __s, __extra) {
+	const __memoRegion = compilerMemoRegion(__s, _hs$ + 0);
+	const __memoCommitted = __memoRegion.auto;
+	let __memoCache = __memoCommitted === void 0 ? [] : __memoCommitted;
+	let __mapItems;
+	let __mapMethod;
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m5;
+		const _root = clone(_t$2);
+		queueRefAttach(__s, _m1 = (e) => applyEscapeProps(e, props), _m0 = _root);
+		(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.b, _b.a));
+		_m5 = child(_root);
+		_b = bag6(__s, _root, _m0, _m1, void 0, void 0, void 0, _m5);
+		__s.refFields = _rm$7;
+	} else {
+		const _r = (e) => applyEscapeProps(e, props);
+		if (_r !== _b.b) _b.b = replaceRef(__s, _b.b, _r, _b.a);
+	}
+	_b.c = bindSignalAttribute(__s, _b.c, _b.a, "id", props.id, "b:703e6aff", setPlainAttribute);
+	_b.d = updateFreshClassName(["vx-progressgroup", props.className], _b.d, _b.a);
+	{
+		const _v = props.style;
+		if (_b.e !== _v) {
+			setStyle(_b.a, _v, _b.e);
+			_b.e = _v;
+		}
+	}
+	{
+		const _v = (__mapItems = props.items, __mapMethod = __mapItems.map, __mapItems);
+		const __mapNative = mapSlot(_v, __mapMethod);
+		{
+			const __memoDep = _v;
+			const __memoDep$ = Meter;
+			if (__s.slots[1] === void 0 || !__mapNative || Meter.__memo !== true || Meter.__compare !== void 0 || __memoCache[3] !== true || !hookMemoEqual(__memoCache[0], __memoDep) || !hookMemoEqual(__memoCache[1], __memoDep$)) {
+				mapSlot(__s, 1, _b.a, _v, __mapMethod, __mapNative, (item) => createScopedElement("div", {
+					key: item.key,
+					className: "vx-progressgroup-row"
+				}, () => positionalChildren([createScopedValue(() => createElementFromConfig("c:4716bfa1", Meter, {
+					value: item.value,
+					max: item.max,
+					accessibilityLabel: item.label
+				})), item.label != null ? createScopedElement("span", { className: "vx-progressgroup-label" }, () => item.label) : null])), _key$0, __item$1, 26 | (Meter.__memo === true && Meter.__compare === void 0 ? 4 : 0), [Meter], _b.f, 1);
+				const _c = compilerCacheContext(__s, 1, __memoCache[2]);
+				if (__memoCache === __memoCommitted) __memoCache = __memoCache.slice();
+				__memoCache[0] = __memoDep;
+				__memoCache[1] = __memoDep$;
+				__memoCache[2] = _c;
+				__memoCache[3] = __mapNative;
+			} else {
+				const _c = compilerCacheContext(__s, 1, __memoCache[2]);
+				if (_c !== __memoCache[2]) {
+					if (__memoCache === __memoCommitted) __memoCache = __memoCache.slice();
+					__memoCache[2] = _c;
+				}
+			}
+		}
+	}
+	if (__memoCache !== __memoCommitted) __memoRegion.auto = __memoCache;
+});
+//#endregion
+export { ProgressGroup };

package/dist/web/RadioGroup.web.tsrx.js

@@ -0,0 +1,69 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { __s, bag9, child, clone, createElement, createScopedElement, positionalChildren, queueRefAttach, queueRefDetach, setAriaAttribute, setStyle, template } from "octane";
+import { bindSignalAttribute, bindSignalChild, enableSignalBindings, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/RadioGroup.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<div role=\"radiogroup\"><!></div>");
+var _rm$1 = [
+	"r",
+	"b",
+	"a"
+];
+var RadioGroup = /* @__PURE__ */ __s(function RadioGroup(props, __s, __extra) {
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m6;
+		const _root = clone(_t$0);
+		queueRefAttach(__s, _m1 = (e) => applyEscapeProps(e, props), _m0 = _root);
+		(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.b, _b.a));
+		_m6 = child(_root);
+		_b = bag9(__s, _root, _m0, _m1, void 0, void 0, void 0, void 0, _m6, null, void 0);
+		__s.refFields = _rm$1;
+	} else {
+		const _r = (e) => applyEscapeProps(e, props);
+		if (_r !== _b.b) _b.b = replaceRef(__s, _b.b, _r, _b.a);
+	}
+	_b.c = bindSignalAttribute(__s, _b.c, _b.a, "id", props.id, "b:e305e177", setPlainAttribute);
+	_b.d = bindSignalAttribute(__s, _b.d, _b.a, "aria-label", props.accessibilityLabel, "b:2387e038", setAriaAttribute);
+	_b.e = updateFreshClassName([
+		"vx-radio-group",
+		props.horizontal ? "vx-radio-group--row" : void 0,
+		props.className
+	], _b.e, _b.a);
+	{
+		const _v = props.style;
+		if (_b.f !== _v) {
+			setStyle(_b.a, _v, _b.f);
+			_b.f = _v;
+		}
+	}
+	_b.j = bindSignalChild(__s, _b.j, 1, _b.a, props.options.map((opt) => {
+		const selected = props.value === opt.value;
+		const disabled = props.disabled || opt.disabled;
+		return createScopedElement("div", {
+			key: opt.value,
+			role: "radio",
+			"aria-checked": selected,
+			"aria-disabled": disabled || void 0,
+			tabIndex: disabled ? void 0 : 0,
+			className: [
+				"vx-radio-row",
+				selected ? "vx-radio--on" : void 0,
+				disabled ? "vx-radio--disabled" : void 0
+			],
+			onClick: disabled ? void 0 : () => props.onValueChange?.(opt.value),
+			onKeyDown: (e) => {
+				if (disabled) return;
+				if (e.key === " " || e.key === "Enter") {
+					e.preventDefault();
+					props.onValueChange?.(opt.value);
+				}
+			}
+		}, () => positionalChildren([createScopedElement("div", {
+			className: "vx-radio",
+			"aria-hidden": "true"
+		}, () => selected ? createElement("div", { className: "vx-radio-dot" }) : null), opt.label != null ? createScopedElement("span", { className: "vx-radio-label" }, () => opt.label) : null]));
+	}), "b:acc26df6", _b.g, true, void 0, void 0, void 0);
+});
+//#endregion
+export { RadioGroup };

package/dist/web/{ui14.js → RichText.web.tsrx.js}

@@ -1,5 +1,5 @@
-import { applyEscapeProps } from "./ui2.js";
-import { layoutChildProps } from "./ui4.js";
+import { applyEscapeProps } from "./escape-props.web.js";
+import { layoutChildProps } from "./layout-child.web.js";
 import { __s, bag5, bag8, clone, delegateEvents, setEventHandler, setStyle, snapshotSpread, template } from "octane";
 import { bindSignalAttribute, bindSignalChild, bindSignalHostPropSources, enableSignalBindings } from "octane/internal/client";
 //#region src/RichText.web.tsrx