@octane-xplat/ui 0.9.0 → 0.10.0

package/dist/web/Carousel.web.tsrx.js

@@ -0,0 +1,189 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { spacingStep } from "./spacing.js";
+import { Pressable } from "./Pressable.web.tsrx.js";
+import { Icon } from "./Icon.web.tsrx.js";
+import { cx } from "./cx.js";
+import { mapChildren, toChildArray } from "./child-array.js";
+import { Fragment, createElement, createScopedElement, createScopedValue, descriptorChildren, hookSlots, positionalChildren, useEffect, useImperativeHandle, useRef, useState } from "octane";
+import { compilerMemoRegion, createElementFromConfig, hookMemoCreate, hookMemoEqual, hookMemoPublish0, hookMemoPublish1, hookMemoPublish2, hookMemoPublishInvariant } from "octane/internal/client";
+//#region src/Carousel.web.tsrx
+var _hs$ = /* @__PURE__ */ hookSlots(8);
+var EPS = 1;
+var Carousel = descriptorChildren(function CarouselImpl(props, __s, __extra) {
+	const __memoRegion = compilerMemoRegion(__s, _hs$ + 0);
+	let __hk = __memoRegion.hooks;
+	if (__hk === void 0) __memoRegion.hooks = __hk = hookMemoCreate(20);
+	let __hkd0, __hkd1, __hkd0$, __hkd1$, __hkd0$2, __hkd0$3;
+	const items = toChildArray(props.children);
+	const count = items.length;
+	const gapPx = spacingStep(props.gap ?? 2) ?? 8;
+	const scroller = useRef(null, _hs$ + 0);
+	const track = useRef(null, _hs$ + 1);
+	const [canPrev, setCanPrev] = useState(false, _hs$ + 2);
+	const [canNext, setCanNext] = useState(false, _hs$ + 3);
+	const [atStart, setAtStart] = useState(true, _hs$ + 4);
+	const [atEnd, setAtEnd] = useState(false, _hs$ + 5);
+	const loop = props.hasLoop === true;
+	const measure = (__hkd0 = count, __hkd1 = loop, __hk[0] !== true || !hookMemoEqual(__hk[1], __hkd0) || !hookMemoEqual(__hk[2], __hkd1) ? hookMemoPublish2(__hk, 0, () => {
+		const el = scroller.current;
+		if (!el) return;
+		const x = getComputedStyle(el).direction === "rtl" ? -el.scrollLeft : el.scrollLeft;
+		const max = Math.max(0, el.scrollWidth - el.clientWidth);
+		const prev = x > EPS;
+		const next = x < max - EPS;
+		setAtStart(!prev);
+		setAtEnd(!next);
+		setCanPrev(loop ? count > 1 : prev);
+		setCanNext(loop ? count > 1 : next);
+	}, __hkd0, __hkd1) : __hk[3]);
+	const slideOffsets = __hk[4] !== true ? hookMemoPublish0(__hk, 4, () => {
+		const t = track.current;
+		if (!t) return [];
+		return Array.from(t.children).map((c) => c.offsetLeft - t.offsetLeft);
+	}) : __hk[5];
+	const reduced = __hk[6] ?? hookMemoPublishInvariant(__hk, 6, () => typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches);
+	const behavior = __hk[7] ?? hookMemoPublishInvariant(__hk, 7, () => reduced() ? "auto" : "smooth");
+	const isRtl = __hk[8] ?? hookMemoPublishInvariant(__hk, 8, () => scroller.current != null && getComputedStyle(scroller.current).direction === "rtl");
+	const scrollToIndex = (__hkd0$ = count, __hkd1$ = slideOffsets, __hk[9] !== true || !hookMemoEqual(__hk[10], __hkd0$) || !hookMemoEqual(__hk[11], __hkd1$) ? hookMemoPublish2(__hk, 9, (i) => {
+		const el = scroller.current;
+		const offsets = slideOffsets();
+		if (!el || !offsets.length) return;
+		const target = offsets[Math.min(Math.max(i, 0), count - 1)] ?? 0;
+		el.scrollTo({
+			left: isRtl() ? -target : target,
+			behavior: behavior()
+		});
+	}, __hkd0$, __hkd1$) : __hk[12]);
+	const scrollNext = (__hkd0$2 = loop, __hk[13] !== true || !hookMemoEqual(__hk[14], __hkd0$2) ? hookMemoPublish1(__hk, 13, () => {
+		const el = scroller.current;
+		if (!el) return;
+		const rtl = isRtl();
+		if ((rtl ? -el.scrollLeft : el.scrollLeft) >= Math.max(0, el.scrollWidth - el.clientWidth) - EPS && loop) {
+			el.scrollTo({
+				left: 0,
+				behavior: behavior()
+			});
+			return;
+		}
+		el.scrollBy({
+			left: (rtl ? -1 : 1) * el.clientWidth,
+			behavior: behavior()
+		});
+	}, __hkd0$2) : __hk[15]);
+	const scrollPrev = (__hkd0$3 = loop, __hk[16] !== true || !hookMemoEqual(__hk[17], __hkd0$3) ? hookMemoPublish1(__hk, 16, () => {
+		const el = scroller.current;
+		if (!el) return;
+		const rtl = isRtl();
+		const x = rtl ? -el.scrollLeft : el.scrollLeft;
+		const max = Math.max(0, el.scrollWidth - el.clientWidth);
+		if (x <= EPS && loop) {
+			el.scrollTo({
+				left: rtl ? -max : max,
+				behavior: behavior()
+			});
+			return;
+		}
+		el.scrollBy({
+			left: (rtl ? 1 : -1) * el.clientWidth,
+			behavior: behavior()
+		});
+	}, __hkd0$3) : __hk[18]);
+	const handle = {
+		scrollNext,
+		scrollPrev,
+		scrollTo: scrollToIndex,
+		canScrollNext: () => {
+			const el = scroller.current;
+			if (!el) return false;
+			if (loop) return count > 1;
+			return (isRtl() ? -el.scrollLeft : el.scrollLeft) < Math.max(0, el.scrollWidth - el.clientWidth) - EPS;
+		},
+		canScrollPrev: () => {
+			const el = scroller.current;
+			if (!el) return false;
+			if (loop) return count > 1;
+			return (isRtl() ? -el.scrollLeft : el.scrollLeft) > EPS;
+		}
+	};
+	useImperativeHandle(props.ref, () => handle, void 0, _hs$ + 6);
+	useEffect(() => {
+		measure();
+		const el = scroller.current;
+		if (!el) return;
+		el.addEventListener("scroll", measure, { passive: true });
+		const ro = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(measure);
+		ro?.observe(el);
+		if (track.current) ro?.observe(track.current);
+		return () => {
+			el.removeEventListener("scroll", measure);
+			ro?.disconnect();
+		};
+	}, [count, measure], _hs$ + 7);
+	const onWheel = __hk[19] ?? hookMemoPublishInvariant(__hk, 19, (event) => {
+		const el = scroller.current;
+		if (!el || !event.shiftKey || el.scrollWidth <= el.clientWidth) return;
+		event.preventDefault();
+		el.scrollLeft += (event.deltaY || event.deltaX) * (isRtl() ? -1 : 1);
+	});
+	return createScopedValue(() => createScopedElement("div", {
+		className: cx("vx-carousel", props.className),
+		style: props.style,
+		id: props.id,
+		role: "region",
+		"aria-roledescription": "carousel",
+		"aria-label": props.accessibilityLabel ?? props.label,
+		"aria-hidden": props.accessible === false ? true : void 0,
+		ref: (el) => applyEscapeProps(el, props)
+	}, () => positionalChildren([
+		props.hasEdgeFade && atStart === false && createElement("div", {
+			className: "vx-carousel-fade vx-carousel-fade-start",
+			"aria-hidden": "true"
+		}),
+		props.hasEdgeFade && atEnd === false && createElement("div", {
+			className: "vx-carousel-fade vx-carousel-fade-end",
+			"aria-hidden": "true"
+		}),
+		createScopedValue(() => createScopedElement("div", {
+			ref: (el) => {
+				scroller.current = el;
+			},
+			className: "vx-carousel-viewport",
+			style: {
+				overflowX: "auto",
+				overflowY: "hidden",
+				scrollSnapType: props.hasSnap ? "x mandatory" : void 0,
+				scrollbarWidth: "none"
+			},
+			onWheel
+		}, () => createScopedValue(() => createScopedElement("div", {
+			ref: track,
+			className: "vx-carousel-track",
+			style: {
+				display: "flex",
+				gap: `${gapPx}px`
+			}
+		}, () => mapChildren(items, (child, i) => createScopedValue(() => createScopedElement("div", {
+			className: cx("vx-carousel-slide", props.variant === "proportional" && "vx-carousel-slide--prop"),
+			role: "group",
+			"aria-roledescription": "slide",
+			"aria-label": `Slide ${i + 1} of ${count}`,
+			style: {
+				scrollSnapAlign: props.hasSnap ? "start" : void 0,
+				flex: props.variant === "proportional" ? "1 0 100%" : "0 0 auto"
+			}
+		}, () => child))))))),
+		props.hasButtons && createScopedElement(Fragment, {}, () => positionalChildren([createScopedValue(() => createScopedElement(Pressable, {
+			className: "vx-carousel-btn vx-carousel-prev",
+			accessibilityLabel: "Previous",
+			disabled: !canPrev,
+			onPress: scrollPrev
+		}, () => createElementFromConfig("c:4408f25e", Icon, { name: "xplat-chevron-left" }), "c:05fb2635")), createScopedValue(() => createScopedElement(Pressable, {
+			className: "vx-carousel-btn vx-carousel-next",
+			accessibilityLabel: "Next",
+			disabled: !canNext,
+			onPress: scrollNext
+		}, () => createElementFromConfig("c:36e28420", Icon, { name: "xplat-chevron-right" }), "c:be5cc469"))]))
+	])));
+});
+//#endregion
+export { Carousel };

package/dist/web/Center.web.tsrx.js

@@ -0,0 +1,86 @@
+import { refList } from "./ref-list.js";
+import { applyEscapeProps } from "./escape-props.web.js";
+import { applyWebProps } from "./platformProps.web.js";
+import { spacingPx } from "./stack-layout.js";
+import { __s, bag16, clone, hookSlots, queueRefAttach, queueRefDetach, setAriaAttribute, setStyle, template } from "octane";
+import { bindSignalAttribute, bindSignalChild, compilerMemoRegion, enableSignalBindings, hookMemoCreate, hookMemoEqual, hookMemoPublish4, hookMemoPublishInvariant, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/Center.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<div></div>");
+var _rm$1 = [
+	"r",
+	"c",
+	"b"
+];
+var _hs$ = /* @__PURE__ */ hookSlots(1);
+var Center = /* @__PURE__ */ __s(function Center(props, __s, __extra) {
+	const __memoRegion = compilerMemoRegion(__s, _hs$ + 0);
+	let __hk = __memoRegion.hooks;
+	if (__hk === void 0) __memoRegion.hooks = __hk = hookMemoCreate(7);
+	let __hkd0, __hkd1, __hkd2, __hkd3;
+	const axis = props.axis ?? "both";
+	const pad = __hk[0] ?? hookMemoPublishInvariant(__hk, 0, (v) => v === void 0 ? void 0 : v);
+	const pInlineStart = pad(spacingPx(props.paddingInlineStart ?? props.paddingInline ?? props.padding));
+	const pInlineEnd = pad(spacingPx(props.paddingInlineEnd ?? props.paddingInline ?? props.padding));
+	const pBlockStart = pad(spacingPx(props.paddingBlockStart ?? props.paddingBlock ?? props.padding));
+	const pBlockEnd = pad(spacingPx(props.paddingBlockEnd ?? props.paddingBlock ?? props.padding));
+	const forwardedRef = (__hkd0 = props.ref, __hkd1 = props.ios, __hkd2 = props.android, __hkd3 = props.web, __hk[1] !== true || !hookMemoEqual(__hk[2], __hkd0) || !hookMemoEqual(__hk[3], __hkd1) || !hookMemoEqual(__hk[4], __hkd2) || !hookMemoEqual(__hk[5], __hkd3) ? hookMemoPublish4(__hk, 1, refList((e) => {
+		if (e) {
+			applyEscapeProps(e, props);
+			applyWebProps(e, props.web);
+		}
+	}, props.ref), __hkd0, __hkd1, __hkd2, __hkd3) : __hk[6]);
+	if (__s.block.pending && !__s.block.crossRenderUpdate) return;
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m1, _m2;
+		const _root = clone(_t$0);
+		_m1 = _root;
+		queueRefAttach(__s, _m2 = forwardedRef, _m1);
+		(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.c, _b.b));
+		_b = bag16(__s, _root, void 0, _m1, _m2, void 0, void 0, void 0, void 0, void 0, void 0, void 0, void 0, void 0, void 0, void 0, null, void 0);
+		__s.refFields = _rm$1;
+	} else {
+		const _r = forwardedRef;
+		if (_r !== _b.c) _b.c = replaceRef(__s, _b.c, _r, _b.b);
+	}
+	_b.a = bindSignalAttribute(__s, _b.a, _b.b, "id", props.id, "b:22c98ea4", setPlainAttribute);
+	_b.d = updateFreshClassName([
+		"vx-center",
+		props.isInline ? "vx-center--inline" : void 0,
+		props.className
+	], _b.d, _b.b);
+	{
+		const _v = {
+			display: props.isInline ? "inline-flex" : "flex",
+			flexDirection: "row",
+			justifyContent: axis !== "vertical" ? "center" : void 0,
+			alignItems: axis !== "horizontal" ? "center" : void 0,
+			...pInlineStart !== void 0 ? { paddingInlineStart: pInlineStart } : {},
+			...pInlineEnd !== void 0 ? { paddingInlineEnd: pInlineEnd } : {},
+			...pBlockStart !== void 0 ? { paddingBlockStart: pBlockStart } : {},
+			...pBlockEnd !== void 0 ? { paddingBlockEnd: pBlockEnd } : {},
+			...props.width != null ? { width: props.width } : {},
+			...props.height != null ? { height: props.height } : {},
+			...props.maxWidth != null ? { maxWidth: props.maxWidth } : {},
+			...props.minHeight != null ? { minHeight: props.minHeight } : {},
+			...props.style
+		};
+		if (_b.e !== _v) {
+			setStyle(_b.b, _v, _b.e);
+			_b.e = _v;
+		}
+	}
+	_b.f = bindSignalAttribute(__s, _b.f, _b.b, "role", props.accessibilityRole, "b:c99d6571", setPlainAttribute);
+	_b.g = bindSignalAttribute(__s, _b.g, _b.b, "aria-label", props.accessibilityLabel, "b:e4d010ac", setAriaAttribute);
+	_b.h = bindSignalAttribute(__s, _b.h, _b.b, "aria-hidden", props.accessible === false ? true : void 0, "b:0f365d48", setAriaAttribute);
+	_b.i = bindSignalAttribute(__s, _b.i, _b.b, "aria-description", props.accessibilityHint, "b:e2aff1a4", setAriaAttribute);
+	_b.j = bindSignalAttribute(__s, _b.j, _b.b, "aria-valuetext", props.accessibilityValue, "b:43e007c8", setAriaAttribute);
+	_b.k = bindSignalAttribute(__s, _b.k, _b.b, "aria-disabled", props.accessibilityState?.disabled, "b:e5e5865d", setAriaAttribute);
+	_b.l = bindSignalAttribute(__s, _b.l, _b.b, "aria-selected", props.accessibilityState?.selected, "b:130fcc58", setAriaAttribute);
+	_b.m = bindSignalAttribute(__s, _b.m, _b.b, "aria-checked", props.accessibilityState?.checked, "b:fbb4fa00", setAriaAttribute);
+	_b.n = bindSignalAttribute(__s, _b.n, _b.b, "aria-live", props.accessibilityLiveRegion === "none" ? "off" : props.accessibilityLiveRegion, "b:02372bb7", setAriaAttribute);
+	_b.q = bindSignalChild(__s, _b.q, 1, _b.b, props.children, "b:154632cf", null, void 0, void 0, void 0, true);
+});
+//#endregion
+export { Center };

package/dist/web/ChatComposer.web.tsrx.js

@@ -0,0 +1,193 @@
+import { Icon } from "./Icon.web.tsrx.js";
+import { ChatComposerProvider } from "./chat-context.js";
+import { ChatComposerInput } from "./ChatComposerInput.web.tsrx.js";
+import { ChatSendButton } from "./ChatSendButton.web.tsrx.js";
+import { bag6, bagOf, child, clone, componentSlot, createScopedElement, createScopedValue, delegateEvents, hookSlots, ifBlock, markChildrenBlock, positionalChildren, queueRefAttach, queueRefDetach, setEventHandler, setStyle, sibling, template, useRef, useState } from "octane";
+import { bindSignalAttribute, bindSignalChild, compilerMemoRegion, createElementFromConfig, enableSignalBindings, hookMemoCreate, hookMemoEqual, hookMemoPublish, hookMemoPublish0, hookMemoPublish2, hookMemoPublish3, replaceRef, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/ChatComposer.web.tsrx
+enableSignalBindings(1, true);
+delegateEvents(["click"]);
+var _t$0 = /* @__PURE__ */ template("<div class=\"vx-chatcomposer-header\"><div class=\"vx-chatcomposer-headerleft\"></div><div class=\"vx-chatcomposer-headerright\"></div></div>");
+var _t$1 = /* @__PURE__ */ template("<div><!><!><div><!><div class=\"vx-chatcomposer-inputarea\"></div><div class=\"vx-chatcomposer-footer\"><div class=\"vx-chatcomposer-footerleft\"></div><div><!><!></div></div></div><!></div>");
+var _hs$ = /* @__PURE__ */ hookSlots(3);
+function __then$4(__props, __s, __extra) {
+	const props = __extra[0];
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m3;
+		const _root = clone(_t$0);
+		const _el0 = child(_root);
+		_m0 = _el0;
+		_m3 = sibling(_el0, 1);
+		_b = bag6(__s, _root, _m0, null, void 0, _m3, null, void 0);
+	}
+	_b.g = bindSignalChild(__s, _b.g, 1, _b.a, props.headerActions, "b:51367cc4", null, void 0, void 0, void 0, true);
+	_b.h = bindSignalChild(__s, _b.h, 2, _b.d, props.headerContext, "b:afb3897f", null, void 0, void 0, void 0, true);
+}
+var _rm$13 = [
+	"r",
+	"f",
+	"e"
+];
+var __childrenBody = {};
+var ChatComposer = function ChatComposer(props, __s, __extra) {
+	const __block = __s.block;
+	const __memoRegion = compilerMemoRegion(__s, _hs$ + 0);
+	let __hk = __memoRegion.hooks;
+	if (__hk === void 0) __memoRegion.hooks = __hk = hookMemoCreate(21);
+	let __hkd0, __hkd1, __hkd0$, __hkd1$, __hkd2, __hkd0$2, __hkd1$2, __hkd2$, __hkd3, __hkd4, __hkd5, __hkd6, __hkd7;
+	const placeholder = props.placeholder ?? "Type a message…";
+	const isDisabled = props.isDisabled ?? false;
+	const isStopShown = props.isStopShown ?? false;
+	const density = props.density ?? "balanced";
+	const elevation = props.elevation ?? "low";
+	const statusPosition = props.statusPosition ?? "bottom";
+	const [internalValue, setInternalValue] = useState("", _hs$ + 0);
+	const isControlled = props.value !== void 0;
+	const currentValue = (isControlled ? props.value : internalValue) ?? "";
+	const updateValue = (__hkd0 = isControlled, __hkd1 = props.onChange, __hk[0] !== true || !hookMemoEqual(__hk[1], __hkd0) || !hookMemoEqual(__hk[2], __hkd1) ? hookMemoPublish2(__hk, 0, (next) => {
+		if (!isControlled) setInternalValue(next);
+		props.onChange?.(next);
+	}, __hkd0, __hkd1) : __hk[3]);
+	const handleSubmit = (__hkd0$ = isDisabled, __hkd1$ = props.onSubmit, __hkd2 = updateValue, __hk[4] !== true || !hookMemoEqual(__hk[5], __hkd0$) || !hookMemoEqual(__hk[6], __hkd1$) || !hookMemoEqual(__hk[7], __hkd2) ? hookMemoPublish3(__hk, 4, (value) => {
+		const trimmed = value.trim();
+		if (!trimmed || isDisabled) return;
+		props.onSubmit(trimmed);
+		updateValue("");
+	}, __hkd0$, __hkd1$, __hkd2) : __hk[8]);
+	const canSend = currentValue.trim().length > 0 && !isDisabled;
+	const bodyRef = useRef(null, _hs$ + 1);
+	const inputControlRef = useRef(null, _hs$ + 2);
+	const handleBodyClick = __hk[9] !== true ? hookMemoPublish0(__hk, 9, (e) => {
+		if (e.target.closest?.("button, a, [role=\"button\"], [contenteditable=\"true\"], [data-vx-chat-token]")) return;
+		if (inputControlRef.current) {
+			inputControlRef.current.focus();
+			return;
+		}
+		(bodyRef.current?.querySelector("[contenteditable=\"true\"], textarea"))?.focus();
+	}) : __hk[10];
+	const composerContext = (__hkd0$2 = currentValue, __hkd1$2 = updateValue, __hkd2$ = handleSubmit, __hkd3 = placeholder, __hkd4 = isDisabled, __hkd5 = isStopShown, __hkd6 = canSend, __hkd7 = props.onStop, __hk[11] !== true || !hookMemoEqual(__hk[12], __hkd0$2) || !hookMemoEqual(__hk[13], __hkd1$2) || !hookMemoEqual(__hk[14], __hkd2$) || !hookMemoEqual(__hk[15], __hkd3) || !hookMemoEqual(__hk[16], __hkd4) || !hookMemoEqual(__hk[17], __hkd5) || !hookMemoEqual(__hk[18], __hkd6) || !hookMemoEqual(__hk[19], __hkd7) ? hookMemoPublish(__hk, 11, {
+		value: currentValue,
+		onChange: updateValue,
+		onSubmit: handleSubmit,
+		placeholder,
+		isDisabled,
+		isStopShown,
+		canSend,
+		onStop: props.onStop,
+		inputControlRef
+	}, __hkd0$2, __hkd1$2, __hkd2$, __hkd3, __hkd4, __hkd5, __hkd6, __hkd7) : __hk[20]);
+	const status = props.status;
+	const statusEl = status ? createScopedValue(() => createScopedElement("div", {
+		role: status.type === "error" ? "alert" : "status",
+		className: [
+			"vx-chatcomposer-status",
+			`vx-chatcomposer-status--${status.type}`,
+			`vx-chatcomposer-status--${statusPosition}`
+		]
+	}, () => positionalChildren([createScopedValue(() => createElementFromConfig("c:866e4c47", Icon, {
+		name: status.type === "error" ? "xplat-error" : "xplat-warning",
+		size: 14
+	})), status.message]))) : null;
+	if (__s.block.pending && !__s.block.crossRenderUpdate) return;
+	function __children$1(__props, __s, __extra) {
+		let _b = __s.slots[0];
+		if (_b === void 0) {
+			let _m1, _m4, _m5, _m8, _m9, _m10, _m13, _m16, _m19, _m22, _m25, _m28;
+			const _root = clone(_t$1);
+			_m1 = _root;
+			const _el0 = sibling(child(_root), 2);
+			queueRefAttach(__s, _m5 = bodyRef, _m4 = _el0);
+			(__s.cleanups ??= []).push(() => _b && queueRefDetach(_b.f, _b.e));
+			setEventHandler(_el0, "$$click", handleBodyClick);
+			const _el1 = sibling(child(_el0), 2);
+			const _el2 = sibling(child(_el1), 1);
+			_m8 = _el2;
+			const _el3 = child(_el0);
+			_m9 = _el3;
+			const _el4 = child(_root);
+			_m10 = _el4;
+			_m13 = sibling(_el4, 1);
+			_m16 = sibling(_el3, 1);
+			_m19 = child(_el1);
+			const _el8 = child(_el2);
+			_m22 = _el8;
+			_m25 = sibling(_el8, 1);
+			_m28 = sibling(_el0, 1);
+			_b = bagOf(__s, _root, {
+				a: void 0,
+				b: _m1,
+				c: void 0,
+				d: void 0,
+				e: _m4,
+				f: _m5,
+				g: void 0,
+				h: void 0,
+				i: _m8,
+				j: _m9,
+				k: _m10,
+				l: null,
+				m: void 0,
+				n: _m13,
+				o: null,
+				p: void 0,
+				q: _m16,
+				r: null,
+				s: void 0,
+				t: _m19,
+				u: null,
+				v: void 0,
+				w: _m22,
+				x: null,
+				y: void 0,
+				z: _m25,
+				A: null,
+				B: void 0,
+				C: _m28,
+				D: null,
+				E: void 0
+			});
+			__s.refFields = _rm$13;
+		} else {
+			const _r = bodyRef;
+			if (_r !== _b.f) _b.f = replaceRef(__s, _b.f, _r, _b.e);
+		}
+		_b.a = bindSignalAttribute(__s, _b.a, _b.b, "id", props.id, "b:24d8ec41", setPlainAttribute);
+		_b.c = updateFreshClassName([
+			"vx-chatcomposer",
+			`vx-chatcomposer--${density}`,
+			isDisabled ? "vx-chatcomposer--disabled" : void 0,
+			props.className
+		], _b.c, _b.b);
+		{
+			const _v = props.style;
+			if (_b.d !== _v) {
+				setStyle(_b.b, _v, _b.d);
+				_b.d = _v;
+			}
+		}
+		_b.g = updateFreshClassName([
+			"vx-chatcomposer-body",
+			`vx-chatcomposer-body--${elevation}`,
+			`vx-chatcomposer-body--${density}`
+		], _b.g, _b.e);
+		_b.h = updateFreshClassName(["vx-chatcomposer-footerright", isDisabled && isStopShown ? "vx-chatcomposer-footerright--live" : void 0], _b.h, _b.i);
+		_b.F = bindSignalChild(__s, _b.F, 1, _b.b, statusPosition === "top" ? statusEl : null, "b:c022f742", _b.k, true, void 0, void 0, void 0);
+		_b.G = bindSignalChild(__s, _b.G, 2, _b.b, props.drawer, "b:9a2d112a", _b.n, true, void 0, void 0, void 0);
+		{
+			const __ifCondition = props.headerActions || props.headerContext;
+			ifBlock(__s, 3, _b.e, __ifCondition, __then$4, null, _b.j, __ifCondition ? [props] : void 0);
+		}
+		_b.H = bindSignalChild(__s, _b.H, 4, _b.q, props.input ?? createElementFromConfig("c:0be762af", ChatComposerInput, {}), "b:e0d4518f", null, void 0, void 0, void 0, true);
+		_b.I = bindSignalChild(__s, _b.I, 5, _b.t, props.footerActions, "b:cccbaa2d", null, void 0, void 0, void 0, true);
+		_b.J = bindSignalChild(__s, _b.J, 6, _b.i, props.sendActions, "b:5d917eab", _b.w, true, void 0, void 0, void 0);
+		_b.K = bindSignalChild(__s, _b.K, 7, _b.i, props.sendButton ?? createElementFromConfig("c:de4a56a8", ChatSendButton, {}), "b:cd78eb97", _b.z, true, void 0, void 0, void 0);
+		_b.L = bindSignalChild(__s, _b.L, 8, _b.b, statusPosition === "bottom" ? statusEl : null, "b:4a4ab2fd", _b.C, true, void 0, void 0, void 0);
+	}
+	componentSlot(__s, 0, __block.parentNode, ChatComposerProvider, {
+		"value": composerContext,
+		"children": markChildrenBlock(__children$1, __childrenBody)
+	}, __block.endMarker, void 0, void 0, true, void 0, "c:1d8f3b7a");
+};
+//#endregion
+export { ChatComposer };

package/dist/web/ChatComposerDrawer.web.tsrx.js

@@ -0,0 +1,196 @@
+import { Badge } from "./Badge.web.tsrx.js";
+import { __s, bag13, bag4, bag5, bag9, child, clone, componentSlotVoid, delegateEvents, drainFrag, hookSlots, ifBlock, markChildrenBlock, markDangerouslySetInnerHTMLChildren, setAriaAttribute, setEventHandler, setStyle, sibling, snapshotSpread, template, useId, useState } from "octane";
+import { bindSignalAttribute, bindSignalChild, bindSignalHostPropSources, enableSignalBindings, setAriaAttributeIfChanged, setPlainAttribute, updateFreshClassName } from "octane/internal/client";
+//#region src/ChatComposerDrawer.web.tsrx
+enableSignalBindings(1, true);
+delegateEvents(["click", "keydown"]);
+var _t$0 = /* @__PURE__ */ template("<!>", 0, 1);
+var _t$1 = /* @__PURE__ */ template("<!><span class=\"vx-chatdrawer-label\"></span>", 3, 1);
+var _t$2 = /* @__PURE__ */ template("<div class=\"vx-chatdrawer-toggle\" role=\"button\" tabindex=\"0\"><div aria-hidden=\"true\"><!></div><div></div></div>");
+var _t$3 = /* @__PURE__ */ template("<div><!><div><div class=\"vx-chatdrawer-inner\"></div></div></div>");
+var _hs$ = /* @__PURE__ */ hookSlots(5);
+var __childrenBody = {};
+function __then$1(__props, __s, __extra) {
+	const __block = __s.block;
+	const label = __extra[0];
+	const props = __extra[1];
+	function __children$3(__props, __s, __extra) {
+		const __block = __s.block;
+		let _b = __s.slots[0];
+		if (_b === void 0) {
+			let _m0, _m1;
+			const _root = clone(_t$0);
+			_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.count, "b:87561676", _b.b, true, void 0, true, void 0);
+	}
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m2;
+		const _root = clone(_t$1);
+		_m0 = __block.parentNode;
+		const _el0 = child(_root);
+		_m1 = _el0;
+		_m2 = sibling(_el0, 1);
+		drainFrag(_root, __block.parentNode, __block.endMarker);
+		_b = bag5(__s, null, _m0, _m1, _m2, null, void 0);
+	}
+	componentSlotVoid(__s, 1, _b.a, Badge, {
+		"className": "vx-chatdrawer-badge",
+		"children": markChildrenBlock(__children$3, __childrenBody)
+	}, _b.b, void 0, void 0, void 0, void 0, "c:18a0588b");
+	_b.f = bindSignalChild(__s, _b.f, 2, _b.c, label, "b:71264de8", null, void 0, void 0, void 0, true);
+}
+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$0);
+		_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.collapsedSummary, "b:e85cc2a4", _b.b, true, void 0, true, void 0);
+}
+function __then$0(__props, __s, __extra) {
+	const contentId = __extra[0];
+	const isCollapsed = __extra[1];
+	const label = __extra[2];
+	const props = __extra[3];
+	const toggle = __extra[4];
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m1, _m5, _m7, _m8;
+		const _root = clone(_t$2);
+		_m1 = _root;
+		setEventHandler(_root, "$$click", toggle);
+		setEventHandler(_root, "$$keydown", (e) => {
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				toggle();
+			}
+		});
+		const _el0 = child(_root);
+		_m5 = _el0;
+		_m7 = sibling(_el0, 1);
+		_m8 = child(_el0);
+		_b = bag9(__s, _root, void 0, _m1, void 0, void 0, void 0, _m5, void 0, _m7, _m8);
+	} else {
+		setEventHandler(_b.b, "$$click", toggle);
+		setEventHandler(_b.b, "$$keydown", (e) => {
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				toggle();
+			}
+		});
+	}
+	_b.a = setAriaAttributeIfChanged(!isCollapsed, _b.a, _b.b, "aria-expanded");
+	_b.c = bindSignalAttribute(__s, _b.c, _b.b, "aria-controls", contentId, "b:d84cb06f", setAriaAttribute);
+	_b.d = setAriaAttributeIfChanged(isCollapsed ? `Expand ${label}` : `Collapse ${label}`, _b.d, _b.b, "aria-label");
+	_b.e = updateFreshClassName(["vx-chatdrawer-summary", !isCollapsed ? "vx-chatdrawer-summary--hidden" : void 0], _b.e, _b.f);
+	_b.g = updateFreshClassName(["vx-chatdrawer-handle", isCollapsed ? "vx-chatdrawer-handle--hidden" : void 0], _b.g, _b.h);
+	ifBlock(__s, 1, _b.f, props.collapsedSummary === void 0, __then$1, __else$6, _b.i, [label, props]);
+}
+var _rm$11 = [
+	"s",
+	"i",
+	"h"
+];
+var ChatComposerDrawer = /* @__PURE__ */ __s(function ChatComposerDrawer(props, __s, __extra) {
+	const isControlled = props.isCollapsed !== void 0;
+	const [internalCollapsed, setInternalCollapsed] = useState(props.defaultIsCollapsed ?? false, _hs$ + 0);
+	const isCollapsed = isControlled ? props.isCollapsed : internalCollapsed;
+	const canCollapse = props.count != null;
+	const contentId = useId(_hs$ + 1);
+	const label = props.label ?? "Items";
+	const toggle = () => {
+		const next = !isCollapsed;
+		if (!isControlled) setInternalCollapsed(next);
+		props.onCollapsedChange?.(next);
+	};
+	if (__s.block.pending && !__s.block.crossRenderUpdate) return;
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m1, _m4, _m5, _m6, _m7, _m8, _m9, _m10;
+		const _root = clone(_t$3);
+		_m1 = _root;
+		const _el0 = sibling(child(_root), 1);
+		_m4 = contentId;
+		_m5 = ["vx-chatdrawer-content", canCollapse && isCollapsed ? "vx-chatdrawer-content--collapsed" : void 0];
+		_m6 = snapshotSpread(canCollapse && isCollapsed ? { inert: true } : {});
+		_m7 = _el0;
+		_m8 = bindSignalHostPropSources(__s, void 0, _el0, [
+			[
+				false,
+				"id",
+				_m4
+			],
+			[
+				false,
+				"className",
+				_m5
+			],
+			[true, _m6]
+		], "b:cb085686", true);
+		markDangerouslySetInnerHTMLChildren(_el0);
+		_m9 = child(_root);
+		_m10 = child(_el0);
+		_b = bag13(__s, _root, void 0, _m1, void 0, void 0, _m4, _m5, _m6, _m7, _m8, _m9, _m10, null, void 0);
+		__s.refFields = _rm$11;
+	} else {
+		{
+			const _v = contentId;
+			if (_b.e !== _v) _b.e = _v;
+		}
+		{
+			const _v = ["vx-chatdrawer-content", canCollapse && isCollapsed ? "vx-chatdrawer-content--collapsed" : void 0];
+			if (_b.f !== _v) _b.f = _v;
+		}
+		_b.g = snapshotSpread(canCollapse && isCollapsed ? { inert: true } : {});
+		_b.i = bindSignalHostPropSources(__s, _b.i, _b.h, [
+			[
+				false,
+				"id",
+				_b.e
+			],
+			[
+				false,
+				"className",
+				_b.f
+			],
+			[true, _b.g]
+		], "b:cb085686", true);
+	}
+	_b.a = bindSignalAttribute(__s, _b.a, _b.b, "id", props.id, "b:1e464f12", setPlainAttribute);
+	_b.c = updateFreshClassName([
+		"vx-chatdrawer",
+		isCollapsed ? "vx-chatdrawer--collapsed" : void 0,
+		props.className
+	], _b.c, _b.b);
+	{
+		const _v = props.style;
+		if (_b.d !== _v) {
+			setStyle(_b.b, _v, _b.d);
+			_b.d = _v;
+		}
+	}
+	{
+		const __ifCondition = canCollapse;
+		ifBlock(__s, 1, _b.b, __ifCondition, __then$0, null, _b.j, __ifCondition ? [
+			contentId,
+			isCollapsed,
+			label,
+			props,
+			toggle
+		] : void 0);
+	}
+	_b.n = bindSignalChild(__s, _b.n, 2, _b.k, props.children, "b:97a6192a", null, void 0, void 0, void 0, true);
+});
+//#endregion
+export { ChatComposerDrawer };