@octane-xplat/ui 0.5.0 → 0.6.0

package/dist/web/NavigationMenu.web.tsrx.js

@@ -0,0 +1,118 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { Icon } from "./Icon.web.tsrx.js";
+import { __s, bag3, bag7, child, clone, componentSlot, createScopedElement, createScopedValue, delegateEvents, ifBlock, mapSlot, positionalChildren, queueRefAttach, queueRefDetach, setAriaAttribute, setEventHandler, setStyle, sibling, template } from "octane";
+import { bindSignalAttribute, bindSignalChild, createElementFromConfig, enableSignalBindings, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/NavigationMenu.web.tsrx
+enableSignalBindings(1, true);
+delegateEvents(["click", "keydown"]);
+var _t$0 = /* @__PURE__ */ template("<span class=\"vx-navmenu-label\"></span>");
+var _t$1 = /* @__PURE__ */ template("<span role=\"link\"><!><!></span>");
+var _t$2 = /* @__PURE__ */ template("<nav><!></nav>");
+var _key$0 = (item) => item.key;
+function __then$2(__props, __s, __extra) {
+	const __block = __s.block;
+	const item = __extra[0];
+	componentSlot(__s, 0, __block.parentNode, Icon, { "name": item.icon }, __block.endMarker, void 0, 2, void 0, void 0, "c:402f6945");
+}
+function __then$5(__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:2bbe82f6", null, void 0, void 0, void 0, true);
+}
+function __item$1(item, __s, __extra) {
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m1, _m5, _m6;
+		const _root = clone(_t$1);
+		_m1 = _root;
+		setEventHandler(_root, "$$click", item.disabled ? void 0 : item.onSelect);
+		setEventHandler(_root, "$$keydown", (e) => {
+			if (!item.disabled && e.key === "Enter") item.onSelect?.();
+		});
+		const _el0 = child(_root);
+		_m5 = _el0;
+		_m6 = sibling(_el0, 1);
+		_b = bag7(__s, _root, void 0, _m1, void 0, void 0, void 0, _m5, _m6);
+	} else {
+		setEventHandler(_b.b, "$$click", item.disabled ? void 0 : item.onSelect);
+		setEventHandler(_b.b, "$$keydown", (e) => {
+			if (!item.disabled && e.key === "Enter") item.onSelect?.();
+		});
+	}
+	_b.a = bindSignalAttribute(__s, _b.a, _b.b, "aria-current", item.active ? "page" : void 0, "b:36065b56", setAriaAttribute);
+	_b.c = bindSignalAttribute(__s, _b.c, _b.b, "aria-disabled", item.disabled || void 0, "b:0a1edf7c", setAriaAttribute);
+	_b.d = bindSignalAttribute(__s, _b.d, _b.b, "tabindex", item.disabled ? void 0 : 0, "b:09198478", setPlainAttribute);
+	_b.e = updateFreshClassName([
+		"vx-navmenu-item",
+		item.active ? "vx-navmenu-item--on" : void 0,
+		item.disabled ? "vx-navmenu-item--disabled" : void 0
+	], _b.e, _b.b);
+	{
+		const __ifCondition = item.icon;
+		ifBlock(__s, 1, _b.b, __ifCondition, __then$2, null, _b.f, __ifCondition ? [item] : void 0);
+	}
+	{
+		const __ifCondition$ = item.label != null;
+		ifBlock(__s, 2, _b.b, __ifCondition$, __then$5, null, _b.g, __ifCondition$ ? [item] : void 0);
+	}
+}
+var _rm$9 = [
+	"r",
+	"b",
+	"a"
+];
+var NavigationMenu = /* @__PURE__ */ __s(function NavigationMenu(props, __s, __extra) {
+	let __mapItems;
+	let __mapMethod;
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m6;
+		const _root = clone(_t$2);
+		queueRefAttach(__s, _m1 = (e) => applyEscapeProps(e, props), _m0 = _root);
+		(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.b, _b.a));
+		_m6 = child(_root);
+		_b = bag7(__s, _root, _m0, _m1, void 0, void 0, void 0, void 0, _m6);
+		__s.refFields = _rm$9;
+	} 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:ef165b7e", setPlainAttribute);
+	_b.d = updateFreshClassName([
+		"vx-navmenu",
+		props.horizontal === false ? "vx-navmenu--col" : "vx-navmenu--row",
+		props.className
+	], _b.d, _b.a);
+	{
+		const _v = props.style;
+		if (_b.e !== _v) {
+			setStyle(_b.a, _v, _b.e);
+			_b.e = _v;
+		}
+	}
+	_b.f = bindSignalAttribute(__s, _b.f, _b.a, "aria-label", props.accessibilityLabel, "b:096aff78", setAriaAttribute);
+	mapSlot(__s, 1, _b.a, (__mapItems = props.items, __mapMethod = __mapItems.map, __mapItems), __mapMethod, (item) => createScopedElement("span", {
+		key: item.key,
+		role: "link",
+		"aria-current": item.active ? "page" : void 0,
+		"aria-disabled": item.disabled || void 0,
+		tabIndex: item.disabled ? void 0 : 0,
+		className: [
+			"vx-navmenu-item",
+			item.active ? "vx-navmenu-item--on" : void 0,
+			item.disabled ? "vx-navmenu-item--disabled" : void 0
+		],
+		onClick: item.disabled ? void 0 : item.onSelect,
+		onKeyDown: (e) => {
+			if (!item.disabled && e.key === "Enter") item.onSelect?.();
+		}
+	}, () => positionalChildren([item.icon ? createScopedValue(() => createElementFromConfig("c:d7ecfcc6", Icon, { name: item.icon })) : null, item.label != null ? createScopedElement("span", { className: "vx-navmenu-label" }, () => item.label) : null])), _key$0, __item$1, 26, void 0, _b.g, 1);
+});
+//#endregion
+export { NavigationMenu };

package/dist/web/{ui31.js → Overlay.web.tsrx.js}

@@ -1,5 +1,5 @@
-import { cx } from "./ui28.js";
-import { useThemeScheme } from "./ui29.js";
+import { cx } from "./cx.js";
+import { useThemeScheme } from "./theme/theme-scheme.js";
 import { bag1, bag2, bag9, child, clone, delegateEvents, drainFrag, hookSlots, ifBlock, markDangerouslySetInnerHTMLChildren, portal, setEventHandler, sibling, snapshotSpread, template, withSlot } from "octane";
 import { bindSignalChild, bindSignalHostPropSources, enableSignalBindings } from "octane/internal/client";
 //#region src/Overlay.web.tsrx

package/dist/web/Pager.web.tsrx.js

@@ -0,0 +1,337 @@
+import { layoutChildProps } from "./layout-child.web.js";
+import { applyWebProps } from "./platformProps.web.js";
+import { bag4, bagOf, child, clone, drainFrag, forBlock, hookSlots, ifBlock, markDangerouslySetInnerHTMLChildren, snapshotSpread, template, useEffect, useRef } from "octane";
+import { bindSignalChild, bindSignalHostPropSources, enableSignalBindings, setAriaAttributeIfChanged } from "octane/internal/client";
+//#region src/Pager.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<div class=\"vx-pager-page\" role=\"group\" aria-roledescription=\"slide\"></div>");
+var _t$1 = /* @__PURE__ */ template("<div><!></div>");
+var _t$2 = /* @__PURE__ */ template("<!>", 0, 1);
+var _hs$ = /* @__PURE__ */ hookSlots(8);
+var _key$1 = (item, i) => i;
+function __item$2(item, __s, __extra) {
+	const __block = __s.block;
+	const props = __extra[0];
+	const i = __block.itemIndex;
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m1;
+		const _root = clone(_t$0);
+		_m1 = _root;
+		_b = bag4(__s, _root, void 0, _m1, null, void 0);
+	}
+	_b.a = setAriaAttributeIfChanged(`${i + 1} of ${props.items.length}`, _b.a, _b.b, "aria-label");
+	_b.e = bindSignalChild(__s, _b.e, 1, _b.b, props.renderItem(item, i), "b:a193c343", null, void 0, void 0, void 0, true);
+}
+var _rm$5 = [
+	"s",
+	"p",
+	"o"
+];
+function __then$0(__props, __s, __extra) {
+	const host = __extra[0];
+	const props = __extra[1];
+	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;
+		const _root = clone(_t$1);
+		_m0 = (el) => {
+			host.current = el;
+			applyWebProps(el, props.web);
+		};
+		_m1 = props.id;
+		_m2 = ["vx-pager", props.className];
+		_m3 = snapshotSpread(layoutChildProps(props));
+		_m4 = props.accessibilityRole ?? "group";
+		_m5 = "carousel";
+		_m6 = props.accessibilityLabel;
+		_m7 = props.accessible === false ? true : void 0;
+		_m8 = props.accessibilityHint;
+		_m9 = props.accessibilityValue;
+		_m10 = props.accessibilityState?.disabled;
+		_m11 = props.accessibilityState?.selected;
+		_m12 = props.accessibilityState?.checked;
+		_m13 = props.accessibilityLiveRegion === "none" ? "off" : props.accessibilityLiveRegion;
+		_m14 = _root;
+		_m15 = bindSignalHostPropSources(__s, void 0, _root, [
+			[
+				false,
+				"ref",
+				_m0
+			],
+			[
+				false,
+				"id",
+				_m1
+			],
+			[
+				false,
+				"className",
+				_m2
+			],
+			[true, _m3],
+			[
+				false,
+				"role",
+				_m4
+			],
+			[
+				false,
+				"aria-roledescription",
+				_m5
+			],
+			[
+				false,
+				"aria-label",
+				_m6
+			],
+			[
+				false,
+				"aria-hidden",
+				_m7
+			],
+			[
+				false,
+				"aria-description",
+				_m8
+			],
+			[
+				false,
+				"aria-valuetext",
+				_m9
+			],
+			[
+				false,
+				"aria-disabled",
+				_m10
+			],
+			[
+				false,
+				"aria-selected",
+				_m11
+			],
+			[
+				false,
+				"aria-checked",
+				_m12
+			],
+			[
+				false,
+				"aria-live",
+				_m13
+			]
+		], "b:452923c1", true);
+		markDangerouslySetInnerHTMLChildren(_root);
+		_m16 = child(_root);
+		_b = bagOf(__s, _root, {
+			a: _m0,
+			b: _m1,
+			c: _m2,
+			d: _m3,
+			e: _m4,
+			f: _m5,
+			g: _m6,
+			h: _m7,
+			i: _m8,
+			j: _m9,
+			k: _m10,
+			l: _m11,
+			m: _m12,
+			n: _m13,
+			o: _m14,
+			p: _m15,
+			q: _m16
+		});
+		__s.refFields = _rm$5;
+	} else {
+		{
+			const _v = (el) => {
+				host.current = el;
+				applyWebProps(el, props.web);
+			};
+			if (_b.a !== _v) _b.a = _v;
+		}
+		{
+			const _v = props.id;
+			if (_b.b !== _v) _b.b = _v;
+		}
+		{
+			const _v = ["vx-pager", props.className];
+			if (_b.c !== _v) _b.c = _v;
+		}
+		_b.d = snapshotSpread(layoutChildProps(props));
+		{
+			const _v = props.accessibilityRole ?? "group";
+			if (_b.e !== _v) _b.e = _v;
+		}
+		{
+			const _v = "carousel";
+			if (_b.f !== _v) _b.f = _v;
+		}
+		{
+			const _v = props.accessibilityLabel;
+			if (_b.g !== _v) _b.g = _v;
+		}
+		{
+			const _v = props.accessible === false ? true : void 0;
+			if (_b.h !== _v) _b.h = _v;
+		}
+		{
+			const _v = props.accessibilityHint;
+			if (_b.i !== _v) _b.i = _v;
+		}
+		{
+			const _v = props.accessibilityValue;
+			if (_b.j !== _v) _b.j = _v;
+		}
+		{
+			const _v = props.accessibilityState?.disabled;
+			if (_b.k !== _v) _b.k = _v;
+		}
+		{
+			const _v = props.accessibilityState?.selected;
+			if (_b.l !== _v) _b.l = _v;
+		}
+		{
+			const _v = props.accessibilityState?.checked;
+			if (_b.m !== _v) _b.m = _v;
+		}
+		{
+			const _v = props.accessibilityLiveRegion === "none" ? "off" : props.accessibilityLiveRegion;
+			if (_b.n !== _v) _b.n = _v;
+		}
+		_b.p = bindSignalHostPropSources(__s, _b.p, _b.o, [
+			[
+				false,
+				"ref",
+				_b.a
+			],
+			[
+				false,
+				"id",
+				_b.b
+			],
+			[
+				false,
+				"className",
+				_b.c
+			],
+			[true, _b.d],
+			[
+				false,
+				"role",
+				_b.e
+			],
+			[
+				false,
+				"aria-roledescription",
+				_b.f
+			],
+			[
+				false,
+				"aria-label",
+				_b.g
+			],
+			[
+				false,
+				"aria-hidden",
+				_b.h
+			],
+			[
+				false,
+				"aria-description",
+				_b.i
+			],
+			[
+				false,
+				"aria-valuetext",
+				_b.j
+			],
+			[
+				false,
+				"aria-disabled",
+				_b.k
+			],
+			[
+				false,
+				"aria-selected",
+				_b.l
+			],
+			[
+				false,
+				"aria-checked",
+				_b.m
+			],
+			[
+				false,
+				"aria-live",
+				_b.n
+			]
+		], "b:452923c1", true);
+	}
+	forBlock(__s, 1, _b.o, props.items, _key$1, __item$2, 50, [props], null, _b.q, true, "f3hircj");
+}
+function __else$6(__props, __s, __extra) {
+	const __block = __s.block;
+	const props = __extra[1];
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1;
+		const _root = clone(_t$2);
+		_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, props.renderEmpty?.(), "b:8f0f2972", _b.b, true, void 0, true, void 0);
+}
+var Pager = function Pager(props, __s, __extra) {
+	const __block = __s.block;
+	const host = useRef(null, _hs$ + 0);
+	const latest = useRef(props, _hs$ + 1);
+	const current = useRef(props.page ?? props.defaultPage ?? 0, _hs$ + 2);
+	const settle = useRef(null, _hs$ + 3);
+	useEffect(() => {
+		latest.current = props;
+	}, [props], _hs$ + 4);
+	useEffect(() => {
+		const el = host.current;
+		if (!el) return;
+		const onScroll = () => {
+			if (settle.current !== null) clearTimeout(settle.current);
+			settle.current = setTimeout(() => {
+				settle.current = null;
+				const el2 = host.current;
+				if (!el2 || el2.clientWidth === 0) return;
+				const max = Math.max(latest.current.items.length - 1, 0);
+				const next = Math.max(0, Math.min(max, Math.round(el2.scrollLeft / el2.clientWidth)));
+				if (next !== current.current) {
+					current.current = next;
+					latest.current.onPageChange?.(next);
+				}
+			}, 90);
+		};
+		el.addEventListener("scroll", onScroll, { passive: true });
+		return () => {
+			el.removeEventListener("scroll", onScroll);
+			if (settle.current !== null) clearTimeout(settle.current);
+		};
+	}, [], _hs$ + 5);
+	useEffect(() => {
+		const el = host.current;
+		if (!el || current.current <= 0) return;
+		el.scrollLeft = current.current * el.clientWidth;
+	}, [], _hs$ + 6);
+	useEffect(() => {
+		const el = host.current;
+		if (!el || props.page === void 0 || props.page === current.current) return;
+		current.current = props.page;
+		el.scrollTo({
+			left: props.page * el.clientWidth,
+			behavior: "smooth"
+		});
+	}, [props.page], _hs$ + 7);
+	ifBlock(__s, 0, __block.parentNode, props.items.length > 0, __then$0, __else$6, __block.endMarker, [host, props]);
+};
+//#endregion
+export { Pager };

package/dist/web/Pagination.web.tsrx.js

@@ -0,0 +1,80 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { __s, bag15, child, clone, createElement, createScopedElement, delegateEvents, evt1, evt1u, queueRefAttach, queueRefDetach, setAriaAttribute, setStyle, sibling, template } from "octane";
+import { bindSignalAttribute, bindSignalChild, enableSignalBindings, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/Pagination.web.tsrx
+enableSignalBindings(1, true);
+delegateEvents(["click"]);
+var _t$0 = /* @__PURE__ */ template("<nav><span class=\"vx-page-btn\" role=\"button\" tabindex=\"0\">‹</span><!><span class=\"vx-page-btn\" role=\"button\" tabindex=\"0\">›</span></nav>");
+var _rm$1 = [
+	"r",
+	"b",
+	"a"
+];
+var Pagination = /* @__PURE__ */ __s(function Pagination(props, __s, __extra) {
+	const sibling$1 = props.siblingCount ?? 1;
+	const count = Math.max(0, props.pageCount);
+	const current = Math.min(Math.max(1, props.page), Math.max(1, count));
+	const pages = [];
+	for (let p = 1; p <= count; p++) if (p === 1 || p === count || Math.abs(p - current) <= sibling$1) pages.push(p);
+	else if (pages[pages.length - 1] !== "…") pages.push("…");
+	const go = (p) => {
+		if (props.disabled || p < 1 || p > count || p === current) return;
+		props.onPageChange?.(p);
+	};
+	if (__s.block.pending && !__s.block.crossRenderUpdate) return;
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m7, _m8, _m10, _m11, _m12;
+		const _root = clone(_t$0);
+		queueRefAttach(__s, _m1 = (e) => applyEscapeProps(e, props), _m0 = _root);
+		(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.b, _b.a));
+		const _el0 = child(_root);
+		_m7 = _el0;
+		_m8 = evt1(_el0, "$$click", go, current - 1);
+		const _el1 = sibling(_el0, 2);
+		_m10 = _el1;
+		_m11 = evt1(_el1, "$$click", go, current + 1);
+		_m12 = sibling(_el0, 1);
+		_b = bag15(__s, _root, _m0, _m1, void 0, void 0, void 0, void 0, void 0, _m7, _m8, void 0, _m10, _m11, _m12, 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);
+		}
+		evt1u(_b.i, go, current - 1);
+		evt1u(_b.l, go, current + 1);
+	}
+	_b.c = bindSignalAttribute(__s, _b.c, _b.a, "id", props.id, "b:8d0d2330", setPlainAttribute);
+	_b.d = updateFreshClassName([
+		"vx-pagination",
+		props.disabled ? "vx-pagination--disabled" : void 0,
+		props.className
+	], _b.d, _b.a);
+	{
+		const _v = props.style;
+		if (_b.e !== _v) {
+			setStyle(_b.a, _v, _b.e);
+			_b.e = _v;
+		}
+	}
+	_b.f = bindSignalAttribute(__s, _b.f, _b.a, "aria-label", props.accessibilityLabel ?? "Pagination", "b:155f52a7", setAriaAttribute);
+	_b.g = bindSignalAttribute(__s, _b.g, _b.h, "aria-disabled", current <= 1 || props.disabled || void 0, "b:0e233a25", setAriaAttribute);
+	_b.j = bindSignalAttribute(__s, _b.j, _b.k, "aria-disabled", current >= count || props.disabled || void 0, "b:a5ed4796", setAriaAttribute);
+	_b.p = bindSignalChild(__s, _b.p, 1, _b.a, pages.map((p, i) => p === "…" ? createElement("span", {
+		key: "e" + i,
+		className: "vx-page-ellipsis"
+	}, "…") : createScopedElement("span", {
+		key: p,
+		className: ["vx-page-btn", p === current ? "vx-page-btn--on" : void 0],
+		role: "button",
+		"aria-current": p === current ? "page" : void 0,
+		tabIndex: 0,
+		onClick: () => go(p),
+		onKeyDown: (e) => {
+			if (e.key === "Enter") go(p);
+		}
+	}, () => p)), "b:98d5a70c", _b.m, true, void 0, void 0, void 0);
+});
+//#endregion
+export { Pagination };

package/dist/web/PinInput.web.tsrx.js

@@ -0,0 +1,72 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { TextInput } from "./TextInput.web.tsrx.js";
+import { __s, bag7, clone, createScopedValue, hookSlots, queueRefAttach, queueRefDetach, setStyle, template, useState } from "octane";
+import { bindSignalAttribute, bindSignalChild, createElementFromConfig, enableSignalBindings, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/PinInput.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<div role=\"group\"></div>");
+var _hs$ = /* @__PURE__ */ hookSlots(1);
+var _rm$1 = [
+	"r",
+	"b",
+	"a"
+];
+var PinInput = /* @__PURE__ */ __s(function PinInput(props, __s, __extra) {
+	const length = props.length ?? 4;
+	const [internal, setInternal] = useState("", _hs$ + 0);
+	const controlled = props.value !== void 0;
+	const value = controlled ? props.value : internal;
+	const handles = [];
+	const setValue = (next) => {
+		const clipped = next.slice(0, length);
+		if (!controlled) setInternal(clipped);
+		props.onValueChange?.(clipped);
+		if (clipped.length === length) props.onComplete?.(clipped);
+	};
+	const cellValue = (i) => value[i] ?? "";
+	const enter = (i, text) => {
+		const ch = text.slice(-1);
+		const next = (value.slice(0, i) + ch + value.slice(i + 1)).slice(0, length);
+		setValue(next);
+		if (ch && i < length - 1) handles[i + 1]?.focus();
+	};
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1;
+		const _root = clone(_t$0);
+		queueRefAttach(__s, _m1 = (e) => applyEscapeProps(e, props), _m0 = _root);
+		(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.b, _b.a));
+		_b = bag7(__s, _root, _m0, _m1, void 0, void 0, void 0, 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:0821d08b", setPlainAttribute);
+	_b.d = updateFreshClassName([
+		"vx-pininput",
+		props.disabled ? "vx-pininput--disabled" : void 0,
+		props.className
+	], _b.d, _b.a);
+	{
+		const _v = props.style;
+		if (_b.e !== _v) {
+			setStyle(_b.a, _v, _b.e);
+			_b.e = _v;
+		}
+	}
+	_b.h = bindSignalChild(__s, _b.h, 1, _b.a, Array.from({ length }, (_, i) => createScopedValue(() => createElementFromConfig("c:5e39db67", TextInput, {
+		key: i,
+		className: "vx-pininput-cell",
+		keyboardType: "number",
+		secure: props.secure,
+		editable: !props.disabled,
+		value: cellValue(i),
+		onChange: (text) => enter(i, text),
+		bind: (h) => {
+			handles[i] = h;
+		}
+	}))), "b:308dacfa", null, void 0, void 0, void 0, true);
+});
+//#endregion
+export { PinInput };

package/dist/web/{ui33.js → Popover.web.tsrx.js}

@@ -1,6 +1,6 @@
-import { cx } from "./ui28.js";
-import { useThemeScheme } from "./ui29.js";
-import { positionPopover } from "./ui32.js";
+import { cx } from "./cx.js";
+import { useThemeScheme } from "./theme/theme-scheme.js";
+import { positionPopover } from "./popover-position.js";
 import { bag4, child, clone, componentSlotVoid, createElement, createPortal, createScopedElement, createScopedValue, drainFrag, hookSlots, ifBlock, positionalChildren, template, useEffect, useRef, useState, withSlot } from "octane";
 import { compilerMemoRegion, hookMemoCreate, hookMemoPublishInvariant, textHoleUpdate } from "octane/internal/client";
 //#region src/Popover.web.tsrx