@burdenoff/microfe-vibecontrols 2026.511.1

package/dist/pages/TemplatesPage.js

@@ -0,0 +1,173 @@
+import { useListTemplatesQuery as e } from "../generated/wspace-operations.js";
+import { useVibeNavigate as t } from "../providers/VibeControlsProvider.js";
+import { PageHeader as n } from "../components/shared/PageHeader.js";
+import { LoadingState as r } from "../components/shared/LoadingState.js";
+import { ErrorState as i } from "../components/shared/ErrorState.js";
+import { EmptyState as a } from "../components/shared/EmptyState.js";
+import { SearchInput as o } from "../components/shared/SearchInput.js";
+import { FilterDropdown as s } from "../components/shared/FilterDropdown.js";
+import { GetHelpButton as c } from "../components/shared/GetHelpButton.js";
+import "../components/shared/index.js";
+import { VIBE_PERMISSIONS as l } from "../constants/permissions.js";
+import { TemplateCard as u } from "../components/templates/TemplateCard.js";
+import "../components/templates/index.js";
+import { useCallback as d, useMemo as f, useState as p } from "react";
+import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { FileCode as h, RefreshCw as g } from "lucide-react";
+import { usePermissions as _ } from "@burdenoff/fe-libs/shared/providers/shell";
+import { AnimatePresence as v } from "framer-motion";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+import { MotionItem as x, MotionList as S, MotionPage as C } from "@burdenoff/fe-libs/shared/motion";
+//#region src/pages/TemplatesPage.tsx
+function w() {
+	let w = t(), { t: T } = m(), { hasPermission: E, isLoading: D } = _(), O = d((e, t, n) => {
+		let r = T(e, n), i = r === e ? t : r;
+		return n ? Object.entries(n).reduce((e, [t, n]) => e.replace(`{{${t}}}`, String(n)), i) : i;
+	}, [T]), k = [
+		{
+			value: "all",
+			label: O("template.allCategories", "All Categories")
+		},
+		{
+			value: "STARTER",
+			label: O("template.categoryStarter", "Starter")
+		},
+		{
+			value: "MICROSERVICE",
+			label: O("template.categoryMicroservice", "Microservice")
+		},
+		{
+			value: "FRONTEND",
+			label: O("template.categoryFrontend", "Frontend")
+		},
+		{
+			value: "BACKEND",
+			label: O("template.categoryBackend", "Backend")
+		},
+		{
+			value: "FULLSTACK",
+			label: O("template.categoryFullstack", "Fullstack")
+		},
+		{
+			value: "INFRASTRUCTURE",
+			label: O("template.categoryInfrastructure", "Infrastructure")
+		},
+		{
+			value: "LIBRARY",
+			label: O("template.categoryLibrary", "Library")
+		},
+		{
+			value: "CUSTOM",
+			label: O("template.categoryCustom", "Custom")
+		}
+	], [A, j] = p(""), [M, N] = p("all"), { data: P, loading: F, error: I, refetch: L } = e({
+		variables: {
+			filter: { category: M === "all" ? void 0 : M },
+			...A ? { pagination: { limit: 1e3 } } : {}
+		},
+		fetchPolicy: "cache-and-network"
+	}), R = f(() => (P?.vibecontrolsTemplates?.items ?? []).map((e) => ({
+		id: e.id,
+		name: e.name,
+		description: e.description || null,
+		category: e.category || null,
+		cloneCount: e.cloneCount || 0,
+		tags: e.tags || [],
+		createdAt: e.createdAt,
+		updatedAt: e.updatedAt
+	})), [P?.vibecontrolsTemplates?.items]), z = f(() => {
+		if (!A) return R;
+		let e = A.toLowerCase();
+		return R.filter((t) => t.name.toLowerCase().includes(e) || t.description?.toLowerCase().includes(e) || t.tags?.some((t) => t.toLowerCase().includes(e)));
+	}, [R, A]), B = (e) => {
+		w(`/templates/${e.id}`);
+	};
+	return D ? /* @__PURE__ */ y("div", {
+		className: "flex items-center justify-center min-h-[400px]",
+		children: /* @__PURE__ */ y("p", {
+			className: "text-text-secondary",
+			children: "Loading permissions..."
+		})
+	}) : E(l.VIBE_LIST) ? F && R.length === 0 ? /* @__PURE__ */ y(C, {
+		className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
+		children: /* @__PURE__ */ y(r, { message: O("template.loading", "Loading templates...") })
+	}) : I && R.length === 0 ? /* @__PURE__ */ y(C, {
+		className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
+		children: /* @__PURE__ */ y(i, {
+			title: O("template.failedLoad", "Failed to load templates"),
+			message: I.message,
+			onRetry: () => L()
+		})
+	}) : /* @__PURE__ */ b(C, {
+		className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
+		children: [
+			/* @__PURE__ */ y(n, {
+				title: O("template.title", "Templates"),
+				description: O("template.description", "{{total}} templates available", { total: R.length }),
+				actions: /* @__PURE__ */ y("button", {
+					onClick: () => L(),
+					disabled: F,
+					className: "flex items-center gap-2 px-3 py-2 text-text-secondary hover:bg-bg-sunken rounded-md transition-colors disabled:opacity-50",
+					title: O("common.refresh", "Refresh"),
+					children: /* @__PURE__ */ y(g, { className: `w-4 h-4 ${F ? "animate-spin" : ""}` })
+				})
+			}),
+			/* @__PURE__ */ b("div", {
+				className: "flex items-center gap-2 sm:gap-3 flex-wrap",
+				children: [/* @__PURE__ */ y(o, {
+					value: A,
+					onChange: j,
+					placeholder: O("template.searchPlaceholder", "Search templates..."),
+					className: "flex-1 sm:w-64 sm:flex-none"
+				}), /* @__PURE__ */ y(s, {
+					label: O("template.filterCategory", "Category"),
+					value: M,
+					options: k,
+					onChange: N
+				})]
+			}),
+			(A || M !== "all") && /* @__PURE__ */ b("p", {
+				className: "text-sm text-text-secondary",
+				children: [O("template.showingResults", "Showing {{filtered}} of {{total}} templates", {
+					filtered: z.length,
+					total: R.length
+				}), F && /* @__PURE__ */ y("span", {
+					className: "ml-2 text-text-muted",
+					children: O("common.refreshing", "(refreshing...)")
+				})]
+			}),
+			z.length > 0 ? /* @__PURE__ */ y(v, {
+				mode: "wait",
+				children: /* @__PURE__ */ y(S, {
+					stagger: .04,
+					className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4",
+					children: z.map((e) => /* @__PURE__ */ y(x, { children: /* @__PURE__ */ y(u, {
+						template: e,
+						onOpen: B
+					}) }, e.id))
+				}, "template-grid")
+			}) : /* @__PURE__ */ y(a, {
+				icon: /* @__PURE__ */ y(h, { className: "w-8 h-8 text-text-secondary" }),
+				title: A || M !== "all" ? O("template.emptyNoResults", "No templates found") : O("template.emptyNoTemplates", "No templates yet"),
+				description: A || M !== "all" ? O("template.emptyAdjustSearch", "Try adjusting your search or filters") : O("template.emptyCreate", "Templates will appear here when components are published as templates"),
+				action: !A && M === "all" ? /* @__PURE__ */ y(c, { prompt: "What is a Template in VibeControls and how do I create one?" }) : void 0
+			})
+		]
+	}) : /* @__PURE__ */ y("div", {
+		className: "flex items-center justify-center min-h-[400px]",
+		children: /* @__PURE__ */ b("div", {
+			className: "text-center space-y-2",
+			children: [/* @__PURE__ */ y("h2", {
+				className: "text-lg font-semibold text-foreground",
+				children: "Access Denied"
+			}), /* @__PURE__ */ y("p", {
+				className: "text-sm text-text-secondary",
+				children: "You don't have permission to access this page."
+			})]
+		})
+	});
+}
+//#endregion
+export { w as TemplatesPage };
+
+//# sourceMappingURL=TemplatesPage.js.map

package/dist/pages/TemplatesPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesPage.js","names":[],"sources":["../../src/pages/TemplatesPage.tsx"],"sourcesContent":["import { useState, useMemo, useCallback } from 'react';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { VIBE_PERMISSIONS } from '../constants/permissions';\nimport { FileCode, RefreshCw } from 'lucide-react';\nimport { TemplateCard } from '@/components/templates';\nimport type { TemplateCardData } from '@/components/templates';\nimport {\n  PageHeader,\n  SearchInput,\n  FilterDropdown,\n  EmptyState,\n  LoadingState,\n  ErrorState,\n  GetHelpButton,\n} from '@/components/shared';\nimport { MotionPage, MotionList, MotionItem } from '@burdenoff/fe-libs/shared/motion';\nimport { AnimatePresence } from 'framer-motion';\nimport { useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useListTemplatesQuery } from '@/generated/wspace-operations';\n\nexport function TemplatesPage() {\n  const navigate = useVibeNavigate();\n  const { t } = useI18n();\n  const { hasPermission, isLoading: permissionsLoading } = usePermissions();\n\n  const tr = useCallback(\n    (key: string, fallback: string, params?: Record<string, string | number>): string => {\n      const translated = t(key, params);\n      const template = translated === key ? fallback : translated;\n      if (!params) return template;\n      return Object.entries(params).reduce(\n        (acc, [paramKey, paramValue]) => acc.replace(`{{${paramKey}}}`, String(paramValue)),\n        template\n      );\n    },\n    [t]\n  );\n\n  const categoryOptions = [\n    { value: 'all', label: tr('template.allCategories', 'All Categories') },\n    { value: 'STARTER', label: tr('template.categoryStarter', 'Starter') },\n    { value: 'MICROSERVICE', label: tr('template.categoryMicroservice', 'Microservice') },\n    { value: 'FRONTEND', label: tr('template.categoryFrontend', 'Frontend') },\n    { value: 'BACKEND', label: tr('template.categoryBackend', 'Backend') },\n    { value: 'FULLSTACK', label: tr('template.categoryFullstack', 'Fullstack') },\n    { value: 'INFRASTRUCTURE', label: tr('template.categoryInfrastructure', 'Infrastructure') },\n    { value: 'LIBRARY', label: tr('template.categoryLibrary', 'Library') },\n    { value: 'CUSTOM', label: tr('template.categoryCustom', 'Custom') },\n  ];\n\n  const [searchQuery, setSearchQuery] = useState('');\n  const [categoryFilter, setCategoryFilter] = useState('all');\n\n  const { data, loading, error, refetch } = useListTemplatesQuery({\n    variables: {\n      filter: {\n        category: categoryFilter !== 'all' ? categoryFilter : undefined,\n      },\n      ...(searchQuery ? { pagination: { limit: 1000 } } : {}),\n    },\n    fetchPolicy: 'cache-and-network',\n  });\n\n  const templates: TemplateCardData[] = useMemo(() => {\n    const items = data?.vibecontrolsTemplates?.items ?? [];\n    return items.map((item: Record<string, unknown>) => ({\n      id: item.id as string,\n      name: item.name as string,\n      description: (item.description as string) || null,\n      category: (item.category as string) || null,\n      cloneCount: (item.cloneCount as number) || 0,\n      tags: (item.tags as string[]) || [],\n      createdAt: item.createdAt as string,\n      updatedAt: item.updatedAt as string,\n    }));\n  }, [data?.vibecontrolsTemplates?.items]);\n\n  const filteredTemplates = useMemo(() => {\n    if (!searchQuery) return templates;\n    const query = searchQuery.toLowerCase();\n    return templates.filter(\n      (tmpl) =>\n        tmpl.name.toLowerCase().includes(query) ||\n        tmpl.description?.toLowerCase().includes(query) ||\n        tmpl.tags?.some((tag) => tag.toLowerCase().includes(query))\n    );\n  }, [templates, searchQuery]);\n\n  const handleTemplateSelect = (tmpl: TemplateCardData) => {\n    navigate(`/templates/${tmpl.id}`);\n  };\n\n  if (permissionsLoading)\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <p className=\"text-text-secondary\">Loading permissions...</p>\n      </div>\n    );\n  if (!hasPermission(VIBE_PERMISSIONS.VIBE_LIST))\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <h2 className=\"text-lg font-semibold text-foreground\">Access Denied</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You don't have permission to access this page.\n          </p>\n        </div>\n      </div>\n    );\n\n  if (loading && templates.length === 0) {\n    return (\n      <MotionPage className=\"space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen\">\n        <LoadingState message={tr('template.loading', 'Loading templates...')} />\n      </MotionPage>\n    );\n  }\n\n  if (error && templates.length === 0) {\n    return (\n      <MotionPage className=\"space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen\">\n        <ErrorState\n          title={tr('template.failedLoad', 'Failed to load templates')}\n          message={error.message}\n          onRetry={() => refetch()}\n        />\n      </MotionPage>\n    );\n  }\n\n  return (\n    <MotionPage className=\"space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen\">\n      <PageHeader\n        title={tr('template.title', 'Templates')}\n        description={tr('template.description', '{{total}} templates available', {\n          total: templates.length,\n        })}\n        actions={\n          <button\n            onClick={() => refetch()}\n            disabled={loading}\n            className=\"flex items-center gap-2 px-3 py-2 text-text-secondary hover:bg-bg-sunken rounded-md transition-colors disabled:opacity-50\"\n            title={tr('common.refresh', 'Refresh')}\n          >\n            <RefreshCw className={`w-4 h-4 ${loading ? 'animate-spin' : ''}`} />\n          </button>\n        }\n      />\n\n      {/* Filters */}\n      <div className=\"flex items-center gap-2 sm:gap-3 flex-wrap\">\n        <SearchInput\n          value={searchQuery}\n          onChange={setSearchQuery}\n          placeholder={tr('template.searchPlaceholder', 'Search templates...')}\n          className=\"flex-1 sm:w-64 sm:flex-none\"\n        />\n        <FilterDropdown\n          label={tr('template.filterCategory', 'Category')}\n          value={categoryFilter}\n          options={categoryOptions}\n          onChange={setCategoryFilter}\n        />\n      </div>\n\n      {/* Results count */}\n      {(searchQuery || categoryFilter !== 'all') && (\n        <p className=\"text-sm text-text-secondary\">\n          {tr('template.showingResults', 'Showing {{filtered}} of {{total}} templates', {\n            filtered: filteredTemplates.length,\n            total: templates.length,\n          })}\n          {loading && (\n            <span className=\"ml-2 text-text-muted\">\n              {tr('common.refreshing', '(refreshing...)')}\n            </span>\n          )}\n        </p>\n      )}\n\n      {/* Grid */}\n      {filteredTemplates.length > 0 ? (\n        <AnimatePresence mode=\"wait\">\n          <MotionList\n            key=\"template-grid\"\n            stagger={0.04}\n            className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\"\n          >\n            {filteredTemplates.map((tmpl) => (\n              <MotionItem key={tmpl.id}>\n                <TemplateCard template={tmpl} onOpen={handleTemplateSelect} />\n              </MotionItem>\n            ))}\n          </MotionList>\n        </AnimatePresence>\n      ) : (\n        <EmptyState\n          icon={<FileCode className=\"w-8 h-8 text-text-secondary\" />}\n          title={\n            searchQuery || categoryFilter !== 'all'\n              ? tr('template.emptyNoResults', 'No templates found')\n              : tr('template.emptyNoTemplates', 'No templates yet')\n          }\n          description={\n            searchQuery || categoryFilter !== 'all'\n              ? tr('template.emptyAdjustSearch', 'Try adjusting your search or filters')\n              : tr(\n                  'template.emptyCreate',\n                  'Templates will appear here when components are published as templates'\n                )\n          }\n          action={\n            !searchQuery && categoryFilter === 'all' ? (\n              <GetHelpButton prompt=\"What is a Template in VibeControls and how do I create one?\" />\n            ) : undefined\n          }\n        />\n      )}\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/TunnelsLandingPage.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Tabbed landing page for /vibecontrols/tunnels.
+ *
+ * Follows the AgentsLandingPage pattern: single route, tab state lives in
+ * `?tab=`, default tab omits the query param.
+ */
+export declare function TunnelsLandingPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TunnelsLandingPage.d.ts.map

package/dist/pages/TunnelsLandingPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TunnelsLandingPage.d.ts","sourceRoot":"","sources":["../../src/pages/TunnelsLandingPage.tsx"],"names":[],"mappings":"AAYA;;;;;GAKG;AACH,wBAAgB,kBAAkB,4CA6CjC"}

package/dist/pages/TunnelsLandingPage.js

@@ -0,0 +1,69 @@
+import { useTr as e } from "../shared/hooks/useTr.js";
+import { TunnelsTab as t } from "./tunnels/TunnelsTab.js";
+import { DomainsTab as n } from "./tunnels/DomainsTab.js";
+import { SessionsTab as r } from "./tunnels/SessionsTab.js";
+import { UsageTab as i } from "./tunnels/UsageTab.js";
+import { AuditTab as a } from "./tunnels/AuditTab.js";
+import { ProvidersTab as o } from "./tunnels/ProvidersTab.js";
+import { useMemo as s } from "react";
+import { useSearchParams as c } from "react-router-dom";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Tabs as d } from "@burdenoff/fe-libs/chrome";
+//#region src/pages/TunnelsLandingPage.tsx
+function f() {
+	let f = e(), [p, m] = c(), h = s(() => [
+		{
+			id: "tunnels",
+			label: f("vibecontrols.tunnels.tabs.tunnels", "Tunnels")
+		},
+		{
+			id: "domains",
+			label: f("vibecontrols.tunnels.tabs.domains", "Domains")
+		},
+		{
+			id: "sessions",
+			label: f("vibecontrols.tunnels.tabs.sessions", "Sessions")
+		},
+		{
+			id: "usage",
+			label: f("vibecontrols.tunnels.tabs.usage", "Usage")
+		},
+		{
+			id: "audit",
+			label: f("vibecontrols.tunnels.tabs.audit", "Audit")
+		},
+		{
+			id: "providers",
+			label: f("vibecontrols.tunnels.tabs.providers", "Providers")
+		}
+	], [f]), g = p.get("tab") ?? h[0].id;
+	return /* @__PURE__ */ u("div", {
+		className: "flex flex-col h-full",
+		children: [/* @__PURE__ */ l("div", {
+			className: "border-b border-border-subtle px-4 pt-3",
+			children: /* @__PURE__ */ l(d, {
+				items: h,
+				activeTabId: g,
+				onTabChange: (e) => {
+					let t = new URLSearchParams(p);
+					e === h[0].id ? t.delete("tab") : t.set("tab", e), m(t, { replace: !0 });
+				},
+				variant: "underline"
+			})
+		}), /* @__PURE__ */ u("div", {
+			className: "flex-1 min-h-0 overflow-auto",
+			children: [
+				g === "tunnels" && /* @__PURE__ */ l(t, {}),
+				g === "domains" && /* @__PURE__ */ l(n, {}),
+				g === "sessions" && /* @__PURE__ */ l(r, {}),
+				g === "usage" && /* @__PURE__ */ l(i, {}),
+				g === "audit" && /* @__PURE__ */ l(a, {}),
+				g === "providers" && /* @__PURE__ */ l(o, {})
+			]
+		})]
+	});
+}
+//#endregion
+export { f as TunnelsLandingPage };
+
+//# sourceMappingURL=TunnelsLandingPage.js.map

package/dist/pages/TunnelsLandingPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TunnelsLandingPage.js","names":[],"sources":["../../src/pages/TunnelsLandingPage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { Tabs, type TabItem } from '@burdenoff/fe-libs/chrome';\nimport { useTr } from '../shared/hooks/useTr';\n\nimport { TunnelsTab } from './tunnels/TunnelsTab';\nimport { DomainsTab } from './tunnels/DomainsTab';\nimport { SessionsTab } from './tunnels/SessionsTab';\nimport { UsageTab } from './tunnels/UsageTab';\nimport { AuditTab } from './tunnels/AuditTab';\nimport { ProvidersTab } from './tunnels/ProvidersTab';\n\n/**\n * Tabbed landing page for /vibecontrols/tunnels.\n *\n * Follows the AgentsLandingPage pattern: single route, tab state lives in\n * `?tab=`, default tab omits the query param.\n */\nexport function TunnelsLandingPage() {\n  const tr = useTr();\n  const [params, setParams] = useSearchParams();\n\n  const tabs: TabItem[] = useMemo(\n    () => [\n      { id: 'tunnels', label: tr('vibecontrols.tunnels.tabs.tunnels', 'Tunnels') },\n      { id: 'domains', label: tr('vibecontrols.tunnels.tabs.domains', 'Domains') },\n      { id: 'sessions', label: tr('vibecontrols.tunnels.tabs.sessions', 'Sessions') },\n      { id: 'usage', label: tr('vibecontrols.tunnels.tabs.usage', 'Usage') },\n      { id: 'audit', label: tr('vibecontrols.tunnels.tabs.audit', 'Audit') },\n      { id: 'providers', label: tr('vibecontrols.tunnels.tabs.providers', 'Providers') },\n    ],\n    [tr]\n  );\n\n  const activeId = params.get('tab') ?? tabs[0].id;\n\n  const handleTabChange = (id: string) => {\n    const next = new URLSearchParams(params);\n    if (id === tabs[0].id) next.delete('tab');\n    else next.set('tab', id);\n    setParams(next, { replace: true });\n  };\n\n  return (\n    <div className=\"flex flex-col h-full\">\n      <div className=\"border-b border-border-subtle px-4 pt-3\">\n        <Tabs\n          items={tabs}\n          activeTabId={activeId}\n          onTabChange={handleTabChange}\n          variant=\"underline\"\n        />\n      </div>\n      <div className=\"flex-1 min-h-0 overflow-auto\">\n        {activeId === 'tunnels' && <TunnelsTab />}\n        {activeId === 'domains' && <DomainsTab />}\n        {activeId === 'sessions' && <SessionsTab />}\n        {activeId === 'usage' && <UsageTab />}\n        {activeId === 'audit' && <AuditTab />}\n        {activeId === 'providers' && <ProvidersTab />}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAkBA,SAAgB,IAAqB;CACnC,IAAM,IAAK,GAAO,EACZ,CAAC,GAAQ,KAAa,GAAiB,EAEvC,IAAkB,QAChB;EACJ;GAAE,IAAI;GAAW,OAAO,EAAG,qCAAqC,UAAU;GAAE;EAC5E;GAAE,IAAI;GAAW,OAAO,EAAG,qCAAqC,UAAU;GAAE;EAC5E;GAAE,IAAI;GAAY,OAAO,EAAG,sCAAsC,WAAW;GAAE;EAC/E;GAAE,IAAI;GAAS,OAAO,EAAG,mCAAmC,QAAQ;GAAE;EACtE;GAAE,IAAI;GAAS,OAAO,EAAG,mCAAmC,QAAQ;GAAE;EACtE;GAAE,IAAI;GAAa,OAAO,EAAG,uCAAuC,YAAY;GAAE;EACnF,EACD,CAAC,EAAG,CACL,EAEK,IAAW,EAAO,IAAI,MAAM,IAAI,EAAK,GAAG;AAS9C,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD;IACE,OAAO;IACP,aAAa;IACb,cAbiB,MAAe;KACtC,IAAM,IAAO,IAAI,gBAAgB,EAAO;AAGxC,KAFI,MAAO,EAAK,GAAG,KAAI,EAAK,OAAO,MAAM,GACpC,EAAK,IAAI,OAAO,EAAG,EACxB,EAAU,GAAM,EAAE,SAAS,IAAM,CAAC;;IAU5B,SAAQ;IACR,CAAA;GACE,CAAA,EACN,kBAAC,OAAD;GAAK,WAAU;aAAf;IACG,MAAa,aAAa,kBAAC,GAAD,EAAc,CAAA;IACxC,MAAa,aAAa,kBAAC,GAAD,EAAc,CAAA;IACxC,MAAa,cAAc,kBAAC,GAAD,EAAe,CAAA;IAC1C,MAAa,WAAW,kBAAC,GAAD,EAAY,CAAA;IACpC,MAAa,WAAW,kBAAC,GAAD,EAAY,CAAA;IACpC,MAAa,eAAe,kBAAC,GAAD,EAAgB,CAAA;IACzC;KACF"}

package/dist/pages/VibeAuditPage.d.ts

@@ -0,0 +1,2 @@
+export declare function VibeAuditPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=VibeAuditPage.d.ts.map

package/dist/pages/VibeAuditPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VibeAuditPage.d.ts","sourceRoot":"","sources":["../../src/pages/VibeAuditPage.tsx"],"names":[],"mappings":"AAsCA,wBAAgB,aAAa,4CA+V5B"}

package/dist/pages/VibeAuditPage.js

@@ -0,0 +1,233 @@
+import { useBulkDeleteVibeAuditLogsMutation as e, useDeleteVibeAuditLogMutation as t, useGetVibeAuditLogQuery as n, useVibeAuditDashboardQuery as r } from "../generated/wspace-operations.js";
+import { useVibeControls as ee } from "../providers/VibeControlsProvider.js";
+import { PageHeader as te } from "../components/shared/PageHeader.js";
+import { LoadingState as i } from "../components/shared/LoadingState.js";
+import { ErrorState as a } from "../components/shared/ErrorState.js";
+import { isNative as o, nativeNotify as s } from "../utils/nativeBridge.js";
+import { EmptyState as ne } from "../components/shared/EmptyState.js";
+import { GetHelpButton as re } from "../components/shared/GetHelpButton.js";
+import "../components/shared/index.js";
+import { VIBE_PERMISSIONS as c } from "../constants/permissions.js";
+import { AuditLogTable as l } from "../components/audit/AuditLogTable.js";
+import { AuditLogFilters as ie } from "../components/audit/AuditLogFilters.js";
+import { AuditLogDetail as ae } from "../components/audit/AuditLogDetail.js";
+import { AuditLogStats as oe } from "../components/audit/AuditLogStats.js";
+import { AuditDeleteDialog as se } from "../components/audit/AuditDeleteDialog.js";
+import { AuditExportButton as ce } from "../components/audit/AuditExportButton.js";
+import "../components/audit/index.js";
+import { useCallback as u, useEffect as le, useRef as ue, useState as d } from "react";
+import { useI18n as f } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { Shield as de } from "lucide-react";
+import { usePermissions as fe } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { AccessDenied as pe } from "@burdenoff/fe-libs/shared/components";
+//#region src/pages/VibeAuditPage.tsx
+var h = 50;
+function g() {
+	ee();
+	let { t: g } = f(), { hasPermission: _, isLoading: v, permissions: y } = fe(), [b, me] = d(""), [x, he] = d("all"), [S, C] = d("all"), [w, ge] = d("all"), [T, _e] = d(!1), [E, D] = d(0), [O, k] = d(null), [A, j] = d(/* @__PURE__ */ new Set()), [M, N] = d([]), [P, F] = d(null), [I, L] = d(null), R = ue(null), z = u((e, t) => {
+		let n = g(e);
+		return n === e ? t : n;
+	}, [g]), B = _(c.AUDIT_LIST), V = _(c.AUDIT_DELETE), ve = v || !B, H = {};
+	b && (H.search = b), x && x !== "all" && (H.action = x), S && S !== "all" && (H.resourceType = S), w && w !== "all" && (H.status = w), T && (H.hasCommand = !0);
+	let { data: U, loading: W, error: G, refetch: K } = r({
+		variables: {
+			filter: H,
+			pagination: { limit: Math.min(Math.max((E + 1) * h, h), 100) }
+		},
+		skip: ve,
+		fetchPolicy: "cache-and-network",
+		notifyOnNetworkStatusChange: !0
+	}), { data: q } = n({
+		variables: { id: O },
+		skip: !O
+	}), [ye, { loading: be }] = t(), [xe] = e();
+	le(() => () => {
+		R.current && clearTimeout(R.current);
+	}, []);
+	let J = u(() => {
+		F(null), R.current &&= (clearTimeout(R.current), null);
+	}, []), Y = u(() => {
+		L(null);
+	}, []), X = (U?.vibeAuditLogs.items ?? []).slice(E * h, (E + 1) * h), Z = U?.vibeAuditLogs.total ?? 0, Q = X.map((e) => e.id), $ = Q.length > 0 && Q.every((e) => A.has(e)), Se = Q.some((e) => A.has(e)) && !$, Ce = async (e) => {
+		if (M.length !== 0) {
+			J(), Y();
+			try {
+				if (M.length === 1) await ye({ variables: {
+					id: M[0],
+					input: { reason: e }
+				} }), L("Deleted 1 audit log");
+				else {
+					let t = await xe({ variables: {
+						ids: M,
+						input: { reason: e }
+					} }), n = t.data?.bulkDeleteVibeAuditLogs.deletedCount ?? 0, r = t.data?.bulkDeleteVibeAuditLogs.failedCount ?? 0;
+					L(`Deleted ${n} audit logs${r > 0 ? ` • ${r} failed` : ""}`);
+				}
+				N([]), j((e) => {
+					let t = new Set(e);
+					return M.forEach((e) => t.delete(e)), t;
+				}), O && M.includes(O) && k(null), await K(), o() && s("success");
+			} catch (e) {
+				console.error("Failed to delete audit log:", e), F(z("audit.deleteFailed", "Failed to delete audit log. Please try again.")), o() && s("error"), R.current = setTimeout(() => {
+					F(null), R.current = null;
+				}, 3e4);
+			}
+		}
+	}, we = u((e) => {
+		V && (J(), Y(), N([e]));
+	}, [
+		V,
+		J,
+		Y
+	]), Te = u((e, t) => {
+		j((n) => {
+			let r = new Set(n);
+			return t ? r.add(e) : r.delete(e), r;
+		});
+	}, []), Ee = u((e) => {
+		j((t) => {
+			let n = new Set(t);
+			return Q.forEach((t) => {
+				e ? n.add(t) : n.delete(t);
+			}), n;
+		});
+	}, [Q]), De = u(() => {
+		!V || A.size === 0 || (J(), Y(), N(Array.from(A)));
+	}, [
+		V,
+		J,
+		Y,
+		A
+	]);
+	return !v && y && y.permissionStrings?.length > 0 && !B ? /* @__PURE__ */ p(pe, {
+		title: z("common.accessDeniedTitle", "Access Denied"),
+		description: z("common.accessDeniedDescription", "You don't have permission to access this resource.")
+	}) : /* @__PURE__ */ m("div", {
+		className: "mx-auto max-w-[1400px] p-4 sm:p-6",
+		children: [
+			/* @__PURE__ */ p(te, {
+				title: z("nav.vibeAudit", "Audit"),
+				description: z("audit.description", "Comprehensive audit trail of all VibeControls operations"),
+				actions: /* @__PURE__ */ p(ce, { filter: H })
+			}),
+			/* @__PURE__ */ p(oe, {
+				stats: U?.vibeAuditLogStats,
+				loading: W && !U
+			}),
+			/* @__PURE__ */ p(ie, {
+				searchQuery: b,
+				onSearchChange: (e) => {
+					me(e), D(0);
+				},
+				actionFilter: x,
+				onActionChange: (e) => {
+					he(e), D(0);
+				},
+				resourceTypeFilter: S,
+				onResourceTypeChange: (e) => {
+					C(e), D(0);
+				},
+				statusFilter: w,
+				onStatusChange: (e) => {
+					ge(e), D(0);
+				},
+				hasCommandFilter: T,
+				onHasCommandChange: (e) => {
+					_e(e), D(0);
+				}
+			}),
+			X.length > 0 ? /* @__PURE__ */ p("div", {
+				className: "rounded-lg border border-border-primary bg-bg-surface p-4",
+				children: /* @__PURE__ */ m("div", {
+					className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between",
+					children: [/* @__PURE__ */ m("div", {
+						className: "flex flex-wrap items-center gap-3",
+						children: [/* @__PURE__ */ m("span", {
+							className: "text-sm font-medium text-text-primary",
+							children: [A.size, " selected"]
+						}), A.size > 0 ? /* @__PURE__ */ p("button", {
+							type: "button",
+							onClick: () => j(/* @__PURE__ */ new Set()),
+							className: "text-sm text-text-secondary transition-colors hover:text-text-primary",
+							children: "Clear selection"
+						}) : null]
+					}), /* @__PURE__ */ p("div", {
+						className: "flex flex-wrap items-center gap-2",
+						children: /* @__PURE__ */ m("button", {
+							type: "button",
+							onClick: De,
+							disabled: !V || A.size === 0,
+							className: "rounded-md border border-status-error-border px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg disabled:cursor-not-allowed disabled:opacity-50",
+							children: ["Delete Selected", A.size > 0 ? ` (${A.size})` : ""]
+						})
+					})]
+				})
+			}) : null,
+			W && !U ? /* @__PURE__ */ p(i, { message: z("audit.loadingLogs", "Loading audit logs...") }) : G ? /* @__PURE__ */ p(a, {
+				message: G.message,
+				onRetry: () => K()
+			}) : Z === 0 ? /* @__PURE__ */ p(ne, {
+				icon: /* @__PURE__ */ p(de, {
+					size: 48,
+					className: "text-text-secondary"
+				}),
+				title: z("audit.noLogs", "No audit logs"),
+				description: z("audit.emptyDescription", "Audit logs will appear here as operations are performed in VibeControls."),
+				action: /* @__PURE__ */ p(re, { prompt: "What is the Audit Log in VibeControls and how do I use it?" })
+			}) : /* @__PURE__ */ p(l, {
+				items: X,
+				total: Z,
+				hasMore: U?.vibeAuditLogs.hasMore ?? !1,
+				page: E,
+				pageSize: h,
+				onPageChange: D,
+				onSelectLog: k,
+				onDeleteLog: we,
+				selectedLogId: O,
+				selectedLogIds: A,
+				allVisibleSelected: $,
+				partiallySelected: Se,
+				onToggleLogSelection: Te,
+				onToggleAllVisible: Ee
+			}),
+			O && q?.vibeAuditLog ? /* @__PURE__ */ p(ae, {
+				log: q.vibeAuditLog,
+				onClose: () => k(null)
+			}) : null,
+			P ? /* @__PURE__ */ m("div", {
+				role: "alert",
+				className: "fixed bottom-4 right-4 z-50 rounded-md bg-status-error-bg px-4 py-3 text-sm text-status-error-text shadow-lg",
+				children: [P, /* @__PURE__ */ p("button", {
+					type: "button",
+					onClick: J,
+					className: "ml-3 text-xs underline opacity-80 hover:opacity-100",
+					children: z("common.dismiss", "Dismiss")
+				})]
+			}) : null,
+			I ? /* @__PURE__ */ m("div", {
+				role: "status",
+				className: "fixed bottom-4 right-4 z-50 rounded-md bg-status-success-bg px-4 py-3 text-sm text-status-success-text shadow-lg",
+				children: [I, /* @__PURE__ */ p("button", {
+					type: "button",
+					onClick: Y,
+					className: "ml-3 text-xs underline opacity-80 hover:opacity-100",
+					children: z("common.dismiss", "Dismiss")
+				})]
+			}) : null,
+			/* @__PURE__ */ p(se, {
+				isOpen: M.length > 0,
+				onClose: () => N([]),
+				onConfirm: Ce,
+				loading: be,
+				title: M.length > 1 ? "Delete Audit Logs" : "Delete Audit Log",
+				description: M.length > 1 ? `This will permanently delete ${M.length} audit logs and record the reason in the audit trail.` : "This action will be recorded in the audit trail.",
+				confirmLabel: M.length > 1 ? "Delete Logs" : "Delete"
+			})
+		]
+	});
+}
+//#endregion
+export { g as VibeAuditPage };
+
+//# sourceMappingURL=VibeAuditPage.js.map

package/dist/pages/VibeAuditPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VibeAuditPage.js","names":[],"sources":["../../src/pages/VibeAuditPage.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { Shield } from 'lucide-react';\nimport { AccessDenied } from '@burdenoff/fe-libs/shared/components';\nimport { isNative, nativeNotify } from '../utils/nativeBridge';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n  AuditDeleteDialog,\n  AuditExportButton,\n  AuditLogDetail,\n  AuditLogFilters,\n  AuditLogStats,\n  AuditLogTable,\n} from '@/components/audit';\nimport {\n  EmptyState,\n  ErrorState,\n  GetHelpButton,\n  LoadingState,\n  PageHeader,\n} from '@/components/shared';\nimport { VIBE_PERMISSIONS } from '@/constants/permissions';\nimport {\n  useBulkDeleteVibeAuditLogsMutation,\n  useDeleteVibeAuditLogMutation,\n  useGetVibeAuditLogQuery,\n  useVibeAuditDashboardQuery,\n} from '@/generated/wspace-operations';\nimport type {\n  VibeAuditAction,\n  VibeAuditLogFilterInput,\n  VibeAuditResourceType,\n  VibeAuditStatus,\n} from '@/generated/wspace-types';\nimport { useVibeControls } from '@/providers/VibeControlsProvider';\n\nconst PAGE_SIZE = 50;\n\nexport function VibeAuditPage() {\n  useVibeControls();\n\n  const { t } = useI18n();\n  const { hasPermission, isLoading: permissionsLoading, permissions } = usePermissions();\n\n  const [searchQuery, setSearchQuery] = useState('');\n  const [actionFilter, setActionFilter] = useState<string | null>('all');\n  const [resourceTypeFilter, setResourceTypeFilter] = useState<string | null>('all');\n  const [statusFilter, setStatusFilter] = useState<string | null>('all');\n  const [hasCommandFilter, setHasCommandFilter] = useState(false);\n  const [page, setPage] = useState(0);\n  const [selectedLogId, setSelectedLogId] = useState<string | null>(null);\n  const [selectedLogIds, setSelectedLogIds] = useState<Set<string>>(new Set());\n  const [deleteTargetIds, setDeleteTargetIds] = useState<string[]>([]);\n  const [deleteError, setDeleteError] = useState<string | null>(null);\n  const [deleteSuccess, setDeleteSuccess] = useState<string | null>(null);\n\n  const deleteErrorTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const tr = useCallback(\n    (key: string, fallback: string): string => {\n      const value = t(key);\n      return value === key ? fallback : value;\n    },\n    [t]\n  );\n\n  const canListAudit = hasPermission(VIBE_PERMISSIONS.AUDIT_LIST);\n  const canDeleteAudit = hasPermission(VIBE_PERMISSIONS.AUDIT_DELETE);\n  const shouldSkipQueries = permissionsLoading || !canListAudit;\n\n  const filter: VibeAuditLogFilterInput = {};\n  if (searchQuery) filter.search = searchQuery;\n  if (actionFilter && actionFilter !== 'all') filter.action = actionFilter as VibeAuditAction;\n  if (resourceTypeFilter && resourceTypeFilter !== 'all')\n    filter.resourceType = resourceTypeFilter as VibeAuditResourceType;\n  if (statusFilter && statusFilter !== 'all') filter.status = statusFilter as VibeAuditStatus;\n  if (hasCommandFilter) filter.hasCommand = true;\n\n  const { data, loading, error, refetch } = useVibeAuditDashboardQuery({\n    variables: {\n      filter,\n      pagination: { limit: Math.min(Math.max((page + 1) * PAGE_SIZE, PAGE_SIZE), 100) },\n    },\n    skip: shouldSkipQueries,\n    fetchPolicy: 'cache-and-network',\n    notifyOnNetworkStatusChange: true,\n  });\n\n  const { data: detailData } = useGetVibeAuditLogQuery({\n    variables: { id: selectedLogId! },\n    skip: !selectedLogId,\n  });\n\n  const [deleteAuditLog, { loading: deleteLoading }] = useDeleteVibeAuditLogMutation();\n  const [bulkDeleteAuditLogs] = useBulkDeleteVibeAuditLogsMutation();\n\n  useEffect(() => {\n    return () => {\n      if (deleteErrorTimer.current) {\n        clearTimeout(deleteErrorTimer.current);\n      }\n    };\n  }, []);\n\n  const clearDeleteError = useCallback(() => {\n    setDeleteError(null);\n    if (deleteErrorTimer.current) {\n      clearTimeout(deleteErrorTimer.current);\n      deleteErrorTimer.current = null;\n    }\n  }, []);\n\n  const clearDeleteSuccess = useCallback(() => {\n    setDeleteSuccess(null);\n  }, []);\n\n  const allItems = data?.vibeAuditLogs.items ?? [];\n  const items = allItems.slice(page * PAGE_SIZE, (page + 1) * PAGE_SIZE);\n  const totalAuditItems = data?.vibeAuditLogs.total ?? 0;\n  const visibleLogIds = items.map((item: (typeof items)[number]) => item.id);\n  const allVisibleSelected =\n    visibleLogIds.length > 0 && visibleLogIds.every((id: string) => selectedLogIds.has(id));\n  const partiallySelected =\n    visibleLogIds.some((id: string) => selectedLogIds.has(id)) && !allVisibleSelected;\n\n  const handleDelete = async (reason: string) => {\n    if (deleteTargetIds.length === 0) return;\n\n    clearDeleteError();\n    clearDeleteSuccess();\n\n    try {\n      if (deleteTargetIds.length === 1) {\n        await deleteAuditLog({ variables: { id: deleteTargetIds[0], input: { reason } } });\n        setDeleteSuccess('Deleted 1 audit log');\n      } else {\n        const result = await bulkDeleteAuditLogs({\n          variables: { ids: deleteTargetIds, input: { reason } },\n        });\n        const deletedCount = result.data?.bulkDeleteVibeAuditLogs.deletedCount ?? 0;\n        const failedCount = result.data?.bulkDeleteVibeAuditLogs.failedCount ?? 0;\n        setDeleteSuccess(\n          `Deleted ${deletedCount} audit logs${failedCount > 0 ? ` • ${failedCount} failed` : ''}`\n        );\n      }\n\n      setDeleteTargetIds([]);\n      setSelectedLogIds((previous) => {\n        const next = new Set(previous);\n        deleteTargetIds.forEach((id) => next.delete(id));\n        return next;\n      });\n      if (selectedLogId && deleteTargetIds.includes(selectedLogId)) {\n        setSelectedLogId(null);\n      }\n      await refetch();\n      if (isNative()) void nativeNotify('success');\n    } catch (deleteAuditError) {\n      console.error('Failed to delete audit log:', deleteAuditError);\n      setDeleteError(tr('audit.deleteFailed', 'Failed to delete audit log. Please try again.'));\n      if (isNative()) void nativeNotify('error');\n      deleteErrorTimer.current = setTimeout(() => {\n        setDeleteError(null);\n        deleteErrorTimer.current = null;\n      }, 30000);\n    }\n  };\n\n  const handleOpenDelete = useCallback(\n    (id: string) => {\n      if (!canDeleteAudit) return;\n      clearDeleteError();\n      clearDeleteSuccess();\n      setDeleteTargetIds([id]);\n    },\n    [canDeleteAudit, clearDeleteError, clearDeleteSuccess]\n  );\n\n  const handleToggleLogSelection = useCallback((id: string, checked: boolean) => {\n    setSelectedLogIds((previous) => {\n      const next = new Set(previous);\n      if (checked) {\n        next.add(id);\n      } else {\n        next.delete(id);\n      }\n      return next;\n    });\n  }, []);\n\n  const handleToggleAllVisible = useCallback(\n    (checked: boolean) => {\n      setSelectedLogIds((previous) => {\n        const next = new Set(previous);\n        visibleLogIds.forEach((id: string) => {\n          if (checked) {\n            next.add(id);\n          } else {\n            next.delete(id);\n          }\n        });\n        return next;\n      });\n    },\n    [visibleLogIds]\n  );\n\n  const handleOpenBulkDelete = useCallback(() => {\n    if (!canDeleteAudit || selectedLogIds.size === 0) return;\n    clearDeleteError();\n    clearDeleteSuccess();\n    setDeleteTargetIds(Array.from(selectedLogIds));\n  }, [canDeleteAudit, clearDeleteError, clearDeleteSuccess, selectedLogIds]);\n\n  if (\n    !permissionsLoading &&\n    permissions &&\n    permissions.permissionStrings?.length > 0 &&\n    !canListAudit\n  ) {\n    return (\n      <AccessDenied\n        title={tr('common.accessDeniedTitle', 'Access Denied')}\n        description={tr(\n          'common.accessDeniedDescription',\n          \"You don't have permission to access this resource.\"\n        )}\n      />\n    );\n  }\n\n  return (\n    <div className=\"mx-auto max-w-[1400px] p-4 sm:p-6\">\n      <PageHeader\n        title={tr('nav.vibeAudit', 'Audit')}\n        description={tr(\n          'audit.description',\n          'Comprehensive audit trail of all VibeControls operations'\n        )}\n        actions={<AuditExportButton filter={filter} />}\n      />\n\n      <AuditLogStats stats={data?.vibeAuditLogStats} loading={loading && !data} />\n\n      <AuditLogFilters\n        searchQuery={searchQuery}\n        onSearchChange={(query) => {\n          setSearchQuery(query);\n          setPage(0);\n        }}\n        actionFilter={actionFilter}\n        onActionChange={(value) => {\n          setActionFilter(value);\n          setPage(0);\n        }}\n        resourceTypeFilter={resourceTypeFilter}\n        onResourceTypeChange={(value) => {\n          setResourceTypeFilter(value);\n          setPage(0);\n        }}\n        statusFilter={statusFilter}\n        onStatusChange={(value) => {\n          setStatusFilter(value);\n          setPage(0);\n        }}\n        hasCommandFilter={hasCommandFilter}\n        onHasCommandChange={(value) => {\n          setHasCommandFilter(value);\n          setPage(0);\n        }}\n      />\n\n      {items.length > 0 ? (\n        <div className=\"rounded-lg border border-border-primary bg-bg-surface p-4\">\n          <div className=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\n            <div className=\"flex flex-wrap items-center gap-3\">\n              <span className=\"text-sm font-medium text-text-primary\">\n                {selectedLogIds.size} selected\n              </span>\n              {selectedLogIds.size > 0 ? (\n                <button\n                  type=\"button\"\n                  onClick={() => setSelectedLogIds(new Set())}\n                  className=\"text-sm text-text-secondary transition-colors hover:text-text-primary\"\n                >\n                  Clear selection\n                </button>\n              ) : null}\n            </div>\n            <div className=\"flex flex-wrap items-center gap-2\">\n              <button\n                type=\"button\"\n                onClick={handleOpenBulkDelete}\n                disabled={!canDeleteAudit || selectedLogIds.size === 0}\n                className=\"rounded-md border border-status-error-border px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg disabled:cursor-not-allowed disabled:opacity-50\"\n              >\n                Delete Selected{selectedLogIds.size > 0 ? ` (${selectedLogIds.size})` : ''}\n              </button>\n            </div>\n          </div>\n        </div>\n      ) : null}\n\n      {loading && !data ? (\n        <LoadingState message={tr('audit.loadingLogs', 'Loading audit logs...')} />\n      ) : error ? (\n        <ErrorState message={error.message} onRetry={() => refetch()} />\n      ) : totalAuditItems === 0 ? (\n        <EmptyState\n          icon={<Shield size={48} className=\"text-text-secondary\" />}\n          title={tr('audit.noLogs', 'No audit logs')}\n          description={tr(\n            'audit.emptyDescription',\n            'Audit logs will appear here as operations are performed in VibeControls.'\n          )}\n          action={\n            <GetHelpButton prompt=\"What is the Audit Log in VibeControls and how do I use it?\" />\n          }\n        />\n      ) : (\n        <AuditLogTable\n          items={items}\n          total={totalAuditItems}\n          hasMore={data?.vibeAuditLogs.hasMore ?? false}\n          page={page}\n          pageSize={PAGE_SIZE}\n          onPageChange={setPage}\n          onSelectLog={setSelectedLogId}\n          onDeleteLog={handleOpenDelete}\n          selectedLogId={selectedLogId}\n          selectedLogIds={selectedLogIds}\n          allVisibleSelected={allVisibleSelected}\n          partiallySelected={partiallySelected}\n          onToggleLogSelection={handleToggleLogSelection}\n          onToggleAllVisible={handleToggleAllVisible}\n        />\n      )}\n\n      {selectedLogId && detailData?.vibeAuditLog ? (\n        <AuditLogDetail log={detailData.vibeAuditLog} onClose={() => setSelectedLogId(null)} />\n      ) : null}\n\n      {deleteError ? (\n        <div\n          role=\"alert\"\n          className=\"fixed bottom-4 right-4 z-50 rounded-md bg-status-error-bg px-4 py-3 text-sm text-status-error-text shadow-lg\"\n        >\n          {deleteError}\n          <button\n            type=\"button\"\n            onClick={clearDeleteError}\n            className=\"ml-3 text-xs underline opacity-80 hover:opacity-100\"\n          >\n            {tr('common.dismiss', 'Dismiss')}\n          </button>\n        </div>\n      ) : null}\n\n      {deleteSuccess ? (\n        <div\n          role=\"status\"\n          className=\"fixed bottom-4 right-4 z-50 rounded-md bg-status-success-bg px-4 py-3 text-sm text-status-success-text shadow-lg\"\n        >\n          {deleteSuccess}\n          <button\n            type=\"button\"\n            onClick={clearDeleteSuccess}\n            className=\"ml-3 text-xs underline opacity-80 hover:opacity-100\"\n          >\n            {tr('common.dismiss', 'Dismiss')}\n          </button>\n        </div>\n      ) : null}\n\n      <AuditDeleteDialog\n        isOpen={deleteTargetIds.length > 0}\n        onClose={() => setDeleteTargetIds([])}\n        onConfirm={handleDelete}\n        loading={deleteLoading}\n        title={deleteTargetIds.length > 1 ? 'Delete Audit Logs' : 'Delete Audit Log'}\n        description={\n          deleteTargetIds.length > 1\n            ? `This will permanently delete ${deleteTargetIds.length} audit logs and record the reason in the audit trail.`\n            : 'This action will be recorded in the audit trail.'\n        }\n        confirmLabel={deleteTargetIds.length > 1 ? 'Delete Logs' : 'Delete'}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/VibeCalendarPage.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Calendar Page
+ *
+ * Main page for scheduling and managing tasks on VibeControls agents.
+ * Supports month and agenda views with task creation, on-demand triggering,
+ * and log viewing via the LogsDrawer.
+ */
+export declare function VibeCalendarPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=VibeCalendarPage.d.ts.map

package/dist/pages/VibeCalendarPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VibeCalendarPage.d.ts","sourceRoot":"","sources":["../../src/pages/VibeCalendarPage.tsx"],"names":[],"mappings":"AA0EA;;;;;;GAMG;AACH,wBAAgB,gBAAgB,4CAuU/B"}