@burdenoff/microfe-botmanor 2026.813.1

package/dist/botlit/pages/ExecutionsPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExecutionsPage.js","names":[],"sources":["../../../src/botlit/pages/ExecutionsPage.tsx"],"sourcesContent":["/**\n * Executions Page\n * @module botlit/pages\n */\n\nimport type { FC } from 'react';\nimport { useMemo, useState } from 'react';\nimport { Link } from 'react-router';\nimport { useBotlit } from '../providers/BotlitProvider';\nimport {\n  Search as SearchIcon,\n  Activity,\n  CheckCircle,\n  XCircle,\n  Clock,\n  DollarSign,\n  Zap,\n  RefreshCw,\n  TrendingUp,\n  Hourglass,\n} from 'lucide-react';\nimport { PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../components/PageLayout';\nimport { Card, CardContent } from '../components/Card';\nimport { Button } from '../components/Button';\nimport { Input } from '../components/Input';\nimport { Badge } from '../components/Badge';\nimport { EmptyState } from '../components/EmptyState';\nimport { ErrorState } from '../components/ErrorState';\nimport { useExecutions, summariseExecutions, type ExecutionRecord } from '../hooks';\nimport {\n  formatNumber,\n  formatRelativeTime,\n  formatCurrency,\n  formatDuration,\n  MISSING_VALUE,\n} from '../utils/formatters';\nimport { ExecutionStatus as GqlExecutionStatus } from '../../generated/wspace-types';\n\n/**\n * The statuses wspace-botlit-svc actually reports. These MUST match the\n * `ExecutionStatus` enum in the supergraph — sending anything else fails\n * GraphQL validation at the gateway.\n */\nconst EXECUTION_STATUSES: GqlExecutionStatus[] = [\n  GqlExecutionStatus.Completed,\n  GqlExecutionStatus.Running,\n  GqlExecutionStatus.Pending,\n  GqlExecutionStatus.Failed,\n  GqlExecutionStatus.Timeout,\n  GqlExecutionStatus.Cancelled,\n];\n\nconst STATUS_LABELS: Record<GqlExecutionStatus, string> = {\n  [GqlExecutionStatus.Completed]: 'Completed',\n  [GqlExecutionStatus.Running]: 'Running',\n  [GqlExecutionStatus.Pending]: 'Pending',\n  [GqlExecutionStatus.Failed]: 'Failed',\n  [GqlExecutionStatus.Timeout]: 'Timed out',\n  [GqlExecutionStatus.Cancelled]: 'Cancelled',\n};\n\nconst StatusIcon: FC<{ status: string; className?: string }> = ({ status, className }) => {\n  switch (status) {\n    case GqlExecutionStatus.Completed:\n      return <CheckCircle className={className ?? 'h-4 w-4 text-status-success-text'} />;\n    case GqlExecutionStatus.Failed:\n    case GqlExecutionStatus.Timeout:\n      return <XCircle className={className ?? 'h-4 w-4 text-status-error-text'} />;\n    case GqlExecutionStatus.Running:\n      return (\n        <RefreshCw\n          className={className ?? 'h-4 w-4 text-status-info-text motion-safe:animate-spin'}\n        />\n      );\n    case GqlExecutionStatus.Pending:\n      return <Hourglass className={className ?? 'h-4 w-4 text-status-warning-text'} />;\n    default:\n      return <Activity className={className ?? 'h-4 w-4 text-text-secondary'} />;\n  }\n};\n\nconst StatusBadge: FC<{ status: string }> = ({ status }) => {\n  const variants: Record<string, 'success' | 'destructive' | 'warning' | 'secondary' | 'default'> =\n    {\n      [GqlExecutionStatus.Completed]: 'success',\n      [GqlExecutionStatus.Failed]: 'destructive',\n      [GqlExecutionStatus.Timeout]: 'destructive',\n      [GqlExecutionStatus.Running]: 'default',\n      [GqlExecutionStatus.Pending]: 'warning',\n      [GqlExecutionStatus.Cancelled]: 'secondary',\n    };\n\n  return (\n    <Badge variant={variants[status] ?? 'secondary'} className=\"flex items-center gap-1\">\n      <StatusIcon status={status} />\n      {STATUS_LABELS[status as GqlExecutionStatus] ?? status}\n    </Badge>\n  );\n};\n\nexport const ExecutionsPage: FC = () => {\n  const { getPath } = useBotlit();\n  const [search, setSearch] = useState('');\n  const [statusFilter, setStatusFilter] = useState<GqlExecutionStatus[]>([]);\n\n  const filter = useMemo(\n    () => ({ search, status: statusFilter as string[] }),\n    [search, statusFilter]\n  );\n  const { data: executions, loading, error, refetch } = useExecutions(filter);\n\n  // No server-side aggregate exists for executions — these numbers describe the\n  // runs currently loaded, and the caption below says so.\n  const rollup = useMemo(() => summariseExecutions(executions), [executions]);\n\n  return (\n    <PageLayout\n      title=\"Executions\"\n      description=\"Monitor agent execution history, performance, and costs\"\n      actions={\n        <Button variant=\"outline\" leftIcon={<RefreshCw size={16} />} onClick={() => void refetch()}>\n          Refresh\n        </Button>\n      }\n    >\n      <div className=\"space-y-6\">\n        <PagePurpose icon={<Activity size={18} />}>\n          An execution is a single run of an agent — one request in, one response out. This page is\n          your observability and cost dashboard: see which runs succeeded or failed, how long they\n          took, how many tokens they burned and what they cost. Use it to spot failing agents,\n          runaway spend and latency regressions, then open any run to inspect its full trace.\n        </PagePurpose>\n\n        {/* Stats over the loaded runs */}\n        {rollup.total > 0 && (\n          <div className=\"space-y-2\">\n            <div className=\"grid grid-cols-2 md:grid-cols-4 gap-4\">\n              <Card treatment=\"glass\" glow>\n                <CardContent className=\"pt-6\">\n                  <div className=\"flex items-center justify-between\">\n                    <div>\n                      <p className=\"text-sm text-text-secondary\">Executions</p>\n                      <p className=\"text-2xl font-bold tabular-nums\">\n                        {formatNumber(rollup.total)}\n                      </p>\n                    </div>\n                    <Activity className=\"h-8 w-8 text-text-secondary\" />\n                  </div>\n                </CardContent>\n              </Card>\n              <Card treatment=\"metric\">\n                <CardContent className=\"pt-6\">\n                  <div className=\"flex items-center justify-between\">\n                    <div>\n                      <p className=\"text-sm text-text-secondary\">Success Rate</p>\n                      <p className=\"text-2xl font-bold tabular-nums text-status-success-text\">\n                        {(rollup.successRate * 100).toFixed(1)}%\n                      </p>\n                    </div>\n                    <TrendingUp className=\"h-8 w-8 text-status-success-text\" />\n                  </div>\n                </CardContent>\n              </Card>\n              <Card treatment=\"metric\">\n                <CardContent className=\"pt-6\">\n                  <div className=\"flex items-center justify-between\">\n                    <div>\n                      <p className=\"text-sm text-text-secondary\">Avg Duration</p>\n                      <p className=\"text-2xl font-bold tabular-nums\">\n                        {formatDuration(rollup.avgDurationMs)}\n                      </p>\n                    </div>\n                    <Clock className=\"h-8 w-8 text-text-secondary\" />\n                  </div>\n                </CardContent>\n              </Card>\n              <Card treatment=\"metric\">\n                <CardContent className=\"pt-6\">\n                  <div className=\"flex items-center justify-between\">\n                    <div>\n                      <p className=\"text-sm text-text-secondary\">Total Cost</p>\n                      <p className=\"text-2xl font-bold tabular-nums\">\n                        {formatCurrency(rollup.totalCost)}\n                      </p>\n                    </div>\n                    <DollarSign className=\"h-8 w-8 text-text-secondary\" />\n                  </div>\n                </CardContent>\n              </Card>\n            </div>\n            <p className=\"text-xs text-text-secondary\">\n              Calculated across the {formatNumber(rollup.total)} runs shown below.\n            </p>\n          </div>\n        )}\n\n        {/* Filters */}\n        <div className=\"flex flex-wrap items-center gap-4\">\n          <div className=\"relative flex-1 max-w-md\">\n            <SearchIcon className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n            <Input\n              placeholder=\"Search by run, agent, bot or input…\"\n              value={search}\n              onChange={(e) => setSearch(e.target.value)}\n              className=\"pl-9\"\n            />\n          </div>\n          <div className=\"flex flex-wrap gap-2\">\n            {EXECUTION_STATUSES.map((status) => (\n              <Button\n                key={status}\n                variant={statusFilter.includes(status) ? 'default' : 'outline'}\n                size=\"sm\"\n                onClick={() =>\n                  setStatusFilter((prev) =>\n                    prev.includes(status) ? prev.filter((s) => s !== status) : [...prev, status]\n                  )\n                }\n              >\n                <StatusIcon status={status} />\n                <span className=\"ml-1\">{STATUS_LABELS[status]}</span>\n              </Button>\n            ))}\n          </div>\n        </div>\n\n        {/* Executions List */}\n        {loading ? (\n          <div className=\"space-y-4\">\n            {[1, 2, 3, 4, 5].map((i) => (\n              <div\n                key={i}\n                className=\"h-20 bg-bg-sunken motion-safe:animate-vc-shimmer rounded-lg\"\n              />\n            ))}\n          </div>\n        ) : error ? (\n          <ErrorState resource=\"executions\" error={error} onRetry={() => void refetch()} />\n        ) : executions.length > 0 ? (\n          <div className=\"space-y-2\">\n            {/* Table Header */}\n            <div className=\"grid grid-cols-12 gap-4 px-4 py-2 text-sm font-medium text-text-secondary border-b border-border-subtle\">\n              <div className=\"col-span-2\">Status</div>\n              <div className=\"col-span-3\">Bot / Agent</div>\n              <div className=\"col-span-2\">Duration</div>\n              <div className=\"col-span-2\">Tokens</div>\n              <div className=\"col-span-1\">Cost</div>\n              <div className=\"col-span-2\">Started</div>\n            </div>\n\n            {/* Table Rows */}\n            {executions.map((execution: ExecutionRecord) => (\n              <Link key={execution.id} to={getPath(`executions/${execution.id}`)}>\n                <Card className=\"hover:border-primary/50 transition-colors cursor-pointer\">\n                  <CardContent className=\"py-3\">\n                    <div className=\"grid grid-cols-12 gap-4 items-center\">\n                      <div className=\"col-span-2\">\n                        <StatusBadge status={execution.status} />\n                      </div>\n                      <div className=\"col-span-3\">\n                        <p className=\"font-medium truncate\">{execution.appId ?? MISSING_VALUE}</p>\n                        <p className=\"text-sm text-text-secondary truncate\">\n                          {execution.agentId ?? MISSING_VALUE}\n                        </p>\n                      </div>\n                      <div className=\"col-span-2\">\n                        <div className=\"flex items-center gap-1\">\n                          <Clock size={14} className=\"text-text-secondary\" />\n                          <span>{formatDuration(execution.duration)}</span>\n                        </div>\n                      </div>\n                      <div className=\"col-span-2\">\n                        <div className=\"flex items-center gap-1\">\n                          <Zap size={14} className=\"text-text-secondary\" />\n                          <span>{formatNumber(execution.tokensUsed)}</span>\n                        </div>\n                      </div>\n                      <div className=\"col-span-1\">\n                        <div className=\"flex items-center gap-1\">\n                          <DollarSign size={14} className=\"text-text-secondary\" />\n                          <span>{formatCurrency(execution.cost)}</span>\n                        </div>\n                      </div>\n                      <div className=\"col-span-2 text-sm text-text-secondary\">\n                        {formatRelativeTime(execution.createdAt)}\n                      </div>\n                    </div>\n                  </CardContent>\n                </Card>\n              </Link>\n            ))}\n          </div>\n        ) : (\n          <EmptyState\n            illustration=\"empty-search\"\n            title=\"No executions found\"\n            description={\n              statusFilter.length > 0 || search\n                ? 'No executions match your filters. Try adjusting your search.'\n                : 'Executions will appear here when agents process requests.'\n            }\n          />\n        )}\n      </div>\n    </PageLayout>\n  );\n};\n"],"mappings":"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"}

package/dist/botlit/pages/InstalledPackagesPage.js

@@ -0,0 +1,619 @@
+import { useBotlit as e } from "../providers/BotlitProvider.js";
+import { formatRelativeTime as t } from "../utils/formatters.js";
+import { PageLayout as n } from "../components/PageLayout.js";
+import { Card as r, CardContent as i, CardDescription as a, CardHeader as o, CardTitle as s } from "../components/Card.js";
+import { Button as c } from "../components/Button.js";
+import { Badge as l } from "../components/Badge.js";
+import { EmptyState as u } from "../components/EmptyState.js";
+import { Input as d } from "../components/Input.js";
+import { ErrorState as f } from "../components/ErrorState.js";
+import { storePackageName as p, useInstalledPackages as ee, usePinPackageVersion as m, useUninstallPackage as te, useUpdateInstalledPackage as h } from "../hooks/useStore.js";
+import "../hooks/index.js";
+import { PackageKind as g } from "../../generated/wspace-types.js";
+import { useMemo as _, useState as v } from "react";
+import { GlassCard as y, PagePurpose as ne } from "@burdenoff/fe-libs/ui";
+import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+import { Link as re } from "react-router";
+import { ArrowUpCircle as C, Copy as ie, Download as ae, ExternalLink as oe, GitBranch as w, Link2 as T, Package as E, RefreshCw as se, Search as ce, Settings as le, Trash2 as D } from "lucide-react";
+import { toast as O } from "sonner";
+//#region src/botlit/pages/InstalledPackagesPage.tsx
+var k = [
+	"DEV",
+	"STAGING",
+	"PROD"
+], A = {
+	APP: {
+		label: "Bot",
+		icon: "📱"
+	},
+	AGENT: {
+		label: "Agent",
+		icon: "🤖"
+	},
+	SKILL: {
+		label: "Skill",
+		icon: "⚡"
+	},
+	MCP_PACK: {
+		label: "MCP Pack",
+		icon: "🔧"
+	},
+	PROMPT_TEMPLATE: {
+		label: "Template",
+		icon: "📝"
+	},
+	PROMPT: {
+		label: "Prompt",
+		icon: "📝"
+	},
+	RETRIEVAL_PROFILE: {
+		label: "Retrieval",
+		icon: "🔍"
+	},
+	POLICY_BUNDLE: {
+		label: "Policy",
+		icon: "🛡️"
+	},
+	CHANNEL_TEMPLATE: {
+		label: "Channel",
+		icon: "📡"
+	},
+	A2A_AGENT: {
+		label: "A2A Agent",
+		icon: "🔗"
+	},
+	KB_TEMPLATE: {
+		label: "KB Template",
+		icon: "📚"
+	},
+	KNOWLEDGE_BASE: {
+		label: "Knowledge Base",
+		icon: "📚"
+	},
+	INTEGRATION: {
+		label: "Integration",
+		icon: "🔌"
+	},
+	TEMPLATE: {
+		label: "Template",
+		icon: "📝"
+	},
+	TOOL: {
+		label: "Tool",
+		icon: "🔧"
+	},
+	WORKFLOW: {
+		label: "Workflow",
+		icon: "🔀"
+	}
+}, j = {
+	label: "Package",
+	icon: "📦"
+};
+function M(e) {
+	return e.package?.slug ?? e.packageId;
+}
+function N(e) {
+	return e.package?.kind;
+}
+function P(e) {
+	let t = N(e);
+	return t && A[t] || j;
+}
+function F(e) {
+	let t = e.package?.version;
+	return !!(t && t !== e.installedVersion);
+}
+function I(e, t) {
+	let n = e.pinnedByEnv?.[t];
+	return typeof n == "string" && n !== "" ? n : void 0;
+}
+var L = () => {
+	let { navigateTo: A, getPath: j } = e(), { data: L, loading: R, error: z, refetch: B } = ee(), { uninstall: V, loading: H } = te(), { update: U, loading: ue } = h(), { pin: de } = m(), [W, fe] = v(""), [pe, G] = v(!1), [K, me] = v("all"), [q, J] = v(null), Y = _(() => {
+		let e = W.trim().toLowerCase();
+		return L.filter((t) => {
+			let n = !e || M(t).toLowerCase().includes(e) || p(t.package).toLowerCase().includes(e), r = K === "all" || N(t) === K;
+			return n && r;
+		});
+	}, [
+		L,
+		W,
+		K
+	]), X = _(() => L.find((e) => e.id === q) ?? null, [L, q]), he = _(() => L.filter(F).length, [L]), ge = async () => {
+		G(!0);
+		try {
+			await B();
+		} finally {
+			G(!1);
+		}
+	}, Z = async (e) => {
+		if (confirm("Are you sure you want to uninstall this package?")) try {
+			await V(e.id), O.success(`Uninstalled "${p(e.package) || M(e)}"`), J(null), B();
+		} catch (e) {
+			O.error(e instanceof Error ? e.message : "Failed to uninstall package");
+		}
+	}, _e = async (e) => {
+		let t = e.package?.version;
+		if (t) try {
+			await U({
+				installedId: e.id,
+				input: { installedVersion: t }
+			}), O.success(`Updated to v${t}`), B();
+		} catch (e) {
+			O.error(e instanceof Error ? e.message : "Failed to update package");
+		}
+	}, Q = async (e, t, n) => {
+		try {
+			await de({
+				installedId: e.id,
+				environment: t,
+				version: n,
+				pinnedByEnv: e.pinnedByEnv
+			}), O.success(n ? `Pinned ${t} to v${n}` : `Unpinned ${t}`), B();
+		} catch (e) {
+			O.error(e instanceof Error ? e.message : "Failed to change version pin");
+		}
+	}, $ = (e) => e === "LINKED" ? /* @__PURE__ */ x(T, { className: "h-4 w-4 text-status-info-text" }) : /* @__PURE__ */ x(ie, { className: "h-4 w-4 text-status-warning-text" }), ve = ({ pkg: e }) => {
+		let n = P(e), a = M(e), o = F(e), s = k.filter((t) => I(e, t));
+		return /* @__PURE__ */ x(r, {
+			className: "hover:shadow-md transition-shadow cursor-pointer",
+			onClick: () => J(e.id),
+			children: /* @__PURE__ */ S(i, {
+				className: "pt-6",
+				children: [
+					/* @__PURE__ */ S("div", {
+						className: "flex items-start justify-between",
+						children: [/* @__PURE__ */ S("div", {
+							className: "flex items-start gap-3",
+							children: [/* @__PURE__ */ x("div", {
+								className: "p-2 rounded-lg bg-bg-sunken text-2xl",
+								children: n.icon
+							}), /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ S("div", {
+								className: "flex items-center gap-2",
+								children: [/* @__PURE__ */ x("h3", {
+									className: "font-semibold",
+									children: p(e.package) || a
+								}), o && /* @__PURE__ */ S(l, {
+									variant: "warning",
+									className: "gap-1",
+									children: [/* @__PURE__ */ x(C, { className: "h-3 w-3" }), "Update"]
+								})]
+							}), /* @__PURE__ */ x("p", {
+								className: "text-sm text-text-secondary font-mono",
+								children: a
+							})] })]
+						}), /* @__PURE__ */ S("div", {
+							className: "flex items-center gap-2",
+							children: [$(e.mode), /* @__PURE__ */ x(l, {
+								variant: "outline",
+								children: n.label
+							})]
+						})]
+					}),
+					/* @__PURE__ */ S("div", {
+						className: "mt-4 grid grid-cols-3 gap-4 text-sm",
+						children: [
+							/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+								className: "text-text-secondary",
+								children: "Installed Version"
+							}), /* @__PURE__ */ S("p", {
+								className: "font-medium font-mono",
+								children: ["v", e.installedVersion]
+							})] }),
+							/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+								className: "text-text-secondary",
+								children: "Mode"
+							}), /* @__PURE__ */ S("p", {
+								className: "font-medium flex items-center gap-1",
+								children: [$(e.mode), e.mode]
+							})] }),
+							/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+								className: "text-text-secondary",
+								children: "Installed"
+							}), /* @__PURE__ */ x("p", {
+								className: "font-medium",
+								children: t(e.installedAt)
+							})] })
+						]
+					}),
+					s.length > 0 && /* @__PURE__ */ S("div", {
+						className: "mt-4 pt-4 border-t border-border-subtle",
+						children: [/* @__PURE__ */ x("p", {
+							className: "text-xs text-text-secondary mb-2",
+							children: "Pinned Versions"
+						}), /* @__PURE__ */ x("div", {
+							className: "flex gap-2",
+							children: k.map((t) => {
+								let n = I(e, t);
+								return /* @__PURE__ */ S(l, {
+									variant: n ? "default" : "outline",
+									className: "text-xs",
+									children: [
+										t,
+										": ",
+										n ?? "latest"
+									]
+								}, t);
+							})
+						})]
+					}),
+					/* @__PURE__ */ S("div", {
+						className: "mt-4 flex justify-end gap-2",
+						children: [
+							/* @__PURE__ */ S(c, {
+								variant: "ghost",
+								size: "sm",
+								onClick: (e) => {
+									e.stopPropagation(), A(`store/package/${a}`);
+								},
+								children: [/* @__PURE__ */ x(oe, { className: "h-4 w-4 mr-1" }), "View in Store"]
+							}),
+							o && /* @__PURE__ */ S(c, {
+								variant: "outline",
+								size: "sm",
+								onClick: (t) => {
+									t.stopPropagation(), _e(e);
+								},
+								isLoading: ue,
+								children: [/* @__PURE__ */ x(C, { className: "h-4 w-4 mr-1" }), "Update"]
+							}),
+							/* @__PURE__ */ x(c, {
+								variant: "ghost",
+								size: "sm",
+								"aria-label": "Uninstall package",
+								className: "text-status-error-text hover:text-status-error-text",
+								onClick: (t) => {
+									t.stopPropagation(), Z(e);
+								},
+								isLoading: H,
+								children: /* @__PURE__ */ x(D, { className: "h-4 w-4" })
+							})
+						]
+					})
+				]
+			})
+		});
+	};
+	return R ? /* @__PURE__ */ x(n, {
+		title: "Installed Packages",
+		description: "Manage installed store packages",
+		children: /* @__PURE__ */ x("div", {
+			className: "space-y-4",
+			children: [
+				1,
+				2,
+				3
+			].map((e) => /* @__PURE__ */ x("div", { className: "h-48 bg-bg-sunken motion-safe:animate-vc-shimmer rounded-lg" }, e))
+		})
+	}) : /* @__PURE__ */ S(n, {
+		title: "Installed Packages",
+		description: "Manage packages installed from the Botlit Store",
+		actions: /* @__PURE__ */ S("div", {
+			className: "flex gap-2",
+			children: [/* @__PURE__ */ x(c, {
+				variant: "outline",
+				leftIcon: /* @__PURE__ */ x(se, { size: 16 }),
+				onClick: () => void ge(),
+				isLoading: pe,
+				children: "Check Updates"
+			}), /* @__PURE__ */ x(c, {
+				leftIcon: /* @__PURE__ */ x(E, { size: 16 }),
+				onClick: () => A("store"),
+				children: "Browse Store"
+			})]
+		}),
+		children: [
+			/* @__PURE__ */ x(ne, {
+				className: "mb-6",
+				icon: /* @__PURE__ */ x(E, { size: 18 }),
+				children: "These are the packages you have installed from the Botlit Store and how they are wired into your workspace. Manage each one’s installation mode (linked, so it auto-updates, or forked as an independent copy), pin specific versions per environment, and update or uninstall — this is your dependency manager for everything you pulled from the store."
+			}),
+			z ? /* @__PURE__ */ x(f, {
+				resource: "installed packages",
+				error: z,
+				onRetry: () => void B()
+			}) : /* @__PURE__ */ S(b, { children: [
+				/* @__PURE__ */ S("div", {
+					className: "grid grid-cols-2 md:grid-cols-4 gap-4 mb-6",
+					children: [
+						/* @__PURE__ */ S(y, {
+							treatment: "glass",
+							glow: !0,
+							className: "p-6 text-center",
+							children: [/* @__PURE__ */ x("p", {
+								className: "text-3xl font-bold tabular-nums text-text-primary",
+								children: L.length
+							}), /* @__PURE__ */ x("p", {
+								className: "text-sm text-text-secondary",
+								children: "Total Installed"
+							})]
+						}),
+						/* @__PURE__ */ S(y, {
+							treatment: "metric",
+							className: "p-6 text-center",
+							children: [/* @__PURE__ */ x("p", {
+								className: "text-3xl font-bold tabular-nums text-text-primary",
+								children: L.filter((e) => e.mode === "LINKED").length
+							}), /* @__PURE__ */ x("p", {
+								className: "text-sm text-text-secondary",
+								children: "Linked"
+							})]
+						}),
+						/* @__PURE__ */ S(y, {
+							treatment: "metric",
+							className: "p-6 text-center",
+							children: [/* @__PURE__ */ x("p", {
+								className: "text-3xl font-bold tabular-nums text-text-primary",
+								children: L.filter((e) => e.mode === "FORKED").length
+							}), /* @__PURE__ */ x("p", {
+								className: "text-sm text-text-secondary",
+								children: "Forked"
+							})]
+						}),
+						/* @__PURE__ */ S(y, {
+							treatment: "metric",
+							className: "p-6 text-center",
+							children: [/* @__PURE__ */ x("p", {
+								className: "text-3xl font-bold tabular-nums text-text-primary",
+								children: he
+							}), /* @__PURE__ */ x("p", {
+								className: "text-sm text-text-secondary",
+								children: "Updates Available"
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ S("div", {
+					className: "flex flex-col md:flex-row gap-4 mb-6",
+					children: [/* @__PURE__ */ S("div", {
+						className: "relative flex-1",
+						children: [/* @__PURE__ */ x(ce, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ x(d, {
+							placeholder: "Search packages...",
+							value: W,
+							onChange: (e) => fe(e.target.value),
+							className: "pl-9"
+						})]
+					}), /* @__PURE__ */ x("div", {
+						className: "flex gap-2",
+						children: /* @__PURE__ */ S("select", {
+							"aria-label": "Filter by package type",
+							className: "flex h-10 rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
+							value: K,
+							onChange: (e) => me(e.target.value),
+							children: [
+								/* @__PURE__ */ x("option", {
+									value: "all",
+									children: "All Types"
+								}),
+								/* @__PURE__ */ x("option", {
+									value: g.Agent,
+									children: "Agents"
+								}),
+								/* @__PURE__ */ x("option", {
+									value: g.Skill,
+									children: "Skills"
+								}),
+								/* @__PURE__ */ x("option", {
+									value: g.McpPack,
+									children: "MCP Packs"
+								}),
+								/* @__PURE__ */ x("option", {
+									value: g.PromptTemplate,
+									children: "Templates"
+								}),
+								/* @__PURE__ */ x("option", {
+									value: g.RetrievalProfile,
+									children: "Retrieval Profiles"
+								})
+							]
+						})
+					})]
+				}),
+				Y.length > 0 ? /* @__PURE__ */ x("div", {
+					className: "grid grid-cols-1 md:grid-cols-2 gap-4",
+					children: Y.map((e) => /* @__PURE__ */ x(ve, { pkg: e }, e.id))
+				}) : /* @__PURE__ */ x(u, {
+					illustration: "empty-generic",
+					title: W || K !== "all" ? "No matching packages" : "No packages installed",
+					description: W || K !== "all" ? "Try adjusting your search or type filter." : "Browse the Botlit Store to find agents, skills, and tools to install.",
+					action: /* @__PURE__ */ x(c, {
+						onClick: () => A("store"),
+						leftIcon: /* @__PURE__ */ x(ae, { className: "h-4 w-4" }),
+						children: "Browse Store"
+					})
+				})
+			] }),
+			X && /* @__PURE__ */ x(({ pkg: e, onClose: n }) => {
+				let l = P(e), u = M(e), d = e.bindings ?? {};
+				return /* @__PURE__ */ x("div", {
+					className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50",
+					children: /* @__PURE__ */ S("div", {
+						className: "bg-bg-surface rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[90vh] overflow-y-auto",
+						children: [
+							/* @__PURE__ */ x("div", {
+								className: "p-6 border-b border-border-subtle",
+								children: /* @__PURE__ */ S("div", {
+									className: "flex items-start justify-between",
+									children: [/* @__PURE__ */ S("div", {
+										className: "flex items-start gap-3",
+										children: [/* @__PURE__ */ x("div", {
+											className: "p-3 rounded-lg bg-bg-sunken text-3xl",
+											children: l.icon
+										}), /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("h2", {
+											className: "text-xl font-bold",
+											children: p(e.package) || u
+										}), /* @__PURE__ */ x("p", {
+											className: "text-sm text-text-secondary font-mono",
+											children: u
+										})] })]
+									}), /* @__PURE__ */ x(c, {
+										variant: "ghost",
+										size: "sm",
+										"aria-label": "Close",
+										onClick: n,
+										children: "×"
+									})]
+								})
+							}),
+							/* @__PURE__ */ S("div", {
+								className: "p-6 space-y-6",
+								children: [
+									/* @__PURE__ */ S(r, { children: [/* @__PURE__ */ x(o, { children: /* @__PURE__ */ x(s, {
+										className: "text-base",
+										children: "Version Information"
+									}) }), /* @__PURE__ */ S(i, {
+										className: "space-y-4",
+										children: [/* @__PURE__ */ S("div", {
+											className: "grid grid-cols-2 gap-4",
+											children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+												className: "text-sm text-text-secondary",
+												children: "Installed Version"
+											}), /* @__PURE__ */ S("p", {
+												className: "font-mono font-medium",
+												children: ["v", e.installedVersion]
+											})] }), e.package && /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+												className: "text-sm text-text-secondary",
+												children: "Latest Version"
+											}), /* @__PURE__ */ S("p", {
+												className: "font-mono font-medium",
+												children: ["v", e.package.version]
+											})] })]
+										}), /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+											className: "text-sm text-text-secondary mb-2",
+											children: "Installation Mode"
+										}), /* @__PURE__ */ S("div", {
+											className: "flex items-center gap-2",
+											children: [
+												$(e.mode),
+												/* @__PURE__ */ x("span", {
+													className: "font-medium",
+													children: e.mode
+												}),
+												/* @__PURE__ */ x("span", {
+													className: "text-sm text-text-secondary",
+													children: e.mode === "LINKED" ? "- Receives updates automatically" : "- Independent copy, no auto-updates"
+												})
+											]
+										})] })]
+									})] }),
+									/* @__PURE__ */ S(r, { children: [/* @__PURE__ */ S(o, { children: [/* @__PURE__ */ S(s, {
+										className: "text-base flex items-center gap-2",
+										children: [/* @__PURE__ */ x(w, { className: "h-4 w-4" }), "Environment Version Pins"]
+									}), /* @__PURE__ */ x(a, { children: "Pin specific versions for each environment" })] }), /* @__PURE__ */ x(i, { children: /* @__PURE__ */ x("div", {
+										className: "space-y-3",
+										children: k.map((t) => {
+											let n = I(e, t);
+											return /* @__PURE__ */ S("div", {
+												className: "flex items-center justify-between p-3 bg-bg-sunken rounded-lg",
+												children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+													className: "font-medium",
+													children: t
+												}), /* @__PURE__ */ x("p", {
+													className: "text-sm text-text-secondary font-mono",
+													children: n ? `v${n}` : "Using latest"
+												})] }), /* @__PURE__ */ x("div", {
+													className: "flex gap-2",
+													children: n ? /* @__PURE__ */ x(c, {
+														variant: "outline",
+														size: "sm",
+														onClick: () => void Q(e, t, ""),
+														children: "Unpin"
+													}) : /* @__PURE__ */ x(c, {
+														variant: "outline",
+														size: "sm",
+														onClick: () => void Q(e, t, e.installedVersion),
+														children: "Pin Current"
+													})
+												})]
+											}, t);
+										})
+									}) })] }),
+									Object.keys(d).length > 0 && /* @__PURE__ */ S(r, { children: [/* @__PURE__ */ x(o, { children: /* @__PURE__ */ S(s, {
+										className: "text-base flex items-center gap-2",
+										children: [/* @__PURE__ */ x(le, { className: "h-4 w-4" }), "Configuration Bindings"]
+									}) }), /* @__PURE__ */ x(i, { children: /* @__PURE__ */ x("div", {
+										className: "space-y-2",
+										children: Object.entries(d).map(([e, t]) => /* @__PURE__ */ S("div", {
+											className: "flex justify-between p-2 bg-bg-sunken rounded",
+											children: [/* @__PURE__ */ x("span", {
+												className: "font-mono text-sm",
+												children: e
+											}), /* @__PURE__ */ x("span", {
+												className: "font-mono text-sm text-text-secondary",
+												children: typeof t == "string" ? t : JSON.stringify(t)
+											})]
+										}, e))
+									}) })] }),
+									/* @__PURE__ */ S(r, { children: [/* @__PURE__ */ x(o, { children: /* @__PURE__ */ x(s, {
+										className: "text-base",
+										children: "Metadata"
+									}) }), /* @__PURE__ */ x(i, { children: /* @__PURE__ */ S("div", {
+										className: "grid grid-cols-2 gap-4 text-sm",
+										children: [
+											/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+												className: "text-text-secondary",
+												children: "Installed At"
+											}), /* @__PURE__ */ x("p", {
+												className: "font-medium",
+												children: t(e.installedAt)
+											})] }),
+											/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+												className: "text-text-secondary",
+												children: "Installed By"
+											}), /* @__PURE__ */ x("p", {
+												className: "font-medium",
+												children: e.installedBy
+											})] }),
+											/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+												className: "text-text-secondary",
+												children: "Package ID"
+											}), /* @__PURE__ */ x("p", {
+												className: "font-mono text-xs",
+												children: e.packageId
+											})] }),
+											/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
+												className: "text-text-secondary",
+												children: "Installation ID"
+											}), /* @__PURE__ */ x("p", {
+												className: "font-mono text-xs",
+												children: e.id
+											})] })
+										]
+									}) })] })
+								]
+							}),
+							/* @__PURE__ */ S("div", {
+								className: "p-6 border-t border-border-subtle flex justify-between",
+								children: [/* @__PURE__ */ S(c, {
+									variant: "destructive",
+									onClick: () => void Z(e),
+									children: [/* @__PURE__ */ x(D, { className: "h-4 w-4 mr-2" }), "Uninstall"]
+								}), /* @__PURE__ */ S("div", {
+									className: "flex gap-2",
+									children: [/* @__PURE__ */ x(re, {
+										to: j(`store/package/${u}`),
+										children: /* @__PURE__ */ x(c, {
+											variant: "outline",
+											children: "View in Store"
+										})
+									}), /* @__PURE__ */ x(c, {
+										variant: "outline",
+										onClick: n,
+										children: "Close"
+									})]
+								})]
+							})
+						]
+					})
+				});
+			}, {
+				pkg: X,
+				onClose: () => J(null)
+			})
+		]
+	});
+};
+//#endregion
+export { L as InstalledPackagesPage };
+
+//# sourceMappingURL=InstalledPackagesPage.js.map