@burdenoff/microfe-vibecontrols 2026.528.7 → 2026.528.9

package/dist/pages/tunnels/TunnelsTab.js

@@ -2,51 +2,64 @@ import { useTr as e } from "../../shared/hooks/useTr.js";
 import { ConfirmDialog as t } from "../../components/shared/ConfirmDialog.js";
 import { QuotaExhaustedDialog as n } from "../../components/shared/QuotaExhaustedDialog.js";
 import { getQuotaDialogContent as r, isQuotaExhaustedError as i, markQuotaHandledLocally as a } from "../../utils/quotaUtils.js";
-import { useDeleteTunnelMutation as o, useListTunnelsQuery as s, useStartTunnelMutation as c, useStopTunnelMutation as l } from "../../generated/wspace-operations.js";
-import { PageHeader as u } from "../../components/shared/PageHeader.js";
-import { LoadingState as d } from "../../components/shared/LoadingState.js";
-import { ErrorState as f } from "../../components/shared/ErrorState.js";
-import { EmptyState as p } from "../../components/shared/EmptyState.js";
-import { SearchInput as m } from "../../components/shared/SearchInput.js";
-import { FilterDropdown as h } from "../../components/shared/FilterDropdown.js";
-import { TunnelCard as g } from "../../components/tunnels/TunnelCard.js";
-import { useEffect as _, useMemo as v, useState as y } from "react";
-import { Link as b, useNavigate as x } from "react-router-dom";
-import { motion as S } from "framer-motion";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
+import { useDeleteTunnelMutation as o, useListAgentsQuery as s, useListTunnelsQuery as c, useStartTunnelMutation as l, useStopTunnelMutation as u } from "../../generated/wspace-operations.js";
+import { PageHeader as d } from "../../components/shared/PageHeader.js";
+import { LoadingState as f } from "../../components/shared/LoadingState.js";
+import { ErrorState as p } from "../../components/shared/ErrorState.js";
+import { EmptyState as m } from "../../components/shared/EmptyState.js";
+import { SearchInput as h } from "../../components/shared/SearchInput.js";
+import { FilterDropdown as g } from "../../components/shared/FilterDropdown.js";
+import { TunnelCard as _ } from "../../components/tunnels/TunnelCard.js";
+import { useEffect as v, useMemo as y, useState as b } from "react";
+import { Link as x, useNavigate as S } from "react-router-dom";
+import { motion as C } from "framer-motion";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { Button as E } from "@burdenoff/fe-libs/ui";
 //#region src/pages/tunnels/TunnelsTab.tsx
-var T = 4e3;
-function E() {
-	let E = e(), D = x(), [O, k] = y(""), [A, j] = y("all"), [M, N] = y("all"), [P, F] = y(null), [I, L] = y(!1), [R, z] = y(/* @__PURE__ */ new Set()), { data: B, loading: V, error: H, refetch: U, startPolling: W, stopPolling: G } = s({
+var D = 4e3;
+function O() {
+	let O = e(), k = S(), [A, ee] = b(""), [j, M] = b("all"), [N, P] = b("all"), [F, I] = b(null), [L, R] = b(!1), [z, B] = b(/* @__PURE__ */ new Set()), { data: V, loading: H, error: U, refetch: W, startPolling: G, stopPolling: K } = c({
 		variables: {
-			filter: v(() => {
+			filter: y(() => {
 				let e = {};
-				return A !== "all" && (e.providerKey = A), M !== "all" && (e.status = [M]), O.trim() && (e.search = O.trim()), e;
+				return j !== "all" && (e.providerKey = j), N !== "all" && (e.status = [N]), A.trim() && (e.search = A.trim()), e;
 			}, [
-				A,
-				M,
-				O
+				j,
+				N,
+				A
 			]),
 			pagination: { limit: 50 }
 		},
 		fetchPolicy: "cache-and-network"
-	}), K = B?.tunnels?.items ?? [], q = R.size > 0 || K.some((e) => e.status === "PROVISIONING" || e.status === "DELETING" || e.status === "ACTIVE" && !e.primaryDomain?.hostname);
-	_(() => {
-		q ? W(T) : G();
+	}), { data: q } = s({
+		variables: { pagination: { limit: 1 } },
+		fetchPolicy: "cache-first"
+	}), J = (q?.vibecontrolsAgents?.length ?? 0) > 0, Y = V?.tunnels?.items ?? [], X = (e) => {
+		if (!J) {
+			e.preventDefault();
+			let t = {
+				message: O("vibecontrols.tunnels.list.createAgentFirst", "Create an agent first to use tunnels"),
+				variant: "info"
+			};
+			window.dispatchEvent(new CustomEvent("vibecontrols:toast", { detail: t })), k("/vibecontrols/agents");
+		}
+	}, Z = z.size > 0 || Y.some((e) => e.status === "PROVISIONING" || e.status === "DELETING" || e.status === "ACTIVE" && !e.primaryDomain?.hostname);
+	v(() => {
+		Z ? G(D) : K();
 	}, [
-		q,
-		W,
-		G
+		Z,
+		G,
+		K
 	]);
-	let J = (e) => z((t) => new Set([...t, e])), Y = (e) => z((t) => {
+	let Q = (e) => B((t) => new Set([...t, e])), $ = (e) => B((t) => {
 		let n = new Set(t);
 		return n.delete(e), n;
-	}), [X] = c(), Z = async (e) => {
-		let t = K.find((t) => t.id === e);
+	}), [te] = l(), ne = async (e) => {
+		let t = Y.find((t) => t.id === e);
 		if (t) {
-			J(e);
+			Q(e);
 			try {
-				let n = await X({
+				let n = await te({
 					variables: { id: e },
 					optimisticResponse: { startTunnel: {
 						...t,
@@ -54,19 +67,19 @@ function E() {
 						__typename: "Tunnel"
 					} }
 				});
-				n.error && i(n.error) && (a(), L(!0));
+				n.error && i(n.error) && (a(), R(!0));
 			} catch (e) {
-				i(e) ? (a(), L(!0)) : console.error("[TunnelsTab] startTunnel failed", e);
+				i(e) ? (a(), R(!0)) : console.error("[TunnelsTab] startTunnel failed", e);
 			} finally {
-				Y(e);
+				$(e);
 			}
 		}
-	}, [Q] = l(), $ = async (e) => {
-		let t = K.find((t) => t.id === e);
+	}, [re] = u(), ie = async (e) => {
+		let t = Y.find((t) => t.id === e);
 		if (t) {
-			J(e);
+			Q(e);
 			try {
-				await Q({
+				await re({
 					variables: { id: e },
 					optimisticResponse: { stopTunnel: {
 						...t,
@@ -75,39 +88,43 @@ function E() {
 					} }
 				});
 			} finally {
-				Y(e);
+				$(e);
 			}
 		}
-	}, [ee, { loading: te }] = o({ onCompleted: () => {
-		F(null), U();
+	}, [ae, { loading: oe }] = o({ onCompleted: () => {
+		I(null), W();
 	} });
-	return /* @__PURE__ */ w("div", {
+	return /* @__PURE__ */ T("div", {
 		className: "p-6 max-w-7xl mx-auto",
 		children: [
-			/* @__PURE__ */ C(u, {
-				title: E("vibecontrols.tunnels.list.title", "Tunnels"),
-				description: E("vibecontrols.tunnels.list.description", "Expose local services on *.vibetunnels.com and custom domains."),
-				actions: /* @__PURE__ */ C(b, {
-					to: "/vibecontrols/tunnels/new",
-					className: "inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover transition-colors",
-					children: E("vibecontrols.tunnels.list.newTunnel", "New tunnel")
+			/* @__PURE__ */ w(d, {
+				title: O("vibecontrols.tunnels.list.title", "Tunnels"),
+				description: O("vibecontrols.tunnels.list.description", "Expose local services on *.vibetunnels.com and custom domains."),
+				actions: /* @__PURE__ */ w(E, {
+					variant: "default",
+					asChild: !0,
+					children: /* @__PURE__ */ w(x, {
+						to: "/vibecontrols/tunnels/new",
+						onClick: X,
+						children: O("vibecontrols.tunnels.list.newTunnel", "New tunnel")
+					})
 				})
 			}),
-			/* @__PURE__ */ w("div", {
+			/* @__PURE__ */ T("div", {
 				className: "flex flex-col sm:flex-row gap-3 mb-4",
 				children: [
-					/* @__PURE__ */ C("div", {
+					/* @__PURE__ */ w("div", {
 						className: "flex-1",
-						children: /* @__PURE__ */ C(m, {
-							value: O,
-							onChange: k,
+						children: /* @__PURE__ */ w(h, {
+							value: A,
+							onChange: ee,
 							placeholder: "Search tunnels by name or slug"
 						})
 					}),
-					/* @__PURE__ */ C(h, {
+					/* @__PURE__ */ w(g, {
 						label: "Provider",
-						value: A,
-						onChange: j,
+						value: j,
+						onChange: M,
 						options: [
 							{
 								value: "all",
@@ -123,10 +140,10 @@ function E() {
 							}
 						]
 					}),
-					/* @__PURE__ */ C(h, {
+					/* @__PURE__ */ w(g, {
 						label: "Status",
-						value: M,
-						onChange: N,
+						value: N,
+						onChange: P,
 						options: [
 							{
 								value: "all",
@@ -156,55 +173,63 @@ function E() {
 					})
 				]
 			}),
-			V && !B && /* @__PURE__ */ C(d, { message: "Loading tunnels" }),
-			H && /* @__PURE__ */ C(f, {
+			H && !V && /* @__PURE__ */ w(f, { message: "Loading tunnels" }),
+			U && /* @__PURE__ */ w(p, {
 				title: "Failed to load tunnels",
-				message: H.message,
-				onRetry: () => U()
+				message: U.message,
+				onRetry: () => W()
+			}),
+			V && Y.length === 0 && !J && /* @__PURE__ */ w(m, {
+				title: O("vibecontrols.tunnels.list.noAgentTitle", "Create an agent first"),
+				description: O("vibecontrols.tunnels.list.noAgentDescription", "Tunnels need a VibeControls agent to forward traffic. Install + register an agent, then come back to create your first tunnel."),
+				action: /* @__PURE__ */ w(E, {
+					variant: "default",
+					onClick: () => k("/vibecontrols/agents"),
+					children: O("vibecontrols.tunnels.list.setupAgent", "Set up an agent")
+				})
 			}),
-			B && K.length === 0 && /* @__PURE__ */ C(p, {
-				title: E("vibecontrols.tunnels.list.emptyTitle", "No tunnels yet"),
-				description: E("vibecontrols.tunnels.list.emptyDescription", "Create your first tunnel to expose a local service."),
-				action: /* @__PURE__ */ C("button", {
-					type: "button",
-					onClick: () => D("/vibecontrols/tunnels/new"),
-					className: "inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover transition-colors",
-					children: E("vibecontrols.tunnels.list.createTunnel", "Create tunnel")
+			V && Y.length === 0 && J && /* @__PURE__ */ w(m, {
+				title: O("vibecontrols.tunnels.list.emptyTitle", "No tunnels yet"),
+				description: O("vibecontrols.tunnels.list.emptyDescription", "Create your first tunnel to expose a local service."),
+				action: /* @__PURE__ */ w(E, {
+					variant: "default",
+					onClick: () => k("/vibecontrols/tunnels/new"),
+					children: O("vibecontrols.tunnels.list.createTunnel", "Create tunnel")
 				})
 			}),
-			K.length > 0 && /* @__PURE__ */ C(S.div, {
+			Y.length > 0 && /* @__PURE__ */ w(C.div, {
 				initial: { opacity: 0 },
 				animate: { opacity: 1 },
 				className: "space-y-3",
-				children: K.map((e) => /* @__PURE__ */ C(g, {
+				children: Y.map((e) => /* @__PURE__ */ w(_, {
 					tunnel: e,
-					isPending: R.has(e.id),
-					onOpen: (e) => D(`/vibecontrols/tunnels/${e}`),
-					onStart: (e) => void Z(e),
-					onStop: (e) => void $(e),
-					onDelete: (e, t) => F({
+					isPending: z.has(e.id),
+					onOpen: (e) => k(`/vibecontrols/tunnels/${e}`),
+					onStart: (e) => void ne(e),
+					onStop: (e) => void ie(e),
+					onDelete: (e, t) => I({
 						id: e,
 						name: t
 					})
 				}, e.id))
 			}),
-			/* @__PURE__ */ C(t, {
-				isOpen: P !== null,
-				onClose: () => F(null),
+			/* @__PURE__ */ w(t, {
+				isOpen: F !== null,
+				onClose: () => I(null),
 				onConfirm: () => {
-					P && ee({ variables: { id: P.id } });
+					F && ae({ variables: { id: F.id } });
 				},
 				title: "Delete tunnel",
-				message: P ? `Delete "${P.name}"? This will stop the tunnel and remove all its sessions and domains.` : "",
+				message: F ? `Delete "${F.name}"? This will stop the tunnel and remove all its sessions and domains.` : "",
 				confirmLabel: "Delete",
 				variant: "danger",
-				isLoading: te
+				isLoading: oe
 			}),
-			/* @__PURE__ */ C(n, {
-				isOpen: I,
-				onClose: () => L(!1),
+			/* @__PURE__ */ w(n, {
+				isOpen: L,
+				onClose: () => R(!1),
 				onConfirm: () => {
-					L(!1), D("/billing");
+					R(!1), k("/billing");
 				},
 				...r("tunnel-start")
 			})
@@ -212,6 +237,6 @@ function E() {
 	});
 }
 //#endregion
-export { E as TunnelsTab };
+export { O as TunnelsTab };
 
 //# sourceMappingURL=TunnelsTab.js.map

package/dist/pages/tunnels/TunnelsTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"TunnelsTab.js","names":[],"sources":["../../../src/pages/tunnels/TunnelsTab.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport { Link, useNavigate } from 'react-router-dom';\nimport { motion } from 'framer-motion';\n\nimport { PageHeader } from '@/components/shared/PageHeader';\nimport { SearchInput } from '@/components/shared/SearchInput';\nimport { FilterDropdown } from '@/components/shared/FilterDropdown';\nimport { ConfirmDialog } from '@/components/shared/ConfirmDialog';\nimport { QuotaExhaustedDialog } from '@/components/shared/QuotaExhaustedDialog';\nimport { EmptyState } from '@/components/shared/EmptyState';\nimport { LoadingState } from '@/components/shared/LoadingState';\nimport { ErrorState } from '@/components/shared/ErrorState';\nimport { TunnelCard } from '@/components/tunnels/TunnelCard';\nimport type { TunnelStatus, TunnelProviderKey } from '@/generated/wspace-types';\nimport { useTr } from '../../shared/hooks/useTr';\nimport {\n  useListTunnelsQuery,\n  useStartTunnelMutation,\n  useStopTunnelMutation,\n  useDeleteTunnelMutation,\n  type ListTunnelsQuery,\n} from '@/generated/wspace-operations';\nimport {\n  isQuotaExhaustedError,\n  markQuotaHandledLocally,\n  getQuotaDialogContent,\n} from '@/utils/quotaUtils';\n\ntype TunnelRow = NonNullable<ListTunnelsQuery['tunnels']>['items'][number];\n\nconst TRANSITION_POLL_MS = 4000;\n\nexport function TunnelsTab() {\n  const tr = useTr();\n  const navigate = useNavigate();\n  const [search, setSearch] = useState('');\n  const [providerFilter, setProviderFilter] = useState<string>('all');\n  const [statusFilter, setStatusFilter] = useState<string>('all');\n  const [pendingDelete, setPendingDelete] = useState<{ id: string; name: string } | null>(null);\n  const [showQuotaExhausted, setShowQuotaExhausted] = useState(false);\n  const [pendingIds, setPendingIds] = useState<Set<string>>(new Set());\n\n  const filter = useMemo(() => {\n    const f: Record<string, unknown> = {};\n    if (providerFilter !== 'all') {\n      f.providerKey = providerFilter as TunnelProviderKey;\n    }\n    if (statusFilter !== 'all') {\n      f.status = [statusFilter as TunnelStatus];\n    }\n    if (search.trim()) {\n      f.search = search.trim();\n    }\n    return f;\n  }, [providerFilter, statusFilter, search]);\n\n  const { data, loading, error, refetch, startPolling, stopPolling } = useListTunnelsQuery({\n    variables: { filter, pagination: { limit: 50 } },\n    fetchPolicy: 'cache-and-network',\n  });\n\n  const tunnels: TunnelRow[] = data?.tunnels?.items ?? [];\n\n  // Poll while any tunnel is in a transient state OR is ACTIVE but has no\n  // domain yet (Cloudflare assigns the URL ~5-15 s after start returns).\n  const needsPoll =\n    pendingIds.size > 0 ||\n    tunnels.some(\n      (t) =>\n        t.status === 'PROVISIONING' ||\n        t.status === 'DELETING' ||\n        (t.status === 'ACTIVE' && !t.primaryDomain?.hostname)\n    );\n  useEffect(() => {\n    if (needsPoll) {\n      startPolling(TRANSITION_POLL_MS);\n    } else {\n      stopPolling();\n    }\n  }, [needsPoll, startPolling, stopPolling]);\n\n  const addPending = (id: string) => setPendingIds((prev) => new Set([...prev, id]));\n  const removePending = (id: string) =>\n    setPendingIds((prev) => {\n      const next = new Set(prev);\n      next.delete(id);\n      return next;\n    });\n\n  const [startTunnel] = useStartTunnelMutation();\n\n  const handleStartTunnel = async (id: string) => {\n    const existing = tunnels.find((t) => t.id === id);\n    if (!existing) return;\n    addPending(id);\n    try {\n      const result = await startTunnel({\n        variables: { id },\n        optimisticResponse: {\n          startTunnel: {\n            ...existing,\n            status: 'PROVISIONING' as TunnelStatus,\n            __typename: 'Tunnel',\n          },\n        },\n      });\n      if (result.error && isQuotaExhaustedError(result.error)) {\n        markQuotaHandledLocally();\n        setShowQuotaExhausted(true);\n      }\n    } catch (err) {\n      // Only open the quota modal for actual quota errors — pre-existing\n      // bug spotted on the BOFF-2625 review: any tunnel-start failure\n      // (network / validation / auth) was opening the quota dialog.\n      if (isQuotaExhaustedError(err)) {\n        markQuotaHandledLocally();\n        setShowQuotaExhausted(true);\n      } else {\n        console.error('[TunnelsTab] startTunnel failed', err);\n      }\n    } finally {\n      removePending(id);\n    }\n  };\n\n  const [stopTunnel] = useStopTunnelMutation();\n\n  const handleStopTunnel = async (id: string) => {\n    const existing = tunnels.find((t) => t.id === id);\n    if (!existing) return;\n    addPending(id);\n    try {\n      await stopTunnel({\n        variables: { id },\n        optimisticResponse: {\n          stopTunnel: { ...existing, status: 'STOPPED' as TunnelStatus, __typename: 'Tunnel' },\n        },\n      });\n    } finally {\n      removePending(id);\n    }\n  };\n\n  const [deleteTunnel, { loading: deleting }] = useDeleteTunnelMutation({\n    onCompleted: () => {\n      setPendingDelete(null);\n      void refetch();\n    },\n  });\n\n  return (\n    <div className=\"p-6 max-w-7xl mx-auto\">\n      <PageHeader\n        title={tr('vibecontrols.tunnels.list.title', 'Tunnels')}\n        description={tr(\n          'vibecontrols.tunnels.list.description',\n          'Expose local services on *.vibetunnels.com and custom domains.'\n        )}\n        actions={\n          <Link\n            to=\"/vibecontrols/tunnels/new\"\n            className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover transition-colors\"\n          >\n            {tr('vibecontrols.tunnels.list.newTunnel', 'New tunnel')}\n          </Link>\n        }\n      />\n\n      <div className=\"flex flex-col sm:flex-row gap-3 mb-4\">\n        <div className=\"flex-1\">\n          <SearchInput\n            value={search}\n            onChange={setSearch}\n            placeholder=\"Search tunnels by name or slug\"\n          />\n        </div>\n        <FilterDropdown\n          label=\"Provider\"\n          value={providerFilter}\n          onChange={setProviderFilter}\n          options={[\n            { value: 'all', label: 'All providers' },\n            { value: 'VIBETUNNELS', label: 'Vibe Tunnels (default)' },\n            { value: 'CLOUDFLARE', label: 'Cloudflare Tunnels' },\n          ]}\n        />\n        <FilterDropdown\n          label=\"Status\"\n          value={statusFilter}\n          onChange={setStatusFilter}\n          options={[\n            { value: 'all', label: 'All statuses' },\n            { value: 'ACTIVE', label: 'Active' },\n            { value: 'DRAFT', label: 'Draft' },\n            { value: 'PROVISIONING', label: 'Provisioning' },\n            { value: 'STOPPED', label: 'Stopped' },\n            { value: 'ERROR', label: 'Error' },\n          ]}\n        />\n      </div>\n\n      {loading && !data && <LoadingState message=\"Loading tunnels\" />}\n      {error && (\n        <ErrorState\n          title=\"Failed to load tunnels\"\n          message={error.message}\n          onRetry={() => refetch()}\n        />\n      )}\n\n      {data && tunnels.length === 0 && (\n        <EmptyState\n          title={tr('vibecontrols.tunnels.list.emptyTitle', 'No tunnels yet')}\n          description={tr(\n            'vibecontrols.tunnels.list.emptyDescription',\n            'Create your first tunnel to expose a local service.'\n          )}\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigate('/vibecontrols/tunnels/new')}\n              className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover transition-colors\"\n            >\n              {tr('vibecontrols.tunnels.list.createTunnel', 'Create tunnel')}\n            </button>\n          }\n        />\n      )}\n\n      {tunnels.length > 0 && (\n        <motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }} className=\"space-y-3\">\n          {tunnels.map((tunnel: TunnelRow) => (\n            <TunnelCard\n              key={tunnel.id}\n              tunnel={tunnel}\n              isPending={pendingIds.has(tunnel.id)}\n              onOpen={(id) => navigate(`/vibecontrols/tunnels/${id}`)}\n              onStart={(id) => void handleStartTunnel(id)}\n              onStop={(id) => void handleStopTunnel(id)}\n              onDelete={(id, name) => setPendingDelete({ id, name })}\n            />\n          ))}\n        </motion.div>\n      )}\n\n      <ConfirmDialog\n        isOpen={pendingDelete !== null}\n        onClose={() => setPendingDelete(null)}\n        onConfirm={() => {\n          if (pendingDelete) {\n            void deleteTunnel({ variables: { id: pendingDelete.id } });\n          }\n        }}\n        title=\"Delete tunnel\"\n        message={\n          pendingDelete\n            ? `Delete \"${pendingDelete.name}\"? This will stop the tunnel and remove all its sessions and domains.`\n            : ''\n        }\n        confirmLabel=\"Delete\"\n        variant=\"danger\"\n        isLoading={deleting}\n      />\n\n      <QuotaExhaustedDialog\n        isOpen={showQuotaExhausted}\n        onClose={() => setShowQuotaExhausted(false)}\n        onConfirm={() => {\n          setShowQuotaExhausted(false);\n          navigate('/billing');\n        }}\n        {...getQuotaDialogContent('tunnel-start')}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TunnelsTab.js","names":[],"sources":["../../../src/pages/tunnels/TunnelsTab.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport { Link, useNavigate } from 'react-router-dom';\nimport { motion } from 'framer-motion';\n\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { PageHeader } from '@/components/shared/PageHeader';\nimport { SearchInput } from '@/components/shared/SearchInput';\nimport { FilterDropdown } from '@/components/shared/FilterDropdown';\nimport { ConfirmDialog } from '@/components/shared/ConfirmDialog';\nimport { QuotaExhaustedDialog } from '@/components/shared/QuotaExhaustedDialog';\nimport { EmptyState } from '@/components/shared/EmptyState';\nimport { LoadingState } from '@/components/shared/LoadingState';\nimport { ErrorState } from '@/components/shared/ErrorState';\nimport { TunnelCard } from '@/components/tunnels/TunnelCard';\nimport type { TunnelStatus, TunnelProviderKey } from '@/generated/wspace-types';\nimport { useTr } from '../../shared/hooks/useTr';\nimport {\n  useListTunnelsQuery,\n  useListAgentsQuery,\n  useStartTunnelMutation,\n  useStopTunnelMutation,\n  useDeleteTunnelMutation,\n  type ListTunnelsQuery,\n} from '@/generated/wspace-operations';\nimport {\n  isQuotaExhaustedError,\n  markQuotaHandledLocally,\n  getQuotaDialogContent,\n} from '@/utils/quotaUtils';\n\ntype TunnelRow = NonNullable<ListTunnelsQuery['tunnels']>['items'][number];\n\nconst TRANSITION_POLL_MS = 4000;\n\nexport function TunnelsTab() {\n  const tr = useTr();\n  const navigate = useNavigate();\n  const [search, setSearch] = useState('');\n  const [providerFilter, setProviderFilter] = useState<string>('all');\n  const [statusFilter, setStatusFilter] = useState<string>('all');\n  const [pendingDelete, setPendingDelete] = useState<{ id: string; name: string } | null>(null);\n  const [showQuotaExhausted, setShowQuotaExhausted] = useState(false);\n  const [pendingIds, setPendingIds] = useState<Set<string>>(new Set());\n\n  const filter = useMemo(() => {\n    const f: Record<string, unknown> = {};\n    if (providerFilter !== 'all') {\n      f.providerKey = providerFilter as TunnelProviderKey;\n    }\n    if (statusFilter !== 'all') {\n      f.status = [statusFilter as TunnelStatus];\n    }\n    if (search.trim()) {\n      f.search = search.trim();\n    }\n    return f;\n  }, [providerFilter, statusFilter, search]);\n\n  const { data, loading, error, refetch, startPolling, stopPolling } = useListTunnelsQuery({\n    variables: { filter, pagination: { limit: 50 } },\n    fetchPolicy: 'cache-and-network',\n  });\n\n  const { data: agentsData } = useListAgentsQuery({\n    variables: { pagination: { limit: 1 } },\n    fetchPolicy: 'cache-first',\n  });\n  const hasAnyAgent = (agentsData?.vibecontrolsAgents?.length ?? 0) > 0;\n\n  const tunnels: TunnelRow[] = data?.tunnels?.items ?? [];\n\n  const handleNewTunnelClick = (event: React.MouseEvent) => {\n    if (!hasAnyAgent) {\n      event.preventDefault();\n      // Lightweight toast via window event — falls back to console if no host listener.\n      const detail = {\n        message: tr(\n          'vibecontrols.tunnels.list.createAgentFirst',\n          'Create an agent first to use tunnels'\n        ),\n        variant: 'info' as const,\n      };\n      window.dispatchEvent(new CustomEvent('vibecontrols:toast', { detail }));\n      navigate('/vibecontrols/agents');\n    }\n  };\n\n  // Poll while any tunnel is in a transient state OR is ACTIVE but has no\n  // domain yet (Cloudflare assigns the URL ~5-15 s after start returns).\n  const needsPoll =\n    pendingIds.size > 0 ||\n    tunnels.some(\n      (t) =>\n        t.status === 'PROVISIONING' ||\n        t.status === 'DELETING' ||\n        (t.status === 'ACTIVE' && !t.primaryDomain?.hostname)\n    );\n  useEffect(() => {\n    if (needsPoll) {\n      startPolling(TRANSITION_POLL_MS);\n    } else {\n      stopPolling();\n    }\n  }, [needsPoll, startPolling, stopPolling]);\n\n  const addPending = (id: string) => setPendingIds((prev) => new Set([...prev, id]));\n  const removePending = (id: string) =>\n    setPendingIds((prev) => {\n      const next = new Set(prev);\n      next.delete(id);\n      return next;\n    });\n\n  const [startTunnel] = useStartTunnelMutation();\n\n  const handleStartTunnel = async (id: string) => {\n    const existing = tunnels.find((t) => t.id === id);\n    if (!existing) return;\n    addPending(id);\n    try {\n      const result = await startTunnel({\n        variables: { id },\n        optimisticResponse: {\n          startTunnel: {\n            ...existing,\n            status: 'PROVISIONING' as TunnelStatus,\n            __typename: 'Tunnel',\n          },\n        },\n      });\n      if (result.error && isQuotaExhaustedError(result.error)) {\n        markQuotaHandledLocally();\n        setShowQuotaExhausted(true);\n      }\n    } catch (err) {\n      // Only open the quota modal for actual quota errors — pre-existing\n      // bug spotted on the BOFF-2625 review: any tunnel-start failure\n      // (network / validation / auth) was opening the quota dialog.\n      if (isQuotaExhaustedError(err)) {\n        markQuotaHandledLocally();\n        setShowQuotaExhausted(true);\n      } else {\n        console.error('[TunnelsTab] startTunnel failed', err);\n      }\n    } finally {\n      removePending(id);\n    }\n  };\n\n  const [stopTunnel] = useStopTunnelMutation();\n\n  const handleStopTunnel = async (id: string) => {\n    const existing = tunnels.find((t) => t.id === id);\n    if (!existing) return;\n    addPending(id);\n    try {\n      await stopTunnel({\n        variables: { id },\n        optimisticResponse: {\n          stopTunnel: { ...existing, status: 'STOPPED' as TunnelStatus, __typename: 'Tunnel' },\n        },\n      });\n    } finally {\n      removePending(id);\n    }\n  };\n\n  const [deleteTunnel, { loading: deleting }] = useDeleteTunnelMutation({\n    onCompleted: () => {\n      setPendingDelete(null);\n      void refetch();\n    },\n  });\n\n  return (\n    <div className=\"p-6 max-w-7xl mx-auto\">\n      <PageHeader\n        title={tr('vibecontrols.tunnels.list.title', 'Tunnels')}\n        description={tr(\n          'vibecontrols.tunnels.list.description',\n          'Expose local services on *.vibetunnels.com and custom domains.'\n        )}\n        actions={\n          <Button variant=\"default\" asChild>\n            <Link to=\"/vibecontrols/tunnels/new\" onClick={handleNewTunnelClick}>\n              {tr('vibecontrols.tunnels.list.newTunnel', 'New tunnel')}\n            </Link>\n          </Button>\n        }\n      />\n\n      <div className=\"flex flex-col sm:flex-row gap-3 mb-4\">\n        <div className=\"flex-1\">\n          <SearchInput\n            value={search}\n            onChange={setSearch}\n            placeholder=\"Search tunnels by name or slug\"\n          />\n        </div>\n        <FilterDropdown\n          label=\"Provider\"\n          value={providerFilter}\n          onChange={setProviderFilter}\n          options={[\n            { value: 'all', label: 'All providers' },\n            { value: 'VIBETUNNELS', label: 'Vibe Tunnels (default)' },\n            { value: 'CLOUDFLARE', label: 'Cloudflare Tunnels' },\n          ]}\n        />\n        <FilterDropdown\n          label=\"Status\"\n          value={statusFilter}\n          onChange={setStatusFilter}\n          options={[\n            { value: 'all', label: 'All statuses' },\n            { value: 'ACTIVE', label: 'Active' },\n            { value: 'DRAFT', label: 'Draft' },\n            { value: 'PROVISIONING', label: 'Provisioning' },\n            { value: 'STOPPED', label: 'Stopped' },\n            { value: 'ERROR', label: 'Error' },\n          ]}\n        />\n      </div>\n\n      {loading && !data && <LoadingState message=\"Loading tunnels\" />}\n      {error && (\n        <ErrorState\n          title=\"Failed to load tunnels\"\n          message={error.message}\n          onRetry={() => refetch()}\n        />\n      )}\n\n      {data && tunnels.length === 0 && !hasAnyAgent && (\n        <EmptyState\n          title={tr('vibecontrols.tunnels.list.noAgentTitle', 'Create an agent first')}\n          description={tr(\n            'vibecontrols.tunnels.list.noAgentDescription',\n            'Tunnels need a VibeControls agent to forward traffic. Install + register an agent, then come back to create your first tunnel.'\n          )}\n          action={\n            <Button variant=\"default\" onClick={() => navigate('/vibecontrols/agents')}>\n              {tr('vibecontrols.tunnels.list.setupAgent', 'Set up an agent')}\n            </Button>\n          }\n        />\n      )}\n\n      {data && tunnels.length === 0 && hasAnyAgent && (\n        <EmptyState\n          title={tr('vibecontrols.tunnels.list.emptyTitle', 'No tunnels yet')}\n          description={tr(\n            'vibecontrols.tunnels.list.emptyDescription',\n            'Create your first tunnel to expose a local service.'\n          )}\n          action={\n            <Button variant=\"default\" onClick={() => navigate('/vibecontrols/tunnels/new')}>\n              {tr('vibecontrols.tunnels.list.createTunnel', 'Create tunnel')}\n            </Button>\n          }\n        />\n      )}\n\n      {tunnels.length > 0 && (\n        <motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }} className=\"space-y-3\">\n          {tunnels.map((tunnel: TunnelRow) => (\n            <TunnelCard\n              key={tunnel.id}\n              tunnel={tunnel}\n              isPending={pendingIds.has(tunnel.id)}\n              onOpen={(id) => navigate(`/vibecontrols/tunnels/${id}`)}\n              onStart={(id) => void handleStartTunnel(id)}\n              onStop={(id) => void handleStopTunnel(id)}\n              onDelete={(id, name) => setPendingDelete({ id, name })}\n            />\n          ))}\n        </motion.div>\n      )}\n\n      <ConfirmDialog\n        isOpen={pendingDelete !== null}\n        onClose={() => setPendingDelete(null)}\n        onConfirm={() => {\n          if (pendingDelete) {\n            void deleteTunnel({ variables: { id: pendingDelete.id } });\n          }\n        }}\n        title=\"Delete tunnel\"\n        message={\n          pendingDelete\n            ? `Delete \"${pendingDelete.name}\"? This will stop the tunnel and remove all its sessions and domains.`\n            : ''\n        }\n        confirmLabel=\"Delete\"\n        variant=\"danger\"\n        isLoading={deleting}\n      />\n\n      <QuotaExhaustedDialog\n        isOpen={showQuotaExhausted}\n        onClose={() => setShowQuotaExhausted(false)}\n        onConfirm={() => {\n          setShowQuotaExhausted(false);\n          navigate('/billing');\n        }}\n        {...getQuotaDialogContent('tunnel-start')}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/services/schedulerApi.js

@@ -4,9 +4,40 @@ import { graphqlFetch as t } from "@burdenoff/fe-libs/shared/graphql/fetch";
 function n() {
 	return e() ?? "";
 }
-async function r(e) {
+function r() {
+	try {
+		return !1;
+	} catch {
+		return !1;
+	}
+}
+async function i(e) {
 	e.workspaceId || n();
-	let r = await t({
+	let i = r() && e.agentRef ? {
+		executorType: "GRAPHQL",
+		executorConfig: {
+			operation: "executeScheduledPrompt",
+			variables: {
+				agentId: e.agentRef.agentId,
+				profile: e.agentRef.profile,
+				sessionId: e.sessionId,
+				prompt: e.prompt
+			}
+		}
+	} : {
+		executorType: "WEBHOOK",
+		executorConfig: {
+			url: `${e.agentTunnelUrl}/api/ai/sessions/${e.sessionId}/send`,
+			method: "POST",
+			headers: {
+				"Content-Type": "application/json",
+				...e.agentApiKey ? { "X-API-Key": e.agentApiKey } : {}
+			},
+			body: JSON.stringify({ prompt: e.prompt })
+		}
+	};
+	if (i.executorType === "WEBHOOK" && !e.agentApiKey) throw Error("schedulePrompt: legacy WEBHOOK executor requires agentApiKey. Set VITE_SCHEDULER_AGENT_REF_ENABLED=true and pass agentRef to use the secure path.");
+	let a = await t({
 		gateway: "workspace",
 		query: "mutation CreateScheduledJob($input: CreateScheduledJobInput!) {\n      createScheduledJob(input: $input) { id status }\n    }",
 		variables: { input: {
@@ -15,26 +46,17 @@ async function r(e) {
 			scheduleType: "ONE_TIME",
 			startDate: e.scheduledAt,
 			timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
-			executorType: "WEBHOOK",
-			executorConfig: {
-				url: `${e.agentTunnelUrl}/api/ai/sessions/${e.sessionId}/send`,
-				method: "POST",
-				headers: {
-					"Content-Type": "application/json",
-					"X-API-Key": e.agentApiKey
-				},
-				body: JSON.stringify({ prompt: e.prompt })
-			},
+			...i,
 			isActive: !0
 		} }
 	});
-	if (r.errors?.length) throw Error(r.errors[0].message);
+	if (a.errors?.length) throw Error(a.errors[0].message);
 	return {
-		jobId: r.data?.createScheduledJob?.id || "",
+		jobId: a.data?.createScheduledJob?.id || "",
 		scheduledAt: e.scheduledAt
 	};
 }
 //#endregion
-export { r as schedulePrompt };
+export { i as schedulePrompt };
 
 //# sourceMappingURL=schedulerApi.js.map

package/dist/services/schedulerApi.js.map

@@ -1 +1 @@
-{"version":3,"file":"schedulerApi.js","names":[],"sources":["../../src/services/schedulerApi.ts"],"sourcesContent":["/**\n * Scheduler API service for scheduling AI prompts.\n *\n * Creates one-time scheduled jobs via the workspace scheduler\n * that fire webhook calls to the AI session send endpoint.\n */\n\nimport { graphqlFetch } from '@burdenoff/fe-libs/shared/graphql/fetch';\nimport { getStoredWorkspaceId } from '@burdenoff/fe-libs/shared/graphql';\n\n// Reads from ActiveContextStorage with URL precedence so the workspace id\n// is found even when the calling MFE route doesn't carry `?workspace=`.\nfunction getWorkspaceId(): string {\n  return getStoredWorkspaceId() ?? '';\n}\n\nexport async function schedulePrompt(params: {\n  sessionId: string;\n  agentTunnelUrl: string;\n  agentApiKey: string;\n  prompt: string;\n  scheduledAt: string; // ISO datetime\n  workspaceId?: string;\n}): Promise<{ jobId: string; scheduledAt: string }> {\n  const wsId = params.workspaceId || getWorkspaceId();\n\n  const result = await graphqlFetch<{\n    createScheduledJob?: { id?: string; status?: string };\n  }>({\n    gateway: 'workspace',\n    query: `mutation CreateScheduledJob($input: CreateScheduledJobInput!) {\n      createScheduledJob(input: $input) { id status }\n    }`,\n    variables: {\n      input: {\n        name: `AI Prompt - ${params.sessionId.slice(0, 8)}`,\n        description: `Scheduled prompt for AI session`,\n        scheduleType: 'ONE_TIME',\n        startDate: params.scheduledAt,\n        timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,\n        executorType: 'WEBHOOK',\n        executorConfig: {\n          url: `${params.agentTunnelUrl}/api/ai/sessions/${params.sessionId}/send`,\n          method: 'POST',\n          headers: { 'Content-Type': 'application/json', 'X-API-Key': params.agentApiKey },\n          body: JSON.stringify({ prompt: params.prompt }),\n        },\n        isActive: true,\n      },\n    },\n  });\n\n  if (result.errors?.length) throw new Error(result.errors[0].message);\n  const job = result.data?.createScheduledJob;\n  return { jobId: job?.id || '', scheduledAt: params.scheduledAt };\n}\n"],"mappings":";;;AAYA,SAAS,IAAyB;AAChC,QAAO,GAAsB,IAAI;;AAGnC,eAAsB,EAAe,GAOe;AACrC,GAAO,eAAe,GAAgB;CAEnD,IAAM,IAAS,MAAM,EAElB;EACD,SAAS;EACT,OAAO;EAGP,WAAW,EACT,OAAO;GACL,MAAM,eAAe,EAAO,UAAU,MAAM,GAAG,EAAE;GACjD,aAAa;GACb,cAAc;GACd,WAAW,EAAO;GAClB,UAAU,KAAK,gBAAgB,CAAC,iBAAiB,CAAC;GAClD,cAAc;GACd,gBAAgB;IACd,KAAK,GAAG,EAAO,eAAe,mBAAmB,EAAO,UAAU;IAClE,QAAQ;IACR,SAAS;KAAE,gBAAgB;KAAoB,aAAa,EAAO;KAAa;IAChF,MAAM,KAAK,UAAU,EAAE,QAAQ,EAAO,QAAQ,CAAC;IAChD;GACD,UAAU;GACX,EACF;EACF,CAAC;AAEF,KAAI,EAAO,QAAQ,OAAQ,OAAU,MAAM,EAAO,OAAO,GAAG,QAAQ;AAEpE,QAAO;EAAE,OADG,EAAO,MAAM,oBACJ,MAAM;EAAI,aAAa,EAAO;EAAa"}
+{"version":3,"file":"schedulerApi.js","names":[],"sources":["../../src/services/schedulerApi.ts"],"sourcesContent":["/**\n * Scheduler API service for scheduling AI prompts.\n *\n * Creates one-time scheduled jobs via the workspace scheduler\n * that fire webhook calls to the AI session send endpoint.\n *\n * SECURITY-F12 (2026-05-28): The legacy WEBHOOK path persists the agent's\n * long-lived `agentApiKey` in `executorConfig.headers['X-API-Key']` inside\n * the scheduler DB. New code paths should instead send `agentRef:{agentId,\n * profile}` so the scheduler invokes a backend mutation that mints a\n * short-lived (≤60s) ticket at execution time. See\n * `~/products/dev/platform/context/scheduler/SECURITY_F12.md` for the full\n * migration plan and why phases 2-4 are deferred.\n *\n * This file ships the microfe half (phase 1) behind a feature flag. With\n * the flag OFF (default) the legacy webhook payload is preserved so\n * running scheduled jobs continue to fire. With the flag ON AND `agentRef`\n * supplied, the secret-free GRAPHQL executor payload is emitted instead.\n */\n\nimport { graphqlFetch } from '@burdenoff/fe-libs/shared/graphql/fetch';\nimport { getStoredWorkspaceId } from '@burdenoff/fe-libs/shared/graphql';\n\n// Reads from ActiveContextStorage with URL precedence so the workspace id\n// is found even when the calling MFE route doesn't carry `?workspace=`.\nfunction getWorkspaceId(): string {\n  return getStoredWorkspaceId() ?? '';\n}\n\nfunction isAgentRefEnabled(): boolean {\n  // Vite-injected env var. Default off — the backend (phase 2 + 3) isn't\n  // shipped yet, flipping this without the backend would break new\n  // scheduled jobs the moment they fire.\n  try {\n    return import.meta.env?.VITE_SCHEDULER_AGENT_REF_ENABLED === 'true';\n  } catch {\n    return false;\n  }\n}\n\nexport interface AgentRef {\n  agentId: string;\n  profile: string;\n}\n\nexport async function schedulePrompt(params: {\n  sessionId: string;\n  agentTunnelUrl: string;\n  /**\n   * Legacy long-lived agent API key. SECURITY-F12: do not persist in new\n   * executor configs once the `agentRef` path is enabled. Still accepted\n   * here so existing call sites and feature-flag-off deployments work.\n   */\n  agentApiKey?: string;\n  /**\n   * Preferred (phase 1+): reference the agent without embedding its key.\n   * Backend mints a short-lived ticket at execution time.\n   */\n  agentRef?: AgentRef;\n  prompt: string;\n  scheduledAt: string; // ISO datetime\n  workspaceId?: string;\n}): Promise<{ jobId: string; scheduledAt: string }> {\n  const wsId = params.workspaceId || getWorkspaceId();\n\n  const useAgentRef = isAgentRefEnabled() && !!params.agentRef;\n\n  // SECURITY-F12 phase 1: when the flag is on AND we have an agentRef,\n  // emit the secret-free GRAPHQL executor payload. The scheduler will\n  // dispatch this through wspace-int-gateway to the (not-yet-shipped)\n  // `executeScheduledPrompt` mutation on wspace-vibecontrols-svc, which\n  // mints a short-lived ticket at execution time.\n  const executor = useAgentRef\n    ? {\n        executorType: 'GRAPHQL' as const,\n        executorConfig: {\n          operation: 'executeScheduledPrompt',\n          variables: {\n            agentId: params.agentRef!.agentId,\n            profile: params.agentRef!.profile,\n            sessionId: params.sessionId,\n            prompt: params.prompt,\n          },\n        },\n      }\n    : {\n        // Legacy path: WEBHOOK with the raw long-lived `agentApiKey`\n        // embedded in headers. Kept for backwards compatibility until\n        // SECURITY-F12 phase 2 + 3 ship and this branch is removed in\n        // phase 4. Refuses to schedule without a key (the legacy\n        // executor cannot authenticate against the agent without one).\n        executorType: 'WEBHOOK' as const,\n        executorConfig: {\n          url: `${params.agentTunnelUrl}/api/ai/sessions/${params.sessionId}/send`,\n          method: 'POST',\n          headers: {\n            'Content-Type': 'application/json',\n            ...(params.agentApiKey ? { 'X-API-Key': params.agentApiKey } : {}),\n          },\n          body: JSON.stringify({ prompt: params.prompt }),\n        },\n      };\n\n  if (executor.executorType === 'WEBHOOK' && !params.agentApiKey) {\n    throw new Error(\n      'schedulePrompt: legacy WEBHOOK executor requires agentApiKey. Set VITE_SCHEDULER_AGENT_REF_ENABLED=true and pass agentRef to use the secure path.'\n    );\n  }\n\n  const result = await graphqlFetch<{\n    createScheduledJob?: { id?: string; status?: string };\n  }>({\n    gateway: 'workspace',\n    query: `mutation CreateScheduledJob($input: CreateScheduledJobInput!) {\n      createScheduledJob(input: $input) { id status }\n    }`,\n    variables: {\n      input: {\n        name: `AI Prompt - ${params.sessionId.slice(0, 8)}`,\n        description: `Scheduled prompt for AI session`,\n        scheduleType: 'ONE_TIME',\n        startDate: params.scheduledAt,\n        timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,\n        ...executor,\n        isActive: true,\n      },\n    },\n  });\n\n  if (result.errors?.length) throw new Error(result.errors[0].message);\n  const job = result.data?.createScheduledJob;\n  return { jobId: job?.id || '', scheduledAt: params.scheduledAt };\n}\n"],"mappings":";;;AAyBA,SAAS,IAAyB;AAChC,QAAO,GAAsB,IAAI;;AAGnC,SAAS,IAA6B;AAIpC,KAAI;AACF,SAAO;SACD;AACN,SAAO;;;AASX,eAAsB,EAAe,GAiBe;AACrC,GAAO,eAAe,GAAgB;CASnD,IAAM,IAPc,GAAmB,IAAM,EAAO,WAQhD;EACE,cAAc;EACd,gBAAgB;GACd,WAAW;GACX,WAAW;IACT,SAAS,EAAO,SAAU;IAC1B,SAAS,EAAO,SAAU;IAC1B,WAAW,EAAO;IAClB,QAAQ,EAAO;IAChB;GACF;EACF,GACD;EAME,cAAc;EACd,gBAAgB;GACd,KAAK,GAAG,EAAO,eAAe,mBAAmB,EAAO,UAAU;GAClE,QAAQ;GACR,SAAS;IACP,gBAAgB;IAChB,GAAI,EAAO,cAAc,EAAE,aAAa,EAAO,aAAa,GAAG,EAAE;IAClE;GACD,MAAM,KAAK,UAAU,EAAE,QAAQ,EAAO,QAAQ,CAAC;GAChD;EACF;AAEL,KAAI,EAAS,iBAAiB,aAAa,CAAC,EAAO,YACjD,OAAU,MACR,oJACD;CAGH,IAAM,IAAS,MAAM,EAElB;EACD,SAAS;EACT,OAAO;EAGP,WAAW,EACT,OAAO;GACL,MAAM,eAAe,EAAO,UAAU,MAAM,GAAG,EAAE;GACjD,aAAa;GACb,cAAc;GACd,WAAW,EAAO;GAClB,UAAU,KAAK,gBAAgB,CAAC,iBAAiB,CAAC;GAClD,GAAG;GACH,UAAU;GACX,EACF;EACF,CAAC;AAEF,KAAI,EAAO,QAAQ,OAAQ,OAAU,MAAM,EAAO,OAAO,GAAG,QAAQ;AAEpE,QAAO;EAAE,OADG,EAAO,MAAM,oBACJ,MAAM;EAAI,aAAa,EAAO;EAAa"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@burdenoff/microfe-vibecontrols",
-  "version": "2026.528.7",
+  "version": "2026.528.9",
   "description": "VibeControls microfrontend for Burdenoff products",
   "type": "module",
   "files": [