@burdenoff/microfe-vibecontrols 2026.520.2 → 2026.521.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,200 +4,206 @@ import n from "./components/shared/AgentEventsConnector.js";
4
4
  /* empty css */
5
5
  import { useEffect as r } from "react";
6
6
  import { useI18n as i } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
7
- import { Activity as a, BarChart2 as o, BookOpen as s, Bot as c, Box as l, Brain as u, CalendarClock as d, FileCode as f, GitBranch as p, Globe as m, LayoutDashboard as h, LayoutGrid as g, PlayCircle as _, Plug as v, Rocket as y, Server as b, Settings as x, Shield as S, Terminal as C, Zap as w } from "lucide-react";
8
- import { jsx as T, jsxs as E } from "react/jsx-runtime";
9
- import { FeatureFlagProvider as D } from "@burdenoff/fe-libs/shared/feature-flags";
7
+ import { useRecordProductVisit as a } from "@burdenoff/fe-libs/shared/hooks";
8
+ import { Activity as o, BarChart2 as s, BookOpen as c, Bot as l, Box as u, Brain as d, CalendarClock as f, FileCode as p, GitBranch as m, Globe as h, LayoutDashboard as g, LayoutGrid as _, PlayCircle as v, Plug as y, Rocket as b, Server as x, Settings as S, Shield as C, Terminal as w, Zap as T } from "lucide-react";
9
+ import { jsx as E, jsxs as D } from "react/jsx-runtime";
10
+ import { FeatureFlagProvider as O } from "@burdenoff/fe-libs/shared/feature-flags";
10
11
  //#region src/VibeControlsRoot.tsx
11
- var O = (O) => {
12
- let { registerNavItems: k, registerFooterItems: A, basePath: j = "/", workspaceId: M } = O, { t: N, locale: P } = i(), F = typeof window < "u" && /^\/vibecontrols\/(share|deck)\//.test(window.location.pathname), I = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
12
+ var k = (k) => {
13
+ let { registerNavItems: A, registerFooterItems: j, basePath: M = "/", workspaceId: N } = k, { t: P, locale: F } = i(), I = typeof window < "u" && /^\/vibecontrols\/(share|deck)\//.test(window.location.pathname);
14
+ a({
15
+ productSlug: "vibecontrols",
16
+ enabled: !I
17
+ });
18
+ let L = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
13
19
  return r(() => {
14
- if (!(!k || F)) return k([
20
+ if (!(!A || I)) return A([
15
21
  {
16
22
  id: "vibecontrols-overview",
17
- label: N("nav.overview"),
18
- path: j === "/" ? "/" : j,
19
- icon: /* @__PURE__ */ T(h, { size: 20 }),
23
+ label: P("nav.overview"),
24
+ path: M === "/" ? "/" : M,
25
+ icon: /* @__PURE__ */ E(g, { size: 20 }),
20
26
  order: 10,
21
27
  group: "vibecontrols"
22
28
  },
23
29
  {
24
30
  id: "vibecontrols-targets",
25
- label: N("nav.targets"),
26
- path: I(j, "targets"),
27
- icon: /* @__PURE__ */ T(b, { size: 20 }),
31
+ label: P("nav.targets"),
32
+ path: L(M, "targets"),
33
+ icon: /* @__PURE__ */ E(x, { size: 20 }),
28
34
  order: 12,
29
35
  group: "vibecontrols"
30
36
  },
31
37
  {
32
38
  id: "vibecontrols-agents",
33
- label: N("nav.agents"),
34
- path: I(j, "agents"),
35
- icon: /* @__PURE__ */ T(c, { size: 20 }),
39
+ label: P("nav.agents"),
40
+ path: L(M, "agents"),
41
+ icon: /* @__PURE__ */ E(l, { size: 20 }),
36
42
  order: 14,
37
43
  group: "vibecontrols"
38
44
  },
39
45
  {
40
46
  id: "vibecontrols-agent-graph",
41
- label: N("nav.agentGraph"),
42
- path: I(j, "agent-graph"),
43
- icon: /* @__PURE__ */ T(p, { size: 20 }),
47
+ label: P("nav.agentGraph"),
48
+ path: L(M, "agent-graph"),
49
+ icon: /* @__PURE__ */ E(m, { size: 20 }),
44
50
  order: 16,
45
51
  group: "vibecontrols"
46
52
  },
47
53
  {
48
54
  id: "vibecontrols-vibes",
49
- label: N("nav.vibes"),
50
- path: I(j, "vibes"),
51
- icon: /* @__PURE__ */ T(w, { size: 20 }),
55
+ label: P("nav.vibes"),
56
+ path: L(M, "vibes"),
57
+ icon: /* @__PURE__ */ E(T, { size: 20 }),
52
58
  order: 20,
53
59
  group: "vibecontrols"
54
60
  },
55
61
  {
56
62
  id: "vibecontrols-catalogs",
57
- label: N("nav.catalogs") === "nav.catalogs" ? "Catalogs" : N("nav.catalogs"),
58
- path: I(j, "catalogs"),
59
- icon: /* @__PURE__ */ T(s, { size: 20 }),
63
+ label: P("nav.catalogs") === "nav.catalogs" ? "Catalogs" : P("nav.catalogs"),
64
+ path: L(M, "catalogs"),
65
+ icon: /* @__PURE__ */ E(c, { size: 20 }),
60
66
  order: 21,
61
67
  group: "vibecontrols"
62
68
  },
63
69
  {
64
70
  id: "vibecontrols-components",
65
- label: N("nav.components") === "nav.components" ? "Components" : N("nav.components"),
66
- path: I(j, "components"),
67
- icon: /* @__PURE__ */ T(l, { size: 20 }),
71
+ label: P("nav.components") === "nav.components" ? "Components" : P("nav.components"),
72
+ path: L(M, "components"),
73
+ icon: /* @__PURE__ */ E(u, { size: 20 }),
68
74
  order: 22,
69
75
  group: "vibecontrols"
70
76
  },
71
77
  {
72
78
  id: "vibecontrols-templates",
73
- label: N("nav.templates") === "nav.templates" ? "Templates" : N("nav.templates"),
74
- path: I(j, "templates"),
75
- icon: /* @__PURE__ */ T(f, { size: 20 }),
79
+ label: P("nav.templates") === "nav.templates" ? "Templates" : P("nav.templates"),
80
+ path: L(M, "templates"),
81
+ icon: /* @__PURE__ */ E(p, { size: 20 }),
76
82
  order: 23,
77
83
  group: "vibecontrols"
78
84
  },
79
85
  {
80
86
  id: "vibecontrols-vibedeck",
81
- label: N("nav.vibeDeck"),
82
- path: I(j, "vibedeck"),
83
- icon: /* @__PURE__ */ T(g, { size: 20 }),
87
+ label: P("nav.vibeDeck"),
88
+ path: L(M, "vibedeck"),
89
+ icon: /* @__PURE__ */ E(_, { size: 20 }),
84
90
  order: 25,
85
91
  group: "vibecontrols"
86
92
  },
87
93
  {
88
94
  id: "vibecontrols-sessions",
89
- label: N("nav.sessions"),
90
- path: I(j, "sessions"),
91
- icon: /* @__PURE__ */ T(C, { size: 20 }),
95
+ label: P("nav.sessions"),
96
+ path: L(M, "sessions"),
97
+ icon: /* @__PURE__ */ E(w, { size: 20 }),
92
98
  order: 30,
93
99
  group: "vibecontrols"
94
100
  },
95
101
  {
96
102
  id: "vibecontrols-vibecalendar",
97
- label: N("nav.vibeCalendar"),
98
- path: I(j, "calendar"),
99
- icon: /* @__PURE__ */ T(d, { size: 20 }),
103
+ label: P("nav.vibeCalendar"),
104
+ path: L(M, "calendar"),
105
+ icon: /* @__PURE__ */ E(f, { size: 20 }),
100
106
  order: 35,
101
107
  group: "vibecontrols"
102
108
  },
103
109
  {
104
110
  id: "vibecontrols-ai",
105
- label: N("nav.ai"),
106
- path: I(j, "ai"),
107
- icon: /* @__PURE__ */ T(u, { size: 20 }),
111
+ label: P("nav.ai"),
112
+ path: L(M, "ai"),
113
+ icon: /* @__PURE__ */ E(d, { size: 20 }),
108
114
  order: 38,
109
115
  group: "vibecontrols"
110
116
  },
111
117
  {
112
118
  id: "vibecontrols-actions",
113
- label: N("nav.actions"),
114
- path: I(j, "actions"),
115
- icon: /* @__PURE__ */ T(_, { size: 20 }),
119
+ label: P("nav.actions"),
120
+ path: L(M, "actions"),
121
+ icon: /* @__PURE__ */ E(v, { size: 20 }),
116
122
  order: 40,
117
123
  group: "vibecontrols"
118
124
  },
119
125
  {
120
126
  id: "vibecontrols-getting-started",
121
- label: N("nav.gettingStarted"),
122
- path: I(j, "getting-started"),
123
- icon: /* @__PURE__ */ T(y, { size: 20 }),
127
+ label: P("nav.gettingStarted"),
128
+ path: L(M, "getting-started"),
129
+ icon: /* @__PURE__ */ E(b, { size: 20 }),
124
130
  order: 50,
125
131
  group: "vibecontrols"
126
132
  },
127
133
  {
128
134
  id: "vibecontrols-tunnels",
129
- label: N("nav.tunnels"),
130
- path: I(j, "tunnels"),
131
- icon: /* @__PURE__ */ T(m, { size: 20 }),
135
+ label: P("nav.tunnels"),
136
+ path: L(M, "tunnels"),
137
+ icon: /* @__PURE__ */ E(h, { size: 20 }),
132
138
  order: 47,
133
139
  group: "vibecontrols"
134
140
  },
135
141
  {
136
142
  id: "vibecontrols-analytics",
137
- label: N("nav.analytics"),
138
- path: I(j, "analytics"),
139
- icon: /* @__PURE__ */ T(o, { size: 20 }),
143
+ label: P("nav.analytics"),
144
+ path: L(M, "analytics"),
145
+ icon: /* @__PURE__ */ E(s, { size: 20 }),
140
146
  order: 55.5,
141
147
  group: "vibecontrols-system"
142
148
  },
143
149
  {
144
150
  id: "vibecontrols-audit",
145
- label: N("nav.vibeAudit"),
146
- path: I(j, "audit"),
147
- icon: /* @__PURE__ */ T(S, { size: 20 }),
151
+ label: P("nav.vibeAudit"),
152
+ path: L(M, "audit"),
153
+ icon: /* @__PURE__ */ E(C, { size: 20 }),
148
154
  order: 56,
149
155
  group: "vibecontrols-system"
150
156
  },
151
157
  {
152
158
  id: "vibecontrols-health",
153
- label: N("nav.health"),
154
- path: I(j, "health"),
155
- icon: /* @__PURE__ */ T(a, { size: 20 }),
159
+ label: P("nav.health"),
160
+ path: L(M, "health"),
161
+ icon: /* @__PURE__ */ E(o, { size: 20 }),
156
162
  order: 110,
157
163
  group: "vibecontrols-system"
158
164
  },
159
165
  {
160
166
  id: "vibecontrols-integrations",
161
- label: N("nav.integrations") === "nav.integrations" ? "Integrations" : N("nav.integrations"),
167
+ label: P("nav.integrations") === "nav.integrations" ? "Integrations" : P("nav.integrations"),
162
168
  path: "/integrations",
163
- icon: /* @__PURE__ */ T(v, { size: 20 }),
169
+ icon: /* @__PURE__ */ E(y, { size: 20 }),
164
170
  order: 115,
165
171
  group: "vibecontrols-system"
166
172
  },
167
173
  {
168
174
  id: "vibecontrols-settings",
169
- label: N("nav.settings"),
170
- path: I(j, "settings"),
171
- icon: /* @__PURE__ */ T(x, { size: 20 }),
175
+ label: P("nav.settings"),
176
+ path: L(M, "settings"),
177
+ icon: /* @__PURE__ */ E(S, { size: 20 }),
172
178
  order: 120,
173
179
  group: "vibecontrols-system"
174
180
  }
175
181
  ]);
176
182
  }, [
177
- k,
178
- j,
179
- N,
183
+ A,
184
+ M,
180
185
  P,
181
- F
186
+ F,
187
+ I
182
188
  ]), r(() => {
183
- if (!(!A || F)) return A([{
189
+ if (!(!j || I)) return j([{
184
190
  id: "vibecontrols-status",
185
191
  label: "VibeControls Ready",
186
192
  type: "status",
187
193
  order: 10,
188
194
  section: "left"
189
195
  }]);
190
- }, [A, F]), /* @__PURE__ */ T(D, {
191
- workspaceId: M ?? null,
196
+ }, [j, I]), /* @__PURE__ */ E(O, {
197
+ workspaceId: N ?? null,
192
198
  gateway: "global",
193
199
  defaultEnabled: !0,
194
- children: /* @__PURE__ */ E(e, {
195
- ...O,
196
- children: [F ? null : /* @__PURE__ */ T(n, {}), /* @__PURE__ */ T(t, {})]
200
+ children: /* @__PURE__ */ D(e, {
201
+ ...k,
202
+ children: [I ? null : /* @__PURE__ */ E(n, {}), /* @__PURE__ */ E(t, {})]
197
203
  })
198
204
  });
199
205
  };
200
206
  //#endregion
201
- export { O as VibeControlsRoot };
207
+ export { k as VibeControlsRoot };
202
208
 
203
209
  //# sourceMappingURL=VibeControlsRoot.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"VibeControlsRoot.js","names":[],"sources":["../src/VibeControlsRoot.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n LayoutDashboard,\n Bot,\n Terminal,\n Zap,\n Globe,\n Settings,\n Activity,\n Rocket,\n LayoutGrid,\n CalendarClock,\n Shield,\n Server,\n GitBranch,\n Brain,\n PlayCircle,\n BarChart2,\n BookOpen,\n Box,\n FileCode,\n Plug,\n} from 'lucide-react';\nimport { VibeControlsProvider } from './providers/VibeControlsProvider';\nimport { FeatureFlagProvider } from '@burdenoff/fe-libs/shared/feature-flags';\nimport type { NavItem, VibeControlsRootProps } from './types';\nimport { VibeControlsRoutes } from './VibeControlsRoutes';\nimport { AgentEventsConnector } from './components/shared/AgentEventsConnector';\nimport './styles/vibecontrols.css';\n\n/**\n * Root component for the VibeControls microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n *\n * @example\n * ```tsx\n * import { VibeControlsRoot, type VibeControlsRootProps } from '@burdenoff/microfe-vibecontrols';\n *\n * function App() {\n * const props: VibeControlsRootProps = {\n * basePath: '/vibecontrols',\n * navigate: (path) => router.push(path),\n * currentUser: { id: '1', email: 'user@example.com', firstName: 'John', lastName: 'Doe' },\n * workspaceId: 'ws-123',\n * tenantId: 'tenant-123',\n * apiGatewayUrl: 'https://api.example.com',\n * authToken: 'token',\n * defaultView: 'agents',\n * onAgentSelect: (agent) => console.log('Agent selected:', agent),\n * onSessionStart: (session) => console.log('Session started:', session),\n * onVibeActivate: (vibe) => console.log('Vibe activated:', vibe),\n * registerNavItems: (items) => { return () => {}; },\n * };\n *\n * return <VibeControlsRoot {...props} />;\n * }\n * ```\n */\nexport const VibeControlsRoot: FC<VibeControlsRootProps> = (props) => {\n const { registerNavItems, registerFooterItems, basePath = '/', workspaceId } = props;\n const { t, locale } = useI18n();\n const isPublicLinkRoute =\n typeof window !== 'undefined' &&\n /^\\/vibecontrols\\/(share|deck)\\//.test(window.location.pathname);\n\n // Helper to join paths correctly, avoiding double slashes\n const joinPath = (base: string, path: string): string => {\n const cleanBase = base.endsWith('/') ? base.slice(0, -1) : base;\n const cleanPath = path.startsWith('/') ? path : `/${path}`;\n return cleanBase + cleanPath;\n };\n\n // Register navigation items with the shell\n useEffect(() => {\n if (!registerNavItems || isPublicLinkRoute) return;\n\n const navItems: NavItem[] = [\n // Main navigation\n {\n id: 'vibecontrols-overview',\n label: t('nav.overview'),\n path: basePath === '/' ? '/' : basePath,\n icon: <LayoutDashboard size={20} />,\n order: 10,\n group: 'vibecontrols',\n },\n\n // Targets first — the primary entity\n {\n id: 'vibecontrols-targets',\n label: t('nav.targets'),\n path: joinPath(basePath, 'targets'),\n icon: <Server size={20} />,\n order: 12,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agents',\n label: t('nav.agents'),\n path: joinPath(basePath, 'agents'),\n icon: <Bot size={20} />,\n order: 14,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agent-graph',\n label: t('nav.agentGraph'),\n path: joinPath(basePath, 'agent-graph'),\n icon: <GitBranch size={20} />,\n order: 16,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibes',\n label: t('nav.vibes'),\n path: joinPath(basePath, 'vibes'),\n icon: <Zap size={20} />,\n order: 20,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-catalogs',\n label: t('nav.catalogs') === 'nav.catalogs' ? 'Catalogs' : t('nav.catalogs'),\n path: joinPath(basePath, 'catalogs'),\n icon: <BookOpen size={20} />,\n order: 21,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-components',\n label: t('nav.components') === 'nav.components' ? 'Components' : t('nav.components'),\n path: joinPath(basePath, 'components'),\n icon: <Box size={20} />,\n order: 22,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-templates',\n label: t('nav.templates') === 'nav.templates' ? 'Templates' : t('nav.templates'),\n path: joinPath(basePath, 'templates'),\n icon: <FileCode size={20} />,\n order: 23,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibedeck',\n label: t('nav.vibeDeck'),\n path: joinPath(basePath, 'vibedeck'),\n icon: <LayoutGrid size={20} />,\n order: 25,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-sessions',\n label: t('nav.sessions'),\n path: joinPath(basePath, 'sessions'),\n icon: <Terminal size={20} />,\n order: 30,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibecalendar',\n label: t('nav.vibeCalendar'),\n path: joinPath(basePath, 'calendar'),\n icon: <CalendarClock size={20} />,\n order: 35,\n group: 'vibecontrols',\n },\n // AI Vibecoding\n {\n id: 'vibecontrols-ai',\n label: t('nav.ai'),\n path: joinPath(basePath, 'ai'),\n icon: <Brain size={20} />,\n order: 38,\n group: 'vibecontrols',\n },\n\n // Actions\n {\n id: 'vibecontrols-actions',\n label: t('nav.actions'),\n path: joinPath(basePath, 'actions'),\n icon: <PlayCircle size={20} />,\n order: 40,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-getting-started',\n label: t('nav.gettingStarted'),\n path: joinPath(basePath, 'getting-started'),\n icon: <Rocket size={20} />,\n order: 50,\n group: 'vibecontrols',\n },\n\n // Connection management\n {\n id: 'vibecontrols-tunnels',\n label: t('nav.tunnels'),\n path: joinPath(basePath, 'tunnels'),\n icon: <Globe size={20} />,\n order: 47,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-analytics',\n label: t('nav.analytics'),\n path: joinPath(basePath, 'analytics'),\n icon: <BarChart2 size={20} />,\n order: 55.5,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-audit',\n label: t('nav.vibeAudit'),\n path: joinPath(basePath, 'audit'),\n icon: <Shield size={20} />,\n order: 56,\n group: 'vibecontrols-system',\n },\n\n // Settings & System\n {\n id: 'vibecontrols-health',\n label: t('nav.health'),\n path: joinPath(basePath, 'health'),\n icon: <Activity size={20} />,\n order: 110,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-integrations',\n label:\n t('nav.integrations') === 'nav.integrations' ? 'Integrations' : t('nav.integrations'),\n // Absolute path — links out to the host shell's /integrations route\n // (microfe-integrations, mounted by vibecontrols-app). Keeps the\n // VibeControls MFE compliant with the no-cross-MFE-import rule.\n path: '/integrations',\n icon: <Plug size={20} />,\n order: 115,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-settings',\n label: t('nav.settings'),\n path: joinPath(basePath, 'settings'),\n icon: <Settings size={20} />,\n order: 120,\n group: 'vibecontrols-system',\n },\n ];\n\n // Register and get cleanup function\n const cleanup = registerNavItems(navItems);\n\n // Return cleanup function to unregister on unmount\n return cleanup;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [registerNavItems, basePath, t, locale, isPublicLinkRoute]);\n\n // Register footer items (example: status indicator in left section)\n useEffect(() => {\n if (!registerFooterItems || isPublicLinkRoute) return;\n\n const footerItems = [\n {\n id: 'vibecontrols-status',\n label: 'VibeControls Ready',\n type: 'status' as const,\n order: 10,\n section: 'left' as const,\n },\n ];\n\n const cleanup = registerFooterItems(footerItems);\n return cleanup;\n }, [registerFooterItems, isPublicLinkRoute]);\n\n return (\n <FeatureFlagProvider workspaceId={workspaceId ?? null} gateway=\"global\" defaultEnabled={true}>\n <VibeControlsProvider {...props}>\n {!isPublicLinkRoute ? (\n /* Agent events connector - syncs active agent to WebSocket */\n <AgentEventsConnector />\n ) : null}\n <VibeControlsRoutes />\n </VibeControlsProvider>\n </FeatureFlagProvider>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"VibeControlsRoot.js","names":[],"sources":["../src/VibeControlsRoot.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useRecordProductVisit } from '@burdenoff/fe-libs/shared/hooks';\nimport {\n LayoutDashboard,\n Bot,\n Terminal,\n Zap,\n Globe,\n Settings,\n Activity,\n Rocket,\n LayoutGrid,\n CalendarClock,\n Shield,\n Server,\n GitBranch,\n Brain,\n PlayCircle,\n BarChart2,\n BookOpen,\n Box,\n FileCode,\n Plug,\n} from 'lucide-react';\nimport { VibeControlsProvider } from './providers/VibeControlsProvider';\nimport { FeatureFlagProvider } from '@burdenoff/fe-libs/shared/feature-flags';\nimport type { NavItem, VibeControlsRootProps } from './types';\nimport { VibeControlsRoutes } from './VibeControlsRoutes';\nimport { AgentEventsConnector } from './components/shared/AgentEventsConnector';\nimport './styles/vibecontrols.css';\n\n/**\n * Root component for the VibeControls microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n *\n * @example\n * ```tsx\n * import { VibeControlsRoot, type VibeControlsRootProps } from '@burdenoff/microfe-vibecontrols';\n *\n * function App() {\n * const props: VibeControlsRootProps = {\n * basePath: '/vibecontrols',\n * navigate: (path) => router.push(path),\n * currentUser: { id: '1', email: 'user@example.com', firstName: 'John', lastName: 'Doe' },\n * workspaceId: 'ws-123',\n * tenantId: 'tenant-123',\n * apiGatewayUrl: 'https://api.example.com',\n * authToken: 'token',\n * defaultView: 'agents',\n * onAgentSelect: (agent) => console.log('Agent selected:', agent),\n * onSessionStart: (session) => console.log('Session started:', session),\n * onVibeActivate: (vibe) => console.log('Vibe activated:', vibe),\n * registerNavItems: (items) => { return () => {}; },\n * };\n *\n * return <VibeControlsRoot {...props} />;\n * }\n * ```\n */\nexport const VibeControlsRoot: FC<VibeControlsRootProps> = (props) => {\n const { registerNavItems, registerFooterItems, basePath = '/', workspaceId } = props;\n const { t, locale } = useI18n();\n\n const isPublicLinkRoute =\n typeof window !== 'undefined' &&\n /^\\/vibecontrols\\/(share|deck)\\//.test(window.location.pathname);\n\n useRecordProductVisit({ productSlug: 'vibecontrols', enabled: !isPublicLinkRoute });\n\n // Helper to join paths correctly, avoiding double slashes\n const joinPath = (base: string, path: string): string => {\n const cleanBase = base.endsWith('/') ? base.slice(0, -1) : base;\n const cleanPath = path.startsWith('/') ? path : `/${path}`;\n return cleanBase + cleanPath;\n };\n\n // Register navigation items with the shell\n useEffect(() => {\n if (!registerNavItems || isPublicLinkRoute) return;\n\n const navItems: NavItem[] = [\n // Main navigation\n {\n id: 'vibecontrols-overview',\n label: t('nav.overview'),\n path: basePath === '/' ? '/' : basePath,\n icon: <LayoutDashboard size={20} />,\n order: 10,\n group: 'vibecontrols',\n },\n\n // Targets first — the primary entity\n {\n id: 'vibecontrols-targets',\n label: t('nav.targets'),\n path: joinPath(basePath, 'targets'),\n icon: <Server size={20} />,\n order: 12,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agents',\n label: t('nav.agents'),\n path: joinPath(basePath, 'agents'),\n icon: <Bot size={20} />,\n order: 14,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agent-graph',\n label: t('nav.agentGraph'),\n path: joinPath(basePath, 'agent-graph'),\n icon: <GitBranch size={20} />,\n order: 16,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibes',\n label: t('nav.vibes'),\n path: joinPath(basePath, 'vibes'),\n icon: <Zap size={20} />,\n order: 20,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-catalogs',\n label: t('nav.catalogs') === 'nav.catalogs' ? 'Catalogs' : t('nav.catalogs'),\n path: joinPath(basePath, 'catalogs'),\n icon: <BookOpen size={20} />,\n order: 21,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-components',\n label: t('nav.components') === 'nav.components' ? 'Components' : t('nav.components'),\n path: joinPath(basePath, 'components'),\n icon: <Box size={20} />,\n order: 22,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-templates',\n label: t('nav.templates') === 'nav.templates' ? 'Templates' : t('nav.templates'),\n path: joinPath(basePath, 'templates'),\n icon: <FileCode size={20} />,\n order: 23,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibedeck',\n label: t('nav.vibeDeck'),\n path: joinPath(basePath, 'vibedeck'),\n icon: <LayoutGrid size={20} />,\n order: 25,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-sessions',\n label: t('nav.sessions'),\n path: joinPath(basePath, 'sessions'),\n icon: <Terminal size={20} />,\n order: 30,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibecalendar',\n label: t('nav.vibeCalendar'),\n path: joinPath(basePath, 'calendar'),\n icon: <CalendarClock size={20} />,\n order: 35,\n group: 'vibecontrols',\n },\n // AI Vibecoding\n {\n id: 'vibecontrols-ai',\n label: t('nav.ai'),\n path: joinPath(basePath, 'ai'),\n icon: <Brain size={20} />,\n order: 38,\n group: 'vibecontrols',\n },\n\n // Actions\n {\n id: 'vibecontrols-actions',\n label: t('nav.actions'),\n path: joinPath(basePath, 'actions'),\n icon: <PlayCircle size={20} />,\n order: 40,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-getting-started',\n label: t('nav.gettingStarted'),\n path: joinPath(basePath, 'getting-started'),\n icon: <Rocket size={20} />,\n order: 50,\n group: 'vibecontrols',\n },\n\n // Connection management\n {\n id: 'vibecontrols-tunnels',\n label: t('nav.tunnels'),\n path: joinPath(basePath, 'tunnels'),\n icon: <Globe size={20} />,\n order: 47,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-analytics',\n label: t('nav.analytics'),\n path: joinPath(basePath, 'analytics'),\n icon: <BarChart2 size={20} />,\n order: 55.5,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-audit',\n label: t('nav.vibeAudit'),\n path: joinPath(basePath, 'audit'),\n icon: <Shield size={20} />,\n order: 56,\n group: 'vibecontrols-system',\n },\n\n // Settings & System\n {\n id: 'vibecontrols-health',\n label: t('nav.health'),\n path: joinPath(basePath, 'health'),\n icon: <Activity size={20} />,\n order: 110,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-integrations',\n label:\n t('nav.integrations') === 'nav.integrations' ? 'Integrations' : t('nav.integrations'),\n // Absolute path — links out to the host shell's /integrations route\n // (microfe-integrations, mounted by vibecontrols-app). Keeps the\n // VibeControls MFE compliant with the no-cross-MFE-import rule.\n path: '/integrations',\n icon: <Plug size={20} />,\n order: 115,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-settings',\n label: t('nav.settings'),\n path: joinPath(basePath, 'settings'),\n icon: <Settings size={20} />,\n order: 120,\n group: 'vibecontrols-system',\n },\n ];\n\n // Register and get cleanup function\n const cleanup = registerNavItems(navItems);\n\n // Return cleanup function to unregister on unmount\n return cleanup;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [registerNavItems, basePath, t, locale, isPublicLinkRoute]);\n\n // Register footer items (example: status indicator in left section)\n useEffect(() => {\n if (!registerFooterItems || isPublicLinkRoute) return;\n\n const footerItems = [\n {\n id: 'vibecontrols-status',\n label: 'VibeControls Ready',\n type: 'status' as const,\n order: 10,\n section: 'left' as const,\n },\n ];\n\n const cleanup = registerFooterItems(footerItems);\n return cleanup;\n }, [registerFooterItems, isPublicLinkRoute]);\n\n return (\n <FeatureFlagProvider workspaceId={workspaceId ?? null} gateway=\"global\" defaultEnabled={true}>\n <VibeControlsProvider {...props}>\n {!isPublicLinkRoute ? (\n /* Agent events connector - syncs active agent to WebSocket */\n <AgentEventsConnector />\n ) : null}\n <VibeControlsRoutes />\n </VibeControlsProvider>\n </FeatureFlagProvider>\n );\n};\n"],"mappings":"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"}
@@ -50,32 +50,32 @@ var w = /^[a-z0-9]([a-z0-9-]{0,61}[a-z0-9])?$/, T = {
50
50
  }
51
51
  ];
52
52
  function D() {
53
- let D = e(), A = v(), [j, M] = _(0), [N, P] = _(T), [F, I] = _(null), [L, R] = _(!1), { setDraftTagIds: z, flushTags: B } = m("VIBECONTROLS_TUNNEL"), { data: V, loading: H, error: U } = r(), { data: W } = n({ variables: { pagination: { limit: 100 } } }), [G, { loading: K }] = t(), q = h((e, t) => {
53
+ let D = e(), A = v(), [j, M] = _(0), [N, P] = _(T), [F, I] = _(null), [L, R] = _(!1), [z, B] = _(!1), { setDraftTagIds: V, flushTags: H } = m("VIBECONTROLS_TUNNEL"), { data: U, loading: W, error: G } = r(), { data: K } = n({ variables: { pagination: { limit: 100 } } }), [q, { loading: J }] = t(), Y = h((e, t) => {
54
54
  P((n) => ({
55
55
  ...n,
56
56
  [e]: t
57
57
  }));
58
- }, []), J = h((e) => {
58
+ }, []), X = h((e) => {
59
59
  P((t) => ({
60
60
  ...t,
61
61
  providerKey: e,
62
62
  hostnameKind: e === u.Cloudflare ? "auto" : "managed"
63
63
  }));
64
- }, []), Y = g(() => [...V?.tunnelProviders ?? []].sort((e, t) => {
64
+ }, []), Z = g(() => [...U?.tunnelProviders ?? []].sort((e, t) => {
65
65
  let n = (e) => e === "VIBETUNNELS" ? 0 : e === "CLOUDFLARE" ? 1 : 2, r = n(e.key) - n(t.key);
66
66
  return r === 0 ? e.key.localeCompare(t.key) : r;
67
- }), [V]), X = g(() => Y.find((e) => e.key === N.providerKey), [Y, N.providerKey])?.capabilities, Z = N.providerKey === u.Cloudflare, Q = g(() => {
68
- if (!X) return [l.Http];
67
+ }), [U]), Q = g(() => Z.find((e) => e.key === N.providerKey), [Z, N.providerKey])?.capabilities, $ = N.providerKey === u.Cloudflare, ee = g(() => {
68
+ if (!Q) return [l.Http];
69
69
  let e = [];
70
- return X.supportsHttp && e.push(l.Http), X.supportsHttps && e.push(l.Https), X.supportsTcp && e.push(l.Tcp), e;
71
- }, [X]), $ = g(() => j === 0 ? !!(N.providerKey && N.agentId && N.name.trim()) : j === 1 ? N.localPort > 0 && N.localPort < 65536 : j === 2 ? N.hostnameKind === "managed" ? !!(N.subdomain && w.test(N.subdomain)) : N.hostnameKind === "custom" ? N.customDomain.trim().includes(".") : Z : !0, [
70
+ return Q.supportsHttp && e.push(l.Http), Q.supportsHttps && e.push(l.Https), Q.supportsTcp && e.push(l.Tcp), e;
71
+ }, [Q]), te = g(() => j === 0 ? !!(N.providerKey && N.agentId && N.name.trim()) : j === 1 ? N.localPort > 0 && N.localPort < 65536 : j === 2 ? N.hostnameKind === "managed" ? !!(N.subdomain && w.test(N.subdomain)) : N.hostnameKind === "custom" ? N.customDomain.trim().includes(".") : $ : !0, [
72
72
  j,
73
73
  N,
74
- Z
75
- ]), ee = () => M((e) => Math.min(e + 1, E.length - 1)), te = () => M((e) => Math.max(e - 1, 0)), ne = async () => {
74
+ $
75
+ ]), ne = () => M((e) => Math.min(e + 1, E.length - 1)), re = () => M((e) => Math.max(e - 1, 0)), ie = async () => {
76
76
  I(null);
77
77
  try {
78
- let e = await G({ variables: { input: {
78
+ let e = await q({ variables: { input: {
79
79
  agentId: N.agentId,
80
80
  name: N.name,
81
81
  description: N.description || void 0,
@@ -90,25 +90,33 @@ function D() {
90
90
  } } });
91
91
  if (e.error) {
92
92
  if (f(e.error)) {
93
- R(!0);
93
+ B(!0);
94
94
  return;
95
95
  }
96
96
  I(e.error.message);
97
97
  return;
98
98
  }
99
99
  let t = e.data?.createTunnel.id;
100
- t && (await B(t), A(`/vibecontrols/tunnels/${t}`));
100
+ if (t) {
101
+ R(!0);
102
+ try {
103
+ await H(t);
104
+ } finally {
105
+ R(!1);
106
+ }
107
+ A(`/vibecontrols/tunnels/${t}`);
108
+ }
101
109
  } catch (e) {
102
110
  if (f(e)) {
103
- I(null), R(!0);
111
+ I(null), B(!0);
104
112
  return;
105
113
  }
106
114
  I(e instanceof Error ? e.message : String(e));
107
115
  }
108
116
  };
109
- return H ? /* @__PURE__ */ S(a, { message: "Loading providers" }) : U ? /* @__PURE__ */ S(o, {
117
+ return W ? /* @__PURE__ */ S(a, { message: "Loading providers" }) : G ? /* @__PURE__ */ S(o, {
110
118
  title: "Failed to load providers",
111
- message: U.message,
119
+ message: G.message,
112
120
  onRetry: () => window.location.reload()
113
121
  }) : /* @__PURE__ */ C("div", {
114
122
  className: "p-6 max-w-3xl mx-auto",
@@ -155,9 +163,9 @@ function D() {
155
163
  }),
156
164
  /* @__PURE__ */ S("div", {
157
165
  className: "grid gap-3 sm:grid-cols-2",
158
- children: Y.map((e) => /* @__PURE__ */ C("button", {
166
+ children: Z.map((e) => /* @__PURE__ */ C("button", {
159
167
  type: "button",
160
- onClick: () => J(e.key),
168
+ onClick: () => X(e.key),
161
169
  className: `rounded-lg border p-4 text-left transition-colors ${N.providerKey === e.key ? "border-action-primary-bg bg-bg-sunken" : "border-border-subtle hover:border-border-default"}`,
162
170
  children: [
163
171
  /* @__PURE__ */ S("div", {
@@ -179,12 +187,12 @@ function D() {
179
187
  label: "Agent",
180
188
  children: /* @__PURE__ */ C("select", {
181
189
  value: N.agentId,
182
- onChange: (e) => q("agentId", e.target.value),
190
+ onChange: (e) => Y("agentId", e.target.value),
183
191
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary",
184
192
  children: [/* @__PURE__ */ S("option", {
185
193
  value: "",
186
194
  children: "Select agent"
187
- }), (W?.vibecontrolsAgents ?? []).map((e) => /* @__PURE__ */ S("option", {
195
+ }), (K?.vibecontrolsAgents ?? []).map((e) => /* @__PURE__ */ S("option", {
188
196
  value: e.id,
189
197
  children: e.name
190
198
  }, e.id))]
@@ -195,7 +203,7 @@ function D() {
195
203
  children: /* @__PURE__ */ S("input", {
196
204
  type: "text",
197
205
  value: N.name,
198
- onChange: (e) => q("name", e.target.value),
206
+ onChange: (e) => Y("name", e.target.value),
199
207
  placeholder: "My dev tunnel",
200
208
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-muted"
201
209
  })
@@ -205,7 +213,7 @@ function D() {
205
213
  children: /* @__PURE__ */ S("input", {
206
214
  type: "text",
207
215
  value: N.description,
208
- onChange: (e) => q("description", e.target.value),
216
+ onChange: (e) => Y("description", e.target.value),
209
217
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-muted"
210
218
  })
211
219
  })
@@ -222,9 +230,9 @@ function D() {
222
230
  label: "Protocol",
223
231
  children: /* @__PURE__ */ S("div", {
224
232
  className: "flex gap-2",
225
- children: Q.map((e) => /* @__PURE__ */ S("button", {
233
+ children: ee.map((e) => /* @__PURE__ */ S("button", {
226
234
  type: "button",
227
- onClick: () => q("protocol", e),
235
+ onClick: () => Y("protocol", e),
228
236
  className: `rounded-md border px-4 py-2 text-sm ${N.protocol === e ? "border-action-primary-bg bg-bg-sunken text-text-primary" : "border-border-subtle text-text-secondary hover:border-border-default"}`,
229
237
  children: e
230
238
  }, e))
@@ -235,7 +243,7 @@ function D() {
235
243
  children: /* @__PURE__ */ S("input", {
236
244
  type: "text",
237
245
  value: N.localHost,
238
- onChange: (e) => q("localHost", e.target.value),
246
+ onChange: (e) => Y("localHost", e.target.value),
239
247
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
240
248
  })
241
249
  }),
@@ -244,7 +252,7 @@ function D() {
244
252
  children: /* @__PURE__ */ S("input", {
245
253
  type: "number",
246
254
  value: N.localPort,
247
- onChange: (e) => q("localPort", parseInt(e.target.value, 10) || 0),
255
+ onChange: (e) => Y("localPort", parseInt(e.target.value, 10) || 0),
248
256
  min: 1,
249
257
  max: 65535,
250
258
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
@@ -264,22 +272,22 @@ function D() {
264
272
  children: [
265
273
  /* @__PURE__ */ S(k, {
266
274
  active: N.hostnameKind === "managed",
267
- onClick: () => q("hostnameKind", "managed"),
268
- disabled: !X?.supportsManagedSubdomains,
275
+ onClick: () => Y("hostnameKind", "managed"),
276
+ disabled: !Q?.supportsManagedSubdomains,
269
277
  label: "Managed subdomain",
270
278
  hint: "*.vibetunnels.com"
271
279
  }),
272
280
  /* @__PURE__ */ S(k, {
273
281
  active: N.hostnameKind === "custom",
274
- onClick: () => q("hostnameKind", "custom"),
275
- disabled: !X?.supportsCustomDomains,
282
+ onClick: () => Y("hostnameKind", "custom"),
283
+ disabled: !Q?.supportsCustomDomains,
276
284
  label: "Custom domain",
277
285
  hint: "TXT verification"
278
286
  }),
279
287
  /* @__PURE__ */ S(k, {
280
288
  active: N.hostnameKind === "auto",
281
- onClick: () => q("hostnameKind", "auto"),
282
- disabled: !Z,
289
+ onClick: () => Y("hostnameKind", "auto"),
290
+ disabled: !$,
283
291
  label: "Auto",
284
292
  hint: "provider default"
285
293
  })
@@ -292,12 +300,12 @@ function D() {
292
300
  className: "flex gap-2",
293
301
  children: [/* @__PURE__ */ S("button", {
294
302
  type: "button",
295
- onClick: () => q("environment", c.Prod),
303
+ onClick: () => Y("environment", c.Prod),
296
304
  className: `rounded-md border px-4 py-2 text-sm ${N.environment === c.Prod ? "border-action-primary-bg bg-bg-sunken text-text-primary" : "border-border-subtle text-text-secondary hover:border-border-default"}`,
297
305
  children: "Prod (vibetunnels.com)"
298
306
  }), /* @__PURE__ */ S("button", {
299
307
  type: "button",
300
- onClick: () => q("environment", c.Alpha),
308
+ onClick: () => Y("environment", c.Alpha),
301
309
  className: `rounded-md border px-4 py-2 text-sm ${N.environment === c.Alpha ? "border-action-primary-bg bg-bg-sunken text-text-primary" : "border-border-subtle text-text-secondary hover:border-border-default"}`,
302
310
  children: "Alpha"
303
311
  })]
@@ -308,7 +316,7 @@ function D() {
308
316
  children: /* @__PURE__ */ S("input", {
309
317
  type: "text",
310
318
  value: N.subdomain,
311
- onChange: (e) => q("subdomain", e.target.value.toLowerCase()),
319
+ onChange: (e) => Y("subdomain", e.target.value.toLowerCase()),
312
320
  placeholder: "demo",
313
321
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
314
322
  })
@@ -330,7 +338,7 @@ function D() {
330
338
  children: [/* @__PURE__ */ S("input", {
331
339
  type: "text",
332
340
  value: N.customDomain,
333
- onChange: (e) => q("customDomain", e.target.value.toLowerCase()),
341
+ onChange: (e) => Y("customDomain", e.target.value.toLowerCase()),
334
342
  placeholder: "preview.example.com",
335
343
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
336
344
  }), /* @__PURE__ */ S("p", {
@@ -352,7 +360,7 @@ function D() {
352
360
  children: /* @__PURE__ */ S("input", {
353
361
  type: "text",
354
362
  value: N.basicAuthUser,
355
- onChange: (e) => q("basicAuthUser", e.target.value),
363
+ onChange: (e) => Y("basicAuthUser", e.target.value),
356
364
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
357
365
  })
358
366
  }),
@@ -361,7 +369,7 @@ function D() {
361
369
  children: /* @__PURE__ */ S("input", {
362
370
  type: "password",
363
371
  value: N.basicAuthPassword,
364
- onChange: (e) => q("basicAuthPassword", e.target.value),
372
+ onChange: (e) => Y("basicAuthPassword", e.target.value),
365
373
  className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
366
374
  })
367
375
  })
@@ -446,7 +454,7 @@ function D() {
446
454
  children: D("vibecontrols.tunnels.tags", "Tags")
447
455
  }), /* @__PURE__ */ S(p, {
448
456
  entityType: "VIBECONTROLS_TUNNEL",
449
- onDraftChange: z
457
+ onDraftChange: V
450
458
  })]
451
459
  }),
452
460
  F && /* @__PURE__ */ S("div", {
@@ -463,28 +471,28 @@ function D() {
463
471
  children: [/* @__PURE__ */ S("button", {
464
472
  type: "button",
465
473
  disabled: j === 0,
466
- onClick: te,
474
+ onClick: re,
467
475
  className: "rounded-md border border-border-default px-4 py-2 text-sm text-text-primary hover:bg-bg-elevated disabled:opacity-50",
468
476
  children: D("vibecontrols.tunnels.back", "Back")
469
477
  }), j < E.length - 1 ? /* @__PURE__ */ S("button", {
470
478
  type: "button",
471
- disabled: !$,
472
- onClick: ee,
479
+ disabled: !te,
480
+ onClick: ne,
473
481
  className: "rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover disabled:opacity-50",
474
482
  children: D("vibecontrols.tunnels.next", "Next")
475
483
  }) : /* @__PURE__ */ S("button", {
476
484
  type: "button",
477
- disabled: K,
478
- onClick: () => void ne(),
485
+ disabled: J || L,
486
+ onClick: () => void ie(),
479
487
  className: "rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover disabled:opacity-50",
480
- children: K ? D("vibecontrols.tunnels.creating", "Creating...") : D("vibecontrols.tunnels.createTunnel", "Create tunnel")
488
+ children: J ? D("vibecontrols.tunnels.creating", "Creating...") : D("vibecontrols.tunnels.createTunnel", "Create tunnel")
481
489
  })]
482
490
  }),
483
491
  /* @__PURE__ */ S(s, {
484
- isOpen: L,
485
- onClose: () => R(!1),
492
+ isOpen: z,
493
+ onClose: () => B(!1),
486
494
  onConfirm: () => {
487
- R(!1), A("/billing");
495
+ B(!1), A("/billing");
488
496
  },
489
497
  ...d("tunnel-subdomain")
490
498
  })