@contractspec/lib.example-shared-ui 6.0.17 → 6.0.18

package/dist/index.js

@@ -1,2147 +1,6 @@
 // @bun
-// src/hooks/useEvolution.ts
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-"use client";
-var EVOLUTION_STORAGE_KEY = "contractspec-evolution-data";
-function useEvolution(templateId) {
-  const [usageStats, setUsageStats] = useState([]);
-  const [anomalies, setAnomalies] = useState([]);
-  const [suggestions, setSuggestions] = useState([]);
-  const [hints, setHints] = useState([]);
-  const [loading, setLoading] = useState(false);
-  const metricsRef = useRef([]);
-  const [operationCount, setOperationCount] = useState(0);
-  useEffect(() => {
-    try {
-      const stored = localStorage.getItem(`${EVOLUTION_STORAGE_KEY}-${templateId}`);
-      if (stored) {
-        const data = JSON.parse(stored);
-        setSuggestions(data.suggestions.map((s) => ({
-          ...s,
-          createdAt: new Date(s.createdAt)
-        })));
-      }
-    } catch {}
-  }, [templateId]);
-  useEffect(() => {
-    try {
-      localStorage.setItem(`${EVOLUTION_STORAGE_KEY}-${templateId}`, JSON.stringify({ suggestions }));
-    } catch {}
-  }, [suggestions, templateId]);
-  const trackOperation = useCallback((operationName, durationMs, success, errorCode) => {
-    const sample = {
-      operation: {
-        name: operationName,
-        version: "1.0.0",
-        tenantId: "sandbox"
-      },
-      durationMs,
-      success,
-      timestamp: new Date,
-      errorCode
-    };
-    metricsRef.current.push(sample);
-    setOperationCount((prev) => prev + 1);
-  }, []);
-  const analyzeUsage = useCallback(() => {
-    const samples = metricsRef.current;
-    if (samples.length < 5)
-      return;
-    const groups = new Map;
-    for (const sample of samples) {
-      const key = `${sample.operation.name}.v${sample.operation.version}`;
-      const arr = groups.get(key) ?? [];
-      arr.push(sample);
-      groups.set(key, arr);
-    }
-    const stats = [];
-    const detectedAnomalies = [];
-    groups.forEach((opSamples) => {
-      if (opSamples.length < 3)
-        return;
-      const durations = opSamples.map((s) => s.durationMs).sort((a, b) => a - b);
-      const errors = opSamples.filter((s) => !s.success);
-      const totalCalls = opSamples.length;
-      const errorRate = errors.length / totalCalls;
-      const averageLatencyMs = durations.reduce((sum, value) => sum + value, 0) / totalCalls;
-      const timestamps = opSamples.map((s) => s.timestamp.getTime());
-      const firstSample = opSamples[0];
-      if (!firstSample)
-        return;
-      const stat = {
-        operation: firstSample.operation,
-        totalCalls,
-        successRate: 1 - errorRate,
-        errorRate,
-        averageLatencyMs,
-        p95LatencyMs: percentile(durations, 0.95),
-        p99LatencyMs: percentile(durations, 0.99),
-        maxLatencyMs: Math.max(...durations),
-        lastSeenAt: new Date(Math.max(...timestamps)),
-        windowStart: new Date(Math.min(...timestamps)),
-        windowEnd: new Date(Math.max(...timestamps)),
-        topErrors: errors.reduce((acc, s) => {
-          if (s.errorCode) {
-            acc[s.errorCode] = (acc[s.errorCode] ?? 0) + 1;
-          }
-          return acc;
-        }, {})
-      };
-      stats.push(stat);
-      if (errorRate > 0.1) {
-        detectedAnomalies.push({
-          operation: stat.operation,
-          severity: errorRate > 0.3 ? "high" : errorRate > 0.2 ? "medium" : "low",
-          metric: "error-rate",
-          description: `Error rate ${(errorRate * 100).toFixed(1)}% exceeds threshold`,
-          detectedAt: new Date,
-          threshold: 0.1,
-          observedValue: errorRate
-        });
-      }
-      if (stat.p99LatencyMs > 500) {
-        detectedAnomalies.push({
-          operation: stat.operation,
-          severity: stat.p99LatencyMs > 1000 ? "high" : stat.p99LatencyMs > 750 ? "medium" : "low",
-          metric: "latency",
-          description: `P99 latency ${stat.p99LatencyMs.toFixed(0)}ms exceeds threshold`,
-          detectedAt: new Date,
-          threshold: 500,
-          observedValue: stat.p99LatencyMs
-        });
-      }
-    });
-    setUsageStats(stats);
-    setAnomalies(detectedAnomalies);
-    const newHints = detectedAnomalies.map((anomaly) => ({
-      operation: anomaly.operation,
-      category: anomaly.metric === "latency" ? "performance" : "error-handling",
-      summary: anomaly.metric === "latency" ? "Latency regression detected" : "Error spike detected",
-      justification: anomaly.description,
-      recommendedActions: anomaly.metric === "latency" ? [
-        "Add caching layer",
-        "Optimize database queries",
-        "Consider pagination"
-      ] : [
-        "Add retry logic",
-        "Improve error handling",
-        "Add circuit breaker"
-      ]
-    }));
-    setHints(newHints);
-  }, []);
-  const generateSuggestions = useCallback(async () => {
-    if (anomalies.length === 0)
-      return;
-    setLoading(true);
-    await new Promise((resolve) => setTimeout(resolve, 800));
-    const newSuggestions = anomalies.map((anomaly) => ({
-      id: `suggestion-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`,
-      intent: {
-        id: `intent-${anomaly.operation.name}`,
-        type: anomaly.metric === "latency" ? "latency-regression" : anomaly.metric === "error-rate" ? "error-spike" : "throughput-drop",
-        description: anomaly.description,
-        operation: anomaly.operation,
-        confidence: {
-          score: anomaly.severity === "high" ? 0.9 : anomaly.severity === "medium" ? 0.7 : 0.5,
-          sampleSize: usageStats.find((s) => s.operation.name === anomaly.operation.name)?.totalCalls ?? 0
-        }
-      },
-      target: anomaly.operation,
-      proposal: {
-        summary: generateSuggestionSummary(anomaly),
-        rationale: generateSuggestionRationale(anomaly),
-        changeType: anomaly.metric === "error-rate" ? "policy-update" : "revision",
-        recommendedActions: generateRecommendedActions(anomaly)
-      },
-      confidence: anomaly.severity === "high" ? 0.85 : anomaly.severity === "medium" ? 0.7 : 0.55,
-      createdAt: new Date,
-      createdBy: "ai-evolution-agent",
-      status: "pending",
-      priority: anomaly.severity
-    }));
-    setSuggestions((prev) => [...prev, ...newSuggestions]);
-    setLoading(false);
-  }, [anomalies, usageStats]);
-  const approveSuggestion = useCallback((id, _notes) => {
-    setSuggestions((prev) => prev.map((s) => s.id === id ? { ...s, status: "approved" } : s));
-  }, []);
-  const rejectSuggestion = useCallback((id, _notes) => {
-    setSuggestions((prev) => prev.map((s) => s.id === id ? { ...s, status: "rejected" } : s));
-  }, []);
-  const clear = useCallback(() => {
-    metricsRef.current = [];
-    setOperationCount(0);
-    setUsageStats([]);
-    setAnomalies([]);
-    setSuggestions([]);
-    setHints([]);
-    localStorage.removeItem(`${EVOLUTION_STORAGE_KEY}-${templateId}`);
-  }, [templateId]);
-  return useMemo(() => ({
-    usageStats,
-    anomalies,
-    suggestions,
-    hints,
-    loading,
-    trackOperation,
-    analyzeUsage,
-    generateSuggestions,
-    approveSuggestion,
-    rejectSuggestion,
-    clear,
-    operationCount
-  }), [
-    usageStats,
-    anomalies,
-    suggestions,
-    hints,
-    loading,
-    trackOperation,
-    analyzeUsage,
-    generateSuggestions,
-    approveSuggestion,
-    rejectSuggestion,
-    clear,
-    operationCount
-  ]);
-}
-function percentile(values, p) {
-  if (!values.length)
-    return 0;
-  if (values.length === 1)
-    return values[0] ?? 0;
-  const idx = Math.min(values.length - 1, Math.floor(p * values.length));
-  return values[idx] ?? 0;
-}
-function generateSuggestionSummary(anomaly) {
-  if (anomaly.metric === "latency") {
-    return `Add caching and pagination to ${anomaly.operation.name} to reduce latency`;
-  }
-  if (anomaly.metric === "error-rate") {
-    return `Add retry policy and circuit breaker to ${anomaly.operation.name}`;
-  }
-  return `Optimize ${anomaly.operation.name} for improved throughput`;
-}
-function generateSuggestionRationale(anomaly) {
-  if (anomaly.metric === "latency") {
-    return `The operation ${anomaly.operation.name} is experiencing P99 latency of ${anomaly.observedValue?.toFixed(0)}ms, which is above the recommended threshold of ${anomaly.threshold}ms. This can impact user experience and downstream operations.`;
-  }
-  if (anomaly.metric === "error-rate") {
-    return `The error rate for ${anomaly.operation.name} is ${((anomaly.observedValue ?? 0) * 100).toFixed(1)}%, indicating potential issues with input validation, external dependencies, or resource limits.`;
-  }
-  return `Throughput for ${anomaly.operation.name} has dropped significantly, suggesting potential bottlenecks or reduced demand that should be investigated.`;
-}
-function generateRecommendedActions(anomaly) {
-  if (anomaly.metric === "latency") {
-    return [
-      "Add response caching for frequently accessed data",
-      "Implement pagination for large result sets",
-      "Optimize database queries with proper indexing",
-      "Consider adding a GraphQL DataLoader for batching"
-    ];
-  }
-  if (anomaly.metric === "error-rate") {
-    return [
-      "Add input validation at the contract level",
-      "Implement retry policy with exponential backoff",
-      "Add circuit breaker for external dependencies",
-      "Enhance error logging for better debugging"
-    ];
-  }
-  return [
-    "Review resource allocation and scaling policies",
-    "Check for upstream routing or load balancer issues",
-    "Validate feature flag configurations",
-    "Monitor dependency health metrics"
-  ];
-}
-
-// src/EvolutionDashboard.tsx
-import { Button, LoaderBlock } from "@contractspec/lib.design-system";
-import { Badge } from "@contractspec/lib.ui-kit-web/ui/badge";
-import { Card } from "@contractspec/lib.ui-kit-web/ui/card";
-import { useCallback as useCallback2, useMemo as useMemo2 } from "react";
-import { jsxDEV } from "react/jsx-dev-runtime";
-"use client";
-function EvolutionDashboard({
-  templateId,
-  onLog
-}) {
-  const {
-    usageStats,
-    anomalies,
-    suggestions,
-    hints,
-    loading,
-    trackOperation,
-    analyzeUsage,
-    generateSuggestions,
-    approveSuggestion,
-    rejectSuggestion,
-    clear,
-    operationCount
-  } = useEvolution(templateId);
-  const handleSimulateOperations = useCallback2(() => {
-    const operations = [
-      { name: `${templateId}.list`, duration: 150, success: true },
-      { name: `${templateId}.list`, duration: 180, success: true },
-      { name: `${templateId}.create`, duration: 350, success: true },
-      {
-        name: `${templateId}.create`,
-        duration: 420,
-        success: false,
-        error: "VALIDATION_ERROR"
-      },
-      { name: `${templateId}.list`, duration: 200, success: true },
-      { name: `${templateId}.get`, duration: 80, success: true },
-      { name: `${templateId}.update`, duration: 280, success: true },
-      { name: `${templateId}.list`, duration: 950, success: true },
-      {
-        name: `${templateId}.delete`,
-        duration: 150,
-        success: false,
-        error: "NOT_FOUND"
-      },
-      { name: `${templateId}.create`, duration: 380, success: true }
-    ];
-    for (const op of operations) {
-      trackOperation(op.name, op.duration, op.success, op.error);
-    }
-    onLog?.(`Simulated ${operations.length} operations`);
-    setTimeout(() => {
-      analyzeUsage();
-      onLog?.("Analysis complete");
-    }, 100);
-  }, [templateId, trackOperation, analyzeUsage, onLog]);
-  const handleGenerateSuggestions = useCallback2(async () => {
-    await generateSuggestions();
-    onLog?.("AI suggestions generated");
-  }, [generateSuggestions, onLog]);
-  const handleApproveSuggestion = useCallback2((id) => {
-    approveSuggestion(id);
-    onLog?.(`Suggestion ${id.slice(0, 8)} approved`);
-  }, [approveSuggestion, onLog]);
-  const handleRejectSuggestion = useCallback2((id) => {
-    rejectSuggestion(id);
-    onLog?.(`Suggestion ${id.slice(0, 8)} rejected`);
-  }, [rejectSuggestion, onLog]);
-  const handleClear = useCallback2(() => {
-    clear();
-    onLog?.("Evolution data cleared");
-  }, [clear, onLog]);
-  const pendingSuggestions = useMemo2(() => suggestions.filter((s) => s.status === "pending"), [suggestions]);
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "space-y-6",
-    children: [
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "flex items-center justify-between",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV("h2", {
-                className: "font-semibold text-xl",
-                children: "AI Evolution Engine"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV("p", {
-                className: "text-muted-foreground text-sm",
-                children: "Analyze usage patterns and get AI-powered suggestions"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV(Badge, {
-                variant: "secondary",
-                children: [
-                  operationCount,
-                  " ops tracked"
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV(Button, {
-                variant: "ghost",
-                size: "sm",
-                onPress: handleClear,
-                children: "Clear"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV(Card, {
-        className: "p-4",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "flex flex-wrap items-center gap-3",
-            children: [
-              /* @__PURE__ */ jsxDEV(Button, {
-                variant: "default",
-                size: "sm",
-                onPress: handleSimulateOperations,
-                children: "Simulate Operations"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV(Button, {
-                variant: "outline",
-                size: "sm",
-                onPress: analyzeUsage,
-                disabled: operationCount < 5,
-                children: "Analyze Usage"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV(Button, {
-                variant: "outline",
-                size: "sm",
-                onPress: handleGenerateSuggestions,
-                disabled: anomalies.length === 0 || loading,
-                children: loading ? "Generating..." : "Generate AI Suggestions"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("p", {
-            className: "mt-2 text-muted-foreground text-xs",
-            children: "Simulate sandbox operations, analyze patterns, and generate AI improvement suggestions."
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      loading && /* @__PURE__ */ jsxDEV(LoaderBlock, {
-        label: "Generating AI suggestions..."
-      }, undefined, false, undefined, this),
-      usageStats.length > 0 && /* @__PURE__ */ jsxDEV(Card, {
-        className: "p-4",
-        children: [
-          /* @__PURE__ */ jsxDEV("h3", {
-            className: "mb-3 font-semibold",
-            children: "Usage Statistics"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "grid gap-3 md:grid-cols-2 lg:grid-cols-3",
-            children: usageStats.map((stat) => /* @__PURE__ */ jsxDEV(UsageStatCard, {
-              stat
-            }, stat.operation.name, false, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      anomalies.length > 0 && /* @__PURE__ */ jsxDEV(Card, {
-        className: "p-4",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "mb-3 flex items-center justify-between",
-            children: [
-              /* @__PURE__ */ jsxDEV("h3", {
-                className: "font-semibold",
-                children: "Detected Anomalies"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV(Badge, {
-                variant: "secondary",
-                className: "border-amber-500/30 bg-amber-500/20 text-amber-400",
-                children: [
-                  anomalies.length,
-                  " issues"
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "space-y-2",
-            children: anomalies.map((anomaly, index) => /* @__PURE__ */ jsxDEV(AnomalyCard, {
-              anomaly
-            }, `${anomaly.operation.name}-${index}`, false, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      suggestions.length > 0 && /* @__PURE__ */ jsxDEV(Card, {
-        className: "p-4",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "mb-3 flex items-center justify-between",
-            children: [
-              /* @__PURE__ */ jsxDEV("h3", {
-                className: "font-semibold",
-                children: "AI Suggestions"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV("div", {
-                className: "flex items-center gap-2",
-                children: pendingSuggestions.length > 0 && /* @__PURE__ */ jsxDEV(Badge, {
-                  variant: "secondary",
-                  className: "border-amber-500/30 bg-amber-500/20 text-amber-400",
-                  children: [
-                    pendingSuggestions.length,
-                    " pending"
-                  ]
-                }, undefined, true, undefined, this)
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "space-y-3",
-            children: suggestions.map((suggestion) => /* @__PURE__ */ jsxDEV(SuggestionCard, {
-              suggestion,
-              onApprove: handleApproveSuggestion,
-              onReject: handleRejectSuggestion
-            }, suggestion.id, false, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      hints.length > 0 && /* @__PURE__ */ jsxDEV(Card, {
-        className: "p-4",
-        children: [
-          /* @__PURE__ */ jsxDEV("h3", {
-            className: "mb-3 font-semibold",
-            children: "Optimization Hints"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "space-y-2",
-            children: hints.map((hint, index) => /* @__PURE__ */ jsxDEV(HintCard, {
-              hint
-            }, `${hint.operation.name}-${index}`, false, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      usageStats.length === 0 && anomalies.length === 0 && suggestions.length === 0 && /* @__PURE__ */ jsxDEV(Card, {
-        className: "p-8 text-center",
-        children: /* @__PURE__ */ jsxDEV("p", {
-          className: "text-muted-foreground",
-          children: 'Click "Simulate Operations" to generate sample data for analysis.'
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function UsageStatCard({ stat }) {
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "rounded-lg border border-violet-500/20 bg-violet-500/5 p-3",
-    children: [
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "mb-2 flex items-center justify-between",
-        children: [
-          /* @__PURE__ */ jsxDEV("span", {
-            className: "font-medium font-mono text-sm",
-            children: stat.operation.name
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV(Badge, {
-            variant: stat.errorRate > 0.1 ? "destructive" : "default",
-            className: stat.errorRate > 0.1 ? "" : "border-green-500/30 bg-green-500/20 text-green-400",
-            children: [
-              ((1 - stat.errorRate) * 100).toFixed(0),
-              "% success"
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "grid grid-cols-2 gap-2 text-xs",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "text-muted-foreground",
-                children: "Total Calls:"
-              }, undefined, false, undefined, this),
-              " ",
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "font-medium",
-                children: stat.totalCalls
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "text-muted-foreground",
-                children: "Avg Latency:"
-              }, undefined, false, undefined, this),
-              " ",
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "font-medium",
-                children: [
-                  stat.averageLatencyMs.toFixed(0),
-                  "ms"
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "text-muted-foreground",
-                children: "P95:"
-              }, undefined, false, undefined, this),
-              " ",
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "font-medium",
-                children: [
-                  stat.p95LatencyMs.toFixed(0),
-                  "ms"
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "text-muted-foreground",
-                children: "P99:"
-              }, undefined, false, undefined, this),
-              " ",
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "font-medium",
-                children: [
-                  stat.p99LatencyMs.toFixed(0),
-                  "ms"
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function AnomalyCard({ anomaly }) {
-  const severityColors = {
-    low: "text-amber-400",
-    medium: "text-orange-400",
-    high: "text-red-400"
-  };
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "flex items-center justify-between rounded-lg border border-amber-500/30 bg-amber-500/5 p-3",
-    children: [
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "flex items-center gap-3",
-        children: [
-          /* @__PURE__ */ jsxDEV("span", {
-            className: `text-lg ${severityColors[anomaly.severity]}`,
-            title: `${anomaly.severity} severity`,
-            children: anomaly.severity === "high" ? "\uD83D\uDD34" : anomaly.severity === "medium" ? "\uD83D\uDFE0" : "\uD83D\uDFE1"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV("p", {
-                className: "font-medium text-sm",
-                children: anomaly.description
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV("p", {
-                className: "text-muted-foreground text-xs",
-                children: [
-                  anomaly.operation.name,
-                  " \u2022 ",
-                  anomaly.metric
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV(Badge, {
-        variant: anomaly.severity === "high" ? "destructive" : "secondary",
-        className: anomaly.severity === "medium" ? "border-amber-500/30 bg-amber-500/20 text-amber-400" : "",
-        children: anomaly.severity
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function SuggestionCard({
-  suggestion,
-  onApprove,
-  onReject
-}) {
-  const getStatusStyles = (status) => {
-    switch (status) {
-      case "pending":
-        return {
-          variant: "secondary",
-          className: "bg-amber-500/20 text-amber-400 border-amber-500/30"
-        };
-      case "approved":
-        return {
-          variant: "default",
-          className: "bg-green-500/20 text-green-400 border-green-500/30"
-        };
-      case "rejected":
-        return { variant: "destructive", className: "" };
-      default:
-        return { variant: "secondary", className: "" };
-    }
-  };
-  const statusStyle = getStatusStyles(suggestion.status);
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "rounded-lg border border-violet-500/30 bg-violet-500/5 p-4",
-    children: [
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "mb-2 flex items-start justify-between",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "flex-1",
-            children: [
-              /* @__PURE__ */ jsxDEV("div", {
-                className: "flex items-center gap-2",
-                children: [
-                  /* @__PURE__ */ jsxDEV("span", {
-                    className: "text-lg",
-                    children: suggestion.intent.type === "latency-regression" ? "\u26A1" : suggestion.intent.type === "error-spike" ? "\uD83D\uDD25" : "\uD83D\uDCC9"
-                  }, undefined, false, undefined, this),
-                  /* @__PURE__ */ jsxDEV("h4", {
-                    className: "font-medium",
-                    children: suggestion.proposal.summary
-                  }, undefined, false, undefined, this)
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV("p", {
-                className: "mt-1 text-muted-foreground text-sm",
-                children: suggestion.proposal.rationale
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV(Badge, {
-            variant: statusStyle.variant,
-            className: statusStyle.className,
-            children: suggestion.status
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      suggestion.proposal.recommendedActions && suggestion.proposal.recommendedActions.length > 0 && /* @__PURE__ */ jsxDEV("div", {
-        className: "mt-3",
-        children: [
-          /* @__PURE__ */ jsxDEV("p", {
-            className: "mb-1 font-semibold text-violet-400 text-xs uppercase",
-            children: "Recommended Actions"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV("ul", {
-            className: "list-inside list-disc space-y-1 text-xs",
-            children: suggestion.proposal.recommendedActions.slice(0, 3).map((action, i) => /* @__PURE__ */ jsxDEV("li", {
-              children: action
-            }, i, false, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV("div", {
-        className: "mt-3 flex items-center justify-between",
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            className: "flex items-center gap-2 text-xs",
-            children: [
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "text-muted-foreground",
-                children: [
-                  "Confidence: ",
-                  (suggestion.confidence * 100).toFixed(0),
-                  "%"
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV("span", {
-                className: "text-muted-foreground",
-                children: "\u2022"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV(Badge, {
-                variant: "secondary",
-                children: suggestion.priority
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          suggestion.status === "pending" && /* @__PURE__ */ jsxDEV("div", {
-            className: "flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV(Button, {
-                variant: "outline",
-                size: "sm",
-                onPress: () => onReject(suggestion.id),
-                children: "Reject"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV(Button, {
-                variant: "default",
-                size: "sm",
-                onPress: () => onApprove(suggestion.id),
-                children: "Approve"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function HintCard({ hint }) {
-  const categoryIcons = {
-    schema: "\uD83D\uDCD0",
-    policy: "\uD83D\uDD12",
-    performance: "\u26A1",
-    "error-handling": "\uD83D\uDEE1\uFE0F"
-  };
-  return /* @__PURE__ */ jsxDEV("div", {
-    className: "rounded-lg border border-blue-500/20 bg-blue-500/5 p-3",
-    children: /* @__PURE__ */ jsxDEV("div", {
-      className: "flex items-start gap-3",
-      children: [
-        /* @__PURE__ */ jsxDEV("span", {
-          className: "text-lg",
-          children: categoryIcons[hint.category]
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV("div", {
-          className: "flex-1",
-          children: [
-            /* @__PURE__ */ jsxDEV("p", {
-              className: "font-medium",
-              children: hint.summary
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV("p", {
-              className: "mt-1 text-muted-foreground text-xs",
-              children: hint.justification
-            }, undefined, false, undefined, this),
-            hint.recommendedActions.length > 0 && /* @__PURE__ */ jsxDEV("ul", {
-              className: "mt-2 list-inside list-disc text-xs",
-              children: hint.recommendedActions.slice(0, 2).map((action, i) => /* @__PURE__ */ jsxDEV("li", {
-                children: action
-              }, i, false, undefined, this))
-            }, undefined, false, undefined, this)
-          ]
-        }, undefined, true, undefined, this)
-      ]
-    }, undefined, true, undefined, this)
-  }, undefined, false, undefined, this);
-}
-
-// src/EvolutionSidebar.tsx
-import { Button as Button2 } from "@contractspec/lib.design-system";
-import { Badge as Badge2 } from "@contractspec/lib.ui-kit-web/ui/badge";
-import { Card as Card2 } from "@contractspec/lib.ui-kit-web/ui/card";
-import { useCallback as useCallback3, useMemo as useMemo3 } from "react";
-import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
-"use client";
-function EvolutionSidebar({
-  templateId,
-  expanded = false,
-  onToggle,
-  onLog,
-  onOpenEvolution
-}) {
-  const {
-    anomalies,
-    suggestions,
-    loading,
-    approveSuggestion,
-    rejectSuggestion,
-    operationCount
-  } = useEvolution(templateId);
-  const pendingSuggestions = useMemo3(() => suggestions.filter((s) => s.status === "pending"), [suggestions]);
-  const topAnomalies = useMemo3(() => anomalies.sort((a, b) => {
-    const severityOrder = { high: 0, medium: 1, low: 2 };
-    return severityOrder[a.severity] - severityOrder[b.severity];
-  }).slice(0, 3), [anomalies]);
-  const handleApprove = useCallback3((id) => {
-    approveSuggestion(id);
-    onLog?.(`Approved suggestion ${id.slice(0, 8)}`);
-  }, [approveSuggestion, onLog]);
-  const handleReject = useCallback3((id) => {
-    rejectSuggestion(id);
-    onLog?.(`Rejected suggestion ${id.slice(0, 8)}`);
-  }, [rejectSuggestion, onLog]);
-  if (!expanded) {
-    return /* @__PURE__ */ jsxDEV2("button", {
-      onClick: onToggle,
-      className: "flex items-center gap-2 rounded-lg border border-violet-500/30 bg-violet-500/10 px-3 py-2 text-sm transition hover:bg-violet-500/20",
-      type: "button",
-      children: [
-        /* @__PURE__ */ jsxDEV2("span", {
-          children: "\uD83E\uDD16"
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV2("span", {
-          children: "Evolution"
-        }, undefined, false, undefined, this),
-        pendingSuggestions.length > 0 && /* @__PURE__ */ jsxDEV2(Badge2, {
-          variant: "secondary",
-          className: "border-amber-500/30 bg-amber-500/20 text-amber-400",
-          children: pendingSuggestions.length
-        }, undefined, false, undefined, this),
-        anomalies.length > 0 && pendingSuggestions.length === 0 && /* @__PURE__ */ jsxDEV2(Badge2, {
-          variant: "destructive",
-          children: anomalies.length
-        }, undefined, false, undefined, this)
-      ]
-    }, undefined, true, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV2(Card2, {
-    className: "w-80 overflow-hidden",
-    children: [
-      /* @__PURE__ */ jsxDEV2("div", {
-        className: "flex items-center justify-between border-violet-500/20 border-b bg-violet-500/5 px-3 py-2",
-        children: [
-          /* @__PURE__ */ jsxDEV2("div", {
-            className: "flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV2("span", {
-                children: "\uD83E\uDD16"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("span", {
-                className: "font-semibold text-sm",
-                children: "Evolution"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV2("div", {
-            className: "flex items-center gap-1",
-            children: [
-              onOpenEvolution && /* @__PURE__ */ jsxDEV2(Button2, {
-                variant: "ghost",
-                size: "sm",
-                onPress: onOpenEvolution,
-                children: "Expand"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("button", {
-                onClick: onToggle,
-                className: "p-1 text-muted-foreground hover:text-foreground",
-                type: "button",
-                title: "Collapse",
-                children: "\u2715"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV2("div", {
-        className: "max-h-96 overflow-y-auto p-3",
-        children: [
-          /* @__PURE__ */ jsxDEV2("div", {
-            className: "mb-3 flex items-center justify-between text-xs",
-            children: [
-              /* @__PURE__ */ jsxDEV2("span", {
-                className: "text-muted-foreground",
-                children: [
-                  operationCount,
-                  " ops tracked"
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "flex items-center gap-2",
-                children: [
-                  anomalies.length > 0 && /* @__PURE__ */ jsxDEV2(Badge2, {
-                    variant: "destructive",
-                    children: [
-                      anomalies.length,
-                      " anomalies"
-                    ]
-                  }, undefined, true, undefined, this),
-                  pendingSuggestions.length > 0 && /* @__PURE__ */ jsxDEV2(Badge2, {
-                    variant: "secondary",
-                    className: "border-amber-500/30 bg-amber-500/20 text-amber-400",
-                    children: [
-                      pendingSuggestions.length,
-                      " pending"
-                    ]
-                  }, undefined, true, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          loading && /* @__PURE__ */ jsxDEV2("div", {
-            className: "py-4 text-center text-muted-foreground text-sm",
-            children: "Generating suggestions..."
-          }, undefined, false, undefined, this),
-          topAnomalies.length > 0 && /* @__PURE__ */ jsxDEV2("div", {
-            className: "mb-4",
-            children: [
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "mb-2 font-semibold text-violet-400 text-xs uppercase",
-                children: "Top Issues"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "space-y-2",
-                children: topAnomalies.map((anomaly, index) => /* @__PURE__ */ jsxDEV2("div", {
-                  className: "rounded border border-amber-500/20 bg-amber-500/5 p-2 text-xs",
-                  children: [
-                    /* @__PURE__ */ jsxDEV2("div", {
-                      className: "flex items-center gap-2",
-                      children: [
-                        /* @__PURE__ */ jsxDEV2("span", {
-                          children: anomaly.severity === "high" ? "\uD83D\uDD34" : anomaly.severity === "medium" ? "\uD83D\uDFE0" : "\uD83D\uDFE1"
-                        }, undefined, false, undefined, this),
-                        /* @__PURE__ */ jsxDEV2("span", {
-                          className: "truncate font-medium",
-                          children: anomaly.operation.name
-                        }, undefined, false, undefined, this)
-                      ]
-                    }, undefined, true, undefined, this),
-                    /* @__PURE__ */ jsxDEV2("p", {
-                      className: "mt-1 truncate text-muted-foreground",
-                      children: anomaly.description
-                    }, undefined, false, undefined, this)
-                  ]
-                }, `${anomaly.operation.name}-${index}`, true, undefined, this))
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          pendingSuggestions.length > 0 && /* @__PURE__ */ jsxDEV2("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV2("p", {
-                className: "mb-2 font-semibold text-violet-400 text-xs uppercase",
-                children: "Pending Suggestions"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV2("div", {
-                className: "space-y-2",
-                children: [
-                  pendingSuggestions.slice(0, 3).map((suggestion) => /* @__PURE__ */ jsxDEV2(CompactSuggestionCard, {
-                    suggestion,
-                    onApprove: handleApprove,
-                    onReject: handleReject
-                  }, suggestion.id, false, undefined, this)),
-                  pendingSuggestions.length > 3 && /* @__PURE__ */ jsxDEV2("p", {
-                    className: "text-center text-muted-foreground text-xs",
-                    children: [
-                      "+",
-                      pendingSuggestions.length - 3,
-                      " more suggestions"
-                    ]
-                  }, undefined, true, undefined, this)
-                ]
-              }, undefined, true, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          anomalies.length === 0 && pendingSuggestions.length === 0 && !loading && /* @__PURE__ */ jsxDEV2("div", {
-            className: "py-4 text-center text-muted-foreground text-xs",
-            children: "No issues detected. Keep coding!"
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      onOpenEvolution && /* @__PURE__ */ jsxDEV2("div", {
-        className: "border-violet-500/20 border-t p-2",
-        children: /* @__PURE__ */ jsxDEV2(Button2, {
-          variant: "ghost",
-          size: "sm",
-          className: "w-full",
-          onPress: onOpenEvolution,
-          children: "Open Evolution Dashboard \u2192"
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function CompactSuggestionCard({
-  suggestion,
-  onApprove,
-  onReject
-}) {
-  return /* @__PURE__ */ jsxDEV2("div", {
-    className: "rounded border border-violet-500/20 bg-violet-500/5 p-2",
-    children: [
-      /* @__PURE__ */ jsxDEV2("div", {
-        className: "flex items-start justify-between gap-2",
-        children: /* @__PURE__ */ jsxDEV2("div", {
-          className: "min-w-0 flex-1",
-          children: [
-            /* @__PURE__ */ jsxDEV2("p", {
-              className: "truncate font-medium text-xs",
-              children: suggestion.proposal.summary
-            }, undefined, false, undefined, this),
-            /* @__PURE__ */ jsxDEV2("div", {
-              className: "mt-1 flex items-center gap-2 text-xs",
-              children: [
-                /* @__PURE__ */ jsxDEV2(Badge2, {
-                  variant: "secondary",
-                  children: suggestion.priority
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV2("span", {
-                  className: "text-muted-foreground",
-                  children: [
-                    (suggestion.confidence * 100).toFixed(0),
-                    "%"
-                  ]
-                }, undefined, true, undefined, this)
-              ]
-            }, undefined, true, undefined, this)
-          ]
-        }, undefined, true, undefined, this)
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV2("div", {
-        className: "mt-2 flex justify-end gap-1",
-        children: [
-          /* @__PURE__ */ jsxDEV2("button", {
-            onClick: () => onReject(suggestion.id),
-            className: "rounded px-2 py-0.5 text-red-400 text-xs hover:bg-red-400/10",
-            type: "button",
-            children: "Reject"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV2("button", {
-            onClick: () => onApprove(suggestion.id),
-            className: "rounded bg-violet-500/20 px-2 py-0.5 text-violet-400 text-xs hover:bg-violet-500/30",
-            type: "button",
-            children: "Approve"
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/lib/runtime-context.tsx
-import { createContext, useContext } from "react";
-"use client";
-var TEMPLATE_RUNTIME_CONTEXT_KEY = Symbol.for("@contractspec/lib.example-shared-ui/template-runtime-context");
-function getTemplateRuntimeContextSingleton() {
-  const store = globalThis;
-  store[TEMPLATE_RUNTIME_CONTEXT_KEY] ??= createContext(null);
-  return store[TEMPLATE_RUNTIME_CONTEXT_KEY];
-}
-var TemplateRuntimeContext = getTemplateRuntimeContextSingleton();
-function useTemplateRuntime() {
-  const context = useContext(TemplateRuntimeContext);
-  if (!context) {
-    throw new Error("useTemplateRuntime must be used within a TemplateRuntimeProvider");
-  }
-  return context;
-}
-
-// src/LocalDataIndicator.tsx
-import { RefreshCw, Shield } from "lucide-react";
-import { useState as useState2 } from "react";
-import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
-"use client";
-function LocalDataIndicator() {
-  const { projectId, templateId, template, installer } = useTemplateRuntime();
-  const [isResetting, setIsResetting] = useState2(false);
-  const handleReset = async () => {
-    setIsResetting(true);
-    try {
-      await installer.install(templateId, { projectId });
-    } finally {
-      setIsResetting(false);
-    }
-  };
-  return /* @__PURE__ */ jsxDEV3("div", {
-    className: "inline-flex items-center gap-2 rounded-full border border-border bg-muted/40 px-3 py-1 text-muted-foreground text-xs",
-    children: [
-      /* @__PURE__ */ jsxDEV3(Shield, {
-        className: "h-3.5 w-3.5 text-violet-400"
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV3("span", {
-        children: [
-          "Local runtime \xB7",
-          " ",
-          /* @__PURE__ */ jsxDEV3("span", {
-            className: "font-semibold text-foreground",
-            children: template.name
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV3("button", {
-        type: "button",
-        className: "inline-flex items-center gap-1 rounded-full border border-border px-2 py-0.5 font-semibold text-[11px] text-muted-foreground hover:text-foreground",
-        onClick: handleReset,
-        disabled: isResetting,
-        children: [
-          /* @__PURE__ */ jsxDEV3(RefreshCw, {
-            className: "h-3 w-3"
-          }, undefined, false, undefined, this),
-          isResetting ? "Resetting\u2026" : "Reset data"
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/markdown/formatPresentationName.ts
-function formatPresentationName(name) {
-  const parts = name.split(".");
-  const lastPart = parts[parts.length - 1] ?? name;
-  return lastPart.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
-}
-
-// src/markdown/useMarkdownPresentation.ts
-import { useCallback as useCallback4, useEffect as useEffect2, useState as useState3 } from "react";
-"use client";
-function useMarkdownPresentation({
-  engine,
-  fetchData,
-  presentationId,
-  presentations,
-  resolvePresentation,
-  templateId
-}) {
-  const [selectedPresentation, setSelectedPresentation] = useState3("");
-  const [markdownContent, setMarkdownContent] = useState3("");
-  const [loading, setLoading] = useState3(false);
-  const [error, setError] = useState3(null);
-  useEffect2(() => {
-    if (presentationId && presentations.includes(presentationId)) {
-      setSelectedPresentation(presentationId);
-      return;
-    }
-    if (presentations.length === 0) {
-      setSelectedPresentation("");
-      return;
-    }
-    if (!presentations.includes(selectedPresentation)) {
-      setSelectedPresentation(presentations[0] ?? "");
-    }
-  }, [presentationId, presentations, selectedPresentation, templateId]);
-  const renderMarkdown = useCallback4(async () => {
-    if (!selectedPresentation || !engine)
-      return;
-    setLoading(true);
-    setError(null);
-    try {
-      if (!resolvePresentation) {
-        throw new Error("resolvePresentation not available in runtime context");
-      }
-      const descriptor = resolvePresentation(selectedPresentation);
-      if (!descriptor) {
-        throw new Error(`Presentation descriptor not found: ${selectedPresentation}`);
-      }
-      const dataResult = await fetchData(selectedPresentation);
-      const result = await engine.render("markdown", descriptor, { data: dataResult.data });
-      setMarkdownContent(result.body);
-    } catch (err) {
-      setError(err instanceof Error ? err : new Error("Failed to render markdown"));
-    } finally {
-      setLoading(false);
-    }
-  }, [engine, fetchData, resolvePresentation, selectedPresentation]);
-  useEffect2(() => {
-    renderMarkdown();
-  }, [renderMarkdown]);
-  return {
-    error,
-    loading,
-    markdownContent,
-    renderMarkdown,
-    selectedPresentation,
-    setSelectedPresentation
-  };
-}
-
-// src/MarkdownView.tsx
-import {
-  Button as Button3,
-  ErrorState,
-  LoaderBlock as LoaderBlock2,
-  MarkdownRenderer
-} from "@contractspec/lib.design-system";
-import { Badge as Badge3 } from "@contractspec/lib.ui-kit-web/ui/badge";
-import { Card as Card3 } from "@contractspec/lib.ui-kit-web/ui/card";
-import { useCallback as useCallback5 } from "react";
-import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
-"use client";
-function MarkdownView({
-  templateId: propTemplateId,
-  presentationId,
-  className
-}) {
-  const {
-    engine,
-    template,
-    templateId: contextTemplateId,
-    resolvePresentation,
-    fetchData
-  } = useTemplateRuntime();
-  const templateId = propTemplateId ?? contextTemplateId;
-  const presentations = template?.presentations ?? [];
-  const {
-    error,
-    loading,
-    markdownContent,
-    renderMarkdown,
-    selectedPresentation,
-    setSelectedPresentation
-  } = useMarkdownPresentation({
-    engine,
-    fetchData,
-    presentationId,
-    presentations,
-    resolvePresentation,
-    templateId
-  });
-  if (!presentations.length) {
-    return /* @__PURE__ */ jsxDEV4(Card3, {
-      className,
-      children: /* @__PURE__ */ jsxDEV4("div", {
-        className: "p-6 text-center",
-        children: /* @__PURE__ */ jsxDEV4("p", {
-          className: "text-muted-foreground",
-          children: "No presentations available for this template."
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this)
-    }, undefined, false, undefined, this);
-  }
-  const handleCopy = useCallback5(() => {
-    if (markdownContent) {
-      navigator.clipboard.writeText(markdownContent);
-    }
-  }, [markdownContent]);
-  return /* @__PURE__ */ jsxDEV4("div", {
-    className,
-    children: [
-      /* @__PURE__ */ jsxDEV4("div", {
-        className: "mb-4 flex flex-wrap items-center gap-2",
-        children: [
-          /* @__PURE__ */ jsxDEV4("span", {
-            className: "font-medium text-muted-foreground text-sm",
-            children: "Presentation:"
-          }, undefined, false, undefined, this),
-          presentations.map((name) => /* @__PURE__ */ jsxDEV4(Button3, {
-            variant: selectedPresentation === name ? "default" : "outline",
-            size: "sm",
-            onPress: () => setSelectedPresentation(name),
-            children: formatPresentationName(name)
-          }, name, false, undefined, this)),
-          /* @__PURE__ */ jsxDEV4("div", {
-            className: "ml-auto flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV4(Badge3, {
-                variant: "secondary",
-                children: "LLM-friendly"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV4(Button3, {
-                variant: "outline",
-                size: "sm",
-                onPress: handleCopy,
-                disabled: !markdownContent || loading,
-                children: "Copy"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV4(Card3, {
-        className: "overflow-hidden",
-        children: [
-          loading && /* @__PURE__ */ jsxDEV4(LoaderBlock2, {
-            label: "Rendering markdown..."
-          }, undefined, false, undefined, this),
-          error && /* @__PURE__ */ jsxDEV4(ErrorState, {
-            title: "Render failed",
-            description: error.message,
-            onRetry: renderMarkdown,
-            retryLabel: "Retry"
-          }, undefined, false, undefined, this),
-          !loading && !error && markdownContent && /* @__PURE__ */ jsxDEV4("div", {
-            className: "p-6",
-            children: /* @__PURE__ */ jsxDEV4(MarkdownRenderer, {
-              content: markdownContent
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this),
-          !loading && !error && !markdownContent && /* @__PURE__ */ jsxDEV4("div", {
-            className: "p-6 text-center",
-            children: /* @__PURE__ */ jsxDEV4("p", {
-              className: "text-muted-foreground",
-              children: "Select a presentation to view its markdown output."
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/OverlayContextProvider.tsx
-import * as React from "react";
-import { useContext as useContext2, useMemo as useMemo4 } from "react";
-import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
-"use client";
-var OverlayContext = React.createContext(null);
-function OverlayContextProvider({
-  templateId,
-  role = "user",
-  device = "desktop",
-  children
-}) {
-  const overlays = useMemo4(() => getTemplateOverlays(templateId, role), [templateId, role]);
-  const activeOverlays = useMemo4(() => {
-    return overlays.filter((overlay) => {
-      const conditions = overlay.conditions;
-      if (!conditions)
-        return true;
-      if (conditions.role && !conditions.role.includes(role)) {
-        return false;
-      }
-      if (conditions.device && conditions.device !== "any" && conditions.device !== device) {
-        return false;
-      }
-      return true;
-    });
-  }, [overlays, role, device]);
-  const overlayMap = useMemo4(() => {
-    const map = new Map;
-    for (const overlay of activeOverlays) {
-      map.set(overlay.target, overlay);
-    }
-    return map;
-  }, [activeOverlays]);
-  const applyOverlay = useMemo4(() => (path, target) => {
-    const overlay = overlayMap.get(path);
-    if (!overlay)
-      return target;
-    let result = { ...target };
-    for (const mod of overlay.modifications) {
-      switch (mod.op) {
-        case "hide":
-          result = { ...result, hidden: true };
-          break;
-        case "relabel":
-          result = { ...result, label: mod.label };
-          break;
-        case "reorder":
-          result = { ...result, position: mod.position };
-          break;
-        case "restyle":
-          result = {
-            ...result,
-            className: mod.className,
-            variant: mod.variant
-          };
-          break;
-        case "set-default":
-          result = { ...result, defaultValue: mod.value };
-          break;
-      }
-    }
-    return result;
-  }, [overlayMap]);
-  const isHidden = useMemo4(() => (path) => {
-    const overlay = overlayMap.get(path);
-    return overlay?.modifications.some((m) => m.op === "hide") ?? false;
-  }, [overlayMap]);
-  const getLabel = useMemo4(() => (path, defaultLabel) => {
-    const overlay = overlayMap.get(path);
-    const relabel = overlay?.modifications.find((m) => m.op === "relabel");
-    return relabel && relabel.op === "relabel" ? relabel.label : defaultLabel;
-  }, [overlayMap]);
-  const getPosition = useMemo4(() => (path, defaultPosition) => {
-    const overlay = overlayMap.get(path);
-    const reorder = overlay?.modifications.find((m) => m.op === "reorder");
-    return reorder && reorder.op === "reorder" ? reorder.position : defaultPosition;
-  }, [overlayMap]);
-  const getStyle = useMemo4(() => (path) => {
-    const overlay = overlayMap.get(path);
-    const restyle = overlay?.modifications.find((m) => m.op === "restyle");
-    if (restyle && restyle.op === "restyle") {
-      return {
-        className: restyle.className,
-        variant: restyle.variant
-      };
-    }
-    return {};
-  }, [overlayMap]);
-  const getDefault = useMemo4(() => (path, defaultValue) => {
-    const overlay = overlayMap.get(path);
-    const setDefault = overlay?.modifications.find((m) => m.op === "set-default");
-    return setDefault && setDefault.op === "set-default" ? setDefault.value : defaultValue;
-  }, [overlayMap]);
-  const value = useMemo4(() => ({
-    overlays: activeOverlays,
-    applyOverlay,
-    isHidden,
-    getLabel,
-    getPosition,
-    getStyle,
-    getDefault,
-    role,
-    device
-  }), [
-    activeOverlays,
-    applyOverlay,
-    isHidden,
-    getLabel,
-    getPosition,
-    getStyle,
-    getDefault,
-    role,
-    device
-  ]);
-  return /* @__PURE__ */ jsxDEV5(OverlayContext.Provider, {
-    value,
-    children
-  }, undefined, false, undefined, this);
-}
-function useOverlayContext() {
-  const context = useContext2(OverlayContext);
-  if (!context) {
-    throw new Error("useOverlayContext must be used within an OverlayContextProvider");
-  }
-  return context;
-}
-function useIsInOverlayContext() {
-  return useContext2(OverlayContext) !== null;
-}
-function getTemplateOverlays(templateId, _role) {
-  const templateOverlays = {
-    "crm-pipeline": [
-      {
-        id: "crm-hide-internal-fields",
-        target: "deal.internalNotes",
-        modifications: [{ op: "hide" }],
-        conditions: { role: ["viewer", "user"] }
-      },
-      {
-        id: "crm-relabel-value",
-        target: "deal.value",
-        modifications: [{ op: "relabel", label: "Deal Amount" }]
-      }
-    ],
-    "saas-boilerplate": [
-      {
-        id: "saas-hide-billing",
-        target: "settings.billing",
-        modifications: [{ op: "hide" }],
-        conditions: { role: ["viewer"] }
-      },
-      {
-        id: "saas-restyle-plan",
-        target: "settings.plan",
-        modifications: [{ op: "restyle", variant: "premium" }],
-        conditions: { role: ["admin"] }
-      }
-    ],
-    "agent-console": [
-      {
-        id: "agent-hide-cost",
-        target: "run.cost",
-        modifications: [{ op: "hide" }],
-        conditions: { role: ["viewer"] }
-      },
-      {
-        id: "agent-relabel-tokens",
-        target: "run.tokens",
-        modifications: [{ op: "relabel", label: "Token Usage" }]
-      }
-    ],
-    "todos-app": [
-      {
-        id: "todos-hide-assignee",
-        target: "task.assignee",
-        modifications: [{ op: "hide" }],
-        conditions: { device: "mobile" }
-      }
-    ],
-    "messaging-app": [
-      {
-        id: "messaging-reorder-timestamp",
-        target: "message.timestamp",
-        modifications: [{ op: "reorder", position: 0 }]
-      }
-    ],
-    "recipe-app-i18n": [
-      {
-        id: "recipe-relabel-servings",
-        target: "recipe.servings",
-        modifications: [{ op: "relabel", label: "Portions" }]
-      }
-    ]
-  };
-  return templateOverlays[templateId] ?? [];
-}
-
-// src/hooks/useBehaviorTracking.ts
-import { useCallback as useCallback6, useEffect as useEffect3, useMemo as useMemo5, useRef as useRef2, useState as useState4 } from "react";
-"use client";
-var BEHAVIOR_STORAGE_KEY = "contractspec-behavior-data";
-var ALL_FEATURES = [
-  "playground",
-  "specs",
-  "builder",
-  "markdown",
-  "evolution",
-  "canvas_add",
-  "canvas_delete",
-  "spec_save",
-  "spec_validate",
-  "ai_suggestions"
-];
-function useBehaviorTracking(templateId) {
-  const [events, setEvents] = useState4([]);
-  const sessionStartRef = useRef2(new Date);
-  const [eventCount, setEventCount] = useState4(0);
-  useEffect3(() => {
-    try {
-      const stored = localStorage.getItem(BEHAVIOR_STORAGE_KEY);
-      if (stored) {
-        const data = JSON.parse(stored);
-        setEvents(data.events.map((e) => ({
-          ...e,
-          timestamp: new Date(e.timestamp)
-        })));
-        sessionStartRef.current = new Date(data.sessionStart);
-      }
-    } catch {}
-  }, []);
-  useEffect3(() => {
-    if (events.length > 0) {
-      try {
-        localStorage.setItem(BEHAVIOR_STORAGE_KEY, JSON.stringify({
-          events: events.map((e) => ({
-            ...e,
-            timestamp: e.timestamp.toISOString()
-          })),
-          sessionStart: sessionStartRef.current.toISOString()
-        }));
-      } catch {}
-    }
-  }, [events]);
-  const trackEvent = useCallback6((type, metadata) => {
-    const event = {
-      type,
-      timestamp: new Date,
-      templateId,
-      metadata
-    };
-    setEvents((prev) => [...prev, event]);
-    setEventCount((prev) => prev + 1);
-  }, [templateId]);
-  const getEventsByType = useCallback6((type) => {
-    return events.filter((e) => e.type === type);
-  }, [events]);
-  const getSummary = useCallback6(() => {
-    const now = new Date;
-    const sessionDuration = now.getTime() - sessionStartRef.current.getTime();
-    const templateCounts = new Map;
-    for (const event of events) {
-      const count = templateCounts.get(event.templateId) ?? 0;
-      templateCounts.set(event.templateId, count + 1);
-    }
-    const mostUsedTemplates = Array.from(templateCounts.entries()).map(([templateId2, count]) => ({ templateId: templateId2, count })).sort((a, b) => b.count - a.count).slice(0, 3);
-    const modeCounts = new Map;
-    for (const event of events) {
-      if (event.type === "mode_change" && event.metadata?.mode) {
-        const mode = event.metadata.mode;
-        const count = modeCounts.get(mode) ?? 0;
-        modeCounts.set(mode, count + 1);
-      }
-    }
-    const mostUsedModes = Array.from(modeCounts.entries()).map(([mode, count]) => ({ mode, count })).sort((a, b) => b.count - a.count);
-    const featuresUsed = new Set;
-    for (const event of events) {
-      if (event.type === "mode_change" && event.metadata?.mode) {
-        featuresUsed.add(event.metadata.mode);
-      }
-      if (event.type === "feature_usage" && event.metadata?.feature) {
-        featuresUsed.add(event.metadata.feature);
-      }
-      if (event.type === "canvas_interaction") {
-        const action = event.metadata?.action;
-        if (action === "add")
-          featuresUsed.add("canvas_add");
-        if (action === "delete")
-          featuresUsed.add("canvas_delete");
-      }
-      if (event.type === "spec_edit") {
-        const action = event.metadata?.action;
-        if (action === "save")
-          featuresUsed.add("spec_save");
-        if (action === "validate")
-          featuresUsed.add("spec_validate");
-      }
-    }
-    const unusedFeatures = ALL_FEATURES.filter((f) => !featuresUsed.has(f));
-    const errorCount = events.filter((e) => e.type === "error").length;
-    const recommendations = generateRecommendations(Array.from(featuresUsed), unusedFeatures, mostUsedModes, events.length);
-    return {
-      totalEvents: events.length,
-      sessionDuration,
-      mostUsedTemplates,
-      mostUsedModes,
-      featuresUsed: Array.from(featuresUsed),
-      unusedFeatures,
-      errorCount,
-      recommendations
-    };
-  }, [events]);
-  const clear = useCallback6(() => {
-    setEvents([]);
-    setEventCount(0);
-    sessionStartRef.current = new Date;
-    localStorage.removeItem(BEHAVIOR_STORAGE_KEY);
-  }, []);
-  return useMemo5(() => ({
-    trackEvent,
-    getSummary,
-    getEventsByType,
-    eventCount,
-    sessionStart: sessionStartRef.current,
-    clear
-  }), [trackEvent, getSummary, getEventsByType, eventCount, clear]);
-}
-function generateRecommendations(featuresUsed, unusedFeatures, mostUsedModes, totalEvents) {
-  const recommendations = [];
-  if (unusedFeatures.includes("evolution")) {
-    recommendations.push("Try the AI Evolution mode to get automated improvement suggestions");
-  }
-  if (unusedFeatures.includes("markdown")) {
-    recommendations.push("Use Markdown preview to see documentation for your specs");
-  }
-  if (unusedFeatures.includes("builder")) {
-    recommendations.push("Explore the Visual Builder to design your UI components");
-  }
-  if (!featuresUsed.includes("spec_validate") && featuresUsed.includes("specs")) {
-    recommendations.push("Don't forget to validate your specs before saving");
-  }
-  if (featuresUsed.includes("evolution") && !featuresUsed.includes("ai_suggestions")) {
-    recommendations.push("Generate AI suggestions to get actionable improvement recommendations");
-  }
-  if (totalEvents > 50) {
-    recommendations.push("Great engagement! Consider saving your work regularly");
-  }
-  if (mostUsedModes.length === 1) {
-    recommendations.push("Try different modes to explore all sandbox capabilities");
-  }
-  return recommendations;
-}
-
-// src/PersonalizationInsights.tsx
-import { Button as Button4 } from "@contractspec/lib.design-system";
-import { Badge as Badge4 } from "@contractspec/lib.ui-kit-web/ui/badge";
-import { Card as Card4 } from "@contractspec/lib.ui-kit-web/ui/card";
-import { useCallback as useCallback7, useMemo as useMemo6, useState as useState5 } from "react";
-import { jsxDEV as jsxDEV6 } from "react/jsx-dev-runtime";
-"use client";
-function PersonalizationInsights({
-  templateId,
-  collapsed = false,
-  onToggle
-}) {
-  const { getSummary, eventCount, clear, sessionStart } = useBehaviorTracking(templateId);
-  const [showDetails, setShowDetails] = useState5(false);
-  const summary = useMemo6(() => getSummary(), [getSummary]);
-  const formatDuration = useCallback7((ms) => {
-    const seconds = Math.floor(ms / 1000);
-    const minutes = Math.floor(seconds / 60);
-    const hours = Math.floor(minutes / 60);
-    if (hours > 0) {
-      return `${hours}h ${minutes % 60}m`;
-    }
-    if (minutes > 0) {
-      return `${minutes}m ${seconds % 60}s`;
-    }
-    return `${seconds}s`;
-  }, []);
-  const handleClear = useCallback7(() => {
-    clear();
-  }, [clear]);
-  if (collapsed) {
-    return /* @__PURE__ */ jsxDEV6("button", {
-      onClick: onToggle,
-      className: "flex items-center gap-2 rounded-lg border border-blue-500/30 bg-blue-500/10 px-3 py-2 text-sm transition hover:bg-blue-500/20",
-      type: "button",
-      children: [
-        /* @__PURE__ */ jsxDEV6("span", {
-          children: "\uD83D\uDCCA"
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV6("span", {
-          children: "Insights"
-        }, undefined, false, undefined, this),
-        /* @__PURE__ */ jsxDEV6(Badge4, {
-          variant: "secondary",
-          children: eventCount
-        }, undefined, false, undefined, this)
-      ]
-    }, undefined, true, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV6(Card4, {
-    className: "overflow-hidden",
-    children: [
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "flex items-center justify-between border-blue-500/20 border-b bg-blue-500/5 px-4 py-3",
-        children: [
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV6("span", {
-                children: "\uD83D\uDCCA"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("span", {
-                className: "font-semibold",
-                children: "Personalization Insights"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV6(Button4, {
-                variant: "ghost",
-                size: "sm",
-                onPress: () => setShowDetails(!showDetails),
-                children: showDetails ? "Hide Details" : "Show Details"
-              }, undefined, false, undefined, this),
-              onToggle && /* @__PURE__ */ jsxDEV6("button", {
-                onClick: onToggle,
-                className: "p-1 text-muted-foreground hover:text-foreground",
-                type: "button",
-                title: "Collapse",
-                children: "\u2715"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "p-4",
-        children: [
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "mb-4 grid grid-cols-2 gap-3 md:grid-cols-4",
-            children: [
-              /* @__PURE__ */ jsxDEV6(StatCard, {
-                label: "Session Time",
-                value: formatDuration(summary.sessionDuration),
-                icon: "\u23F1\uFE0F"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6(StatCard, {
-                label: "Events Tracked",
-                value: summary.totalEvents.toString(),
-                icon: "\uD83D\uDCC8"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6(StatCard, {
-                label: "Features Used",
-                value: `${summary.featuresUsed.length}/${summary.featuresUsed.length + summary.unusedFeatures.length}`,
-                icon: "\u2728"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6(StatCard, {
-                label: "Errors",
-                value: summary.errorCount.toString(),
-                icon: "\u26A0\uFE0F",
-                variant: summary.errorCount > 0 ? "warning" : "success"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          summary.recommendations.length > 0 && /* @__PURE__ */ jsxDEV6("div", {
-            className: "mb-4",
-            children: [
-              /* @__PURE__ */ jsxDEV6("h4", {
-                className: "mb-2 font-semibold text-blue-400 text-xs uppercase",
-                children: "Recommendations"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("ul", {
-                className: "space-y-1",
-                children: summary.recommendations.map((rec, index) => /* @__PURE__ */ jsxDEV6("li", {
-                  className: "flex items-start gap-2 text-sm",
-                  children: [
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      className: "text-blue-400",
-                      children: "\uD83D\uDCA1"
-                    }, undefined, false, undefined, this),
-                    /* @__PURE__ */ jsxDEV6("span", {
-                      children: rec
-                    }, undefined, false, undefined, this)
-                  ]
-                }, index, true, undefined, this))
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          summary.unusedFeatures.length > 0 && /* @__PURE__ */ jsxDEV6("div", {
-            className: "mb-4",
-            children: [
-              /* @__PURE__ */ jsxDEV6("h4", {
-                className: "mb-2 font-semibold text-blue-400 text-xs uppercase",
-                children: "Try These Features"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV6("div", {
-                className: "flex flex-wrap gap-2",
-                children: summary.unusedFeatures.slice(0, 5).map((feature) => /* @__PURE__ */ jsxDEV6(Badge4, {
-                  variant: "secondary",
-                  children: formatFeatureName(feature)
-                }, feature, false, undefined, this))
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          showDetails && /* @__PURE__ */ jsxDEV6(DetailedInsights, {
-            summary,
-            sessionStart
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "mt-4 flex justify-end border-blue-500/10 border-t pt-4",
-            children: /* @__PURE__ */ jsxDEV6(Button4, {
-              variant: "ghost",
-              size: "sm",
-              onPress: handleClear,
-              children: "Clear Data"
-            }, undefined, false, undefined, this)
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function StatCard({
-  label,
-  value,
-  icon,
-  variant = "default"
-}) {
-  const bgColors = {
-    default: "bg-blue-500/5 border-blue-500/20",
-    warning: "bg-amber-500/5 border-amber-500/20",
-    success: "bg-green-500/5 border-green-500/20"
-  };
-  return /* @__PURE__ */ jsxDEV6("div", {
-    className: `rounded-lg border p-3 text-center ${bgColors[variant]}`,
-    children: [
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "mb-1 text-lg",
-        children: icon
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "font-bold text-lg",
-        children: value
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "text-muted-foreground text-xs",
-        children: label
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function DetailedInsights({
-  summary,
-  sessionStart
-}) {
-  return /* @__PURE__ */ jsxDEV6("div", {
-    className: "mt-4 space-y-4 border-blue-500/10 border-t pt-4",
-    children: [
-      summary.mostUsedTemplates.length > 0 && /* @__PURE__ */ jsxDEV6("div", {
-        children: [
-          /* @__PURE__ */ jsxDEV6("h4", {
-            className: "mb-2 font-semibold text-blue-400 text-xs uppercase",
-            children: "Most Used Templates"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "space-y-1",
-            children: summary.mostUsedTemplates.map(({ templateId, count }) => /* @__PURE__ */ jsxDEV6("div", {
-              className: "flex items-center justify-between text-sm",
-              children: [
-                /* @__PURE__ */ jsxDEV6("span", {
-                  children: formatTemplateId(templateId)
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV6("span", {
-                  className: "text-muted-foreground",
-                  children: [
-                    count,
-                    " events"
-                  ]
-                }, undefined, true, undefined, this)
-              ]
-            }, templateId, true, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      summary.mostUsedModes.length > 0 && /* @__PURE__ */ jsxDEV6("div", {
-        children: [
-          /* @__PURE__ */ jsxDEV6("h4", {
-            className: "mb-2 font-semibold text-blue-400 text-xs uppercase",
-            children: "Mode Usage"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "space-y-1",
-            children: summary.mostUsedModes.map(({ mode, count }) => /* @__PURE__ */ jsxDEV6("div", {
-              className: "flex items-center justify-between text-sm",
-              children: [
-                /* @__PURE__ */ jsxDEV6("span", {
-                  children: formatFeatureName(mode)
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV6("span", {
-                  className: "text-muted-foreground",
-                  children: [
-                    count,
-                    " switches"
-                  ]
-                }, undefined, true, undefined, this)
-              ]
-            }, mode, true, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV6("div", {
-        children: [
-          /* @__PURE__ */ jsxDEV6("h4", {
-            className: "mb-2 font-semibold text-blue-400 text-xs uppercase",
-            children: "Features Used"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV6("div", {
-            className: "flex flex-wrap gap-2",
-            children: summary.featuresUsed.map((feature) => /* @__PURE__ */ jsxDEV6(Badge4, {
-              variant: "default",
-              className: "border-green-500/30 bg-green-500/20 text-green-400",
-              children: [
-                "\u2713 ",
-                formatFeatureName(feature)
-              ]
-            }, feature, true, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV6("div", {
-        className: "text-muted-foreground text-xs",
-        children: [
-          "Session started: ",
-          sessionStart.toLocaleString()
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-function formatFeatureName(feature) {
-  return feature.replace(/_/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
-}
-function formatTemplateId(id) {
-  return id.replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
-}
-
-// src/SaveToStudioButton.tsx
-import { Sparkles } from "lucide-react";
-import { useState as useState6 } from "react";
-import { jsxDEV as jsxDEV7 } from "react/jsx-dev-runtime";
-"use client";
-function SaveToStudioButton({
-  organizationId = "demo-org",
-  projectName,
-  endpoint,
-  token
-}) {
-  const { installer, templateId, template } = useTemplateRuntime();
-  const [status, setStatus] = useState6("idle");
-  const [error, setError] = useState6(null);
-  const handleSave = async () => {
-    setStatus("saving");
-    setError(null);
-    try {
-      await installer.saveToStudio({
-        templateId,
-        projectName: projectName ?? `${template.name} demo`,
-        organizationId,
-        endpoint,
-        token
-      });
-      setStatus("saved");
-      setTimeout(() => setStatus("idle"), 3000);
-    } catch (err) {
-      setStatus("error");
-      setError(err instanceof Error ? err.message : "Unknown error");
-    }
-  };
-  return /* @__PURE__ */ jsxDEV7("div", {
-    className: "flex flex-col items-end gap-1",
-    children: [
-      /* @__PURE__ */ jsxDEV7("button", {
-        type: "button",
-        className: "btn-primary inline-flex items-center gap-2 text-sm",
-        onClick: handleSave,
-        disabled: status === "saving",
-        children: [
-          /* @__PURE__ */ jsxDEV7(Sparkles, {
-            className: "h-4 w-4"
-          }, undefined, false, undefined, this),
-          status === "saving" ? "Publishing\u2026" : "Save to Studio"
-        ]
-      }, undefined, true, undefined, this),
-      status === "error" && error ? /* @__PURE__ */ jsxDEV7("p", {
-        className: "text-destructive text-xs",
-        children: error
-      }, undefined, false, undefined, this) : null,
-      status === "saved" ? /* @__PURE__ */ jsxDEV7("p", {
-        className: "text-emerald-400 text-xs",
-        children: "Template sent to Studio."
-      }, undefined, false, undefined, this) : null
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/SpecDrivenTemplateShell.tsx
-import {
-  BundleProvider,
-  BundleRenderer
-} from "@contractspec/lib.surface-runtime/react";
-import { jsxDEV as jsxDEV8 } from "react/jsx-dev-runtime";
-function SpecDrivenTemplateShell({
-  plan,
-  title,
-  description,
-  sidebar,
-  actions,
-  showSaveAction = true,
-  saveProps,
-  children
-}) {
-  const headerContent = /* @__PURE__ */ jsxDEV8("header", {
-    className: "rounded-2xl border border-border bg-card p-6 shadow-sm",
-    children: [
-      /* @__PURE__ */ jsxDEV8("div", {
-        className: "flex flex-wrap items-center justify-between gap-4",
-        children: [
-          /* @__PURE__ */ jsxDEV8("div", {
-            children: [
-              /* @__PURE__ */ jsxDEV8("p", {
-                className: "font-semibold text-muted-foreground text-sm uppercase tracking-wide",
-                children: "ContractSpec Templates"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV8("h1", {
-                className: "font-bold text-3xl",
-                children: title
-              }, undefined, false, undefined, this),
-              description ? /* @__PURE__ */ jsxDEV8("p", {
-                className: "mt-2 max-w-2xl text-muted-foreground text-sm",
-                children: description
-              }, undefined, false, undefined, this) : null
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV8("div", {
-            className: "flex flex-col items-end gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV8(LocalDataIndicator, {}, undefined, false, undefined, this),
-              showSaveAction ? /* @__PURE__ */ jsxDEV8(SaveToStudioButton, {
-                ...saveProps
-              }, undefined, false, undefined, this) : null
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      actions ? /* @__PURE__ */ jsxDEV8("div", {
-        className: "mt-4",
-        children: actions
-      }, undefined, false, undefined, this) : null
-    ]
-  }, undefined, true, undefined, this);
-  const slotContent = {
-    header: headerContent,
-    primary: /* @__PURE__ */ jsxDEV8("main", {
-      className: "space-y-4 p-2",
-      children
-    }, undefined, false, undefined, this)
-  };
-  if (sidebar != null) {
-    slotContent.sidebar = /* @__PURE__ */ jsxDEV8("aside", {
-      className: "rounded-2xl border border-border bg-card p-4",
-      children: sidebar
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV8(BundleProvider, {
-    plan,
-    children: /* @__PURE__ */ jsxDEV8(BundleRenderer, {
-      slotContent
-    }, undefined, false, undefined, this)
-  }, undefined, false, undefined, this);
-}
-
-// src/utils/generateSpecFromTemplate.ts
-function generateSpecFromTemplate(template) {
-  const templateId = template?.id ?? "unknown";
-  if (!template) {
-    return generateDefaultSpec(templateId);
-  }
-  switch (templateId) {
-    case "crm-pipeline":
-      return generateCrmPipelineSpec(template.schema.contracts);
-    case "saas-boilerplate":
-      return generateSaasBoilerplateSpec(template.schema.contracts);
-    case "agent-console":
-      return generateAgentConsoleSpec(template.schema.contracts);
-    case "todos-app":
-      return generateTodosSpec(template.schema.contracts);
-    case "messaging-app":
-      return generateMessagingSpec(template.schema.contracts);
-    case "recipe-app-i18n":
-      return generateRecipeSpec(template.schema.contracts);
-    default:
-      return generateDefaultSpec(templateId);
-  }
-}
-function generateCrmPipelineSpec(contracts) {
-  return `// CRM Pipeline Specs
-// Contracts: ${contracts.join(", ")}
+import{useCallback as d,useEffect as B0,useMemo as $1,useRef as N1,useState as m}from"react";var D0="contractspec-evolution-data";function q0($){let[N,q]=m([]),[J,X]=m([]),[K,z]=m([]),[U,w]=m([]),[V,f]=m(!1),F=N1([]),[Y,b]=m(0);B0(()=>{try{let P=localStorage.getItem(`${D0}-${$}`);if(P){let G=JSON.parse(P);z(G.suggestions.map((M)=>({...M,createdAt:new Date(M.createdAt)})))}}catch{}},[$]),B0(()=>{try{localStorage.setItem(`${D0}-${$}`,JSON.stringify({suggestions:K}))}catch{}},[K,$]);let W=d((P,G,M,E)=>{let u={operation:{name:P,version:"1.0.0",tenantId:"sandbox"},durationMs:G,success:M,timestamp:new Date,errorCode:E};F.current.push(u),b((B)=>B+1)},[]),Q=d(()=>{let P=F.current;if(P.length<5)return;let G=new Map;for(let B of P){let y=`${B.operation.name}.v${B.operation.version}`,a=G.get(y)??[];a.push(B),G.set(y,a)}let M=[],E=[];G.forEach((B)=>{if(B.length<3)return;let y=B.map((k)=>k.durationMs).sort((k,x)=>k-x),a=B.filter((k)=>!k.success),F0=B.length,j=a.length/F0,e0=y.reduce((k,x)=>k+x,0)/F0,Y0=B.map((k)=>k.timestamp.getTime()),O0=B[0];if(!O0)return;let c={operation:O0.operation,totalCalls:F0,successRate:1-j,errorRate:j,averageLatencyMs:e0,p95LatencyMs:L0(y,0.95),p99LatencyMs:L0(y,0.99),maxLatencyMs:Math.max(...y),lastSeenAt:new Date(Math.max(...Y0)),windowStart:new Date(Math.min(...Y0)),windowEnd:new Date(Math.max(...Y0)),topErrors:a.reduce((k,x)=>{if(x.errorCode)k[x.errorCode]=(k[x.errorCode]??0)+1;return k},{})};if(M.push(c),j>0.1)E.push({operation:c.operation,severity:j>0.3?"high":j>0.2?"medium":"low",metric:"error-rate",description:`Error rate ${(j*100).toFixed(1)}% exceeds threshold`,detectedAt:new Date,threshold:0.1,observedValue:j});if(c.p99LatencyMs>500)E.push({operation:c.operation,severity:c.p99LatencyMs>1000?"high":c.p99LatencyMs>750?"medium":"low",metric:"latency",description:`P99 latency ${c.p99LatencyMs.toFixed(0)}ms exceeds threshold`,detectedAt:new Date,threshold:500,observedValue:c.p99LatencyMs})}),q(M),X(E);let u=E.map((B)=>({operation:B.operation,category:B.metric==="latency"?"performance":"error-handling",summary:B.metric==="latency"?"Latency regression detected":"Error spike detected",justification:B.description,recommendedActions:B.metric==="latency"?["Add caching layer","Optimize database queries","Consider pagination"]:["Add retry logic","Improve error handling","Add circuit breaker"]}));w(u)},[]),H=d(async()=>{if(J.length===0)return;f(!0),await new Promise((G)=>setTimeout(G,800));let P=J.map((G)=>({id:`suggestion-${Date.now()}-${Math.random().toString(36).slice(2,9)}`,intent:{id:`intent-${G.operation.name}`,type:G.metric==="latency"?"latency-regression":G.metric==="error-rate"?"error-spike":"throughput-drop",description:G.description,operation:G.operation,confidence:{score:G.severity==="high"?0.9:G.severity==="medium"?0.7:0.5,sampleSize:N.find((M)=>M.operation.name===G.operation.name)?.totalCalls??0}},target:G.operation,proposal:{summary:q1(G),rationale:P1(G),changeType:G.metric==="error-rate"?"policy-update":"revision",recommendedActions:J1(G)},confidence:G.severity==="high"?0.85:G.severity==="medium"?0.7:0.55,createdAt:new Date,createdBy:"ai-evolution-agent",status:"pending",priority:G.severity}));z((G)=>[...G,...P]),f(!1)},[J,N]),Z=d((P,G)=>{z((M)=>M.map((E)=>E.id===P?{...E,status:"approved"}:E))},[]),A=d((P,G)=>{z((M)=>M.map((E)=>E.id===P?{...E,status:"rejected"}:E))},[]),L=d(()=>{F.current=[],b(0),q([]),X([]),z([]),w([]),localStorage.removeItem(`${D0}-${$}`)},[$]);return $1(()=>({usageStats:N,anomalies:J,suggestions:K,hints:U,loading:V,trackOperation:W,analyzeUsage:Q,generateSuggestions:H,approveSuggestion:Z,rejectSuggestion:A,clear:L,operationCount:Y}),[N,J,K,U,V,W,Q,H,Z,A,L,Y])}function L0($,N){if(!$.length)return 0;if($.length===1)return $[0]??0;let q=Math.min($.length-1,Math.floor(N*$.length));return $[q]??0}function q1($){if($.metric==="latency")return`Add caching and pagination to ${$.operation.name} to reduce latency`;if($.metric==="error-rate")return`Add retry policy and circuit breaker to ${$.operation.name}`;return`Optimize ${$.operation.name} for improved throughput`}function P1($){if($.metric==="latency")return`The operation ${$.operation.name} is experiencing P99 latency of ${$.observedValue?.toFixed(0)}ms, which is above the recommended threshold of ${$.threshold}ms. This can impact user experience and downstream operations.`;if($.metric==="error-rate")return`The error rate for ${$.operation.name} is ${(($.observedValue??0)*100).toFixed(1)}%, indicating potential issues with input validation, external dependencies, or resource limits.`;return`Throughput for ${$.operation.name} has dropped significantly, suggesting potential bottlenecks or reduced demand that should be investigated.`}function J1($){if($.metric==="latency")return["Add response caching for frequently accessed data","Implement pagination for large result sets","Optimize database queries with proper indexing","Consider adding a GraphQL DataLoader for batching"];if($.metric==="error-rate")return["Add input validation at the contract level","Implement retry policy with exponential backoff","Add circuit breaker for external dependencies","Enhance error logging for better debugging"];return["Review resource allocation and scaling policies","Check for upstream routing or load balancer issues","Validate feature flag configurations","Monitor dependency health metrics"]}import{Button as n,LoaderBlock as Z1}from"@contractspec/lib.design-system";import{Badge as g}from"@contractspec/lib.ui-kit-web/ui/badge";import{Card as l}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as t,useMemo as Q1}from"react";import{jsx as D,jsxs as _}from"react/jsx-runtime";function K2({templateId:$,onLog:N}){let{usageStats:q,anomalies:J,suggestions:X,hints:K,loading:z,trackOperation:U,analyzeUsage:w,generateSuggestions:V,approveSuggestion:f,rejectSuggestion:F,clear:Y,operationCount:b}=q0($),W=t(()=>{let P=[{name:`${$}.list`,duration:150,success:!0},{name:`${$}.list`,duration:180,success:!0},{name:`${$}.create`,duration:350,success:!0},{name:`${$}.create`,duration:420,success:!1,error:"VALIDATION_ERROR"},{name:`${$}.list`,duration:200,success:!0},{name:`${$}.get`,duration:80,success:!0},{name:`${$}.update`,duration:280,success:!0},{name:`${$}.list`,duration:950,success:!0},{name:`${$}.delete`,duration:150,success:!1,error:"NOT_FOUND"},{name:`${$}.create`,duration:380,success:!0}];for(let G of P)U(G.name,G.duration,G.success,G.error);N?.(`Simulated ${P.length} operations`),setTimeout(()=>{w(),N?.("Analysis complete")},100)},[$,U,w,N]),Q=t(async()=>{await V(),N?.("AI suggestions generated")},[V,N]),H=t((P)=>{f(P),N?.(`Suggestion ${P.slice(0,8)} approved`)},[f,N]),Z=t((P)=>{F(P),N?.(`Suggestion ${P.slice(0,8)} rejected`)},[F,N]),A=t(()=>{Y(),N?.("Evolution data cleared")},[Y,N]),L=Q1(()=>X.filter((P)=>P.status==="pending"),[X]);return _("div",{className:"space-y-6",children:[_("div",{className:"flex items-center justify-between",children:[_("div",{children:[D("h2",{className:"font-semibold text-xl",children:"AI Evolution Engine"}),D("p",{className:"text-muted-foreground text-sm",children:"Analyze usage patterns and get AI-powered suggestions"})]}),_("div",{className:"flex items-center gap-2",children:[_(g,{variant:"secondary",children:[b," ops tracked"]}),D(n,{variant:"ghost",size:"sm",onPress:A,children:"Clear"})]})]}),_(l,{className:"p-4",children:[_("div",{className:"flex flex-wrap items-center gap-3",children:[D(n,{variant:"default",size:"sm",onPress:W,children:"Simulate Operations"}),D(n,{variant:"outline",size:"sm",onPress:w,disabled:b<5,children:"Analyze Usage"}),D(n,{variant:"outline",size:"sm",onPress:Q,disabled:J.length===0||z,children:z?"Generating...":"Generate AI Suggestions"})]}),D("p",{className:"mt-2 text-muted-foreground text-xs",children:"Simulate sandbox operations, analyze patterns, and generate AI improvement suggestions."})]}),z&&D(Z1,{label:"Generating AI suggestions..."}),q.length>0&&_(l,{className:"p-4",children:[D("h3",{className:"mb-3 font-semibold",children:"Usage Statistics"}),D("div",{className:"grid gap-3 md:grid-cols-2 lg:grid-cols-3",children:q.map((P)=>D(X1,{stat:P},P.operation.name))})]}),J.length>0&&_(l,{className:"p-4",children:[_("div",{className:"mb-3 flex items-center justify-between",children:[D("h3",{className:"font-semibold",children:"Detected Anomalies"}),_(g,{variant:"secondary",className:"border-amber-500/30 bg-amber-500/20 text-amber-400",children:[J.length," issues"]})]}),D("div",{className:"space-y-2",children:J.map((P,G)=>D(z1,{anomaly:P},`${P.operation.name}-${G}`))})]}),X.length>0&&_(l,{className:"p-4",children:[_("div",{className:"mb-3 flex items-center justify-between",children:[D("h3",{className:"font-semibold",children:"AI Suggestions"}),D("div",{className:"flex items-center gap-2",children:L.length>0&&_(g,{variant:"secondary",className:"border-amber-500/30 bg-amber-500/20 text-amber-400",children:[L.length," pending"]})})]}),D("div",{className:"space-y-3",children:X.map((P)=>D(H1,{suggestion:P,onApprove:H,onReject:Z},P.id))})]}),K.length>0&&_(l,{className:"p-4",children:[D("h3",{className:"mb-3 font-semibold",children:"Optimization Hints"}),D("div",{className:"space-y-2",children:K.map((P,G)=>D(G1,{hint:P},`${P.operation.name}-${G}`))})]}),q.length===0&&J.length===0&&X.length===0&&D(l,{className:"p-8 text-center",children:D("p",{className:"text-muted-foreground",children:'Click "Simulate Operations" to generate sample data for analysis.'})})]})}function X1({stat:$}){return _("div",{className:"rounded-lg border border-violet-500/20 bg-violet-500/5 p-3",children:[_("div",{className:"mb-2 flex items-center justify-between",children:[D("span",{className:"font-medium font-mono text-sm",children:$.operation.name}),_(g,{variant:$.errorRate>0.1?"destructive":"default",className:$.errorRate>0.1?"":"border-green-500/30 bg-green-500/20 text-green-400",children:[((1-$.errorRate)*100).toFixed(0),"% success"]})]}),_("div",{className:"grid grid-cols-2 gap-2 text-xs",children:[_("div",{children:[D("span",{className:"text-muted-foreground",children:"Total Calls:"})," ",D("span",{className:"font-medium",children:$.totalCalls})]}),_("div",{children:[D("span",{className:"text-muted-foreground",children:"Avg Latency:"})," ",_("span",{className:"font-medium",children:[$.averageLatencyMs.toFixed(0),"ms"]})]}),_("div",{children:[D("span",{className:"text-muted-foreground",children:"P95:"})," ",_("span",{className:"font-medium",children:[$.p95LatencyMs.toFixed(0),"ms"]})]}),_("div",{children:[D("span",{className:"text-muted-foreground",children:"P99:"})," ",_("span",{className:"font-medium",children:[$.p99LatencyMs.toFixed(0),"ms"]})]})]})]})}function z1({anomaly:$}){return _("div",{className:"flex items-center justify-between rounded-lg border border-amber-500/30 bg-amber-500/5 p-3",children:[_("div",{className:"flex items-center gap-3",children:[D("span",{className:`text-lg ${{low:"text-amber-400",medium:"text-orange-400",high:"text-red-400"}[$.severity]}`,title:`${$.severity} severity`,children:$.severity==="high"?"\uD83D\uDD34":$.severity==="medium"?"\uD83D\uDFE0":"\uD83D\uDFE1"}),_("div",{children:[D("p",{className:"font-medium text-sm",children:$.description}),_("p",{className:"text-muted-foreground text-xs",children:[$.operation.name," \u2022 ",$.metric]})]})]}),D(g,{variant:$.severity==="high"?"destructive":"secondary",className:$.severity==="medium"?"border-amber-500/30 bg-amber-500/20 text-amber-400":"",children:$.severity})]})}function H1({suggestion:$,onApprove:N,onReject:q}){let X=((K)=>{switch(K){case"pending":return{variant:"secondary",className:"bg-amber-500/20 text-amber-400 border-amber-500/30"};case"approved":return{variant:"default",className:"bg-green-500/20 text-green-400 border-green-500/30"};case"rejected":return{variant:"destructive",className:""};default:return{variant:"secondary",className:""}}})($.status);return _("div",{className:"rounded-lg border border-violet-500/30 bg-violet-500/5 p-4",children:[_("div",{className:"mb-2 flex items-start justify-between",children:[_("div",{className:"flex-1",children:[_("div",{className:"flex items-center gap-2",children:[D("span",{className:"text-lg",children:$.intent.type==="latency-regression"?"\u26A1":$.intent.type==="error-spike"?"\uD83D\uDD25":"\uD83D\uDCC9"}),D("h4",{className:"font-medium",children:$.proposal.summary})]}),D("p",{className:"mt-1 text-muted-foreground text-sm",children:$.proposal.rationale})]}),D(g,{variant:X.variant,className:X.className,children:$.status})]}),$.proposal.recommendedActions&&$.proposal.recommendedActions.length>0&&_("div",{className:"mt-3",children:[D("p",{className:"mb-1 font-semibold text-violet-400 text-xs uppercase",children:"Recommended Actions"}),D("ul",{className:"list-inside list-disc space-y-1 text-xs",children:$.proposal.recommendedActions.slice(0,3).map((K,z)=>D("li",{children:K},z))})]}),_("div",{className:"mt-3 flex items-center justify-between",children:[_("div",{className:"flex items-center gap-2 text-xs",children:[_("span",{className:"text-muted-foreground",children:["Confidence: ",($.confidence*100).toFixed(0),"%"]}),D("span",{className:"text-muted-foreground",children:"\u2022"}),D(g,{variant:"secondary",children:$.priority})]}),$.status==="pending"&&_("div",{className:"flex items-center gap-2",children:[D(n,{variant:"outline",size:"sm",onPress:()=>q($.id),children:"Reject"}),D(n,{variant:"default",size:"sm",onPress:()=>N($.id),children:"Approve"})]})]})]})}function G1({hint:$}){return D("div",{className:"rounded-lg border border-blue-500/20 bg-blue-500/5 p-3",children:_("div",{className:"flex items-start gap-3",children:[D("span",{className:"text-lg",children:{schema:"\uD83D\uDCD0",policy:"\uD83D\uDD12",performance:"\u26A1","error-handling":"\uD83D\uDEE1\uFE0F"}[$.category]}),_("div",{className:"flex-1",children:[D("p",{className:"font-medium",children:$.summary}),D("p",{className:"mt-1 text-muted-foreground text-xs",children:$.justification}),$.recommendedActions.length>0&&D("ul",{className:"mt-2 list-inside list-disc text-xs",children:$.recommendedActions.slice(0,2).map((q,J)=>D("li",{children:q},J))})]})]})})}import{Button as E0}from"@contractspec/lib.design-system";import{Badge as s}from"@contractspec/lib.ui-kit-web/ui/badge";import{Card as K1}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as k0,useMemo as C0}from"react";import{jsx as h,jsxs as T}from"react/jsx-runtime";function U2({templateId:$,expanded:N=!1,onToggle:q,onLog:J,onOpenEvolution:X}){let{anomalies:K,suggestions:z,loading:U,approveSuggestion:w,rejectSuggestion:V,operationCount:f}=q0($),F=C0(()=>z.filter((Q)=>Q.status==="pending"),[z]),Y=C0(()=>K.sort((Q,H)=>{let Z={high:0,medium:1,low:2};return Z[Q.severity]-Z[H.severity]}).slice(0,3),[K]),b=k0((Q)=>{w(Q),J?.(`Approved suggestion ${Q.slice(0,8)}`)},[w,J]),W=k0((Q)=>{V(Q),J?.(`Rejected suggestion ${Q.slice(0,8)}`)},[V,J]);if(!N)return T("button",{onClick:q,className:"flex items-center gap-2 rounded-lg border border-violet-500/30 bg-violet-500/10 px-3 py-2 text-sm transition hover:bg-violet-500/20",type:"button",children:[h("span",{children:"\uD83E\uDD16"}),h("span",{children:"Evolution"}),F.length>0&&h(s,{variant:"secondary",className:"border-amber-500/30 bg-amber-500/20 text-amber-400",children:F.length}),K.length>0&&F.length===0&&h(s,{variant:"destructive",children:K.length})]});return T(K1,{className:"w-80 overflow-hidden",children:[T("div",{className:"flex items-center justify-between border-violet-500/20 border-b bg-violet-500/5 px-3 py-2",children:[T("div",{className:"flex items-center gap-2",children:[h("span",{children:"\uD83E\uDD16"}),h("span",{className:"font-semibold text-sm",children:"Evolution"})]}),T("div",{className:"flex items-center gap-1",children:[X&&h(E0,{variant:"ghost",size:"sm",onPress:X,children:"Expand"}),h("button",{onClick:q,className:"p-1 text-muted-foreground hover:text-foreground",type:"button",title:"Collapse",children:"\u2715"})]})]}),T("div",{className:"max-h-96 overflow-y-auto p-3",children:[T("div",{className:"mb-3 flex items-center justify-between text-xs",children:[T("span",{className:"text-muted-foreground",children:[f," ops tracked"]}),T("div",{className:"flex items-center gap-2",children:[K.length>0&&T(s,{variant:"destructive",children:[K.length," anomalies"]}),F.length>0&&T(s,{variant:"secondary",className:"border-amber-500/30 bg-amber-500/20 text-amber-400",children:[F.length," pending"]})]})]}),U&&h("div",{className:"py-4 text-center text-muted-foreground text-sm",children:"Generating suggestions..."}),Y.length>0&&T("div",{className:"mb-4",children:[h("p",{className:"mb-2 font-semibold text-violet-400 text-xs uppercase",children:"Top Issues"}),h("div",{className:"space-y-2",children:Y.map((Q,H)=>T("div",{className:"rounded border border-amber-500/20 bg-amber-500/5 p-2 text-xs",children:[T("div",{className:"flex items-center gap-2",children:[h("span",{children:Q.severity==="high"?"\uD83D\uDD34":Q.severity==="medium"?"\uD83D\uDFE0":"\uD83D\uDFE1"}),h("span",{className:"truncate font-medium",children:Q.operation.name})]}),h("p",{className:"mt-1 truncate text-muted-foreground",children:Q.description})]},`${Q.operation.name}-${H}`))})]}),F.length>0&&T("div",{children:[h("p",{className:"mb-2 font-semibold text-violet-400 text-xs uppercase",children:"Pending Suggestions"}),T("div",{className:"space-y-2",children:[F.slice(0,3).map((Q)=>h(V1,{suggestion:Q,onApprove:b,onReject:W},Q.id)),F.length>3&&T("p",{className:"text-center text-muted-foreground text-xs",children:["+",F.length-3," more suggestions"]})]})]}),K.length===0&&F.length===0&&!U&&h("div",{className:"py-4 text-center text-muted-foreground text-xs",children:"No issues detected. Keep coding!"})]}),X&&h("div",{className:"border-violet-500/20 border-t p-2",children:h(E0,{variant:"ghost",size:"sm",className:"w-full",onPress:X,children:"Open Evolution Dashboard \u2192"})})]})}function V1({suggestion:$,onApprove:N,onReject:q}){return T("div",{className:"rounded border border-violet-500/20 bg-violet-500/5 p-2",children:[h("div",{className:"flex items-start justify-between gap-2",children:T("div",{className:"min-w-0 flex-1",children:[h("p",{className:"truncate font-medium text-xs",children:$.proposal.summary}),T("div",{className:"mt-1 flex items-center gap-2 text-xs",children:[h(s,{variant:"secondary",children:$.priority}),T("span",{className:"text-muted-foreground",children:[($.confidence*100).toFixed(0),"%"]})]})]})}),T("div",{className:"mt-2 flex justify-end gap-1",children:[h("button",{onClick:()=>q($.id),className:"rounded px-2 py-0.5 text-red-400 text-xs hover:bg-red-400/10",type:"button",children:"Reject"}),h("button",{onClick:()=>N($.id),className:"rounded bg-violet-500/20 px-2 py-0.5 text-violet-400 text-xs hover:bg-violet-500/30",type:"button",children:"Approve"})]})]})}import{createContext as F1,useContext as Y1}from"react";var I0=Symbol.for("@contractspec/lib.example-shared-ui/template-runtime-context");function D1(){let $=globalThis;return $[I0]??=F1(null),$[I0]}var f1=D1();function r(){let $=Y1(f1);if(!$)throw Error("useTemplateRuntime must be used within a TemplateRuntimeProvider");return $}import{RefreshCw as W1,Shield as _1}from"lucide-react";import{useState as U1}from"react";import{jsx as f0,jsxs as W0}from"react/jsx-runtime";function P0(){let{projectId:$,templateId:N,template:q,installer:J}=r(),[X,K]=U1(!1),z=async()=>{K(!0);try{await J.install(N,{projectId:$})}finally{K(!1)}};return W0("div",{className:"inline-flex items-center gap-2 rounded-full border border-border bg-muted/40 px-3 py-1 text-muted-foreground text-xs",children:[f0(_1,{className:"h-3.5 w-3.5 text-violet-400"}),W0("span",{children:["Local runtime \xB7"," ",f0("span",{className:"font-semibold text-foreground",children:q.name})]}),W0("button",{type:"button",className:"inline-flex items-center gap-1 rounded-full border border-border px-2 py-0.5 font-semibold text-[11px] text-muted-foreground hover:text-foreground",onClick:z,disabled:X,children:[f0(W1,{className:"h-3 w-3"}),X?"Resetting\u2026":"Reset data"]})]})}function S0($){let N=$.split(".");return(N[N.length-1]??$).split("-").map((J)=>J.charAt(0).toUpperCase()+J.slice(1)).join(" ")}import{useCallback as A1,useEffect as v0,useState as J0}from"react";function y0({engine:$,fetchData:N,presentationId:q,presentations:J,resolvePresentation:X,templateId:K}){let[z,U]=J0(""),[w,V]=J0(""),[f,F]=J0(!1),[Y,b]=J0(null);v0(()=>{if(q&&J.includes(q)){U(q);return}if(J.length===0){U("");return}if(!J.includes(z))U(J[0]??"")},[q,J,z,K]);let W=A1(async()=>{if(!z||!$)return;F(!0),b(null);try{if(!X)throw Error("resolvePresentation not available in runtime context");let Q=X(z);if(!Q)throw Error(`Presentation descriptor not found: ${z}`);let H=await N(z),Z=await $.render("markdown",Q,{data:H.data});V(Z.body)}catch(Q){b(Q instanceof Error?Q:Error("Failed to render markdown"))}finally{F(!1)}},[$,N,X,z]);return v0(()=>{W()},[W]),{error:Y,loading:f,markdownContent:w,renderMarkdown:W,selectedPresentation:z,setSelectedPresentation:U}}import{Button as c0,ErrorState as w1,LoaderBlock as b1,MarkdownRenderer as R1}from"@contractspec/lib.design-system";import{Badge as h1}from"@contractspec/lib.ui-kit-web/ui/badge";import{Card as r0}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as M1}from"react";import{jsx as C,jsxs as Z0}from"react/jsx-runtime";function i2({templateId:$,presentationId:N,className:q}){let{engine:J,template:X,templateId:K,resolvePresentation:z,fetchData:U}=r(),w=$??K,V=X?.presentations??[],{error:f,loading:F,markdownContent:Y,renderMarkdown:b,selectedPresentation:W,setSelectedPresentation:Q}=y0({engine:J,fetchData:U,presentationId:N,presentations:V,resolvePresentation:z,templateId:w});if(!V.length)return C(r0,{className:q,children:C("div",{className:"p-6 text-center",children:C("p",{className:"text-muted-foreground",children:"No presentations available for this template."})})});let H=M1(()=>{if(Y)navigator.clipboard.writeText(Y)},[Y]);return Z0("div",{className:q,children:[Z0("div",{className:"mb-4 flex flex-wrap items-center gap-2",children:[C("span",{className:"font-medium text-muted-foreground text-sm",children:"Presentation:"}),V.map((Z)=>C(c0,{variant:W===Z?"default":"outline",size:"sm",onPress:()=>Q(Z),children:S0(Z)},Z)),Z0("div",{className:"ml-auto flex items-center gap-2",children:[C(h1,{variant:"secondary",children:"LLM-friendly"}),C(c0,{variant:"outline",size:"sm",onPress:H,disabled:!Y||F,children:"Copy"})]})]}),Z0(r0,{className:"overflow-hidden",children:[F&&C(b1,{label:"Rendering markdown..."}),f&&C(w1,{title:"Render failed",description:f.message,onRetry:b,retryLabel:"Retry"}),!F&&!f&&Y&&C("div",{className:"p-6",children:C(R1,{content:Y})}),!F&&!f&&!Y&&C("div",{className:"p-6 text-center",children:C("p",{className:"text-muted-foreground",children:"Select a presentation to view its markdown output."})})]})]})}import*as i0 from"react";import{useContext as j0,useMemo as I}from"react";import{jsx as O1}from"react/jsx-runtime";var _0=i0.createContext(null);function p2({templateId:$,role:N="user",device:q="desktop",children:J}){let X=I(()=>T1($,N),[$,N]),K=I(()=>{return X.filter((W)=>{let Q=W.conditions;if(!Q)return!0;if(Q.role&&!Q.role.includes(N))return!1;if(Q.device&&Q.device!=="any"&&Q.device!==q)return!1;return!0})},[X,N,q]),z=I(()=>{let W=new Map;for(let Q of K)W.set(Q.target,Q);return W},[K]),U=I(()=>(W,Q)=>{let H=z.get(W);if(!H)return Q;let Z={...Q};for(let A of H.modifications)switch(A.op){case"hide":Z={...Z,hidden:!0};break;case"relabel":Z={...Z,label:A.label};break;case"reorder":Z={...Z,position:A.position};break;case"restyle":Z={...Z,className:A.className,variant:A.variant};break;case"set-default":Z={...Z,defaultValue:A.value};break}return Z},[z]),w=I(()=>(W)=>{return z.get(W)?.modifications.some((H)=>H.op==="hide")??!1},[z]),V=I(()=>(W,Q)=>{let Z=z.get(W)?.modifications.find((A)=>A.op==="relabel");return Z&&Z.op==="relabel"?Z.label:Q},[z]),f=I(()=>(W,Q)=>{let Z=z.get(W)?.modifications.find((A)=>A.op==="reorder");return Z&&Z.op==="reorder"?Z.position:Q},[z]),F=I(()=>(W)=>{let H=z.get(W)?.modifications.find((Z)=>Z.op==="restyle");if(H&&H.op==="restyle")return{className:H.className,variant:H.variant};return{}},[z]),Y=I(()=>(W,Q)=>{let Z=z.get(W)?.modifications.find((A)=>A.op==="set-default");return Z&&Z.op==="set-default"?Z.value:Q},[z]),b=I(()=>({overlays:K,applyOverlay:U,isHidden:w,getLabel:V,getPosition:f,getStyle:F,getDefault:Y,role:N,device:q}),[K,U,w,V,f,F,Y,N,q]);return O1(_0.Provider,{value:b,children:J})}function u2(){let $=j0(_0);if(!$)throw Error("useOverlayContext must be used within an OverlayContextProvider");return $}function d2(){return j0(_0)!==null}function T1($,N){return{"crm-pipeline":[{id:"crm-hide-internal-fields",target:"deal.internalNotes",modifications:[{op:"hide"}],conditions:{role:["viewer","user"]}},{id:"crm-relabel-value",target:"deal.value",modifications:[{op:"relabel",label:"Deal Amount"}]}],"saas-boilerplate":[{id:"saas-hide-billing",target:"settings.billing",modifications:[{op:"hide"}],conditions:{role:["viewer"]}},{id:"saas-restyle-plan",target:"settings.plan",modifications:[{op:"restyle",variant:"premium"}],conditions:{role:["admin"]}}],"agent-console":[{id:"agent-hide-cost",target:"run.cost",modifications:[{op:"hide"}],conditions:{role:["viewer"]}},{id:"agent-relabel-tokens",target:"run.tokens",modifications:[{op:"relabel",label:"Token Usage"}]}],"todos-app":[{id:"todos-hide-assignee",target:"task.assignee",modifications:[{op:"hide"}],conditions:{device:"mobile"}}],"messaging-app":[{id:"messaging-reorder-timestamp",target:"message.timestamp",modifications:[{op:"reorder",position:0}]}],"recipe-app-i18n":[{id:"recipe-relabel-servings",target:"recipe.servings",modifications:[{op:"relabel",label:"Portions"}]}]}[$]??[]}import{useCallback as Q0,useEffect as x0,useMemo as B1,useRef as L1,useState as g0}from"react";var U0="contractspec-behavior-data",E1=["playground","specs","builder","markdown","evolution","canvas_add","canvas_delete","spec_save","spec_validate","ai_suggestions"];function p0($){let[N,q]=g0([]),J=L1(new Date),[X,K]=g0(0);x0(()=>{try{let f=localStorage.getItem(U0);if(f){let F=JSON.parse(f);q(F.events.map((Y)=>({...Y,timestamp:new Date(Y.timestamp)}))),J.current=new Date(F.sessionStart)}}catch{}},[]),x0(()=>{if(N.length>0)try{localStorage.setItem(U0,JSON.stringify({events:N.map((f)=>({...f,timestamp:f.timestamp.toISOString()})),sessionStart:J.current.toISOString()}))}catch{}},[N]);let z=Q0((f,F)=>{let Y={type:f,timestamp:new Date,templateId:$,metadata:F};q((b)=>[...b,Y]),K((b)=>b+1)},[$]),U=Q0((f)=>{return N.filter((F)=>F.type===f)},[N]),w=Q0(()=>{let F=new Date().getTime()-J.current.getTime(),Y=new Map;for(let P of N){let G=Y.get(P.templateId)??0;Y.set(P.templateId,G+1)}let b=Array.from(Y.entries()).map(([P,G])=>({templateId:P,count:G})).sort((P,G)=>G.count-P.count).slice(0,3),W=new Map;for(let P of N)if(P.type==="mode_change"&&P.metadata?.mode){let G=P.metadata.mode,M=W.get(G)??0;W.set(G,M+1)}let Q=Array.from(W.entries()).map(([P,G])=>({mode:P,count:G})).sort((P,G)=>G.count-P.count),H=new Set;for(let P of N){if(P.type==="mode_change"&&P.metadata?.mode)H.add(P.metadata.mode);if(P.type==="feature_usage"&&P.metadata?.feature)H.add(P.metadata.feature);if(P.type==="canvas_interaction"){let G=P.metadata?.action;if(G==="add")H.add("canvas_add");if(G==="delete")H.add("canvas_delete")}if(P.type==="spec_edit"){let G=P.metadata?.action;if(G==="save")H.add("spec_save");if(G==="validate")H.add("spec_validate")}}let Z=E1.filter((P)=>!H.has(P)),A=N.filter((P)=>P.type==="error").length,L=k1(Array.from(H),Z,Q,N.length);return{totalEvents:N.length,sessionDuration:F,mostUsedTemplates:b,mostUsedModes:Q,featuresUsed:Array.from(H),unusedFeatures:Z,errorCount:A,recommendations:L}},[N]),V=Q0(()=>{q([]),K(0),J.current=new Date,localStorage.removeItem(U0)},[]);return B1(()=>({trackEvent:z,getSummary:w,getEventsByType:U,eventCount:X,sessionStart:J.current,clear:V}),[z,w,U,X,V])}function k1($,N,q,J){let X=[];if(N.includes("evolution"))X.push("Try the AI Evolution mode to get automated improvement suggestions");if(N.includes("markdown"))X.push("Use Markdown preview to see documentation for your specs");if(N.includes("builder"))X.push("Explore the Visual Builder to design your UI components");if(!$.includes("spec_validate")&&$.includes("specs"))X.push("Don't forget to validate your specs before saving");if($.includes("evolution")&&!$.includes("ai_suggestions"))X.push("Generate AI suggestions to get actionable improvement recommendations");if(J>50)X.push("Great engagement! Consider saving your work regularly");if(q.length===1)X.push("Try different modes to explore all sandbox capabilities");return X}import{Button as u0}from"@contractspec/lib.design-system";import{Badge as A0}from"@contractspec/lib.ui-kit-web/ui/badge";import{Card as C1}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as d0,useMemo as I1,useState as S1}from"react";import{jsx as R,jsxs as O}from"react/jsx-runtime";function N4({templateId:$,collapsed:N=!1,onToggle:q}){let{getSummary:J,eventCount:X,clear:K,sessionStart:z}=p0($),[U,w]=S1(!1),V=I1(()=>J(),[J]),f=d0((Y)=>{let b=Math.floor(Y/1000),W=Math.floor(b/60),Q=Math.floor(W/60);if(Q>0)return`${Q}h ${W%60}m`;if(W>0)return`${W}m ${b%60}s`;return`${b}s`},[]),F=d0(()=>{K()},[K]);if(N)return O("button",{onClick:q,className:"flex items-center gap-2 rounded-lg border border-blue-500/30 bg-blue-500/10 px-3 py-2 text-sm transition hover:bg-blue-500/20",type:"button",children:[R("span",{children:"\uD83D\uDCCA"}),R("span",{children:"Insights"}),R(A0,{variant:"secondary",children:X})]});return O(C1,{className:"overflow-hidden",children:[O("div",{className:"flex items-center justify-between border-blue-500/20 border-b bg-blue-500/5 px-4 py-3",children:[O("div",{className:"flex items-center gap-2",children:[R("span",{children:"\uD83D\uDCCA"}),R("span",{className:"font-semibold",children:"Personalization Insights"})]}),O("div",{className:"flex items-center gap-2",children:[R(u0,{variant:"ghost",size:"sm",onPress:()=>w(!U),children:U?"Hide Details":"Show Details"}),q&&R("button",{onClick:q,className:"p-1 text-muted-foreground hover:text-foreground",type:"button",title:"Collapse",children:"\u2715"})]})]}),O("div",{className:"p-4",children:[O("div",{className:"mb-4 grid grid-cols-2 gap-3 md:grid-cols-4",children:[R(X0,{label:"Session Time",value:f(V.sessionDuration),icon:"\u23F1\uFE0F"}),R(X0,{label:"Events Tracked",value:V.totalEvents.toString(),icon:"\uD83D\uDCC8"}),R(X0,{label:"Features Used",value:`${V.featuresUsed.length}/${V.featuresUsed.length+V.unusedFeatures.length}`,icon:"\u2728"}),R(X0,{label:"Errors",value:V.errorCount.toString(),icon:"\u26A0\uFE0F",variant:V.errorCount>0?"warning":"success"})]}),V.recommendations.length>0&&O("div",{className:"mb-4",children:[R("h4",{className:"mb-2 font-semibold text-blue-400 text-xs uppercase",children:"Recommendations"}),R("ul",{className:"space-y-1",children:V.recommendations.map((Y,b)=>O("li",{className:"flex items-start gap-2 text-sm",children:[R("span",{className:"text-blue-400",children:"\uD83D\uDCA1"}),R("span",{children:Y})]},b))})]}),V.unusedFeatures.length>0&&O("div",{className:"mb-4",children:[R("h4",{className:"mb-2 font-semibold text-blue-400 text-xs uppercase",children:"Try These Features"}),R("div",{className:"flex flex-wrap gap-2",children:V.unusedFeatures.slice(0,5).map((Y)=>R(A0,{variant:"secondary",children:w0(Y)},Y))})]}),U&&R(v1,{summary:V,sessionStart:z}),R("div",{className:"mt-4 flex justify-end border-blue-500/10 border-t pt-4",children:R(u0,{variant:"ghost",size:"sm",onPress:F,children:"Clear Data"})})]})]})}function X0({label:$,value:N,icon:q,variant:J="default"}){return O("div",{className:`rounded-lg border p-3 text-center ${{default:"bg-blue-500/5 border-blue-500/20",warning:"bg-amber-500/5 border-amber-500/20",success:"bg-green-500/5 border-green-500/20"}[J]}`,children:[R("div",{className:"mb-1 text-lg",children:q}),R("div",{className:"font-bold text-lg",children:N}),R("div",{className:"text-muted-foreground text-xs",children:$})]})}function v1({summary:$,sessionStart:N}){return O("div",{className:"mt-4 space-y-4 border-blue-500/10 border-t pt-4",children:[$.mostUsedTemplates.length>0&&O("div",{children:[R("h4",{className:"mb-2 font-semibold text-blue-400 text-xs uppercase",children:"Most Used Templates"}),R("div",{className:"space-y-1",children:$.mostUsedTemplates.map(({templateId:q,count:J})=>O("div",{className:"flex items-center justify-between text-sm",children:[R("span",{children:y1(q)}),O("span",{className:"text-muted-foreground",children:[J," events"]})]},q))})]}),$.mostUsedModes.length>0&&O("div",{children:[R("h4",{className:"mb-2 font-semibold text-blue-400 text-xs uppercase",children:"Mode Usage"}),R("div",{className:"space-y-1",children:$.mostUsedModes.map(({mode:q,count:J})=>O("div",{className:"flex items-center justify-between text-sm",children:[R("span",{children:w0(q)}),O("span",{className:"text-muted-foreground",children:[J," switches"]})]},q))})]}),O("div",{children:[R("h4",{className:"mb-2 font-semibold text-blue-400 text-xs uppercase",children:"Features Used"}),R("div",{className:"flex flex-wrap gap-2",children:$.featuresUsed.map((q)=>O(A0,{variant:"default",className:"border-green-500/30 bg-green-500/20 text-green-400",children:["\u2713 ",w0(q)]},q))})]}),O("div",{className:"text-muted-foreground text-xs",children:["Session started: ",N.toLocaleString()]})]})}function w0($){return $.replace(/_/g," ").replace(/\b\w/g,(N)=>N.toUpperCase())}function y1($){return $.replace(/-/g," ").replace(/\b\w/g,(N)=>N.toUpperCase())}import{Sparkles as c1}from"lucide-react";import{useState as m0}from"react";import{jsx as b0,jsxs as l0}from"react/jsx-runtime";function z0({organizationId:$="demo-org",projectName:N,endpoint:q,token:J}){let{installer:X,templateId:K,template:z}=r(),[U,w]=m0("idle"),[V,f]=m0(null);return l0("div",{className:"flex flex-col items-end gap-1",children:[l0("button",{type:"button",className:"btn-primary inline-flex items-center gap-2 text-sm",onClick:async()=>{w("saving"),f(null);try{await X.saveToStudio({templateId:K,projectName:N??`${z.name} demo`,organizationId:$,endpoint:q,token:J}),w("saved"),setTimeout(()=>w("idle"),3000)}catch(Y){w("error"),f(Y instanceof Error?Y.message:"Unknown error")}},disabled:U==="saving",children:[b0(c1,{className:"h-4 w-4"}),U==="saving"?"Publishing\u2026":"Save to Studio"]}),U==="error"&&V?b0("p",{className:"text-destructive text-xs",children:V}):null,U==="saved"?b0("p",{className:"text-emerald-400 text-xs",children:"Template sent to Studio."}):null]})}import{BundleProvider as r1,BundleRenderer as i1}from"@contractspec/lib.surface-runtime/react";import{jsx as S,jsxs as H0}from"react/jsx-runtime";function V4({plan:$,title:N,description:q,sidebar:J,actions:X,showSaveAction:K=!0,saveProps:z,children:U}){let V={header:H0("header",{className:"rounded-2xl border border-border bg-card p-6 shadow-sm",children:[H0("div",{className:"flex flex-wrap items-center justify-between gap-4",children:[H0("div",{children:[S("p",{className:"font-semibold text-muted-foreground text-sm uppercase tracking-wide",children:"ContractSpec Templates"}),S("h1",{className:"font-bold text-3xl",children:N}),q?S("p",{className:"mt-2 max-w-2xl text-muted-foreground text-sm",children:q}):null]}),H0("div",{className:"flex flex-col items-end gap-2",children:[S(P0,{}),K?S(z0,{...z}):null]})]}),X?S("div",{className:"mt-4",children:X}):null]}),primary:S("main",{className:"space-y-4 p-2",children:U})};if(J!=null)V.sidebar=S("aside",{className:"rounded-2xl border border-border bg-card p-4",children:J});return S(r1,{plan:$,children:S(i1,{slotContent:V})})}function e($){let N=$?.id??"unknown";if(!$)return n0(N);switch(N){case"crm-pipeline":return j1($.schema.contracts);case"saas-boilerplate":return x1($.schema.contracts);case"agent-console":return g1($.schema.contracts);case"todos-app":return p1($.schema.contracts);case"messaging-app":return u1($.schema.contracts);case"recipe-app-i18n":return d1($.schema.contracts);default:return n0(N)}}function j1($){return`// CRM Pipeline Specs
+// Contracts: ${$.join(", ")}
 
 contractSpec("crm.deal.updateStage.v1", {
   goal: "Move a deal to a different pipeline stage",
@@ -2210,11 +69,8 @@ contractSpec("crm.contact.list.v1", {
       hasMore: "boolean"
     }
   }
-});`;
-}
-function generateSaasBoilerplateSpec(contracts) {
-  return `// SaaS Boilerplate Specs
-// Contracts: ${contracts.join(", ")}
+});`}function x1($){return`// SaaS Boilerplate Specs
+// Contracts: ${$.join(", ")}
 
 contractSpec("saas.project.create.v1", {
   goal: "Create a new project in an organization",
@@ -2277,11 +133,8 @@ contractSpec("saas.settings.update.v1", {
     }
   },
   events: ["settings.updated"]
-});`;
-}
-function generateAgentConsoleSpec(contracts) {
-  return `// Agent Console Specs
-// Contracts: ${contracts.join(", ")}
+});`}function g1($){return`// Agent Console Specs
+// Contracts: ${$.join(", ")}
 
 contractSpec("agent.run.execute.v1", {
   goal: "Execute an agent run with specified tools",
@@ -2347,11 +200,8 @@ contractSpec("agent.agent.create.v1", {
     }
   },
   events: ["agent.created"]
-});`;
-}
-function generateTodosSpec(contracts) {
-  return `// To-dos App Specs
-// Contracts: ${contracts.join(", ")}
+});`}function p1($){return`// To-dos App Specs
+// Contracts: ${$.join(", ")}
 
 contractSpec("tasks.board.v1", {
   goal: "Assign and approve craft work",
@@ -2410,11 +260,8 @@ contractSpec("tasks.complete.v1", {
     }
   },
   events: ["task.completed"]
-});`;
-}
-function generateMessagingSpec(contracts) {
-  return `// Messaging App Specs
-// Contracts: ${contracts.join(", ")}
+});`}function u1($){return`// Messaging App Specs
+// Contracts: ${$.join(", ")}
 
 contractSpec("messaging.send.v1", {
   goal: "Deliver intent-rich updates",
@@ -2467,11 +314,8 @@ contractSpec("messaging.read.v1", {
     }
   },
   events: ["message.read"]
-});`;
-}
-function generateRecipeSpec(contracts) {
-  return `// Recipe App (i18n) Specs
-// Contracts: ${contracts.join(", ")}
+});`}function d1($){return`// Recipe App (i18n) Specs
+// Contracts: ${$.join(", ")}
 
 contractSpec("recipes.lookup.v1", {
   goal: "Serve bilingual rituals",
@@ -2518,13 +362,10 @@ contractSpec("recipes.favorite.toggle.v1", {
     }
   },
   events: ["recipe.favorited", "recipe.unfavorited"]
-});`;
-}
-function generateDefaultSpec(templateId) {
-  return `// ${templateId} Specs
+});`}function n0($){return`// ${$} Specs
 
-contractSpec("${templateId}.main.v1", {
-  goal: "Main operation for ${templateId}",
+contractSpec("${$}.main.v1", {
+  goal: "Main operation for ${$}",
   transport: { gql: { query: "main" } },
   io: {
     input: { 
@@ -2534,961 +375,38 @@ contractSpec("${templateId}.main.v1", {
       result: "unknown"
     }
   }
-});`;
-}
-
-// src/hooks/useSpecContent.ts
-import { useCallback as useCallback8, useEffect as useEffect4, useState as useState7 } from "react";
-"use client";
-var SPEC_STORAGE_KEY = "contractspec-spec-content";
-function useSpecContent(templateId) {
-  const { template } = useTemplateRuntime();
-  const [content, setContentState] = useState7("");
-  const [savedContent, setSavedContent] = useState7("");
-  const [loading, setLoading] = useState7(true);
-  const [validation, setValidation] = useState7(null);
-  const [lastSaved, setLastSaved] = useState7(null);
-  useEffect4(() => {
-    setLoading(true);
-    try {
-      const stored = localStorage.getItem(`${SPEC_STORAGE_KEY}-${templateId}`);
-      if (stored) {
-        const parsed = JSON.parse(stored);
-        if (parsed.content) {
-          setContentState(parsed.content);
-          setSavedContent(parsed.content);
-          setLastSaved(parsed.savedAt);
-        } else {
-          const generated = generateSpecFromTemplate(template);
-          setContentState(generated);
-          setSavedContent(generated);
-        }
-      } else {
-        const generated = generateSpecFromTemplate(template);
-        setContentState(generated);
-        setSavedContent(generated);
-      }
-    } catch {
-      const generated = generateSpecFromTemplate(template);
-      setContentState(generated);
-      setSavedContent(generated);
-    }
-    setLoading(false);
-  }, [templateId]);
-  const setContent = useCallback8((newContent) => {
-    setContentState(newContent);
-    setValidation(null);
-  }, []);
-  const save = useCallback8(() => {
-    try {
-      const savedAt = new Date().toISOString();
-      localStorage.setItem(`${SPEC_STORAGE_KEY}-${templateId}`, JSON.stringify({
-        content,
-        savedAt
-      }));
-      setSavedContent(content);
-      setLastSaved(savedAt);
-    } catch {}
-  }, [content, templateId]);
-  const validate = useCallback8(() => {
-    const errors = [];
-    const lines = content.split(`
-`);
-    if (!content.includes("contractSpec(")) {
-      errors.push({
-        line: 1,
-        message: "Spec must contain a contractSpec() definition",
-        severity: "error"
-      });
-    }
-    if (!content.includes("goal:")) {
-      errors.push({
-        line: 1,
-        message: "Spec should have a goal field",
-        severity: "warning"
-      });
-    }
-    if (!content.includes("io:")) {
-      errors.push({
-        line: 1,
-        message: "Spec should define io (input/output)",
-        severity: "warning"
-      });
-    }
-    const openBraces = (content.match(/{/g) ?? []).length;
-    const closeBraces = (content.match(/}/g) ?? []).length;
-    if (openBraces !== closeBraces) {
-      errors.push({
-        line: lines.length,
-        message: `Unbalanced braces: ${openBraces} opening, ${closeBraces} closing`,
-        severity: "error"
-      });
-    }
-    const openParens = (content.match(/\(/g) ?? []).length;
-    const closeParens = (content.match(/\)/g) ?? []).length;
-    if (openParens !== closeParens) {
-      errors.push({
-        line: lines.length,
-        message: `Unbalanced parentheses: ${openParens} opening, ${closeParens} closing`,
-        severity: "error"
-      });
-    }
-    lines.forEach((line, index) => {
-      const singleQuotes = (line.match(/'/g) ?? []).length;
-      const doubleQuotes = (line.match(/"/g) ?? []).length;
-      if (singleQuotes % 2 !== 0) {
-        errors.push({
-          line: index + 1,
-          message: "Unclosed single quote",
-          severity: "error"
-        });
-      }
-      if (doubleQuotes % 2 !== 0) {
-        errors.push({
-          line: index + 1,
-          message: "Unclosed double quote",
-          severity: "error"
-        });
-      }
-    });
-    const result = {
-      valid: errors.filter((e) => e.severity === "error").length === 0,
-      errors
-    };
-    setValidation(result);
-    return result;
-  }, [content]);
-  const reset = useCallback8(() => {
-    const generated = generateSpecFromTemplate(template);
-    setContentState(generated);
-    setSavedContent(generated);
-    setValidation(null);
-    setLastSaved(null);
-    try {
-      localStorage.removeItem(`${SPEC_STORAGE_KEY}-${templateId}`);
-    } catch {}
-  }, [templateId]);
-  return {
-    content,
-    loading,
-    isDirty: content !== savedContent,
-    validation,
-    setContent,
-    save,
-    validate,
-    reset,
-    lastSaved
-  };
-}
-
-// src/SpecEditorPanel.tsx
-import { Button as Button5, LoaderBlock as LoaderBlock3 } from "@contractspec/lib.design-system";
-import { Badge as Badge5 } from "@contractspec/lib.ui-kit-web/ui/badge";
-import { useCallback as useCallback9, useEffect as useEffect5 } from "react";
-import { jsxDEV as jsxDEV9 } from "react/jsx-dev-runtime";
-"use client";
-function SpecEditorPanel({
-  templateId,
-  SpecEditor,
-  onLog
-}) {
-  const {
-    content,
-    loading,
-    isDirty,
-    validation,
-    setContent,
-    save,
-    validate,
-    reset,
-    lastSaved
-  } = useSpecContent(templateId);
-  useEffect5(() => {
-    if (!loading && content) {
-      onLog?.(`Spec loaded for ${templateId}`);
-    }
-  }, [loading, content, templateId, onLog]);
-  const handleSave = useCallback9(() => {
-    save();
-    onLog?.("Spec saved locally");
-  }, [save, onLog]);
-  const handleValidate = useCallback9(() => {
-    const result = validate();
-    if (result.valid) {
-      onLog?.("Spec validation passed");
-    } else {
-      const errorCount = result.errors.filter((e) => e.severity === "error").length;
-      const warnCount = result.errors.filter((e) => e.severity === "warning").length;
-      onLog?.(`Spec validation: ${errorCount} errors, ${warnCount} warnings`);
-    }
-  }, [validate, onLog]);
-  const handleReset = useCallback9(() => {
-    reset();
-    onLog?.("Spec reset to template defaults");
-  }, [reset, onLog]);
-  if (loading) {
-    return /* @__PURE__ */ jsxDEV9(LoaderBlock3, {
-      label: "Loading spec..."
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV9("div", {
-    className: "space-y-4",
-    children: [
-      /* @__PURE__ */ jsxDEV9("div", {
-        className: "flex items-center justify-between",
-        children: [
-          /* @__PURE__ */ jsxDEV9("div", {
-            className: "flex items-center gap-2",
-            children: [
-              /* @__PURE__ */ jsxDEV9(Button5, {
-                variant: "default",
-                size: "sm",
-                onClick: handleSave,
-                children: "Save"
-              }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV9(Button5, {
-                variant: "outline",
-                size: "sm",
-                onClick: handleValidate,
-                children: "Validate"
-              }, undefined, false, undefined, this),
-              isDirty && /* @__PURE__ */ jsxDEV9(Badge5, {
-                variant: "secondary",
-                className: "border-amber-500/30 bg-amber-500/20 text-amber-400",
-                children: "Unsaved changes"
-              }, undefined, false, undefined, this),
-              validation && /* @__PURE__ */ jsxDEV9(Badge5, {
-                variant: validation.valid ? "default" : "destructive",
-                className: validation.valid ? "border-green-500/30 bg-green-500/20 text-green-400" : "",
-                children: validation.valid ? "Valid" : `${validation.errors.filter((e) => e.severity === "error").length} errors`
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV9("div", {
-            className: "flex items-center gap-2",
-            children: [
-              lastSaved && /* @__PURE__ */ jsxDEV9("span", {
-                className: "text-muted-foreground text-xs",
-                children: [
-                  "Last saved: ",
-                  new Date(lastSaved).toLocaleTimeString()
-                ]
-              }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV9(Button5, {
-                variant: "ghost",
-                size: "sm",
-                onPress: handleReset,
-                children: "Reset"
-              }, undefined, false, undefined, this)
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      validation && validation.errors.length > 0 && /* @__PURE__ */ jsxDEV9("div", {
-        className: "rounded-lg border border-amber-500/50 bg-amber-500/10 p-3",
-        children: [
-          /* @__PURE__ */ jsxDEV9("p", {
-            className: "mb-2 font-semibold text-amber-400 text-xs uppercase",
-            children: "Validation Issues"
-          }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV9("ul", {
-            className: "space-y-1",
-            children: validation.errors.map((error, index) => /* @__PURE__ */ jsxDEV9("li", {
-              className: `text-xs ${error.severity === "error" ? "text-red-400" : "text-amber-400"}`,
-              children: [
-                "Line ",
-                error.line,
-                ": ",
-                error.message
-              ]
-            }, `${error.line}-${error.message}-${index}`, true, undefined, this))
-          }, undefined, false, undefined, this)
-        ]
-      }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV9("div", {
-        className: "rounded-2xl border border-border bg-card p-4",
-        children: /* @__PURE__ */ jsxDEV9(SpecEditor, {
-          projectId: "sandbox",
-          type: "CAPABILITY",
-          content,
-          onChange: setContent,
-          metadata: { template: templateId },
-          onSave: handleSave,
-          onValidate: handleValidate
-        }, undefined, false, undefined, this)
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
-
-// src/TemplateShell.tsx
-import { jsxDEV as jsxDEV10 } from "react/jsx-dev-runtime";
-var TemplateShell = ({
-  title,
-  description,
-  sidebar,
-  actions,
-  showSaveAction = true,
-  saveProps,
-  children
-}) => /* @__PURE__ */ jsxDEV10("div", {
-  className: "space-y-6",
-  children: [
-    /* @__PURE__ */ jsxDEV10("header", {
-      className: "rounded-2xl border border-border bg-card p-6 shadow-sm",
-      children: [
-        /* @__PURE__ */ jsxDEV10("div", {
-          className: "flex flex-wrap items-center justify-between gap-4",
-          children: [
-            /* @__PURE__ */ jsxDEV10("div", {
-              children: [
-                /* @__PURE__ */ jsxDEV10("p", {
-                  className: "font-semibold text-muted-foreground text-sm uppercase tracking-wide",
-                  children: "ContractSpec Templates"
-                }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV10("h1", {
-                  className: "font-bold text-3xl",
-                  children: title
-                }, undefined, false, undefined, this),
-                description ? /* @__PURE__ */ jsxDEV10("p", {
-                  className: "mt-2 max-w-2xl text-muted-foreground text-sm",
-                  children: description
-                }, undefined, false, undefined, this) : null
-              ]
-            }, undefined, true, undefined, this),
-            /* @__PURE__ */ jsxDEV10("div", {
-              className: "flex flex-col items-end gap-2",
-              children: [
-                /* @__PURE__ */ jsxDEV10(LocalDataIndicator, {}, undefined, false, undefined, this),
-                showSaveAction ? /* @__PURE__ */ jsxDEV10(SaveToStudioButton, {
-                  ...saveProps
-                }, undefined, false, undefined, this) : null
-              ]
-            }, undefined, true, undefined, this)
-          ]
-        }, undefined, true, undefined, this),
-        actions ? /* @__PURE__ */ jsxDEV10("div", {
-          className: "mt-4",
-          children: actions
-        }, undefined, false, undefined, this) : null
-      ]
-    }, undefined, true, undefined, this),
-    /* @__PURE__ */ jsxDEV10("div", {
-      className: sidebar ? "grid gap-6 lg:grid-cols-[minmax(0,1fr)_320px]" : "w-full",
-      children: [
-        /* @__PURE__ */ jsxDEV10("main", {
-          className: "space-y-4 p-2",
-          children
-        }, undefined, false, undefined, this),
-        sidebar ? /* @__PURE__ */ jsxDEV10("aside", {
-          className: "rounded-2xl border border-border bg-card p-4",
-          children: sidebar
-        }, undefined, false, undefined, this) : null
-      ]
-    }, undefined, true, undefined, this)
-  ]
-}, undefined, true, undefined, this);
-
-// src/hooks/useRegistryTemplates.ts
-import { useQuery } from "@tanstack/react-query";
-function useRegistryTemplates() {
-  return useQuery({
-    queryKey: ["registryTemplates"],
-    queryFn: async () => {
-      const registryUrl = process.env.NEXT_PUBLIC_CONTRACTSPEC_REGISTRY_URL ?? "";
-      if (!registryUrl)
-        return [];
-      const res = await fetch(`${registryUrl.replace(/\/$/, "")}/r/contractspec.json`, {
-        method: "GET",
-        headers: { Accept: "application/json" }
-      });
-      if (!res.ok)
-        return [];
-      const json = await res.json();
-      const items = json.items ?? [];
-      return items.filter((i) => i.type === "contractspec:template").map((i) => ({
-        id: i.name,
-        name: i.title ?? i.name,
-        description: i.description,
-        tags: i.meta?.tags ?? [],
-        source: "registry",
-        registryUrl
-      }));
-    }
-  });
-}
-
-// src/hooks/useWorkflowComposer.ts
-import { useCallback as useCallback10, useEffect as useEffect6, useMemo as useMemo7, useState as useState8 } from "react";
-"use client";
-function useWorkflowComposer(templateId) {
-  const [selectedWorkflow, setSelectedWorkflow] = useState8(null);
-  const [extensions, setExtensions] = useState8([]);
-  const [loading, _setLoading] = useState8(false);
-  const [error, _setError] = useState8(null);
-  const baseWorkflows = useMemo7(() => getTemplateWorkflows(templateId), [templateId]);
-  useEffect6(() => {
-    const firstWorkflow = baseWorkflows[0];
-    if (baseWorkflows.length > 0 && !selectedWorkflow && firstWorkflow) {
-      setSelectedWorkflow(firstWorkflow.meta.key);
-    }
-  }, [baseWorkflows, selectedWorkflow]);
-  const currentBase = useMemo7(() => {
-    return baseWorkflows.find((w) => w.meta.key === selectedWorkflow) ?? null;
-  }, [baseWorkflows, selectedWorkflow]);
-  const compose = useCallback10((scope) => {
-    if (!currentBase)
-      return null;
-    const applicableExtensions = extensions.filter((ext) => ext.workflow === currentBase.meta.key).filter((ext) => matchesScope(ext, scope)).sort((a, b) => (a.priority ?? 0) - (b.priority ?? 0));
-    if (applicableExtensions.length === 0) {
-      return currentBase;
-    }
-    let composedWorkflow = { ...currentBase, steps: [...currentBase.steps] };
-    for (const extension of applicableExtensions) {
-      composedWorkflow = applyExtension(composedWorkflow, extension);
-    }
-    return composedWorkflow;
-  }, [currentBase, extensions]);
-  const workflow = useMemo7(() => compose(), [compose]);
-  const selectWorkflow = useCallback10((workflowName) => {
-    setSelectedWorkflow(workflowName);
-  }, []);
-  const addExtension = useCallback10((extension) => {
-    setExtensions((prev) => [...prev, extension]);
-  }, []);
-  const removeExtension = useCallback10((workflowName, index) => {
-    setExtensions((prev) => {
-      const forWorkflow = prev.filter((e) => e.workflow === workflowName);
-      const others = prev.filter((e) => e.workflow !== workflowName);
-      forWorkflow.splice(index, 1);
-      return [...others, ...forWorkflow];
-    });
-  }, []);
-  const generateSpecCode = useCallback10(() => {
-    const composed = workflow;
-    if (!composed) {
-      return "// No workflow selected";
-    }
-    const stepsCode = composed.steps.map((step) => `    {
-      id: '${step.id}',
-      name: '${step.name}',
-      type: '${step.type}',${step.description ? `
-      description: '${step.description}',` : ""}${step.next ? `
-      next: ${JSON.stringify(step.next)},` : ""}${step.condition ? `
-      condition: '${step.condition}',` : ""}${step.timeout ? `
-      timeout: ${step.timeout},` : ""}${step.retries ? `
-      retries: ${step.retries},` : ""}${step.onError ? `
-      onError: '${step.onError}',` : ""}
+});`}import{useCallback as G0,useEffect as m1,useState as $0}from"react";var R0="contractspec-spec-content";function o0($){let{template:N}=r(),[q,J]=$0(""),[X,K]=$0(""),[z,U]=$0(!0),[w,V]=$0(null),[f,F]=$0(null);m1(()=>{U(!0);try{let H=localStorage.getItem(`${R0}-${$}`);if(H){let Z=JSON.parse(H);if(Z.content)J(Z.content),K(Z.content),F(Z.savedAt);else{let A=e(N);J(A),K(A)}}else{let Z=e(N);J(Z),K(Z)}}catch{let H=e(N);J(H),K(H)}U(!1)},[$]);let Y=G0((H)=>{J(H),V(null)},[]),b=G0(()=>{try{let H=new Date().toISOString();localStorage.setItem(`${R0}-${$}`,JSON.stringify({content:q,savedAt:H})),K(q),F(H)}catch{}},[q,$]),W=G0(()=>{let H=[],Z=q.split(`
+`);if(!q.includes("contractSpec("))H.push({line:1,message:"Spec must contain a contractSpec() definition",severity:"error"});if(!q.includes("goal:"))H.push({line:1,message:"Spec should have a goal field",severity:"warning"});if(!q.includes("io:"))H.push({line:1,message:"Spec should define io (input/output)",severity:"warning"});let A=(q.match(/{/g)??[]).length,L=(q.match(/}/g)??[]).length;if(A!==L)H.push({line:Z.length,message:`Unbalanced braces: ${A} opening, ${L} closing`,severity:"error"});let P=(q.match(/\(/g)??[]).length,G=(q.match(/\)/g)??[]).length;if(P!==G)H.push({line:Z.length,message:`Unbalanced parentheses: ${P} opening, ${G} closing`,severity:"error"});Z.forEach((E,u)=>{let B=(E.match(/'/g)??[]).length,y=(E.match(/"/g)??[]).length;if(B%2!==0)H.push({line:u+1,message:"Unclosed single quote",severity:"error"});if(y%2!==0)H.push({line:u+1,message:"Unclosed double quote",severity:"error"})});let M={valid:H.filter((E)=>E.severity==="error").length===0,errors:H};return V(M),M},[q]),Q=G0(()=>{let H=e(N);J(H),K(H),V(null),F(null);try{localStorage.removeItem(`${R0}-${$}`)}catch{}},[$]);return{content:q,loading:z,isDirty:q!==X,validation:w,setContent:Y,save:b,validate:W,reset:Q,lastSaved:f}}import{Button as h0,LoaderBlock as l1}from"@contractspec/lib.design-system";import{Badge as a0}from"@contractspec/lib.ui-kit-web/ui/badge";import{useCallback as M0,useEffect as n1}from"react";import{jsx as v,jsxs as p}from"react/jsx-runtime";function h4({templateId:$,SpecEditor:N,onLog:q}){let{content:J,loading:X,isDirty:K,validation:z,setContent:U,save:w,validate:V,reset:f,lastSaved:F}=o0($);n1(()=>{if(!X&&J)q?.(`Spec loaded for ${$}`)},[X,J,$,q]);let Y=M0(()=>{w(),q?.("Spec saved locally")},[w,q]),b=M0(()=>{let Q=V();if(Q.valid)q?.("Spec validation passed");else{let H=Q.errors.filter((A)=>A.severity==="error").length,Z=Q.errors.filter((A)=>A.severity==="warning").length;q?.(`Spec validation: ${H} errors, ${Z} warnings`)}},[V,q]),W=M0(()=>{f(),q?.("Spec reset to template defaults")},[f,q]);if(X)return v(l1,{label:"Loading spec..."});return p("div",{className:"space-y-4",children:[p("div",{className:"flex items-center justify-between",children:[p("div",{className:"flex items-center gap-2",children:[v(h0,{variant:"default",size:"sm",onClick:Y,children:"Save"}),v(h0,{variant:"outline",size:"sm",onClick:b,children:"Validate"}),K&&v(a0,{variant:"secondary",className:"border-amber-500/30 bg-amber-500/20 text-amber-400",children:"Unsaved changes"}),z&&v(a0,{variant:z.valid?"default":"destructive",className:z.valid?"border-green-500/30 bg-green-500/20 text-green-400":"",children:z.valid?"Valid":`${z.errors.filter((Q)=>Q.severity==="error").length} errors`})]}),p("div",{className:"flex items-center gap-2",children:[F&&p("span",{className:"text-muted-foreground text-xs",children:["Last saved: ",new Date(F).toLocaleTimeString()]}),v(h0,{variant:"ghost",size:"sm",onPress:W,children:"Reset"})]})]}),z&&z.errors.length>0&&p("div",{className:"rounded-lg border border-amber-500/50 bg-amber-500/10 p-3",children:[v("p",{className:"mb-2 font-semibold text-amber-400 text-xs uppercase",children:"Validation Issues"}),v("ul",{className:"space-y-1",children:z.errors.map((Q,H)=>p("li",{className:`text-xs ${Q.severity==="error"?"text-red-400":"text-amber-400"}`,children:["Line ",Q.line,": ",Q.message]},`${Q.line}-${Q.message}-${H}`))})]}),v("div",{className:"rounded-2xl border border-border bg-card p-4",children:v(N,{projectId:"sandbox",type:"CAPABILITY",content:J,onChange:U,metadata:{template:$},onSave:Y,onValidate:b})})]})}import{jsx as i,jsxs as o}from"react/jsx-runtime";var L4=({title:$,description:N,sidebar:q,actions:J,showSaveAction:X=!0,saveProps:K,children:z})=>o("div",{className:"space-y-6",children:[o("header",{className:"rounded-2xl border border-border bg-card p-6 shadow-sm",children:[o("div",{className:"flex flex-wrap items-center justify-between gap-4",children:[o("div",{children:[i("p",{className:"font-semibold text-muted-foreground text-sm uppercase tracking-wide",children:"ContractSpec Templates"}),i("h1",{className:"font-bold text-3xl",children:$}),N?i("p",{className:"mt-2 max-w-2xl text-muted-foreground text-sm",children:N}):null]}),o("div",{className:"flex flex-col items-end gap-2",children:[i(P0,{}),X?i(z0,{...K}):null]})]}),J?i("div",{className:"mt-4",children:J}):null]}),o("div",{className:q?"grid gap-6 lg:grid-cols-[minmax(0,1fr)_320px]":"w-full",children:[i("main",{className:"space-y-4 p-2",children:z}),q?i("aside",{className:"rounded-2xl border border-border bg-card p-4",children:q}):null]})]});import{useQuery as o1}from"@tanstack/react-query";function I4(){return o1({queryKey:["registryTemplates"],queryFn:async()=>{let $=process.env.NEXT_PUBLIC_CONTRACTSPEC_REGISTRY_URL??"";if(!$)return[];let N=await fetch(`${$.replace(/\/$/,"")}/r/contractspec.json`,{method:"GET",headers:{Accept:"application/json"}});if(!N.ok)return[];return((await N.json()).items??[]).filter((X)=>X.type==="contractspec:template").map((X)=>({id:X.name,name:X.title??X.name,description:X.description,tags:X.meta?.tags??[],source:"registry",registryUrl:$}))}})}import{useCallback as N0,useEffect as a1,useMemo as T0,useState as K0}from"react";function y4($){let[N,q]=K0(null),[J,X]=K0([]),[K,z]=K0(!1),[U,w]=K0(null),V=T0(()=>$2($),[$]);a1(()=>{let Z=V[0];if(V.length>0&&!N&&Z)q(Z.meta.key)},[V,N]);let f=T0(()=>{return V.find((Z)=>Z.meta.key===N)??null},[V,N]),F=N0((Z)=>{if(!f)return null;let A=J.filter((P)=>P.workflow===f.meta.key).filter((P)=>t1(P,Z)).sort((P,G)=>(P.priority??0)-(G.priority??0));if(A.length===0)return f;let L={...f,steps:[...f.steps]};for(let P of A)L=s1(L,P);return L},[f,J]),Y=T0(()=>F(),[F]),b=N0((Z)=>{q(Z)},[]),W=N0((Z)=>{X((A)=>[...A,Z])},[]),Q=N0((Z,A)=>{X((L)=>{let P=L.filter((M)=>M.workflow===Z),G=L.filter((M)=>M.workflow!==Z);return P.splice(A,1),[...G,...P]})},[]),H=N0(()=>{let Z=Y;if(!Z)return"// No workflow selected";let A=Z.steps.map((P)=>`    {
+      id: '${P.id}',
+      name: '${P.name}',
+      type: '${P.type}',${P.description?`
+      description: '${P.description}',`:""}${P.next?`
+      next: ${JSON.stringify(P.next)},`:""}${P.condition?`
+      condition: '${P.condition}',`:""}${P.timeout?`
+      timeout: ${P.timeout},`:""}${P.retries?`
+      retries: ${P.retries},`:""}${P.onError?`
+      onError: '${P.onError}',`:""}
     }`).join(`,
-`);
-    const extensionsCode = extensions.length > 0 ? `
+`),L=J.length>0?`
 
 // Extensions applied:
-${extensions.map((ext) => `// - ${ext.workflow} (priority: ${ext.priority ?? 0})${ext.customSteps?.length ? ` +${ext.customSteps.length} steps` : ""}${ext.hiddenSteps?.length ? ` -${ext.hiddenSteps.length} hidden` : ""}`).join(`
-`)}` : "";
-    return `// Workflow Spec: ${composed.meta.key} v${composed.meta.version}
-// Generated from ${templateId} template
-${extensionsCode}
+${J.map((P)=>`// - ${P.workflow} (priority: ${P.priority??0})${P.customSteps?.length?` +${P.customSteps.length} steps`:""}${P.hiddenSteps?.length?` -${P.hiddenSteps.length} hidden`:""}`).join(`
+`)}`:"";return`// Workflow Spec: ${Z.meta.key} v${Z.meta.version}
+// Generated from ${$} template
+${L}
 
 import { workflowSpec } from '@contractspec/lib.contracts-spec/workflow';
 
-export const ${toCamelCase(composed.meta.key)}Workflow = workflowSpec({
+export const ${e1(Z.meta.key)}Workflow = workflowSpec({
   meta: {
-    key: '${composed.meta.key}',
-    version: ${composed.meta.version},${composed.meta.description ? `
-    description: '${composed.meta.description}',` : ""}
+    key: '${Z.meta.key}',
+    version: ${Z.meta.version},${Z.meta.description?`
+    description: '${Z.meta.description}',`:""}
   },
-  start: '${composed.start}',
+  start: '${Z.start}',
   steps: [
-${stepsCode}
-  ],${composed.context ? `
-  context: ${JSON.stringify(composed.context, null, 2)},` : ""}
+${A}
+  ],${Z.context?`
+  context: ${JSON.stringify(Z.context,null,2)},`:""}
 });
-`;
-  }, [workflow, extensions, templateId]);
-  return {
-    workflow,
-    baseWorkflows,
-    extensions,
-    selectWorkflow,
-    addExtension,
-    removeExtension,
-    compose,
-    generateSpecCode,
-    loading,
-    error
-  };
-}
-function matchesScope(extension, scope) {
-  if (!scope)
-    return true;
-  if (extension.tenantId && extension.tenantId !== scope.tenantId) {
-    return false;
-  }
-  if (extension.role && extension.role !== scope.role) {
-    return false;
-  }
-  if (extension.device && extension.device !== scope.device) {
-    return false;
-  }
-  return true;
-}
-function applyExtension(workflow, extension) {
-  let steps = [...workflow.steps];
-  if (extension.hiddenSteps) {
-    steps = steps.filter((s) => !extension.hiddenSteps?.includes(s.id));
-  }
-  if (extension.customSteps) {
-    for (const injection of extension.customSteps) {
-      const stepToInject = {
-        ...injection.inject,
-        id: injection.id ?? injection.inject.id
-      };
-      if (injection.after) {
-        const afterIndex = steps.findIndex((s) => s.id === injection.after);
-        if (afterIndex !== -1) {
-          steps.splice(afterIndex + 1, 0, stepToInject);
-        }
-      } else if (injection.before) {
-        const beforeIndex = steps.findIndex((s) => s.id === injection.before);
-        if (beforeIndex !== -1) {
-          steps.splice(beforeIndex, 0, stepToInject);
-        }
-      } else {
-        steps.push(stepToInject);
-      }
-    }
-  }
-  return { ...workflow, steps };
-}
-function toCamelCase(str) {
-  return str.replace(/[^a-zA-Z0-9]+(.)/g, (_, c) => c.toUpperCase()).replace(/^./, (c) => c.toLowerCase());
-}
-function getTemplateWorkflows(templateId) {
-  const templateWorkflows = {
-    "crm-pipeline": [
-      {
-        meta: {
-          key: "deal.qualification",
-          version: "1.0.0",
-          description: "Deal qualification workflow"
-        },
-        start: "lead-received",
-        steps: [
-          {
-            id: "lead-received",
-            name: "Lead Received",
-            type: "action",
-            description: "New lead enters the pipeline",
-            next: "qualify-lead"
-          },
-          {
-            id: "qualify-lead",
-            name: "Qualify Lead",
-            type: "decision",
-            description: "Determine if lead meets qualification criteria",
-            next: ["qualified", "disqualified"],
-            condition: "lead.score >= threshold"
-          },
-          {
-            id: "qualified",
-            name: "Lead Qualified",
-            type: "action",
-            next: "assign-rep"
-          },
-          {
-            id: "disqualified",
-            name: "Lead Disqualified",
-            type: "end"
-          },
-          {
-            id: "assign-rep",
-            name: "Assign Sales Rep",
-            type: "action",
-            next: "complete"
-          },
-          {
-            id: "complete",
-            name: "Workflow Complete",
-            type: "end"
-          }
-        ]
-      },
-      {
-        meta: {
-          key: "deal.closing",
-          version: "1.0.0",
-          description: "Deal closing workflow"
-        },
-        start: "proposal-sent",
-        steps: [
-          {
-            id: "proposal-sent",
-            name: "Proposal Sent",
-            type: "action",
-            next: "wait-response"
-          },
-          {
-            id: "wait-response",
-            name: "Wait for Response",
-            type: "wait",
-            timeout: 604800000,
-            next: "negotiate",
-            onError: "follow-up"
-          },
-          {
-            id: "follow-up",
-            name: "Follow Up",
-            type: "action",
-            next: "wait-response",
-            retries: 3
-          },
-          {
-            id: "negotiate",
-            name: "Negotiation",
-            type: "action",
-            next: "finalize"
-          },
-          {
-            id: "finalize",
-            name: "Finalize Deal",
-            type: "decision",
-            next: ["won", "lost"],
-            condition: "deal.accepted"
-          },
-          {
-            id: "won",
-            name: "Deal Won",
-            type: "end"
-          },
-          {
-            id: "lost",
-            name: "Deal Lost",
-            type: "end"
-          }
-        ]
-      }
-    ],
-    "saas-boilerplate": [
-      {
-        meta: {
-          key: "user.onboarding",
-          version: "1.0.0",
-          description: "User onboarding workflow"
-        },
-        start: "signup",
-        steps: [
-          {
-            id: "signup",
-            name: "User Signup",
-            type: "action",
-            next: "verify-email"
-          },
-          {
-            id: "verify-email",
-            name: "Verify Email",
-            type: "wait",
-            timeout: 86400000,
-            next: "profile-setup",
-            onError: "resend-verification"
-          },
-          {
-            id: "resend-verification",
-            name: "Resend Verification",
-            type: "action",
-            next: "verify-email",
-            retries: 2
-          },
-          {
-            id: "profile-setup",
-            name: "Setup Profile",
-            type: "action",
-            next: "onboarding-tour"
-          },
-          {
-            id: "onboarding-tour",
-            name: "Onboarding Tour",
-            type: "action",
-            next: "complete"
-          },
-          {
-            id: "complete",
-            name: "Onboarding Complete",
-            type: "end"
-          }
-        ]
-      }
-    ],
-    "agent-console": [
-      {
-        meta: {
-          key: "agent.execution",
-          version: "1.0.0",
-          description: "Agent execution workflow"
-        },
-        start: "receive-task",
-        steps: [
-          {
-            id: "receive-task",
-            name: "Receive Task",
-            type: "action",
-            next: "plan-execution"
-          },
-          {
-            id: "plan-execution",
-            name: "Plan Execution",
-            type: "action",
-            next: "execute-steps"
-          },
-          {
-            id: "execute-steps",
-            name: "Execute Steps",
-            type: "parallel",
-            next: ["tool-call", "observe", "reason"]
-          },
-          {
-            id: "tool-call",
-            name: "Tool Call",
-            type: "action",
-            next: "evaluate"
-          },
-          {
-            id: "observe",
-            name: "Observe",
-            type: "action",
-            next: "evaluate"
-          },
-          {
-            id: "reason",
-            name: "Reason",
-            type: "action",
-            next: "evaluate"
-          },
-          {
-            id: "evaluate",
-            name: "Evaluate Result",
-            type: "decision",
-            condition: "task.isComplete",
-            next: ["complete", "execute-steps"]
-          },
-          {
-            id: "complete",
-            name: "Task Complete",
-            type: "end"
-          }
-        ]
-      }
-    ],
-    "todos-app": [
-      {
-        meta: {
-          key: "task.lifecycle",
-          version: "1.0.0",
-          description: "Task lifecycle workflow"
-        },
-        start: "created",
-        steps: [
-          {
-            id: "created",
-            name: "Task Created",
-            type: "action",
-            next: "in-progress"
-          },
-          {
-            id: "in-progress",
-            name: "In Progress",
-            type: "action",
-            next: "review"
-          },
-          {
-            id: "review",
-            name: "Review",
-            type: "decision",
-            condition: "task.approved",
-            next: ["done", "in-progress"]
-          },
-          {
-            id: "done",
-            name: "Done",
-            type: "end"
-          }
-        ]
-      }
-    ],
-    "messaging-app": [
-      {
-        meta: {
-          key: "message.delivery",
-          version: "1.0.0",
-          description: "Message delivery workflow"
-        },
-        start: "compose",
-        steps: [
-          {
-            id: "compose",
-            name: "Compose Message",
-            type: "action",
-            next: "send"
-          },
-          {
-            id: "send",
-            name: "Send Message",
-            type: "action",
-            next: "deliver"
-          },
-          {
-            id: "deliver",
-            name: "Deliver",
-            type: "decision",
-            condition: "recipient.online",
-            next: ["delivered", "queue"]
-          },
-          {
-            id: "queue",
-            name: "Queue for Delivery",
-            type: "wait",
-            next: "deliver"
-          },
-          {
-            id: "delivered",
-            name: "Message Delivered",
-            type: "action",
-            next: "read"
-          },
-          {
-            id: "read",
-            name: "Message Read",
-            type: "end"
-          }
-        ]
-      }
-    ],
-    "recipe-app-i18n": [
-      {
-        meta: {
-          key: "recipe.creation",
-          version: "1.0.0",
-          description: "Recipe creation workflow"
-        },
-        start: "draft",
-        steps: [
-          {
-            id: "draft",
-            name: "Draft Recipe",
-            type: "action",
-            next: "add-ingredients"
-          },
-          {
-            id: "add-ingredients",
-            name: "Add Ingredients",
-            type: "action",
-            next: "add-steps"
-          },
-          {
-            id: "add-steps",
-            name: "Add Steps",
-            type: "action",
-            next: "review"
-          },
-          {
-            id: "review",
-            name: "Review Recipe",
-            type: "decision",
-            condition: "recipe.isComplete",
-            next: ["publish", "draft"]
-          },
-          {
-            id: "publish",
-            name: "Publish Recipe",
-            type: "end"
-          }
-        ]
-      }
-    ]
-  };
-  return templateWorkflows[templateId] ?? [];
-}
-// src/lib/component-registry.tsx
-import { useEffect as useEffect7, useState as useState9 } from "react";
-"use client";
-
-class TemplateComponentRegistry {
-  components = new Map;
-  listeners = new Set;
-  register(templateId, registration) {
-    this.components.set(templateId, registration);
-    this.listeners.forEach((l) => l(templateId));
-  }
-  get(templateId) {
-    return this.components.get(templateId);
-  }
-  subscribe(listener) {
-    this.listeners.add(listener);
-    return () => {
-      this.listeners.delete(listener);
-    };
-  }
-}
-var TEMPLATE_COMPONENT_REGISTRY_KEY = Symbol.for("@contractspec/lib.example-shared-ui/template-component-registry");
-function getTemplateComponentRegistrySingleton() {
-  const store = globalThis;
-  store[TEMPLATE_COMPONENT_REGISTRY_KEY] ??= new TemplateComponentRegistry;
-  return store[TEMPLATE_COMPONENT_REGISTRY_KEY];
-}
-var templateComponentRegistry = getTemplateComponentRegistrySingleton();
-function registerTemplateComponents(templateId, components) {
-  templateComponentRegistry.register(templateId, components);
-}
-function useTemplateComponents(templateId) {
-  const [components, setComponents] = useState9(() => templateComponentRegistry.get(templateId));
-  useEffect7(() => {
-    return templateComponentRegistry.subscribe((updatedId) => {
-      if (updatedId === templateId) {
-        setComponents(templateComponentRegistry.get(templateId));
-      }
-    });
-  }, [templateId]);
-  return components;
-}
-// src/utils/fetchPresentationData.ts
-async function fetchPresentationData(_presentationName, _templateId) {
-  throw new Error("fetchPresentationData is deprecated. Use fetchData from TemplateRuntimeContext.");
-}
-function hasPresentationDataFetcher(_presentationName) {
-  return false;
-}
-function getRegisteredPresentationFetchers() {
-  return [];
-}
-// src/index.ts
-import { MarkdownRenderer as MarkdownRenderer2 } from "@contractspec/lib.design-system";
-export {
-  useWorkflowComposer,
-  useTemplateRuntime,
-  useTemplateComponents,
-  useSpecContent,
-  useRegistryTemplates,
-  useOverlayContext,
-  useIsInOverlayContext,
-  useEvolution,
-  useBehaviorTracking,
-  templateComponentRegistry,
-  registerTemplateComponents,
-  hasPresentationDataFetcher,
-  getRegisteredPresentationFetchers,
-  generateSpecFromTemplate,
-  fetchPresentationData,
-  TemplateShell,
-  TemplateRuntimeContext,
-  TemplateComponentRegistry,
-  SpecEditorPanel,
-  SpecDrivenTemplateShell,
-  SaveToStudioButton,
-  PersonalizationInsights,
-  OverlayContextProvider,
-  MarkdownView,
-  MarkdownRenderer2 as MarkdownRenderer,
-  LocalDataIndicator,
-  EvolutionSidebar,
-  EvolutionDashboard
-};
+`},[Y,J,$]);return{workflow:Y,baseWorkflows:V,extensions:J,selectWorkflow:b,addExtension:W,removeExtension:Q,compose:F,generateSpecCode:H,loading:K,error:U}}function t1($,N){if(!N)return!0;if($.tenantId&&$.tenantId!==N.tenantId)return!1;if($.role&&$.role!==N.role)return!1;if($.device&&$.device!==N.device)return!1;return!0}function s1($,N){let q=[...$.steps];if(N.hiddenSteps)q=q.filter((J)=>!N.hiddenSteps?.includes(J.id));if(N.customSteps)for(let J of N.customSteps){let X={...J.inject,id:J.id??J.inject.id};if(J.after){let K=q.findIndex((z)=>z.id===J.after);if(K!==-1)q.splice(K+1,0,X)}else if(J.before){let K=q.findIndex((z)=>z.id===J.before);if(K!==-1)q.splice(K,0,X)}else q.push(X)}return{...$,steps:q}}function e1($){return $.replace(/[^a-zA-Z0-9]+(.)/g,(N,q)=>q.toUpperCase()).replace(/^./,(N)=>N.toLowerCase())}function $2($){return{"crm-pipeline":[{meta:{key:"deal.qualification",version:"1.0.0",description:"Deal qualification workflow"},start:"lead-received",steps:[{id:"lead-received",name:"Lead Received",type:"action",description:"New lead enters the pipeline",next:"qualify-lead"},{id:"qualify-lead",name:"Qualify Lead",type:"decision",description:"Determine if lead meets qualification criteria",next:["qualified","disqualified"],condition:"lead.score >= threshold"},{id:"qualified",name:"Lead Qualified",type:"action",next:"assign-rep"},{id:"disqualified",name:"Lead Disqualified",type:"end"},{id:"assign-rep",name:"Assign Sales Rep",type:"action",next:"complete"},{id:"complete",name:"Workflow Complete",type:"end"}]},{meta:{key:"deal.closing",version:"1.0.0",description:"Deal closing workflow"},start:"proposal-sent",steps:[{id:"proposal-sent",name:"Proposal Sent",type:"action",next:"wait-response"},{id:"wait-response",name:"Wait for Response",type:"wait",timeout:604800000,next:"negotiate",onError:"follow-up"},{id:"follow-up",name:"Follow Up",type:"action",next:"wait-response",retries:3},{id:"negotiate",name:"Negotiation",type:"action",next:"finalize"},{id:"finalize",name:"Finalize Deal",type:"decision",next:["won","lost"],condition:"deal.accepted"},{id:"won",name:"Deal Won",type:"end"},{id:"lost",name:"Deal Lost",type:"end"}]}],"saas-boilerplate":[{meta:{key:"user.onboarding",version:"1.0.0",description:"User onboarding workflow"},start:"signup",steps:[{id:"signup",name:"User Signup",type:"action",next:"verify-email"},{id:"verify-email",name:"Verify Email",type:"wait",timeout:86400000,next:"profile-setup",onError:"resend-verification"},{id:"resend-verification",name:"Resend Verification",type:"action",next:"verify-email",retries:2},{id:"profile-setup",name:"Setup Profile",type:"action",next:"onboarding-tour"},{id:"onboarding-tour",name:"Onboarding Tour",type:"action",next:"complete"},{id:"complete",name:"Onboarding Complete",type:"end"}]}],"agent-console":[{meta:{key:"agent.execution",version:"1.0.0",description:"Agent execution workflow"},start:"receive-task",steps:[{id:"receive-task",name:"Receive Task",type:"action",next:"plan-execution"},{id:"plan-execution",name:"Plan Execution",type:"action",next:"execute-steps"},{id:"execute-steps",name:"Execute Steps",type:"parallel",next:["tool-call","observe","reason"]},{id:"tool-call",name:"Tool Call",type:"action",next:"evaluate"},{id:"observe",name:"Observe",type:"action",next:"evaluate"},{id:"reason",name:"Reason",type:"action",next:"evaluate"},{id:"evaluate",name:"Evaluate Result",type:"decision",condition:"task.isComplete",next:["complete","execute-steps"]},{id:"complete",name:"Task Complete",type:"end"}]}],"todos-app":[{meta:{key:"task.lifecycle",version:"1.0.0",description:"Task lifecycle workflow"},start:"created",steps:[{id:"created",name:"Task Created",type:"action",next:"in-progress"},{id:"in-progress",name:"In Progress",type:"action",next:"review"},{id:"review",name:"Review",type:"decision",condition:"task.approved",next:["done","in-progress"]},{id:"done",name:"Done",type:"end"}]}],"messaging-app":[{meta:{key:"message.delivery",version:"1.0.0",description:"Message delivery workflow"},start:"compose",steps:[{id:"compose",name:"Compose Message",type:"action",next:"send"},{id:"send",name:"Send Message",type:"action",next:"deliver"},{id:"deliver",name:"Deliver",type:"decision",condition:"recipient.online",next:["delivered","queue"]},{id:"queue",name:"Queue for Delivery",type:"wait",next:"deliver"},{id:"delivered",name:"Message Delivered",type:"action",next:"read"},{id:"read",name:"Message Read",type:"end"}]}],"recipe-app-i18n":[{meta:{key:"recipe.creation",version:"1.0.0",description:"Recipe creation workflow"},start:"draft",steps:[{id:"draft",name:"Draft Recipe",type:"action",next:"add-ingredients"},{id:"add-ingredients",name:"Add Ingredients",type:"action",next:"add-steps"},{id:"add-steps",name:"Add Steps",type:"action",next:"review"},{id:"review",name:"Review Recipe",type:"decision",condition:"recipe.isComplete",next:["publish","draft"]},{id:"publish",name:"Publish Recipe",type:"end"}]}]}[$]??[]}import{useEffect as N2,useState as q2}from"react";class s0{components=new Map;listeners=new Set;register($,N){this.components.set($,N),this.listeners.forEach((q)=>q($))}get($){return this.components.get($)}subscribe($){return this.listeners.add($),()=>{this.listeners.delete($)}}}var t0=Symbol.for("@contractspec/lib.example-shared-ui/template-component-registry");function P2(){let $=globalThis;return $[t0]??=new s0,$[t0]}var V0=P2();function m4($,N){V0.register($,N)}function l4($){let[N,q]=q2(()=>V0.get($));return N2(()=>{return V0.subscribe((J)=>{if(J===$)q(V0.get($))})},[$]),N}async function o4($,N){throw Error("fetchPresentationData is deprecated. Use fetchData from TemplateRuntimeContext.")}function a4($){return!1}function t4(){return[]}import{MarkdownRenderer as J3}from"@contractspec/lib.design-system";export{y4 as useWorkflowComposer,r as useTemplateRuntime,l4 as useTemplateComponents,o0 as useSpecContent,I4 as useRegistryTemplates,u2 as useOverlayContext,d2 as useIsInOverlayContext,q0 as useEvolution,p0 as useBehaviorTracking,V0 as templateComponentRegistry,m4 as registerTemplateComponents,a4 as hasPresentationDataFetcher,t4 as getRegisteredPresentationFetchers,e as generateSpecFromTemplate,o4 as fetchPresentationData,L4 as TemplateShell,f1 as TemplateRuntimeContext,s0 as TemplateComponentRegistry,h4 as SpecEditorPanel,V4 as SpecDrivenTemplateShell,z0 as SaveToStudioButton,N4 as PersonalizationInsights,p2 as OverlayContextProvider,i2 as MarkdownView,J3 as MarkdownRenderer,P0 as LocalDataIndicator,U2 as EvolutionSidebar,K2 as EvolutionDashboard};