@joewinke/jatui 0.2.25 → 0.2.27

package/dist/meet/ControlBar.svelte

@@ -26,6 +26,13 @@
 		controls?: MeetLocalControls;
 		/** Host-action callbacks. */
 		hostActions?: MeetHostActions;
+		/**
+		 * Live input level of the local microphone, 0–1. When provided (and the
+		 * mic is unmuted) the mic button renders a small 3-bar meter under the
+		 * icon so the user can SEE that their voice is being picked up — the
+		 * camera gives that feedback for free, the mic never did. Omit to hide.
+		 */
+		micLevel?: number;
 		class?: string;
 	}
 
@@ -36,9 +43,19 @@
 		allowScreenShare = true,
 		controls = {},
 		hostActions = {},
+		micLevel,
 		class: className = ''
 	}: Props = $props();
 
+	// Perceptual boost: raw RMS of speech sits low (~0.05–0.3); sqrt spreads
+	// the useful range across the meter. Each bar lights past its threshold.
+	const meterLevel = $derived(Math.sqrt(Math.min(1, Math.max(0, micLevel ?? 0))));
+	const barActive = $derived([
+		meterLevel > 0.15,
+		meterLevel > 0.4,
+		meterLevel > 0.65
+	]);
+
 	const recording = $derived(room.recording ?? false);
 	const locked = $derived(room.locked ?? false);
 </script>
@@ -52,7 +69,7 @@
 	<!-- Mic -->
 	<button
 		type="button"
-		class="btn btn-circle"
+		class="btn btn-circle relative"
 		class:btn-error={local.micMuted}
 		class:btn-ghost={!local.micMuted}
 		aria-pressed={local.micMuted}
@@ -67,6 +84,17 @@
 			<svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
 				<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11a7 7 0 01-14 0m7 7v3m0-3a4 4 0 004-4V5a4 4 0 00-8 0v6a4 4 0 004 4z" />
 			</svg>
+			{#if micLevel !== undefined}
+				<span class="jatui-mic-meter" aria-hidden="true">
+					{#each barActive as active, i (i)}
+						<span
+							class="jatui-mic-meter-bar"
+							class:is-active={active}
+							style="height: {0.2 + i * 0.125}rem"
+						></span>
+					{/each}
+				</span>
+			{/if}
 		{/if}
 	</button>
 
@@ -174,3 +202,27 @@
 		<span class="hidden sm:inline">Leave</span>
 	</button>
 </div>
+
+<style>
+	/* Mic level meter — 3 tiny bars docked bottom-center of the mic button.
+	   Color/motion stay subtle: base-content at rest, success when lit. */
+	.jatui-mic-meter {
+		position: absolute;
+		bottom: 0.3rem;
+		left: 50%;
+		transform: translateX(-50%);
+		display: inline-flex;
+		align-items: flex-end;
+		gap: 2px;
+		pointer-events: none;
+	}
+	.jatui-mic-meter-bar {
+		width: 3px;
+		border-radius: 1px;
+		background: color-mix(in oklch, var(--color-base-content) 25%, transparent);
+		transition: background var(--motion-fast, 150ms) ease;
+	}
+	.jatui-mic-meter-bar.is-active {
+		background: var(--color-success);
+	}
+</style>

package/dist/meet/ControlBar.svelte.d.ts

@@ -24,6 +24,13 @@ interface Props {
     controls?: MeetLocalControls;
     /** Host-action callbacks. */
     hostActions?: MeetHostActions;
+    /**
+     * Live input level of the local microphone, 0–1. When provided (and the
+     * mic is unmuted) the mic button renders a small 3-bar meter under the
+     * icon so the user can SEE that their voice is being picked up — the
+     * camera gives that feedback for free, the mic never did. Omit to hide.
+     */
+    micLevel?: number;
     class?: string;
 }
 declare const ControlBar: import("svelte").Component<Props, {}, "">;

package/dist/meet/PreJoinLobby.svelte

@@ -12,6 +12,7 @@
 	 * haven't installed the peer. Media preview is stopped on unmount and before
 	 * join (the room re-acquires tracks).
 	 */
+	import { untrack } from 'svelte';
 	import type { Snippet } from 'svelte';
 	import type { PreJoinResult } from './types.js';
 
@@ -175,7 +176,12 @@
 		void videoDeviceId;
 		void audioDeviceId;
 		void videoEl;
-		acquire();
+		// untrack is load-bearing: acquire() synchronously calls stopStream(),
+		// which READS `stream` — without untrack the effect silently depends on
+		// `stream`, so the `stream = next` assignment re-runs the effect, whose
+		// cleanup stops the just-acquired stream and re-acquires, forever. The
+		// observable symptom was a preview that never survived acquisition.
+		untrack(() => acquire());
 		return () => stopStream();
 	});
 

package/dist/meet/PreJoinLobby.svelte.d.ts

@@ -1,16 +1,3 @@
-/**
-     * PreJoinLobby — the device check before joining.
-     *
-     * Camera/mic self-preview, display-name confirm, per-device pickers, and an
-     * optional consent gate (checkbox slot; recording/telehealth contexts). On
-     * "Join" it emits a {@link PreJoinResult} the route uses to exchange the join
-     * token for a LiveKit JWT and connect.
-     *
-     * Uses only browser-native `getUserMedia`/`enumerateDevices` — NO
-     * livekit-client dependency, so the lobby renders in demos and in apps that
-     * haven't installed the peer. Media preview is stopped on unmount and before
-     * join (the room re-acquires tracks).
-     */
 import type { Snippet } from 'svelte';
 import type { PreJoinResult } from './types.js';
 interface Props {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@joewinke/jatui",
-  "version": "0.2.25",
+  "version": "0.2.27",
   "private": false,
   "description": "Shared Svelte 5 component library for JAT projects",
   "type": "module",