@elizaos/ui 2.0.0-beta.2 → 2.0.3-beta.2

package/cloud-ui/components/log-viewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"log-viewer.d.ts","sourceRoot":"","sources":["../../../../../../src/cloud-ui/components/log-viewer.tsx"],"names":[],"mappings":"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"}

package/cloud-ui/components/log-viewer.js

@@ -0,0 +1,95 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Copy, Download, RefreshCw, Search, Terminal, Wifi, WifiOff, } from "lucide-react";
+import * as React from "react";
+import { Badge } from "../../components/ui/badge.js";
+import { Input } from "../../components/ui/input.js";
+import { ScrollArea } from "../../components/ui/scroll-area.js";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "../../components/ui/select.js";
+import { Skeleton } from "../../components/ui/skeleton.js";
+import { cn } from "../lib/utils.js";
+import { BrandButton, BrandCard } from "./brand/index.js";
+function formatTimestamp(value) {
+    if (!value)
+        return "";
+    return new Date(value).toLocaleTimeString();
+}
+function getDefaultLineClassName(line) {
+    const normalized = line.toLowerCase();
+    if (normalized.includes("error") ||
+        normalized.includes("fatal") ||
+        normalized.includes("panic")) {
+        return "border-l-red-500 text-red-300";
+    }
+    if (normalized.includes("warn"))
+        return "border-l-yellow-500 text-yellow-300";
+    if (normalized.includes("info"))
+        return "border-l-blue-500 text-blue-300";
+    return "border-l-neutral-700 text-neutral-300";
+}
+function getDefaultEntryLevelVariant(level) {
+    switch (level) {
+        case "error":
+            return "destructive";
+        case "info":
+            return "default";
+        case "debug":
+            return "secondary";
+        default:
+            return "outline";
+    }
+}
+function getDefaultEntryClassName(entry) {
+    switch (entry.level) {
+        case "error":
+            return "text-red-500";
+        case "warn":
+            return "text-yellow-500";
+        case "info":
+            return "text-blue-500";
+        case "debug":
+            return "text-gray-500";
+        default:
+            return "text-foreground";
+    }
+}
+function renderMetadata(metadata) {
+    if (!metadata ||
+        (typeof metadata === "object" && Object.keys(metadata).length === 0)) {
+        return null;
+    }
+    return JSON.stringify(metadata);
+}
+export function LogViewer({ title, subtitle, badges = [], fetchedAt, childrenBeforeSearch, search, levelFilter, lineCountControl, loading = false, error, errorTitle = "Failed to fetch logs", retryLabel = "Retry", onRetry, showRetryOnError = true, emptyState = { title: "No logs available" }, filteredEmptyState = { title: "No logs match your filter" }, isFilteredEmpty: isFilteredEmptyOverride, lines, entries, onRefresh, onCopyAll, onDownload, onToggleStreaming, streaming, copyDisabled, downloadDisabled, refreshTitle = "Refresh logs", copyTitle = "Copy all logs", downloadTitle = "Download logs", streamingTitle, heightClassName = entries ? "h-[400px]" : "h-[500px]", contentRef, lineClassName = getDefaultLineClassName, entryClassName = getDefaultEntryClassName, entryLevelVariant = getDefaultEntryLevelVariant, entryLevelBorderColor, onCopyEntry, className, }) {
+    const itemCount = entries?.length ?? lines?.length ?? 0;
+    const isFilteredEmpty = isFilteredEmptyOverride ??
+        (itemCount === 0 &&
+            Boolean(search?.value || (levelFilter && levelFilter.value !== "all")));
+    const hasData = itemCount > 0;
+    const renderedLines = React.useMemo(() => {
+        const seen = new Map();
+        return lines?.map((line) => {
+            const occurrence = (seen.get(line) ?? 0) + 1;
+            seen.set(line, occurrence);
+            return {
+                line,
+                key: `${line.slice(0, 120)}:${line.length}:${occurrence}`,
+            };
+        });
+    }, [lines]);
+    return (_jsx(BrandCard, { className: cn("relative ", className), cornerSize: "sm", children: _jsxs("div", { className: "relative z-10 space-y-6", children: [_jsxs("div", { className: "flex flex-col gap-4 border-b border-white/10 pb-4 lg:flex-row lg:items-start lg:justify-between", children: [_jsxs("div", { children: [_jsxs("div", { className: "mb-1 flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "inline-block h-2 w-2 rounded-full bg-[#FF5800]" }), _jsx("h2", { className: "text-xl font-normal text-white", style: { fontFamily: "var(--font-roboto-mono)" }, children: title }), badges.map((badge) => (_jsx(Badge, { variant: badge.variant ?? "outline", className: badge.className, children: badge.label }, badge.key ?? String(badge.label))))] }), subtitle && _jsx("p", { className: "text-sm text-white/60", children: subtitle }), fetchedAt && (_jsxs("p", { className: "mt-1 text-xs text-white/40", children: ["Refreshed at ", new Date(fetchedAt).toLocaleTimeString()] }))] }), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [lineCountControl && (_jsxs(Select, { value: lineCountControl.value, onValueChange: lineCountControl.onChange, children: [_jsx(SelectTrigger, { className: cn("h-8 w-[100px] rounded-none border-white/10 bg-black/40 text-xs", lineCountControl.triggerClassName), children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { className: "rounded-none border-white/10 bg-neutral-900", children: lineCountControl.options.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) })] })), onToggleStreaming && (_jsx(BrandButton, { variant: "outline", size: "sm", onClick: onToggleStreaming, title: streamingTitle, children: streaming?.active ? (_jsx(Wifi, { className: "h-4 w-4" })) : streaming?.enabled ? (_jsx(RefreshCw, { className: "h-4 w-4 animate-spin" })) : (_jsx(WifiOff, { className: "h-4 w-4" })) })), onRefresh && (_jsx(BrandButton, { variant: "outline", size: "sm", onClick: onRefresh, title: refreshTitle, children: _jsx(RefreshCw, { className: cn("h-4 w-4", loading && "animate-spin") }) })), onCopyAll && (_jsx(BrandButton, { variant: "outline", size: "sm", onClick: onCopyAll, disabled: copyDisabled, title: copyTitle, children: _jsx(Copy, { className: "h-4 w-4" }) })), onDownload && (_jsx(BrandButton, { variant: "outline", size: "sm", onClick: onDownload, disabled: downloadDisabled, title: downloadTitle, children: _jsx(Download, { className: "h-4 w-4" }) }))] })] }), childrenBeforeSearch, (search || levelFilter) && (_jsxs("div", { className: "flex flex-col gap-3 sm:flex-row", children: [search && (_jsxs("div", { className: "relative flex-1", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-white/40" }), _jsx(Input, { placeholder: search.placeholder ?? "Search logs...", value: search.value, onChange: (event) => search.onChange(event.target.value), className: "rounded-none border-white/10 bg-black/40 pl-9 text-white placeholder:text-white/40 focus-visible:ring-[#FF5800]/50", style: { fontFamily: "var(--font-roboto-mono)" } })] })), levelFilter && (_jsxs(Select, { value: levelFilter.value, onValueChange: levelFilter.onChange, children: [_jsx(SelectTrigger, { className: cn("w-full rounded-none border-white/10 bg-black/40 sm:w-[140px]", levelFilter.triggerClassName), style: { fontFamily: "var(--font-roboto-mono)" }, children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { className: "rounded-none border-white/10 bg-[#0A0A0A]", children: levelFilter.options.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) })] }))] })), search?.resultLabel && (_jsx("p", { className: "text-xs text-white/50", style: { fontFamily: "var(--font-roboto-mono)" }, children: search.resultLabel })), loading && !hasData ? (_jsxs("div", { className: "space-y-2", children: [_jsx(Skeleton, { className: "h-5 w-full rounded-none" }), _jsx(Skeleton, { className: "h-5 w-full rounded-none" }), _jsx(Skeleton, { className: "h-5 w-3/4 rounded-none" })] })) : error ? (_jsxs("div", { className: "py-8 text-center", children: [_jsx(Terminal, { className: "mx-auto mb-3 h-8 w-8 text-neutral-600" }), _jsx("p", { className: "mb-1 text-sm font-medium text-red-400", style: { fontFamily: "var(--font-roboto-mono)" }, children: errorTitle }), _jsx("p", { className: "text-xs text-white/40", children: error }), showRetryOnError && onRetry && (_jsxs(BrandButton, { variant: "outline", size: "sm", onClick: onRetry, className: "mt-4", children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), retryLabel] }))] })) : !hasData ? (_jsxs("div", { className: "py-8 text-center", children: [_jsx(Terminal, { className: "mx-auto mb-3 h-8 w-8 text-neutral-600" }), _jsx("p", { className: "text-sm text-white/60", children: isFilteredEmpty ? filteredEmptyState.title : emptyState.title }), (isFilteredEmpty
+                            ? filteredEmptyState.description
+                            : emptyState.description) && (_jsx("p", { className: "mt-1 text-xs text-white/40", children: isFilteredEmpty
+                                ? filteredEmptyState.description
+                                : emptyState.description })), (isFilteredEmpty
+                            ? filteredEmptyState.action
+                            : emptyState.action) && (_jsx("div", { className: "mt-4", children: isFilteredEmpty
+                                ? filteredEmptyState.action
+                                : emptyState.action }))] })) : (_jsx(ScrollArea, { className: cn("w-full rounded-none border border-white/10", heightClassName), children: _jsxs("div", { ref: contentRef, className: cn("space-y-px p-3 font-mono text-xs", entries && "space-y-1 p-4 text-sm"), style: { fontFamily: "var(--font-roboto-mono)" }, children: [renderedLines?.map(({ line, key }) => (_jsx("div", { className: cn("whitespace-pre-wrap break-all border-l-2 px-2 py-0.5 transition-colors hover:bg-white/5", lineClassName(line)), children: line }, key))), entries?.map((entry, index) => (_jsxs("div", { className: cn("group flex gap-3 rounded-none border-l-2 p-2 transition-colors hover:bg-white/5", entryClassName(entry)), style: {
+                                    borderLeftColor: entryLevelBorderColor?.(entry.level ?? ""),
+                                }, children: [entry.level && (_jsx(Badge, { variant: entryLevelVariant(entry.level), className: "h-5 shrink-0 rounded-none font-mono text-xs", children: entry.level.toUpperCase() })), entry.timestamp && (_jsx("span", { className: "min-w-[70px] shrink-0 text-xs text-white/60", children: formatTimestamp(entry.timestamp) })), _jsx("span", { className: "flex-1 whitespace-pre-wrap break-all text-white/80", children: entry.message }), renderMetadata(entry.metadata) && (_jsx("span", { className: "max-w-[200px] truncate text-xs text-white/50", children: renderMetadata(entry.metadata) })), onCopyEntry && (_jsx(BrandButton, { variant: "ghost", size: "sm", onClick: () => onCopyEntry(entry), className: "h-6 w-6 shrink-0 p-0 opacity-0 transition-opacity group-hover:opacity-100", title: "Copy log line", children: _jsx(Copy, { className: "h-3 w-3" }) }))] }, entry.id ?? `${entry.timestamp ?? ""}-${index}`)))] }) })), streaming?.enabled && (_jsx("div", { className: "mt-2 flex items-center justify-center gap-2 text-xs text-white/60", style: { fontFamily: "var(--font-roboto-mono)" }, children: streaming.active ? (_jsxs(_Fragment, { children: [_jsx(Wifi, { className: "h-3 w-3 text-green-500" }), _jsx("span", { className: "text-green-500", children: streaming.activeLabel ??
+                                    streaming.label ??
+                                    "Live streaming enabled" })] })) : (_jsxs(_Fragment, { children: [_jsx(RefreshCw, { className: "h-3 w-3 animate-spin" }), streaming.inactiveLabel ??
+                                streaming.label ??
+                                "Auto-refreshing"] })) }))] }) }));
+}

package/cloud-ui/components/monetization/animated-counter.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Animated counter component for smooth number counting animations.
+ * Used for displaying earnings, balances, and other numeric values with visual flair.
+ */
+interface AnimatedCounterProps {
+    value: number;
+    prefix?: string;
+    suffix?: string;
+    decimals?: number;
+    duration?: number;
+    className?: string;
+    onComplete?: () => void;
+}
+export declare function AnimatedCounter({ value, prefix, suffix, decimals, duration, className, onComplete, }: AnimatedCounterProps): import("react/jsx-runtime").JSX.Element;
+interface AnimatedCounterWithLabelProps extends AnimatedCounterProps {
+    label: string;
+    labelClassName?: string;
+    valueClassName?: string;
+    trend?: {
+        value: number;
+        period: string;
+    };
+}
+export declare function AnimatedCounterWithLabel({ label, labelClassName, valueClassName, trend, ...counterProps }: AnimatedCounterWithLabelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=animated-counter.d.ts.map

package/cloud-ui/components/monetization/animated-counter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animated-counter.d.ts","sourceRoot":"","sources":["../../../../../../../src/cloud-ui/components/monetization/animated-counter.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,UAAU,oBAAoB;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,MAAW,EACX,MAAW,EACX,QAAY,EACZ,QAAe,EACf,SAAS,EACT,UAAU,GACX,EAAE,oBAAoB,2CAmDtB;AAED,UAAU,6BAA8B,SAAQ,oBAAoB;IAClE,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;AAED,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,cAAc,EACd,cAAc,EACd,KAAK,EACL,GAAG,YAAY,EAChB,EAAE,6BAA6B,2CAwB/B"}

package/cloud-ui/components/monetization/animated-counter.js

@@ -0,0 +1,44 @@
+/**
+ * Animated counter component for smooth number counting animations.
+ * Used for displaying earnings, balances, and other numeric values with visual flair.
+ */
+"use client";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { cn } from "../../lib/utils.js";
+export function AnimatedCounter({ value, prefix = "", suffix = "", decimals = 2, duration = 1500, className, onComplete, }) {
+    const [displayValue, setDisplayValue] = useState(0);
+    const previousValue = useRef(0);
+    const animationRef = useRef(null);
+    useEffect(() => {
+        const startValue = previousValue.current;
+        const endValue = value;
+        const startTime = performance.now();
+        const animate = (currentTime) => {
+            const elapsed = currentTime - startTime;
+            const progress = Math.min(elapsed / duration, 1);
+            // Easing function (ease-out cubic)
+            const easeOutCubic = 1 - (1 - progress) ** 3;
+            const currentValue = startValue + (endValue - startValue) * easeOutCubic;
+            setDisplayValue(currentValue);
+            if (progress < 1) {
+                animationRef.current = requestAnimationFrame(animate);
+            }
+            else {
+                previousValue.current = endValue;
+                onComplete?.();
+            }
+        };
+        animationRef.current = requestAnimationFrame(animate);
+        return () => {
+            if (animationRef.current) {
+                cancelAnimationFrame(animationRef.current);
+            }
+        };
+    }, [value, duration, onComplete]);
+    const formattedValue = displayValue.toFixed(decimals);
+    return (_jsxs("span", { className: cn("tabular-nums font-mono transition-opacity duration-300", className), children: [prefix, formattedValue, suffix] }));
+}
+export function AnimatedCounterWithLabel({ label, labelClassName, valueClassName, trend, ...counterProps }) {
+    return (_jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: cn("text-xs text-neutral-500 mb-1", labelClassName), children: label }), _jsx(AnimatedCounter, { ...counterProps, className: cn("text-xl font-semibold text-white", valueClassName) }), trend && (_jsxs("span", { className: cn("text-xs mt-1 flex items-center gap-1", trend.value >= 0 ? "text-emerald-400" : "text-red-400"), children: [_jsx("span", { children: trend.value >= 0 ? "↑" : "↓" }), _jsxs("span", { children: ["$", Math.abs(trend.value).toFixed(2)] }), _jsx("span", { className: "text-neutral-500", children: trend.period })] }))] }));
+}

package/cloud-ui/components/monetization/earnings-simulator.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Earnings simulator component for visualizing potential earnings.
+ * Shows "what if" scenarios based on user count and spend amounts.
+ */
+interface EarningsSimulatorProps {
+    markupPercentage: number;
+    purchaseSharePercentage: number;
+    className?: string;
+}
+export declare function EarningsSimulator({ markupPercentage, purchaseSharePercentage, className, }: EarningsSimulatorProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=earnings-simulator.d.ts.map

package/cloud-ui/components/monetization/earnings-simulator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"earnings-simulator.d.ts","sourceRoot":"","sources":["../../../../../../../src/cloud-ui/components/monetization/earnings-simulator.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AA0BH,UAAU,sBAAsB;IAC9B,gBAAgB,EAAE,MAAM,CAAC;IACzB,uBAAuB,EAAE,MAAM,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,gBAAgB,EAChB,uBAAuB,EACvB,SAAS,GACV,EAAE,sBAAsB,2CAiJxB"}

package/cloud-ui/components/monetization/earnings-simulator.js

@@ -0,0 +1,40 @@
+/**
+ * Earnings simulator component for visualizing potential earnings.
+ * Shows "what if" scenarios based on user count and spend amounts.
+ */
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Calculator, Coins, DollarSign, TrendingUp, Users, Zap, } from "lucide-react";
+import { useMemo, useState } from "react";
+import { Slider } from "../../../components/ui/slider.js";
+import { cn } from "../../lib/utils.js";
+/**
+ * Illustrative spend-mix assumptions for the "what if" projection. These are NOT
+ * server-sourced: Cloud does not currently expose an inference-vs-purchase spend
+ * split, so the simulator assumes a fixed mix purely to visualize potential
+ * earnings. They must never be presented as actual monetization accounting — the
+ * UI labels every output as an estimate.
+ */
+const ASSUMED_INFERENCE_SPEND_SHARE = 0.8;
+const ASSUMED_PURCHASE_SPEND_SHARE = 0.2;
+export function EarningsSimulator({ markupPercentage, purchaseSharePercentage, className, }) {
+    const [users, setUsers] = useState(100);
+    const [spendPerUser, setSpendPerUser] = useState(10);
+    const calculations = useMemo(() => {
+        const totalSpend = users * spendPerUser;
+        // Inference earnings: users spend on AI, creator gets the markup share.
+        const inferenceSpend = totalSpend * ASSUMED_INFERENCE_SPEND_SHARE;
+        const inferenceEarnings = inferenceSpend * (markupPercentage / 100);
+        // Purchase earnings: creator gets a share of new credit purchases.
+        const purchaseSpend = totalSpend * ASSUMED_PURCHASE_SPEND_SHARE;
+        const purchaseEarnings = purchaseSpend * (purchaseSharePercentage / 100);
+        const totalEarnings = inferenceEarnings + purchaseEarnings;
+        return {
+            totalSpend,
+            inferenceEarnings,
+            purchaseEarnings,
+            totalEarnings,
+        };
+    }, [users, spendPerUser, markupPercentage, purchaseSharePercentage]);
+    return (_jsxs("div", { className: cn("bg-neutral-900 rounded-sm p-4", className), children: [_jsxs("h3", { className: "text-sm font-medium text-white flex items-center gap-2 mb-4", children: [_jsx(Calculator, { className: "h-4 w-4 text-purple-400" }), "Earnings Calculator"] }), _jsxs("div", { className: "space-y-4 mb-4", children: [_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("span", { className: "text-xs text-neutral-400 flex items-center gap-1.5", children: [_jsx(Users, { className: "h-3 w-3" }), "Monthly Active Users"] }), _jsx("span", { className: "text-sm font-mono text-white", children: users })] }), _jsx(Slider, { value: [users], onValueChange: ([v]) => setUsers(v), min: 10, max: 1000, step: 10, className: "w-full" }), _jsxs("div", { className: "flex justify-between text-[10px] text-neutral-600", children: [_jsx("span", { children: "10" }), _jsx("span", { children: "1,000" })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("span", { className: "text-xs text-neutral-400 flex items-center gap-1.5", children: [_jsx(DollarSign, { className: "h-3 w-3" }), "Avg. Spend per User"] }), _jsxs("span", { className: "text-sm font-mono text-white", children: ["$", spendPerUser] })] }), _jsx(Slider, { value: [spendPerUser], onValueChange: ([v]) => setSpendPerUser(v), min: 1, max: 100, step: 1, className: "w-full" }), _jsxs("div", { className: "flex justify-between text-[10px] text-neutral-600", children: [_jsx("span", { children: "$1" }), _jsx("span", { children: "$100" })] })] })] }), _jsx("div", { className: "h-px bg-white/10 mb-4" }), _jsxs("div", { className: "space-y-2", children: [_jsxs("p", { className: "text-xs text-neutral-500 flex items-center gap-1.5 mb-3", children: [_jsx(TrendingUp, { className: "h-3 w-3" }), "Estimated Monthly Earnings"] }), _jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsx("span", { className: "text-neutral-400", children: "Total User Spend" }), _jsxs("span", { className: "font-mono text-neutral-300", children: ["$", calculations.totalSpend.toFixed(2)] })] }), _jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsxs("span", { className: "text-purple-400 flex items-center gap-1.5", children: [_jsx(Zap, { className: "h-3 w-3" }), "Inference (", markupPercentage, "%)"] }), _jsxs("span", { className: "font-mono text-purple-400", children: ["+$", calculations.inferenceEarnings.toFixed(2)] })] }), _jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsxs("span", { className: "text-amber-400 flex items-center gap-1.5", children: [_jsx(Coins, { className: "h-3 w-3" }), "Purchase (", purchaseSharePercentage, "%)"] }), _jsxs("span", { className: "font-mono text-amber-400", children: ["+$", calculations.purchaseEarnings.toFixed(2)] })] }), _jsx("div", { className: "h-px bg-white/10 my-2" }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-white font-medium", children: "Your Earnings" }), _jsxs("span", { className: "text-xl font-semibold text-[#FF5800]", children: ["$", calculations.totalEarnings.toFixed(2)] })] }), _jsxs("p", { className: "text-[10px] text-neutral-600 leading-snug pt-2", children: ["Illustrative estimate only. Assumes", " ", Math.round(ASSUMED_INFERENCE_SPEND_SHARE * 100), "% of spend goes to inference and ", Math.round(ASSUMED_PURCHASE_SPEND_SHARE * 100), "% to credit purchases. Actual earnings depend on real usage."] })] })] }));
+}

package/cloud-ui/components/monetization/index.d.ts

@@ -0,0 +1,5 @@
+export { AnimatedCounter, AnimatedCounterWithLabel } from "./animated-counter";
+export { EarningsSimulator } from "./earnings-simulator";
+export { MilestoneCard, MilestoneProgress } from "./milestone-progress";
+export { RevenueFlowDiagram } from "./revenue-flow-diagram";
+//# sourceMappingURL=index.d.ts.map

package/cloud-ui/components/monetization/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/cloud-ui/components/monetization/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AAC/E,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC"}

package/cloud-ui/components/monetization/index.js

@@ -0,0 +1,4 @@
+export { AnimatedCounter, AnimatedCounterWithLabel } from "./animated-counter.js";
+export { EarningsSimulator } from "./earnings-simulator.js";
+export { MilestoneCard, MilestoneProgress } from "./milestone-progress.js";
+export { RevenueFlowDiagram } from "./revenue-flow-diagram.js";

package/cloud-ui/components/monetization/milestone-progress.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Milestone progress component showing progress toward withdrawal threshold.
+ * Features animated progress bar and celebratory state when milestone is reached.
+ */
+interface MilestoneProgressProps {
+    current: number;
+    target: number;
+    label?: string;
+    className?: string;
+    showAmount?: boolean;
+}
+export declare function MilestoneProgress({ current, target, label, className, showAmount, }: MilestoneProgressProps): import("react/jsx-runtime").JSX.Element;
+interface MilestoneCardProps extends MilestoneProgressProps {
+    title?: string;
+}
+export declare function MilestoneCard({ title, ...props }: MilestoneCardProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=milestone-progress.d.ts.map

package/cloud-ui/components/monetization/milestone-progress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"milestone-progress.d.ts","sourceRoot":"","sources":["../../../../../../../src/cloud-ui/components/monetization/milestone-progress.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAQH,UAAU,sBAAsB;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,MAAM,EACN,KAA8B,EAC9B,SAAS,EACT,UAAiB,GAClB,EAAE,sBAAsB,2CAwDxB;AAED,UAAU,kBAAmB,SAAQ,sBAAsB;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,aAAa,CAAC,EAC5B,KAA6B,EAC7B,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAgBpB"}

package/cloud-ui/components/monetization/milestone-progress.js

@@ -0,0 +1,28 @@
+/**
+ * Milestone progress component showing progress toward withdrawal threshold.
+ * Features animated progress bar and celebratory state when milestone is reached.
+ */
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CheckCircle2, Target } from "lucide-react";
+import { useEffect, useState } from "react";
+import { cn } from "../../lib/utils.js";
+export function MilestoneProgress({ current, target, label = "Withdrawal Threshold", className, showAmount = true, }) {
+    const [animatedProgress, setAnimatedProgress] = useState(0);
+    const progress = Math.min((current / target) * 100, 100);
+    const isComplete = current >= target;
+    useEffect(() => {
+        // Animate progress bar on mount
+        const timeout = setTimeout(() => {
+            setAnimatedProgress(progress);
+        }, 100);
+        return () => clearTimeout(timeout);
+    }, [progress]);
+    return (_jsxs("div", { className: cn("space-y-2", className), children: [_jsxs("div", { className: "flex items-center justify-between text-xs", children: [_jsxs("span", { className: "text-neutral-500 flex items-center gap-1.5", children: [_jsx(Target, { className: "h-3 w-3" }), label] }), showAmount && (_jsxs("span", { className: "text-neutral-400 font-mono", children: ["$", current.toFixed(2), " / $", target.toFixed(2)] }))] }), _jsx("div", { className: "relative h-1.5 bg-white/10 rounded-full overflow-hidden", children: _jsx("div", { className: cn("absolute inset-y-0 left-0 rounded-full transition-all duration-700 ease-out", isComplete ? "bg-emerald-500" : "bg-[#FF5800]"), style: { width: `${animatedProgress}%` } }) }), _jsxs("div", { className: "flex items-center justify-between", children: [isComplete ? (_jsxs("span", { className: "text-xs text-emerald-400 flex items-center gap-1.5", children: [_jsx(CheckCircle2, { className: "h-3.5 w-3.5" }), "Ready to withdraw!"] })) : (_jsxs("span", { className: "text-xs text-neutral-500", children: ["$", (target - current).toFixed(2), " more to unlock"] })), _jsxs("span", { className: "text-xs font-mono text-neutral-500", children: [progress.toFixed(0), "%"] })] })] }));
+}
+export function MilestoneCard({ title = "Withdrawal Progress", ...props }) {
+    const isComplete = props.current >= props.target;
+    return (_jsxs("div", { className: cn("p-4 rounded-sm border transition-colors", isComplete
+            ? "bg-emerald-500/5 border-emerald-500/30"
+            : "bg-neutral-900 border-white/10"), children: [_jsx("h4", { className: "text-sm font-medium text-white mb-3", children: title }), _jsx(MilestoneProgress, { ...props })] }));
+}

package/cloud-ui/components/monetization/revenue-flow-diagram.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Revenue flow diagram component showing how money flows from users to creators.
+ * Visual explanation of the monetization model.
+ */
+interface RevenueFlowDiagramProps {
+    markupPercentage: number;
+    purchaseSharePercentage: number;
+    className?: string;
+}
+export declare function RevenueFlowDiagram({ markupPercentage, purchaseSharePercentage, className, }: RevenueFlowDiagramProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=revenue-flow-diagram.d.ts.map

package/cloud-ui/components/monetization/revenue-flow-diagram.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"revenue-flow-diagram.d.ts","sourceRoot":"","sources":["../../../../../../../src/cloud-ui/components/monetization/revenue-flow-diagram.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAOH,UAAU,uBAAuB;IAC/B,gBAAgB,EAAE,MAAM,CAAC;IACzB,uBAAuB,EAAE,MAAM,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,kBAAkB,CAAC,EACjC,gBAAgB,EAChB,uBAAuB,EACvB,SAAS,GACV,EAAE,uBAAuB,2CAuHzB"}

package/cloud-ui/components/monetization/revenue-flow-diagram.js

@@ -0,0 +1,26 @@
+/**
+ * Revenue flow diagram component showing how money flows from users to creators.
+ * Visual explanation of the monetization model.
+ */
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ArrowRight, Coins, Server, User, Wallet, Zap } from "lucide-react";
+import { cn } from "../../lib/utils.js";
+export function RevenueFlowDiagram({ markupPercentage, purchaseSharePercentage, className, }) {
+    // Example calculation with $1.00 base cost
+    const baseCost = 1.0;
+    const markup = baseCost * (markupPercentage / 100);
+    const userPays = baseCost + markup;
+    return (_jsxs("div", { className: cn("bg-neutral-900 rounded-sm p-4 flex flex-col h-full", className), children: [_jsxs("div", { className: "mb-4", children: [_jsx("h3", { className: "text-sm font-medium text-white", children: "How Revenue Flows" }), _jsxs("p", { className: "text-xs text-neutral-500 mt-1", children: ["Example: User makes an AI request ($", baseCost.toFixed(2), " base cost)"] })] }), _jsxs("div", { className: "pb-4", children: [_jsxs("div", { className: "hidden sm:flex items-center justify-between gap-2", children: [_jsx(FlowNode, { icon: _jsx(User, { className: "h-5 w-5" }), label: "User", value: `Pays $${userPays.toFixed(2)}`, color: "text-blue-400", bgColor: "bg-blue-500/10" }), _jsx(FlowArrow, { label: `$${userPays.toFixed(2)}` }), _jsx(FlowNode, { icon: _jsx(Server, { className: "h-5 w-5" }), label: "Platform", value: `Keeps $${baseCost.toFixed(2)}`, color: "text-neutral-400", bgColor: "bg-white/5" }), _jsx(FlowArrow, { label: `$${markup.toFixed(2)}`, highlight: true }), _jsx(FlowNode, { icon: _jsx(Wallet, { className: "h-5 w-5" }), label: "You", value: `Earn $${markup.toFixed(2)}`, color: "text-[#FF5800]", bgColor: "bg-[#FF5800]/10", highlight: true })] }), _jsxs("div", { className: "sm:hidden space-y-2", children: [_jsx(FlowNodeMobile, { icon: _jsx(User, { className: "h-4 w-4" }), label: "User pays", value: `$${userPays.toFixed(2)}`, color: "text-blue-400" }), _jsx("div", { className: "flex justify-center", children: _jsx(ArrowRight, { className: "h-4 w-4 text-neutral-600 rotate-90" }) }), _jsx(FlowNodeMobile, { icon: _jsx(Server, { className: "h-4 w-4" }), label: "Platform keeps", value: `$${baseCost.toFixed(2)}`, color: "text-neutral-400", sublabel: "(base cost)" }), _jsx("div", { className: "flex justify-center", children: _jsx(ArrowRight, { className: "h-4 w-4 text-[#FF5800] rotate-90" }) }), _jsx(FlowNodeMobile, { icon: _jsx(Wallet, { className: "h-4 w-4" }), label: "You earn", value: `$${markup.toFixed(2)}`, color: "text-[#FF5800]", sublabel: `(${markupPercentage}% markup)`, highlight: true })] })] }), _jsx("div", { className: "mt-auto pt-4 border-t border-white/10", children: _jsxs("div", { className: "space-y-3 text-xs", children: [_jsxs("div", { className: "flex items-start gap-2", children: [_jsx(Zap, { className: "h-3 w-3 text-purple-400 mt-0.5" }), _jsxs("div", { children: [_jsx("p", { className: "font-medium text-purple-400", children: "Inference Markup" }), _jsxs("p", { className: "text-neutral-500 mt-0.5", children: ["You set ", markupPercentage, "% markup on AI costs. More usage = more earnings."] })] })] }), _jsxs("div", { className: "flex items-start gap-2", children: [_jsx(Coins, { className: "h-3 w-3 text-amber-400 mt-0.5" }), _jsxs("div", { children: [_jsx("p", { className: "font-medium text-amber-400", children: "Purchase Share" }), _jsxs("p", { className: "text-neutral-500 mt-0.5", children: ["Earn ", purchaseSharePercentage, "% when users buy credits in your app."] })] })] })] }) })] }));
+}
+function FlowNode({ icon, label, value, color, bgColor, highlight, }) {
+    return (_jsxs("div", { className: cn("flex flex-col items-center gap-2 p-3 rounded-sm border transition-colors w-[90px]", highlight ? "border-[#FF5800]/30" : "border-white/10", bgColor), children: [_jsx("div", { className: cn(color), children: icon }), _jsxs("div", { className: "text-center", children: [_jsx("p", { className: "text-xs font-medium text-white", children: label }), _jsx("p", { className: cn("text-[10px] font-mono", color), children: value })] })] }));
+}
+function FlowArrow({ label, highlight }) {
+    return (_jsxs("div", { className: "flex flex-col items-center gap-1 w-[50px]", children: [_jsx(ArrowRight, { className: cn("h-4 w-4", highlight ? "text-[#FF5800]" : "text-neutral-600") }), _jsx("span", { className: cn("text-[10px] font-mono", highlight ? "text-[#FF5800]" : "text-neutral-500"), children: label })] }));
+}
+function FlowNodeMobile({ icon, label, value, color, sublabel, highlight, }) {
+    return (_jsxs("div", { className: cn("flex items-center justify-between p-3 rounded-sm border", highlight
+            ? "border-[#FF5800]/30 bg-[#FF5800]/10"
+            : "border-white/10 bg-black/30"), children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: color, children: icon }), _jsxs("div", { children: [_jsx("span", { className: "text-xs text-white", children: label }), sublabel && (_jsx("span", { className: "text-[10px] text-neutral-500 ml-1", children: sublabel }))] })] }), _jsx("span", { className: cn("text-sm font-mono font-medium", color), children: value })] }));
+}

package/cloud-ui/components/navigation-progress.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Drives the nprogress bar from react-router navigation.
+ *
+ * Strategy: when the location changes, start the bar and finish it shortly
+ * after — the bar is a presence cue, not an in-flight indicator (the SPA
+ * does its own data fetching with TanStack Query). The previous version
+ * had `[]` deps and only fired once; this version reacts to every
+ * navigation.
+ */
+export declare function NavigationProgress(): null;
+//# sourceMappingURL=navigation-progress.d.ts.map

package/cloud-ui/components/navigation-progress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-progress.d.ts","sourceRoot":"","sources":["../../../../../../src/cloud-ui/components/navigation-progress.tsx"],"names":[],"mappings":"AAOA;;;;;;;;GAQG;AACH,wBAAgB,kBAAkB,SA6BjC"}

package/cloud-ui/components/navigation-progress.js

@@ -0,0 +1,42 @@
+/// <reference path="../types/nprogress.d.ts" />
+import nprogress from "nprogress";
+import { useEffect, useRef } from "react";
+import { useLocation } from "react-router-dom";
+nprogress.configure({ showSpinner: false, trickleSpeed: 120, minimum: 0.15 });
+/**
+ * Drives the nprogress bar from react-router navigation.
+ *
+ * Strategy: when the location changes, start the bar and finish it shortly
+ * after — the bar is a presence cue, not an in-flight indicator (the SPA
+ * does its own data fetching with TanStack Query). The previous version
+ * had `[]` deps and only fired once; this version reacts to every
+ * navigation.
+ */
+export function NavigationProgress() {
+    const { pathname, search } = useLocation();
+    const isFirstRender = useRef(true);
+    const timerRef = useRef(null);
+    // biome-ignore lint/correctness/useExhaustiveDependencies: pathname/search are intentional triggers — each navigation should restart the bar
+    useEffect(() => {
+        if (isFirstRender.current) {
+            isFirstRender.current = false;
+            return;
+        }
+        nprogress.start();
+        if (timerRef.current !== null) {
+            window.clearTimeout(timerRef.current);
+        }
+        timerRef.current = window.setTimeout(() => {
+            nprogress.done();
+            timerRef.current = null;
+        }, 200);
+        return () => {
+            if (timerRef.current !== null) {
+                window.clearTimeout(timerRef.current);
+                timerRef.current = null;
+            }
+            nprogress.done();
+        };
+    }, [pathname, search]);
+    return null;
+}

package/cloud-ui/components/primitives.d.ts

@@ -0,0 +1,58 @@
+export * from "../../components/ui/accordion";
+export * from "../../components/ui/alert";
+export * from "../../components/ui/alert-dialog";
+export * from "../../components/ui/avatar";
+export * from "../../components/ui/badge";
+export * from "../../components/ui/button";
+export * from "../../components/ui/calendar";
+export * from "../../components/ui/card";
+export * from "../../components/ui/carousel";
+export * from "../../components/ui/chart";
+export * from "../../components/ui/checkbox";
+export * from "../../components/ui/collapsible";
+export * from "../../components/ui/dialog";
+export * from "../../components/ui/dropdown-menu";
+export * from "../../components/ui/empty-state";
+export * from "../../components/ui/form";
+export * from "../../components/ui/hover-card";
+export * from "../../components/ui/input";
+export * from "../../components/ui/label";
+export * from "../../components/ui/pagination";
+export * from "../../components/ui/progress";
+export * from "../../components/ui/scroll-area";
+export * from "../../components/ui/select";
+export * from "../../components/ui/separator";
+export * from "../../components/ui/skeleton";
+export { DetailSkeleton, ListSkeleton, TableSkeleton, } from "../../components/ui/skeleton-layouts";
+export * from "../../components/ui/slider";
+export * from "../../components/ui/status-badge";
+export * from "../../components/ui/status-badge.helpers";
+export * from "../../components/ui/switch";
+export * from "../../components/ui/table";
+export * from "../../components/ui/tabs";
+export * from "../../components/ui/textarea";
+export * from "../../components/ui/toggle";
+export * from "../../components/ui/tooltip";
+export * from "../lib/utils";
+export * from "./ai-elements";
+export * from "./analytics";
+export { ApiKeyEmptyState } from "./api-key-empty-state";
+export * from "./brand";
+export * from "./code";
+export * from "./connection-card";
+export { AppsEmptyState, type AppsEmptyStateProps, AppsSkeleton, ContainersEmptyState, ContainersSkeleton, DashboardActionCards, type DashboardActionCardsProps, DashboardActionCardsSkeleton, } from "./dashboard/cloud-dashboard-components";
+export { DashboardRouteError } from "./dashboard/dashboard-route-error";
+export { formatDashboardRouteErrorMessage } from "./dashboard/dashboard-route-error.helpers";
+export { DashboardErrorState, DashboardLoadingState, } from "./dashboard/route-placeholders";
+export { DocsLayout, type DocsLayoutProps } from "./docs/docs-layout";
+export type { DocsFrontmatter, MdxModule, NavItem } from "./docs/docs-types";
+export * from "./drawer";
+export * from "./layout";
+export { NavigationProgress } from "./navigation-progress";
+export * from "./resizable";
+export * from "./share";
+export * from "./sonner";
+export * from "./spotlight";
+export * from "./theme";
+export * from "./timeline";
+//# sourceMappingURL=primitives.d.ts.map

package/cloud-ui/components/primitives.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../../../../../src/cloud-ui/components/primitives.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC;AAC9C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,mCAAmC,CAAC;AAClD,cAAc,iCAAiC,CAAC;AAChD,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iCAAiC,CAAC;AAChD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EACL,cAAc,EACd,YAAY,EACZ,aAAa,GACd,MAAM,sCAAsC,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,0CAA0C,CAAC;AACzD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,mBAAmB,CAAC;AAClC,OAAO,EACL,cAAc,EACd,KAAK,mBAAmB,EACxB,YAAY,EACZ,oBAAoB,EACpB,kBAAkB,EAClB,oBAAoB,EACpB,KAAK,yBAAyB,EAC9B,4BAA4B,GAC7B,MAAM,wCAAwC,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,gCAAgC,EAAE,MAAM,2CAA2C,CAAC;AAC7F,OAAO,EACL,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACtE,YAAY,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC7E,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC"}

package/cloud-ui/components/primitives.js

@@ -0,0 +1,56 @@
+export * from "../../components/ui/accordion.js";
+export * from "../../components/ui/alert.js";
+export * from "../../components/ui/alert-dialog.js";
+export * from "../../components/ui/avatar.js";
+export * from "../../components/ui/badge.js";
+export * from "../../components/ui/button.js";
+export * from "../../components/ui/calendar.js";
+export * from "../../components/ui/card.js";
+export * from "../../components/ui/carousel.js";
+export * from "../../components/ui/chart.js";
+export * from "../../components/ui/checkbox.js";
+export * from "../../components/ui/collapsible.js";
+export * from "../../components/ui/dialog.js";
+export * from "../../components/ui/dropdown-menu.js";
+export * from "../../components/ui/empty-state.js";
+export * from "../../components/ui/form.js";
+export * from "../../components/ui/hover-card.js";
+export * from "../../components/ui/input.js";
+export * from "../../components/ui/label.js";
+export * from "../../components/ui/pagination.js";
+export * from "../../components/ui/progress.js";
+export * from "../../components/ui/scroll-area.js";
+export * from "../../components/ui/select.js";
+export * from "../../components/ui/separator.js";
+export * from "../../components/ui/skeleton.js";
+export { DetailSkeleton, ListSkeleton, TableSkeleton, } from "../../components/ui/skeleton-layouts.js";
+export * from "../../components/ui/slider.js";
+export * from "../../components/ui/status-badge.js";
+export * from "../../components/ui/status-badge.helpers.js";
+export * from "../../components/ui/switch.js";
+export * from "../../components/ui/table.js";
+export * from "../../components/ui/tabs.js";
+export * from "../../components/ui/textarea.js";
+export * from "../../components/ui/toggle.js";
+export * from "../../components/ui/tooltip.js";
+export * from "../lib/utils.js";
+export * from "./ai-elements/index.js";
+export * from "./analytics/index.js";
+export { ApiKeyEmptyState } from "./api-key-empty-state.js";
+export * from "./brand/index.js";
+export * from "./code/index.js";
+export * from "./connection-card.js";
+export { AppsEmptyState, AppsSkeleton, ContainersEmptyState, ContainersSkeleton, DashboardActionCards, DashboardActionCardsSkeleton, } from "./dashboard/cloud-dashboard-components.js";
+export { DashboardRouteError } from "./dashboard/dashboard-route-error.js";
+export { formatDashboardRouteErrorMessage } from "./dashboard/dashboard-route-error.helpers.js";
+export { DashboardErrorState, DashboardLoadingState, } from "./dashboard/route-placeholders.js";
+export { DocsLayout } from "./docs/docs-layout.js";
+export * from "./drawer.js";
+export * from "./layout/index.js";
+export { NavigationProgress } from "./navigation-progress.js";
+export * from "./resizable.js";
+export * from "./share/index.js";
+export * from "./sonner.js";
+export * from "./spotlight.js";
+export * from "./theme/index.js";
+export * from "./timeline.js";

package/cloud-ui/components/product-switcher.d.ts

@@ -0,0 +1,16 @@
+export type ProductSwitcherItem = {
+    label: string;
+    href: string;
+    active?: boolean;
+    external?: boolean;
+};
+export type ProductSwitcherProps = {
+    items: ProductSwitcherItem[];
+    className?: string;
+    linkClassName?: string;
+    activeClassName?: string;
+    inactiveClassName?: string;
+    "aria-label"?: string;
+};
+export declare function ProductSwitcher({ items, className, linkClassName, activeClassName, inactiveClassName, "aria-label": ariaLabel, }: ProductSwitcherProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-switcher.d.ts.map

package/cloud-ui/components/product-switcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-switcher.d.ts","sourceRoot":"","sources":["../../../../../../src/cloud-ui/components/product-switcher.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,SAAS,EACT,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,YAAY,EAAE,SAA8B,GAC7C,EAAE,oBAAoB,2CA8BtB"}

package/cloud-ui/components/product-switcher.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+export function ProductSwitcher({ items, className, linkClassName, activeClassName, inactiveClassName, "aria-label": ariaLabel = "Product switcher", }) {
+    return (_jsx("nav", { "aria-label": ariaLabel, className: cn("flex flex-wrap items-center justify-end gap-1 rounded-full border border-border/70 bg-card/82 p-1 text-sm text-muted-strong backdrop-blur-md", className), children: items.map((item) => (_jsx("a", { "aria-current": item.active ? "page" : undefined, className: cn("rounded-full px-3 py-1.5 font-medium transition-colors", item.active
+                ? "bg-primary text-primary-foreground "
+                : "hover:bg-bg-accent hover:text-txt", item.active ? activeClassName : inactiveClassName, linkClassName), href: item.href, rel: item.external ? "noopener noreferrer" : undefined, target: item.external ? "_blank" : undefined, children: item.label }, item.label))) }));
+}