@contractspec/bundle.library 1.12.0 → 1.13.0

package/dist/node/presentation/features/index.js

@@ -0,0 +1,3059 @@
+// src/features/docs/docs.contracts.ts
+import {
+  DocSummaryModel,
+  DocsIndexInput,
+  DocsIndexOutput,
+  DocsIndexQuery,
+  DocsIndexQuery as DocsIndexQuery2,
+  ContractReferenceQuery
+} from "@contractspec/lib.contracts/docs";
+// src/features/contracts-registry.ts
+import {
+  OperationSpecRegistry,
+  EventRegistry
+} from "@contractspec/lib.contracts";
+import { PresentationRegistry } from "@contractspec/lib.contracts/presentations";
+import { DataViewRegistry } from "@contractspec/lib.contracts/data-views";
+import { FormRegistry } from "@contractspec/lib.contracts/forms";
+import {
+  serializeOperationSpec,
+  serializeEventSpec,
+  serializePresentationSpec,
+  serializeDataViewSpec,
+  serializeFormSpec
+} from "@contractspec/lib.contracts/serialization";
+import {
+  ContractReferenceDataView,
+  ContractReferenceQuery as ContractReferenceQuery2,
+  DocsGeneratedEvent,
+  DocsGenerateCommand,
+  DocsIndexDataView,
+  DocsIndexQuery as DocsIndexQuery3,
+  DocsLayoutPresentation,
+  DocsPublishedEvent,
+  DocsPublishCommand,
+  DocsReferencePagePresentation,
+  DocsSearchForm,
+  ExampleCatalogDataView
+} from "@contractspec/lib.contracts/docs";
+var operationRegistry = null;
+function createContractSpecOperationRegistry() {
+  const registry = new OperationSpecRegistry;
+  registry.register(DocsIndexQuery3).register(ContractReferenceQuery2).register(DocsGenerateCommand).register(DocsPublishCommand);
+  return registry;
+}
+function getContractSpecOperationRegistry() {
+  if (!operationRegistry) {
+    operationRegistry = createContractSpecOperationRegistry();
+  }
+  return operationRegistry;
+}
+function resolveOperationSpec(key, version) {
+  return getContractSpecOperationRegistry().get(key, version);
+}
+var eventRegistry = null;
+function createContractSpecEventRegistry() {
+  const registry = new EventRegistry;
+  registry.register(DocsGeneratedEvent).register(DocsPublishedEvent);
+  return registry;
+}
+function getContractSpecEventRegistry() {
+  if (!eventRegistry) {
+    eventRegistry = createContractSpecEventRegistry();
+  }
+  return eventRegistry;
+}
+function resolveEventSpec(key, version) {
+  return getContractSpecEventRegistry().get(key, version);
+}
+var presentationRegistry = null;
+function createContractSpecPresentationRegistry() {
+  const registry = new PresentationRegistry;
+  registry.register(DocsLayoutPresentation).register(DocsReferencePagePresentation);
+  return registry;
+}
+function getContractSpecPresentationRegistry() {
+  if (!presentationRegistry) {
+    presentationRegistry = createContractSpecPresentationRegistry();
+  }
+  return presentationRegistry;
+}
+function resolvePresentationSpec(key, version) {
+  return getContractSpecPresentationRegistry().get(key, version);
+}
+var dataViewRegistry = null;
+function createContractSpecDataViewRegistry() {
+  const registry = new DataViewRegistry;
+  registry.register(DocsIndexDataView).register(ContractReferenceDataView).register(ExampleCatalogDataView);
+  return registry;
+}
+function getContractSpecDataViewRegistry() {
+  if (!dataViewRegistry) {
+    dataViewRegistry = createContractSpecDataViewRegistry();
+  }
+  return dataViewRegistry;
+}
+function resolveDataViewSpec(key, version) {
+  return getContractSpecDataViewRegistry().get(key, version);
+}
+var formRegistry = null;
+function createContractSpecFormRegistry() {
+  const registry = new FormRegistry;
+  registry.register(DocsSearchForm);
+  return registry;
+}
+function getContractSpecFormRegistry() {
+  if (!formRegistry) {
+    formRegistry = createContractSpecFormRegistry();
+  }
+  return formRegistry;
+}
+function resolveFormSpec(key, _version) {
+  return getContractSpecFormRegistry().get(key);
+}
+function resolveSerializedOperationSpec(key, version) {
+  const spec = resolveOperationSpec(key, version);
+  return serializeOperationSpec(spec) ?? undefined;
+}
+function resolveSerializedEventSpec(key, version) {
+  const spec = resolveEventSpec(key, version);
+  return serializeEventSpec(spec) ?? undefined;
+}
+function resolveSerializedPresentationSpec(key, version) {
+  const spec = resolvePresentationSpec(key, version);
+  return serializePresentationSpec(spec) ?? undefined;
+}
+function resolveSerializedDataViewSpec(key, version) {
+  const spec = resolveDataViewSpec(key, version);
+  return serializeDataViewSpec(spec) ?? undefined;
+}
+function resolveSerializedFormSpec(key, version) {
+  const spec = resolveFormSpec(key, version);
+  return serializeFormSpec(spec) ?? undefined;
+}
+function resetContractSpecOperationRegistry() {
+  operationRegistry = null;
+}
+function resetContractSpecEventRegistry() {
+  eventRegistry = null;
+}
+function resetContractSpecPresentationRegistry() {
+  presentationRegistry = null;
+}
+function resetContractSpecDataViewRegistry() {
+  dataViewRegistry = null;
+}
+function resetContractSpecFormRegistry() {
+  formRegistry = null;
+}
+function resetAllContractSpecRegistries() {
+  resetContractSpecOperationRegistry();
+  resetContractSpecEventRegistry();
+  resetContractSpecPresentationRegistry();
+  resetContractSpecDataViewRegistry();
+  resetContractSpecFormRegistry();
+}
+
+// src/features/docs.feature.ts
+var DocsFeature = {
+  meta: {
+    key: "contractspec.docs",
+    version: "1.0.0",
+    title: "Documentation",
+    description: "Comprehensive documentation system for ContractSpec",
+    domain: "platform",
+    owners: ["@platform.docs"],
+    tags: ["documentation", "guides", "api-reference"],
+    stability: "stable"
+  },
+  operations: [
+    { key: "docs.search", version: "1.0.0" },
+    { key: "docs.navigate", version: "1.0.0" }
+  ],
+  events: [
+    { key: "docs.page_viewed", version: "1.0.0" },
+    { key: "docs.search_performed", version: "1.0.0" }
+  ],
+  presentations: [
+    { key: "docs.landing", version: "1.0.0" },
+    { key: "docs.getting-started", version: "1.0.0" },
+    { key: "docs.architecture", version: "1.0.0" }
+  ],
+  capabilities: {
+    provides: [{ key: "contracts.docs", version: "1.0.0" }],
+    requires: []
+  }
+};
+
+// src/features/mcp.feature.ts
+var MCPFeature = {
+  meta: {
+    key: "contractspec.mcp",
+    version: "1.0.0",
+    title: "MCP Integration",
+    description: "Model Context Protocol server for AI agent integration",
+    domain: "platform",
+    owners: ["@platform.mcp"],
+    tags: ["mcp", "ai-agents", "tooling"],
+    stability: "beta"
+  },
+  operations: [
+    { key: "mcp.tool.register", version: "1.0.0" },
+    { key: "mcp.resource.register", version: "1.0.0" },
+    { key: "mcp.prompt.register", version: "1.0.0" }
+  ],
+  events: [
+    { key: "mcp.tool_invoked", version: "1.0.0" },
+    { key: "mcp.resource_accessed", version: "1.0.0" }
+  ],
+  presentations: [],
+  capabilities: {
+    provides: [{ key: "contracts.mcp", version: "1.0.0" }],
+    requires: [{ key: "contracts.operations", version: "1.0.0" }]
+  }
+};
+
+// src/features/presentations.feature.ts
+var PresentationsFeature = {
+  meta: {
+    key: "contractspec.presentations",
+    version: "1.0.0",
+    title: "Presentation Runtime",
+    description: "Cross-platform rendering of contract-driven UI",
+    domain: "platform",
+    owners: ["@platform.presentations"],
+    tags: ["presentations", "ui", "rendering", "cross-platform"],
+    stability: "beta"
+  },
+  operations: [
+    { key: "presentation.render", version: "1.0.0" },
+    { key: "presentation.transform", version: "1.0.0" }
+  ],
+  events: [
+    { key: "presentation.rendered", version: "1.0.0" },
+    { key: "presentation.transformed", version: "1.0.0" }
+  ],
+  presentations: [
+    { key: "form.standard", version: "1.0.0" },
+    { key: "list.standard", version: "1.0.0" },
+    { key: "detail.standard", version: "1.0.0" }
+  ],
+  capabilities: {
+    provides: [{ key: "contracts.presentations", version: "1.0.0" }],
+    requires: []
+  }
+};
+
+// src/features/registry.ts
+import { FeatureRegistry } from "@contractspec/lib.contracts/features";
+import { AppConfigFeature } from "@contractspec/lib.contracts/app-config";
+function createContractSpecFeatureRegistry() {
+  const features = new FeatureRegistry;
+  features.register(DocsFeature);
+  features.register(MCPFeature);
+  features.register(PresentationsFeature);
+  features.register(AppConfigFeature);
+  return features;
+}
+var registryInstance = null;
+function getContractSpecFeatureRegistry() {
+  if (!registryInstance) {
+    registryInstance = createContractSpecFeatureRegistry();
+  }
+  return registryInstance;
+}
+function resetContractSpecFeatureRegistry() {
+  registryInstance = null;
+}
+
+// src/features/index.ts
+import { FeatureRegistry as FeatureRegistry2 } from "@contractspec/lib.contracts/features";
+
+// src/presentation/features/atoms/FeatureIcon/FeatureIcon.tsx
+import * as React from "react";
+import {
+  FileText,
+  Boxes,
+  Settings,
+  Globe,
+  Shield,
+  Database,
+  MessageSquare,
+  Layout,
+  Workflow
+} from "lucide-react";
+import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+var domainIconMap = {
+  platform: Settings,
+  documentation: FileText,
+  docs: FileText,
+  integration: Workflow,
+  api: Globe,
+  security: Shield,
+  data: Database,
+  messaging: MessageSquare,
+  ui: Layout,
+  presentation: Layout
+};
+var tagIconMap = {
+  documentation: FileText,
+  guides: FileText,
+  "api-reference": Globe,
+  presentations: Layout,
+  ui: Layout,
+  rendering: Layout,
+  mcp: Workflow,
+  integration: Workflow,
+  security: Shield,
+  auth: Shield,
+  data: Database,
+  storage: Database
+};
+var stabilityToneMap = {
+  stable: "success",
+  beta: "warning",
+  experimental: "info",
+  deprecated: "danger"
+};
+var sizeClasses = {
+  sm: "h-4 w-4",
+  md: "h-5 w-5",
+  lg: "h-6 w-6"
+};
+function FeatureIcon({
+  domain,
+  tags = [],
+  stability,
+  icon: IconOverride,
+  size = "md",
+  className
+}) {
+  const Icon = React.useMemo(() => {
+    if (IconOverride)
+      return IconOverride;
+    if (domain) {
+      const domainIcon = domainIconMap[domain.toLowerCase()];
+      if (domainIcon)
+        return domainIcon;
+    }
+    for (const tag of tags) {
+      const tagIcon = tagIconMap[tag.toLowerCase()];
+      if (tagIcon)
+        return tagIcon;
+    }
+    return Boxes;
+  }, [domain, tags, IconOverride]);
+  const tone = stability ? stabilityToneMap[stability] || "primary" : "primary";
+  const toneClasses = {
+    success: "text-emerald-600 dark:text-emerald-400",
+    warning: "text-amber-600 dark:text-amber-400",
+    info: "text-blue-600 dark:text-blue-400",
+    danger: "text-red-600 dark:text-red-400",
+    primary: "text-primary"
+  };
+  return /* @__PURE__ */ jsxDEV(Icon, {
+    className: cn(sizeClasses[size], toneClasses[tone], className)
+  }, undefined, false, undefined, this);
+}
+function getFeatureIconTone(stability) {
+  if (!stability)
+    return "primary";
+  return stabilityToneMap[stability] || "primary";
+}
+// src/presentation/features/hooks/useFeatureRegistry.ts
+import { useMemo as useMemo2 } from "react";
+"use client";
+function useFeatureRegistry() {
+  const registry = useMemo2(() => getContractSpecFeatureRegistry(), []);
+  return useMemo2(() => {
+    const features = registry.list();
+    return {
+      features,
+      getFeature: (key) => registry.get(key),
+      getByTag: (tag) => registry.listByTag(tag),
+      getByOwner: (owner) => registry.listByOwner(owner),
+      getUniqueTags: () => registry.getUniqueTags(),
+      getUniqueDomains: () => {
+        const domains = new Set;
+        for (const f of features) {
+          if (f.meta.domain)
+            domains.add(f.meta.domain);
+        }
+        return [...domains].sort();
+      },
+      getUniqueStabilities: () => {
+        const stabilities = new Set;
+        for (const f of features) {
+          if (f.meta.stability)
+            stabilities.add(f.meta.stability);
+        }
+        return [...stabilities].sort();
+      }
+    };
+  }, [registry]);
+}
+
+// src/presentation/features/hooks/useFeatureFilters.ts
+import { useState, useMemo as useMemo3, useCallback } from "react";
+"use client";
+var defaultFilters = {
+  search: "",
+  tags: [],
+  stability: [],
+  domain: []
+};
+function useFeatureFilters(features) {
+  const [filters, setFilters] = useState(defaultFilters);
+  const setSearch = useCallback((search) => {
+    setFilters((prev) => ({ ...prev, search }));
+  }, []);
+  const toggleTag = useCallback((tag) => {
+    setFilters((prev) => ({
+      ...prev,
+      tags: prev.tags.includes(tag) ? prev.tags.filter((t) => t !== tag) : [...prev.tags, tag]
+    }));
+  }, []);
+  const toggleStability = useCallback((stability) => {
+    setFilters((prev) => ({
+      ...prev,
+      stability: prev.stability.includes(stability) ? prev.stability.filter((s) => s !== stability) : [...prev.stability, stability]
+    }));
+  }, []);
+  const toggleDomain = useCallback((domain) => {
+    setFilters((prev) => ({
+      ...prev,
+      domain: prev.domain.includes(domain) ? prev.domain.filter((d) => d !== domain) : [...prev.domain, domain]
+    }));
+  }, []);
+  const clearFilters = useCallback(() => setFilters(defaultFilters), []);
+  const hasActiveFilters = useMemo3(() => {
+    return filters.search.length > 0 || filters.tags.length > 0 || filters.stability.length > 0 || filters.domain.length > 0;
+  }, [filters]);
+  const filteredFeatures = useMemo3(() => {
+    return features.filter((feature) => {
+      if (filters.search) {
+        const searchLower = filters.search.toLowerCase();
+        const title = feature.meta.title ?? "";
+        const matches = title.toLowerCase().includes(searchLower) || feature.meta.description?.toLowerCase().includes(searchLower) || feature.meta.key.toLowerCase().includes(searchLower);
+        if (!matches)
+          return false;
+      }
+      if (filters.tags.length > 0) {
+        const hasTag = filters.tags.some((tag) => feature.meta.tags?.includes(tag));
+        if (!hasTag)
+          return false;
+      }
+      if (filters.stability.length > 0) {
+        if (!filters.stability.includes(feature.meta.stability ?? "unknown"))
+          return false;
+      }
+      if (filters.domain.length > 0) {
+        if (!filters.domain.includes(feature.meta.domain ?? "unknown"))
+          return false;
+      }
+      return true;
+    });
+  }, [features, filters]);
+  return {
+    filters,
+    setSearch,
+    toggleTag,
+    toggleStability,
+    toggleDomain,
+    clearFilters,
+    filteredFeatures,
+    hasActiveFilters
+  };
+}
+
+// src/presentation/features/hooks/useContractsRegistry.ts
+import { useMemo as useMemo4 } from "react";
+"use client";
+function useContractsRegistry() {
+  const registry = useMemo4(() => getContractSpecOperationRegistry(), []);
+  return useMemo4(() => ({
+    resolveOperation: (ref) => resolveOperationSpec(ref.key, ref.version),
+    getOperationSpec: (key, version) => resolveOperationSpec(key, version),
+    listOperations: () => registry.list()
+  }), [registry]);
+}
+// src/presentation/features/hooks/useRelatedDocs.ts
+import { useMemo as useMemo5 } from "react";
+import { defaultDocRegistry } from "@contractspec/lib.contracts";
+"use client";
+function useRelatedDocs(key, tags) {
+  const docs2 = useMemo5(() => {
+    try {
+      const allDocs = defaultDocRegistry.list();
+      return allDocs.filter(({ block }) => {
+        const keyMatch = block.id.toLowerCase().includes(key.toLowerCase()) || block.title.toLowerCase().includes(key.toLowerCase());
+        const tagMatch = tags?.some((t) => block.tags?.some((bt) => bt.toLowerCase().includes(t.toLowerCase())));
+        return keyMatch || tagMatch;
+      }).map(({ block, route }) => ({
+        id: block.id,
+        title: block.title,
+        summary: block.summary,
+        route
+      }));
+    } catch (e) {
+      console.error("Failed to fetch related docs:", e);
+      return [];
+    }
+  }, [key, tags]);
+  return docs2;
+}
+
+// src/presentation/features/molecules/FeatureHoverPreview/FeatureHoverPreview.tsx
+import { StatusChip } from "@contractspec/lib.design-system";
+import { HStack } from "@contractspec/lib.ui-kit-web/ui/stack";
+import {
+  ArrowRight,
+  Layout as Layout2,
+  Radio,
+  Shield as Shield2,
+  Tag,
+  Users,
+  Zap
+} from "lucide-react";
+import { jsxDEV as jsxDEV2, Fragment } from "react/jsx-dev-runtime";
+"use client";
+function FeatureHoverPreview({ feature }) {
+  const { meta, operations, events, presentations, capabilities } = feature;
+  const hasCapabilities = capabilities?.provides?.length || capabilities?.requires?.length;
+  return /* @__PURE__ */ jsxDEV2(Fragment, {
+    children: [
+      meta.description && /* @__PURE__ */ jsxDEV2("p", {
+        className: "text-muted-foreground text-sm leading-relaxed",
+        children: meta.description
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV2(HStack, {
+        gap: "md",
+        className: "py-2",
+        children: [
+          operations?.length ? /* @__PURE__ */ jsxDEV2("div", {
+            className: "flex items-center gap-1.5 text-sm",
+            children: [
+              /* @__PURE__ */ jsxDEV2(Zap, {
+                className: "h-4 w-4 text-amber-500"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "font-medium",
+                children: operations.length
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground",
+                children: "ops"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this) : null,
+          events?.length ? /* @__PURE__ */ jsxDEV2("div", {
+            className: "flex items-center gap-1.5 text-sm",
+            children: [
+              /* @__PURE__ */ jsxDEV2(Radio, {
+                className: "h-4 w-4 text-blue-500"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "font-medium",
+                children: events.length
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground",
+                children: "events"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this) : null,
+          presentations?.length ? /* @__PURE__ */ jsxDEV2("div", {
+            className: "flex items-center gap-1.5 text-sm",
+            children: [
+              /* @__PURE__ */ jsxDEV2(Layout2, {
+                className: "h-4 w-4 text-purple-500"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "font-medium",
+                children: presentations.length
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground",
+                children: "views"
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      hasCapabilities && /* @__PURE__ */ jsxDEV2("div", {
+        className: "border-border/50 space-y-1.5 border-t pt-1",
+        children: [
+          capabilities?.provides?.length ? /* @__PURE__ */ jsxDEV2(HStack, {
+            gap: "xs",
+            wrap: "wrap",
+            className: "items-start",
+            children: [
+              /* @__PURE__ */ jsxDEV2(Shield2, {
+                className: "mt-0.5 h-3.5 w-3.5 text-emerald-500"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground text-xs",
+                children: "Provides:"
+              }, undefined, false, undefined, this),
+              capabilities.provides.slice(0, 2).map((cap) => /* @__PURE__ */ jsxDEV2(StatusChip, {
+                tone: "success",
+                label: cap.key,
+                size: "sm"
+              }, cap.key, false, undefined, this)),
+              capabilities.provides.length > 2 && /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground text-xs",
+                children: [
+                  "+",
+                  capabilities.provides.length - 2
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, undefined, true, undefined, this) : null,
+          capabilities?.requires?.length ? /* @__PURE__ */ jsxDEV2(HStack, {
+            gap: "xs",
+            wrap: "wrap",
+            className: "items-start",
+            children: [
+              /* @__PURE__ */ jsxDEV2(ArrowRight, {
+                className: "mt-0.5 h-3.5 w-3.5 text-blue-500"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground text-xs",
+                children: "Requires:"
+              }, undefined, false, undefined, this),
+              capabilities.requires.slice(0, 2).map((req) => /* @__PURE__ */ jsxDEV2(StatusChip, {
+                tone: "info",
+                label: req.key,
+                size: "sm"
+              }, req.key, false, undefined, this)),
+              capabilities.requires.length > 2 && /* @__PURE__ */ jsxDEV2("span", {
+                className: "text-muted-foreground text-xs",
+                children: [
+                  "+",
+                  capabilities.requires.length - 2
+                ]
+              }, undefined, true, undefined, this)
+            ]
+          }, undefined, true, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      meta.tags?.length ? /* @__PURE__ */ jsxDEV2(HStack, {
+        gap: "xs",
+        wrap: "wrap",
+        className: "border-border/50 items-center border-t pt-1",
+        children: [
+          /* @__PURE__ */ jsxDEV2(Tag, {
+            className: "text-muted-foreground h-3.5 w-3.5"
+          }, undefined, false, undefined, this),
+          meta.tags.slice(0, 4).map((tag) => /* @__PURE__ */ jsxDEV2("span", {
+            className: "bg-muted text-muted-foreground rounded px-1.5 py-0.5 text-xs",
+            children: [
+              "#",
+              tag
+            ]
+          }, tag, true, undefined, this)),
+          meta.tags.length > 4 && /* @__PURE__ */ jsxDEV2("span", {
+            className: "text-muted-foreground text-xs",
+            children: [
+              "+",
+              meta.tags.length - 4
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this) : null,
+      meta.owners?.length ? /* @__PURE__ */ jsxDEV2(HStack, {
+        gap: "xs",
+        className: "text-muted-foreground items-center text-xs",
+        children: [
+          /* @__PURE__ */ jsxDEV2(Users, {
+            className: "h-3.5 w-3.5"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV2("span", {
+            children: meta.owners.join(", ")
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this) : null
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/molecules/FeatureCard/FeatureCard.tsx
+import { EntityCard, StatusChip as StatusChip2 } from "@contractspec/lib.design-system";
+import { HStack as HStack2 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { Zap as Zap2, Radio as Radio2, Layout as Layout3, Shield as Shield3 } from "lucide-react";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+"use client";
+var stabilityTone = {
+  stable: "success",
+  beta: "warning",
+  experimental: "info",
+  deprecated: "danger"
+};
+function FeatureCard({
+  feature,
+  onSelect,
+  className
+}) {
+  const { meta, operations, events, presentations, capabilities } = feature;
+  const tone = stabilityTone[meta.stability] ?? "neutral";
+  const iconTone = getFeatureIconTone(meta.stability);
+  const emphasis = meta.stability === "stable" ? "strong" : "default";
+  const handleClick = onSelect ? () => onSelect(feature) : undefined;
+  const hasCapabilities = capabilities?.provides?.length || capabilities?.requires?.length;
+  return /* @__PURE__ */ jsxDEV3(EntityCard, {
+    cardTitle: meta.title,
+    cardSubtitle: meta.key,
+    className,
+    onClick: handleClick,
+    emphasis,
+    icon: /* @__PURE__ */ jsxDEV3(FeatureIcon, {
+      domain: meta.domain,
+      tags: meta.tags,
+      stability: meta.stability,
+      size: "md"
+    }, undefined, false, undefined, this),
+    iconTone,
+    chips: /* @__PURE__ */ jsxDEV3(StatusChip2, {
+      tone,
+      label: meta.stability ?? "unknown",
+      size: "sm"
+    }, undefined, false, undefined, this),
+    meta: meta.description ? /* @__PURE__ */ jsxDEV3("span", {
+      className: "text-muted-foreground line-clamp-2 text-sm",
+      children: meta.description
+    }, undefined, false, undefined, this) : undefined,
+    preview: /* @__PURE__ */ jsxDEV3(FeatureHoverPreview, {
+      feature
+    }, undefined, false, undefined, this),
+    footer: /* @__PURE__ */ jsxDEV3(HStack2, {
+      gap: "md",
+      className: "text-muted-foreground w-full justify-between text-xs",
+      children: [
+        /* @__PURE__ */ jsxDEV3(HStack2, {
+          gap: "sm",
+          children: [
+            operations?.length ? /* @__PURE__ */ jsxDEV3("span", {
+              className: "flex items-center gap-1",
+              children: [
+                /* @__PURE__ */ jsxDEV3(Zap2, {
+                  className: "h-3 w-3 text-amber-500"
+                }, undefined, false, undefined, this),
+                operations.length
+              ]
+            }, undefined, true, undefined, this) : null,
+            events?.length ? /* @__PURE__ */ jsxDEV3("span", {
+              className: "flex items-center gap-1",
+              children: [
+                /* @__PURE__ */ jsxDEV3(Radio2, {
+                  className: "h-3 w-3 text-blue-500"
+                }, undefined, false, undefined, this),
+                events.length
+              ]
+            }, undefined, true, undefined, this) : null,
+            presentations?.length ? /* @__PURE__ */ jsxDEV3("span", {
+              className: "flex items-center gap-1",
+              children: [
+                /* @__PURE__ */ jsxDEV3(Layout3, {
+                  className: "h-3 w-3 text-purple-500"
+                }, undefined, false, undefined, this),
+                presentations.length
+              ]
+            }, undefined, true, undefined, this) : null
+          ]
+        }, undefined, true, undefined, this),
+        hasCapabilities && /* @__PURE__ */ jsxDEV3("span", {
+          className: "flex items-center gap-1",
+          children: [
+            /* @__PURE__ */ jsxDEV3(Shield3, {
+              className: "h-3 w-3 text-emerald-500"
+            }, undefined, false, undefined, this),
+            (capabilities?.provides?.length ?? 0) + (capabilities?.requires?.length ?? 0)
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this)
+  }, undefined, false, undefined, this);
+}
+// src/presentation/features/molecules/FeatureFilters/FeatureFilters.tsx
+import { Button, Input } from "@contractspec/lib.design-system";
+import { VStack, HStack as HStack3 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureFiltersBar({
+  uniqueTags,
+  uniqueStabilities,
+  filters,
+  setSearch,
+  toggleTag,
+  toggleStability,
+  clearFilters,
+  hasActiveFilters,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV4(VStack, {
+    gap: "md",
+    className: cn2("w-full", className),
+    children: [
+      /* @__PURE__ */ jsxDEV4(HStack3, {
+        gap: "md",
+        justify: "between",
+        className: "w-full",
+        children: [
+          /* @__PURE__ */ jsxDEV4(Input, {
+            placeholder: "Search features...",
+            value: filters.search,
+            onChange: (e) => setSearch(e.target.value),
+            className: "max-w-md",
+            "aria-label": "Search features"
+          }, undefined, false, undefined, this),
+          hasActiveFilters && /* @__PURE__ */ jsxDEV4(Button, {
+            variant: "ghost",
+            size: "sm",
+            onClick: clearFilters,
+            children: "Clear filters"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      uniqueStabilities.length > 0 && /* @__PURE__ */ jsxDEV4(HStack3, {
+        gap: "xs",
+        wrap: "wrap",
+        children: [
+          /* @__PURE__ */ jsxDEV4("span", {
+            className: "text-muted-foreground text-sm",
+            children: "Stability:"
+          }, undefined, false, undefined, this),
+          uniqueStabilities.map((stability) => /* @__PURE__ */ jsxDEV4(Button, {
+            variant: filters.stability.includes(stability) ? "default" : "outline",
+            size: "sm",
+            onClick: () => toggleStability(stability),
+            "aria-pressed": filters.stability.includes(stability),
+            children: stability
+          }, stability, false, undefined, this))
+        ]
+      }, undefined, true, undefined, this),
+      uniqueTags.length > 0 && /* @__PURE__ */ jsxDEV4(HStack3, {
+        gap: "xs",
+        wrap: "wrap",
+        children: [
+          /* @__PURE__ */ jsxDEV4("span", {
+            className: "text-muted-foreground text-sm",
+            children: "Tags:"
+          }, undefined, false, undefined, this),
+          uniqueTags.slice(0, 10).map((tag) => /* @__PURE__ */ jsxDEV4(Button, {
+            variant: filters.tags.includes(tag) ? "default" : "outline",
+            size: "sm",
+            onClick: () => toggleTag(tag),
+            "aria-pressed": filters.tags.includes(tag),
+            children: [
+              "#",
+              tag
+            ]
+          }, tag, true, undefined, this)),
+          uniqueTags.length > 10 && /* @__PURE__ */ jsxDEV4("span", {
+            className: "text-muted-foreground text-sm",
+            children: [
+              "+",
+              uniqueTags.length - 10,
+              " more"
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/molecules/FeatureCategoryHeader/FeatureCategoryHeader.tsx
+import { cn as cn3 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { ChevronDown, Boxes as Boxes2 } from "lucide-react";
+import { HStack as HStack4 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { StatusChip as StatusChip3 } from "@contractspec/lib.design-system";
+import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureCategoryHeader({
+  title,
+  count,
+  icon,
+  isCollapsed = false,
+  onToggle,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV5("button", {
+    type: "button",
+    onClick: onToggle,
+    className: cn3("flex w-full items-center justify-between rounded-lg px-4 py-3", "bg-muted/30 hover:bg-muted/50 transition-colors", "group cursor-pointer", className),
+    children: [
+      /* @__PURE__ */ jsxDEV5(HStack4, {
+        gap: "sm",
+        className: "items-center",
+        children: [
+          /* @__PURE__ */ jsxDEV5("div", {
+            className: "text-muted-foreground group-hover:text-foreground transition-colors",
+            children: icon || /* @__PURE__ */ jsxDEV5(Boxes2, {
+              className: "h-5 w-5"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV5("span", {
+            className: "group-hover:text-primary text-lg font-semibold capitalize transition-colors",
+            children: title
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV5(StatusChip3, {
+            tone: "neutral",
+            label: `${count} ${count === 1 ? "feature" : "features"}`,
+            size: "sm"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV5(ChevronDown, {
+        className: cn3("text-muted-foreground h-5 w-5 transition-transform duration-200", isCollapsed && "-rotate-90")
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/organisms/FeatureDiscovery/FeatureDiscovery.tsx
+import * as React2 from "react";
+import {
+  PageHeaderResponsive,
+  EmptyState,
+  Button as Button2,
+  StatusChip as StatusChip4
+} from "@contractspec/lib.design-system";
+import { VStack as VStack2, HStack as HStack5 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn4 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { LayoutGrid, List, Star } from "lucide-react";
+import { jsxDEV as jsxDEV6 } from "react/jsx-dev-runtime";
+"use client";
+function groupFeaturesByDomain(features) {
+  const groups = {};
+  for (const feature of features) {
+    const domain = feature.meta.domain || "Other";
+    if (!groups[domain])
+      groups[domain] = [];
+    groups[domain].push(feature);
+  }
+  return groups;
+}
+function groupFeaturesByStability(features) {
+  const order = ["stable", "beta", "experimental", "deprecated", "unknown"];
+  const groups = {};
+  for (const feature of features) {
+    const stability = feature.meta.stability || "unknown";
+    if (!groups[stability])
+      groups[stability] = [];
+    groups[stability].push(feature);
+  }
+  const sorted = {};
+  for (const key of order) {
+    if (groups[key])
+      sorted[key] = groups[key];
+  }
+  return sorted;
+}
+function FeatureDiscovery({
+  onSelectFeature,
+  className,
+  defaultViewMode = "grid",
+  groupBy = "domain",
+  showFeatured = true
+}) {
+  const { features, getUniqueTags, getUniqueStabilities } = useFeatureRegistry();
+  const {
+    filters,
+    setSearch,
+    toggleTag,
+    toggleStability,
+    clearFilters,
+    filteredFeatures,
+    hasActiveFilters
+  } = useFeatureFilters(features);
+  const uniqueTags = getUniqueTags();
+  const uniqueStabilities = getUniqueStabilities();
+  const [viewMode, setViewMode] = React2.useState(defaultViewMode);
+  const [collapsedGroups, setCollapsedGroups] = React2.useState(new Set);
+  const featuredFeatures = React2.useMemo(() => filteredFeatures.filter((f) => f.meta.stability === "stable"), [filteredFeatures]);
+  const nonFeaturedFeatures = React2.useMemo(() => showFeatured ? filteredFeatures.filter((f) => f.meta.stability !== "stable") : filteredFeatures, [filteredFeatures, showFeatured]);
+  const groupedFeatures = React2.useMemo(() => {
+    if (groupBy === "none")
+      return null;
+    if (groupBy === "domain")
+      return groupFeaturesByDomain(nonFeaturedFeatures);
+    return groupFeaturesByStability(nonFeaturedFeatures);
+  }, [nonFeaturedFeatures, groupBy]);
+  const toggleGroup = (group) => {
+    setCollapsedGroups((prev) => {
+      const next = new Set(prev);
+      if (next.has(group)) {
+        next.delete(group);
+      } else {
+        next.add(group);
+      }
+      return next;
+    });
+  };
+  const gridClasses = viewMode === "grid" ? "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3" : "flex flex-col gap-3";
+  const renderFeatureCards = (featureList) => /* @__PURE__ */ jsxDEV6("div", {
+    className: gridClasses,
+    children: featureList.map((feature) => /* @__PURE__ */ jsxDEV6(FeatureCard, {
+      feature,
+      onSelect: onSelectFeature
+    }, feature.meta.key, false, undefined, this))
+  }, undefined, false, undefined, this);
+  return /* @__PURE__ */ jsxDEV6(VStack2, {
+    gap: "lg",
+    className: cn4("w-full p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV6("div", {
+        className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
+        children: [
+          /* @__PURE__ */ jsxDEV6(PageHeaderResponsive, {
+            title: "Feature Discovery",
+            subtitle: `Browse ${features.length} available ContractSpec features`
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV6(HStack5, {
+            gap: "xs",
+            children: [
+              /* @__PURE__ */ jsxDEV6("button", {
+                type: "button",
+                onClick: () => setViewMode("grid"),
+                className: cn4("rounded-md p-2 transition-colors", viewMode === "grid" ? "bg-primary text-primary-foreground" : "bg-muted hover:bg-muted/80 text-muted-foreground"),
+                "aria-label": "Grid view",
+                children: /* @__PURE__ */ jsxDEV6(LayoutGrid, {
+                  className: "h-4 w-4"
+                }, undefined, false, undefined, this)
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV6("button", {
+                type: "button",
+                onClick: () => setViewMode("list"),
+                className: cn4("rounded-md p-2 transition-colors", viewMode === "list" ? "bg-primary text-primary-foreground" : "bg-muted hover:bg-muted/80 text-muted-foreground"),
+                "aria-label": "List view",
+                children: /* @__PURE__ */ jsxDEV6(List, {
+                  className: "h-4 w-4"
+                }, undefined, false, undefined, this)
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV6(FeatureFiltersBar, {
+        uniqueTags,
+        uniqueStabilities,
+        filters,
+        setSearch,
+        toggleTag,
+        toggleStability,
+        clearFilters,
+        hasActiveFilters
+      }, undefined, false, undefined, this),
+      filteredFeatures.length === 0 ? /* @__PURE__ */ jsxDEV6(EmptyState, {
+        title: "No features found",
+        description: hasActiveFilters ? "Try adjusting your search or filters" : "No features are registered yet",
+        primaryAction: hasActiveFilters ? /* @__PURE__ */ jsxDEV6(Button2, {
+          variant: "outline",
+          onClick: clearFilters,
+          children: "Clear filters"
+        }, undefined, false, undefined, this) : undefined
+      }, undefined, false, undefined, this) : /* @__PURE__ */ jsxDEV6(VStack2, {
+        gap: "lg",
+        children: [
+          showFeatured && featuredFeatures.length > 0 && /* @__PURE__ */ jsxDEV6(VStack2, {
+            gap: "sm",
+            children: [
+              /* @__PURE__ */ jsxDEV6(HStack5, {
+                gap: "sm",
+                className: "items-center",
+                children: [
+                  /* @__PURE__ */ jsxDEV6(Star, {
+                    className: "h-5 w-5 fill-amber-500 text-amber-500"
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ jsxDEV6("span", {
+                    className: "text-lg font-semibold",
+                    children: "Featured"
+                  }, undefined, false, undefined, this),
+                  /* @__PURE__ */ jsxDEV6(StatusChip4, {
+                    tone: "success",
+                    label: `${featuredFeatures.length} stable`,
+                    size: "sm"
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              renderFeatureCards(featuredFeatures)
+            ]
+          }, undefined, true, undefined, this),
+          groupedFeatures ? /* @__PURE__ */ jsxDEV6(VStack2, {
+            gap: "md",
+            children: Object.entries(groupedFeatures).map(([group, groupFeatures]) => /* @__PURE__ */ jsxDEV6(VStack2, {
+              gap: "sm",
+              children: [
+                /* @__PURE__ */ jsxDEV6(FeatureCategoryHeader, {
+                  title: group,
+                  count: groupFeatures.length,
+                  isCollapsed: collapsedGroups.has(group),
+                  onToggle: () => toggleGroup(group)
+                }, undefined, false, undefined, this),
+                !collapsedGroups.has(group) && renderFeatureCards(groupFeatures)
+              ]
+            }, group, true, undefined, this))
+          }, undefined, false, undefined, this) : renderFeatureCards(nonFeaturedFeatures)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/organisms/FeatureDetail/FeatureDetail.tsx
+import {
+  StatCard,
+  StatCardGroup,
+  StatusChip as StatusChip5
+} from "@contractspec/lib.design-system";
+import { Box, HStack as HStack6, VStack as VStack3 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn5 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import Link from "next/link";
+import { jsxDEV as jsxDEV7 } from "react/jsx-dev-runtime";
+"use client";
+var stabilityTone2 = {
+  stable: "success",
+  beta: "warning",
+  experimental: "info",
+  deprecated: "danger"
+};
+function FeatureDetail({ feature, className }) {
+  const { meta, operations, events, presentations, capabilities } = feature;
+  const tone = stabilityTone2[meta.stability] ?? "neutral";
+  return /* @__PURE__ */ jsxDEV7(VStack3, {
+    gap: "lg",
+    className: cn5("w-full", className),
+    children: [
+      /* @__PURE__ */ jsxDEV7(HStack6, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV7(StatusChip5, {
+            tone,
+            label: meta.stability ?? "unknown"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(StatusChip5, {
+            tone: "neutral",
+            label: meta.key,
+            size: "sm"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(StatusChip5, {
+            tone: "neutral",
+            label: `v${meta.version}`,
+            size: "sm"
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV7(StatCardGroup, {
+        children: [
+          /* @__PURE__ */ jsxDEV7(Link, {
+            href: `./${feature.meta.key}/operations`,
+            children: /* @__PURE__ */ jsxDEV7(StatCard, {
+              label: "Operations",
+              value: operations?.length ?? 0
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(Link, {
+            href: `./${feature.meta.key}/events`,
+            children: /* @__PURE__ */ jsxDEV7(StatCard, {
+              label: "Events",
+              value: events?.length ?? 0
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(Link, {
+            href: `./${feature.meta.key}/presentations`,
+            children: /* @__PURE__ */ jsxDEV7(StatCard, {
+              label: "Presentations",
+              value: presentations?.length ?? 0
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      capabilities?.provides?.length ? /* @__PURE__ */ jsxDEV7(Box, {
+        className: "flex-col rounded-lg border p-4",
+        gap: "sm",
+        align: "start",
+        children: [
+          /* @__PURE__ */ jsxDEV7("span", {
+            className: "font-semibold",
+            children: "Provides Capabilities"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(HStack6, {
+            gap: "xs",
+            wrap: "wrap",
+            children: capabilities.provides.map((cap) => /* @__PURE__ */ jsxDEV7(StatusChip5, {
+              tone: "success",
+              label: `${cap.key} v${cap.version}`,
+              size: "sm"
+            }, `${cap.key}-${cap.version}`, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this) : null,
+      capabilities?.requires?.length ? /* @__PURE__ */ jsxDEV7(Box, {
+        className: "flex-col rounded-lg border p-4",
+        gap: "sm",
+        align: "start",
+        children: [
+          /* @__PURE__ */ jsxDEV7("span", {
+            className: "font-semibold",
+            children: "Requires Capabilities"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(HStack6, {
+            gap: "xs",
+            wrap: "wrap",
+            children: capabilities.requires.map((req) => /* @__PURE__ */ jsxDEV7(StatusChip5, {
+              tone: "info",
+              label: `${req.key}${req.version ? ` v${req.version}` : ""}${req.optional ? " (optional)" : ""}`,
+              size: "sm"
+            }, req.key, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this) : null,
+      meta.tags?.length ? /* @__PURE__ */ jsxDEV7(Box, {
+        className: "flex-col rounded-lg border p-4",
+        gap: "sm",
+        align: "start",
+        children: [
+          /* @__PURE__ */ jsxDEV7("span", {
+            className: "font-semibold",
+            children: "Tags"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(HStack6, {
+            gap: "xs",
+            wrap: "wrap",
+            children: meta.tags.map((tag) => /* @__PURE__ */ jsxDEV7(StatusChip5, {
+              tone: "neutral",
+              label: `#${tag}`,
+              size: "sm"
+            }, tag, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this) : null,
+      meta.owners?.length ? /* @__PURE__ */ jsxDEV7(Box, {
+        className: "flex-col rounded-lg border p-4",
+        gap: "sm",
+        align: "start",
+        children: [
+          /* @__PURE__ */ jsxDEV7("span", {
+            className: "font-semibold",
+            children: "Owners"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV7(HStack6, {
+            gap: "xs",
+            wrap: "wrap",
+            children: meta.owners.map((owner) => /* @__PURE__ */ jsxDEV7(StatusChip5, {
+              tone: "neutral",
+              label: owner,
+              size: "sm"
+            }, owner, false, undefined, this))
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this) : null
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/organisms/FeatureOperationsList.tsx
+import { EntityCard as EntityCard2 } from "@contractspec/lib.design-system";
+import { Zap as Zap3 } from "lucide-react";
+import { jsxDEV as jsxDEV8 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureOperationsList({
+  feature
+}) {
+  if (!feature.operations?.length)
+    return null;
+  return /* @__PURE__ */ jsxDEV8("div", {
+    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+    children: feature.operations.map((op) => {
+      const spec = resolveSerializedOperationSpec(op.key, op.version);
+      return /* @__PURE__ */ jsxDEV8(EntityCard2, {
+        cardTitle: op.key,
+        cardSubtitle: `v${op.version}`,
+        footer: spec?.meta.description,
+        icon: /* @__PURE__ */ jsxDEV8(Zap3, {
+          className: "h-4 w-4"
+        }, undefined, false, undefined, this),
+        href: `/features/${feature.meta.key}/operations/${op.key}`
+      }, op.key, false, undefined, this);
+    })
+  }, undefined, false, undefined, this);
+}
+
+// src/presentation/features/organisms/FeatureEventsList.tsx
+import { EntityCard as EntityCard3 } from "@contractspec/lib.design-system";
+import { Radio as Radio3 } from "lucide-react";
+import { jsxDEV as jsxDEV9 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureEventsList({ feature }) {
+  if (!feature.events?.length)
+    return null;
+  return /* @__PURE__ */ jsxDEV9("div", {
+    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+    children: feature.events.map((ev) => {
+      const spec = resolveSerializedEventSpec(ev.key, ev.version);
+      return /* @__PURE__ */ jsxDEV9(EntityCard3, {
+        cardTitle: ev.key,
+        cardSubtitle: `v${ev.version}`,
+        footer: spec?.meta.description,
+        icon: /* @__PURE__ */ jsxDEV9(Radio3, {
+          className: "h-4 w-4"
+        }, undefined, false, undefined, this),
+        href: `/features/${feature.meta.key}/events/${ev.key}`
+      }, ev.key, false, undefined, this);
+    })
+  }, undefined, false, undefined, this);
+}
+
+// src/presentation/features/organisms/FeaturePresentationsList.tsx
+import { EntityCard as EntityCard4 } from "@contractspec/lib.design-system";
+import { Layout as Layout4 } from "lucide-react";
+import { jsxDEV as jsxDEV10 } from "react/jsx-dev-runtime";
+"use client";
+function FeaturePresentationsList({
+  feature
+}) {
+  if (!feature.presentations?.length)
+    return null;
+  return /* @__PURE__ */ jsxDEV10("div", {
+    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+    children: feature.presentations.map((pres) => {
+      const spec = resolveSerializedPresentationSpec(pres.key, pres.version);
+      return /* @__PURE__ */ jsxDEV10(EntityCard4, {
+        cardTitle: pres.key,
+        cardSubtitle: `v${pres.version}`,
+        footer: spec?.meta.description,
+        icon: /* @__PURE__ */ jsxDEV10(Layout4, {
+          className: "h-4 w-4"
+        }, undefined, false, undefined, this),
+        href: `/features/${feature.meta.key}/presentations/${pres.key}`
+      }, pres.key, false, undefined, this);
+    })
+  }, undefined, false, undefined, this);
+}
+
+// src/presentation/features/organisms/FeatureDataViewsList.tsx
+import { EntityCard as EntityCard5 } from "@contractspec/lib.design-system";
+import { Table } from "lucide-react";
+import { jsxDEV as jsxDEV11 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureDataViewsList({
+  feature
+}) {
+  if (!feature.dataViews?.length)
+    return null;
+  return /* @__PURE__ */ jsxDEV11("div", {
+    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+    children: feature.dataViews.map((view) => {
+      const spec = resolveSerializedDataViewSpec(view.key, view.version);
+      return /* @__PURE__ */ jsxDEV11(EntityCard5, {
+        cardTitle: view.key,
+        cardSubtitle: `v${view.version}`,
+        footer: spec?.meta.description,
+        icon: /* @__PURE__ */ jsxDEV11(Table, {
+          className: "h-4 w-4"
+        }, undefined, false, undefined, this),
+        href: `/features/${feature.meta.key}/dataviews/${view.key}`
+      }, view.key, false, undefined, this);
+    })
+  }, undefined, false, undefined, this);
+}
+
+// src/presentation/features/organisms/FeatureFormsList.tsx
+import { EntityCard as EntityCard6 } from "@contractspec/lib.design-system";
+import { FormInput } from "lucide-react";
+import { jsxDEV as jsxDEV12 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureFormsList({ feature }) {
+  if (!feature.forms?.length)
+    return null;
+  return /* @__PURE__ */ jsxDEV12("div", {
+    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+    children: feature.forms.map((form) => {
+      const spec = resolveSerializedFormSpec(form.key, form.version);
+      return /* @__PURE__ */ jsxDEV12(EntityCard6, {
+        cardTitle: form.key,
+        cardSubtitle: form.version ? `v${form.version}` : undefined,
+        footer: spec?.meta.description,
+        icon: /* @__PURE__ */ jsxDEV12(FormInput, {
+          className: "h-4 w-4"
+        }, undefined, false, undefined, this),
+        href: `/features/${feature.meta.key}/forms/${form.key}`
+      }, form.key, false, undefined, this);
+    })
+  }, undefined, false, undefined, this);
+}
+
+// src/presentation/features/templates/FeatureOverviewTemplate/FeatureOverviewTemplate.tsx
+import {
+  PageHeaderResponsive as PageHeaderResponsive2,
+  Breadcrumbs
+} from "@contractspec/lib.design-system";
+import { VStack as VStack4 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn6 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV13 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureOverviewTemplate({
+  feature,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV13(VStack4, {
+    gap: "lg",
+    className: cn6("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV13(PageHeaderResponsive2, {
+        title: feature.meta.title || feature.meta.key,
+        subtitle: feature.meta.description || "Feature overview",
+        breadcrumb: /* @__PURE__ */ jsxDEV13(Breadcrumbs, {
+          items: [
+            { label: "Features", href: "/features" },
+            { label: feature.meta.title || feature.meta.key }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV13(FeatureDetail, {
+        feature
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureOperationsTemplate/FeatureOperationsTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs2,
+  PageHeaderResponsive as PageHeaderResponsive3
+} from "@contractspec/lib.design-system";
+import { VStack as VStack5 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn7 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV14 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureOperationsTemplate({
+  feature,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV14(VStack5, {
+    gap: "lg",
+    className: cn7("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV14(PageHeaderResponsive3, {
+        title: "Operations",
+        subtitle: `Operations defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV14(Breadcrumbs2, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Operations" }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV14(FeatureOperationsList, {
+        feature
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureEventsTemplate/FeatureEventsTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs3,
+  PageHeaderResponsive as PageHeaderResponsive4
+} from "@contractspec/lib.design-system";
+import { VStack as VStack6 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn8 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV15 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureEventsTemplate({
+  feature,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV15(VStack6, {
+    gap: "lg",
+    className: cn8("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV15(PageHeaderResponsive4, {
+        title: "Events",
+        subtitle: `Events defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV15(Breadcrumbs3, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Events" }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV15(FeatureEventsList, {
+        feature
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeaturePresentationsTemplate/FeaturePresentationsTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs4,
+  PageHeaderResponsive as PageHeaderResponsive5
+} from "@contractspec/lib.design-system";
+import { VStack as VStack7 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn9 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV16 } from "react/jsx-dev-runtime";
+"use client";
+function FeaturePresentationsTemplate({
+  feature,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV16(VStack7, {
+    gap: "lg",
+    className: cn9("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV16(PageHeaderResponsive5, {
+        title: "Presentations",
+        subtitle: `Presentations defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV16(Breadcrumbs4, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Presentations" }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV16(FeaturePresentationsList, {
+        feature
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureDataViewsTemplate/FeatureDataViewsTemplate.tsx
+import {
+  PageHeaderResponsive as PageHeaderResponsive6,
+  Breadcrumbs as Breadcrumbs5
+} from "@contractspec/lib.design-system";
+import { VStack as VStack8 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn10 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV17 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureDataViewsTemplate({
+  feature,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV17(VStack8, {
+    gap: "lg",
+    className: cn10("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV17(PageHeaderResponsive6, {
+        title: "Data Views",
+        subtitle: `Data views defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV17(Breadcrumbs5, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Data Views" }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV17(FeatureDataViewsList, {
+        feature
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureFormsTemplate/FeatureFormsTemplate.tsx
+import {
+  PageHeaderResponsive as PageHeaderResponsive7,
+  Breadcrumbs as Breadcrumbs6
+} from "@contractspec/lib.design-system";
+import { VStack as VStack9 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn11 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV18 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureFormsTemplate({
+  feature,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV18(VStack9, {
+    gap: "lg",
+    className: cn11("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV18(PageHeaderResponsive7, {
+        title: "Forms",
+        subtitle: `Forms defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV18(Breadcrumbs6, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Forms" }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV18(FeatureFormsList, {
+        feature
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureOperationDetailTemplate/FeatureOperationDetailTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs7,
+  CodeBlock,
+  EmptyState as EmptyState2,
+  PageHeaderResponsive as PageHeaderResponsive8,
+  StatusChip as StatusChip6
+} from "@contractspec/lib.design-system";
+import { Card } from "@contractspec/lib.ui-kit-web/ui/card";
+import { Box as Box2, HStack as HStack7, VStack as VStack10 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn12 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { Code, Database as Database2, Zap as Zap4 } from "lucide-react";
+import { jsxDEV as jsxDEV19 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureOperationDetailTemplate({
+  feature,
+  operationKey,
+  operation,
+  spec,
+  className
+}) {
+  const opRef = operation ?? feature.operations?.find((op) => op.key === operationKey);
+  const _relatedDocs = useRelatedDocs(opRef?.key || "", spec?.meta?.tags);
+  if (!opRef) {
+    return /* @__PURE__ */ jsxDEV19(VStack10, {
+      gap: "lg",
+      className: cn12("mx-auto w-full max-w-5xl p-6", className),
+      children: [
+        /* @__PURE__ */ jsxDEV19(PageHeaderResponsive8, {
+          title: "Operation Not Found",
+          subtitle: `Operation ${operationKey} not found in feature ${feature.meta.key}`,
+          breadcrumb: /* @__PURE__ */ jsxDEV19(Breadcrumbs7, {
+            items: [
+              { label: "Features", href: "/features" },
+              {
+                label: feature.meta.title || feature.meta.key,
+                href: `/features/${feature.meta.key}`
+              },
+              { label: "Operations" }
+            ]
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV19(EmptyState2, {
+          title: "Operation not found",
+          description: `The operation '${operationKey}' could not be found in this feature.`,
+          icon: /* @__PURE__ */ jsxDEV19(Zap4, {
+            className: "text-muted-foreground h-12 w-12"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV19(VStack10, {
+    gap: "lg",
+    className: cn12("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV19(PageHeaderResponsive8, {
+        title: opRef.key,
+        subtitle: `Operation defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV19(Breadcrumbs7, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            {
+              label: "Operations",
+              href: `/features/${feature.meta.key}/operations`
+            },
+            { label: opRef.key }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV19(HStack7, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV19(StatusChip6, {
+            tone: "neutral",
+            label: opRef.key,
+            size: "sm",
+            icon: /* @__PURE__ */ jsxDEV19(Zap4, {
+              className: "h-3 w-3"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV19(StatusChip6, {
+            tone: "neutral",
+            label: `v${opRef.version}`,
+            size: "sm"
+          }, undefined, false, undefined, this),
+          spec?.meta?.stability ? /* @__PURE__ */ jsxDEV19(StatusChip6, {
+            tone: spec.meta.stability === "stable" ? "success" : "warning",
+            label: spec.meta.stability,
+            size: "sm"
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV19("div", {
+        className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+        children: [
+          /* @__PURE__ */ jsxDEV19("div", {
+            className: "space-y-6 lg:col-span-2",
+            children: /* @__PURE__ */ jsxDEV19(Card, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV19(VStack10, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV19(HStack7, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV19(Code, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV19("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Schema Definition"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  spec ? /* @__PURE__ */ jsxDEV19(VStack10, {
+                    gap: "lg",
+                    children: [
+                      spec.meta.description && /* @__PURE__ */ jsxDEV19("p", {
+                        className: "text-muted-foreground",
+                        children: spec.meta.description
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV19(Box2, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Input Schema"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19(CodeBlock, {
+                            className: "w-full",
+                            code: JSON.stringify(spec.io.input, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV19(Box2, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Output Schema"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19(CodeBlock, {
+                            className: "w-full",
+                            code: JSON.stringify(spec.io.output, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this) : /* @__PURE__ */ jsxDEV19(VStack10, {
+                    gap: "md",
+                    children: [
+                      /* @__PURE__ */ jsxDEV19("p", {
+                        className: "text-muted-foreground",
+                        children: "Full schema details are not available for this operation reference."
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV19(CodeBlock, {
+                        code: JSON.stringify(opRef, null, 2),
+                        language: "json"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV19("div", {
+            className: "space-y-6",
+            children: /* @__PURE__ */ jsxDEV19(Card, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV19(VStack10, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV19(HStack7, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV19(Database2, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV19("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Metadata"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV19("dl", {
+                    className: "grid grid-cols-1 gap-4 text-sm",
+                    children: [
+                      /* @__PURE__ */ jsxDEV19("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("dt", {
+                            className: "text-muted-foreground",
+                            children: "Key"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19("dd", {
+                            className: "truncate font-medium",
+                            children: opRef.key
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV19("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("dt", {
+                            className: "text-muted-foreground",
+                            children: "Version"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19("dd", {
+                            className: "font-medium",
+                            children: opRef.version
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.context && /* @__PURE__ */ jsxDEV19("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("dt", {
+                            className: "text-muted-foreground",
+                            children: "Context"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19("dd", {
+                            className: "font-medium",
+                            children: spec.meta.context
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.owners && /* @__PURE__ */ jsxDEV19("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("dt", {
+                            className: "text-muted-foreground",
+                            children: "Owners"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.owners.map((o) => /* @__PURE__ */ jsxDEV19(StatusChip6, {
+                              label: o,
+                              size: "sm",
+                              tone: "neutral"
+                            }, o, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.tags && /* @__PURE__ */ jsxDEV19("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV19("dt", {
+                            className: "text-muted-foreground",
+                            children: "Tags"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV19("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.tags.map((t) => /* @__PURE__ */ jsxDEV19(StatusChip6, {
+                              label: `#${t}`,
+                              size: "sm",
+                              tone: "neutral"
+                            }, t, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureEventDetailTemplate/FeatureEventDetailTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs8,
+  CodeBlock as CodeBlock2,
+  EmptyState as EmptyState3,
+  PageHeaderResponsive as PageHeaderResponsive9,
+  StatusChip as StatusChip7
+} from "@contractspec/lib.design-system";
+import { Card as Card2 } from "@contractspec/lib.ui-kit-web/ui/card";
+import { Box as Box3, HStack as HStack8, VStack as VStack11 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn13 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { BookOpen, Code as Code2, Database as Database3, Radio as Radio4 } from "lucide-react";
+import Link2 from "next/link";
+import { jsxDEV as jsxDEV20 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureEventDetailTemplate({
+  feature,
+  eventKey,
+  event,
+  spec,
+  className
+}) {
+  const eventRef = event ?? feature.events?.find((ev) => ev.key === eventKey);
+  const relatedDocs = useRelatedDocs(eventRef?.key || "", spec?.meta?.tags);
+  if (!eventRef) {
+    return /* @__PURE__ */ jsxDEV20(VStack11, {
+      gap: "lg",
+      className: cn13("mx-auto w-full max-w-5xl p-6", className),
+      children: [
+        /* @__PURE__ */ jsxDEV20(PageHeaderResponsive9, {
+          title: "Event Not Found",
+          subtitle: `Event ${eventKey} not found in feature ${feature.meta.key}`,
+          breadcrumb: /* @__PURE__ */ jsxDEV20(Breadcrumbs8, {
+            items: [
+              { label: "Features", href: "/features" },
+              {
+                label: feature.meta.title || feature.meta.key,
+                href: `/features/${feature.meta.key}`
+              },
+              {
+                label: "Events",
+                href: `/features/${feature.meta.key}/events`
+              }
+            ]
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV20(EmptyState3, {
+          title: "Event not found",
+          description: `The event '${eventKey}' could not be found in this feature.`,
+          icon: /* @__PURE__ */ jsxDEV20(Radio4, {
+            className: "text-muted-foreground h-12 w-12"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV20(VStack11, {
+    gap: "lg",
+    className: cn13("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV20(PageHeaderResponsive9, {
+        title: eventRef.key,
+        subtitle: `Event defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV20(Breadcrumbs8, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Events", href: `/features/${feature.meta.key}#events` },
+            { label: eventRef.key }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV20(HStack8, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV20(StatusChip7, {
+            tone: "neutral",
+            label: eventRef.key,
+            size: "sm",
+            icon: /* @__PURE__ */ jsxDEV20(Radio4, {
+              className: "h-3 w-3"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV20(StatusChip7, {
+            tone: "neutral",
+            label: `v${eventRef.version}`,
+            size: "sm"
+          }, undefined, false, undefined, this),
+          spec?.meta?.stability ? /* @__PURE__ */ jsxDEV20(StatusChip7, {
+            tone: spec.meta.stability === "stable" ? "success" : "warning",
+            label: spec.meta.stability,
+            size: "sm"
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV20("div", {
+        className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+        children: [
+          /* @__PURE__ */ jsxDEV20("div", {
+            className: "space-y-6 lg:col-span-2",
+            children: /* @__PURE__ */ jsxDEV20(Card2, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV20(VStack11, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV20(HStack8, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV20(Code2, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV20("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Payload Definition"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  spec ? /* @__PURE__ */ jsxDEV20(VStack11, {
+                    gap: "lg",
+                    children: [
+                      spec.meta.description && /* @__PURE__ */ jsxDEV20("p", {
+                        className: "text-muted-foreground",
+                        children: spec.meta.description
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV20(Box3, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV20("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Payload Schema"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV20(CodeBlock2, {
+                            code: JSON.stringify(spec.payload, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this) : /* @__PURE__ */ jsxDEV20(VStack11, {
+                    gap: "md",
+                    children: [
+                      /* @__PURE__ */ jsxDEV20("p", {
+                        className: "text-muted-foreground",
+                        children: "Full payload details are not available for this event reference."
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV20(CodeBlock2, {
+                        code: JSON.stringify(eventRef, null, 2),
+                        language: "json"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV20("div", {
+            className: "space-y-6",
+            children: /* @__PURE__ */ jsxDEV20(Card2, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV20(VStack11, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV20(HStack8, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV20(Database3, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV20("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Metadata"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV20("dl", {
+                    className: "grid grid-cols-1 gap-4 text-sm",
+                    children: [
+                      /* @__PURE__ */ jsxDEV20("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV20("dt", {
+                            className: "text-muted-foreground",
+                            children: "Key"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV20("dd", {
+                            className: "truncate font-medium",
+                            children: eventRef.key
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV20("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV20("dt", {
+                            className: "text-muted-foreground",
+                            children: "Version"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV20("dd", {
+                            className: "font-medium",
+                            children: eventRef.version
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.owners && /* @__PURE__ */ jsxDEV20("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV20("dt", {
+                            className: "text-muted-foreground",
+                            children: "Owners"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV20("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.owners.map((o) => /* @__PURE__ */ jsxDEV20(StatusChip7, {
+                              label: o,
+                              size: "sm",
+                              tone: "neutral"
+                            }, o, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          relatedDocs?.length ? /* @__PURE__ */ jsxDEV20("div", {
+            className: "lg:col-span-3",
+            children: /* @__PURE__ */ jsxDEV20(Card2, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV20(VStack11, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV20(HStack8, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV20(BookOpen, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV20("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Related Documentation"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV20("div", {
+                    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+                    children: relatedDocs.map((doc) => /* @__PURE__ */ jsxDEV20(Link2, {
+                      href: doc.route || `/docs/${doc.id}`,
+                      className: "group block",
+                      children: /* @__PURE__ */ jsxDEV20("div", {
+                        className: "hover:border-primary h-full rounded-lg border p-4 transition-colors",
+                        children: [
+                          /* @__PURE__ */ jsxDEV20("h4", {
+                            className: "group-hover:text-primary mb-1 font-semibold",
+                            children: doc.title
+                          }, undefined, false, undefined, this),
+                          doc.summary && /* @__PURE__ */ jsxDEV20("p", {
+                            className: "text-muted-foreground line-clamp-2 text-sm",
+                            children: doc.summary
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    }, doc.id, false, undefined, this))
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeaturePresentationDetailTemplate/FeaturePresentationDetailTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs9,
+  CodeBlock as CodeBlock3,
+  EmptyState as EmptyState4,
+  PageHeaderResponsive as PageHeaderResponsive10,
+  StatusChip as StatusChip8
+} from "@contractspec/lib.design-system";
+import { Card as Card3 } from "@contractspec/lib.ui-kit-web/ui/card";
+import { Box as Box4, HStack as HStack9, VStack as VStack12 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn14 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { BookOpen as BookOpen2, Code as Code3, Database as Database4, Layout as Layout5 } from "lucide-react";
+import Link3 from "next/link";
+import { jsxDEV as jsxDEV21 } from "react/jsx-dev-runtime";
+"use client";
+function FeaturePresentationDetailTemplate({
+  feature,
+  presentationKey,
+  presentation,
+  spec,
+  className
+}) {
+  const presRef = presentation ?? feature.presentations?.find((p) => p.key === presentationKey);
+  const relatedDocs = useRelatedDocs(presRef?.key || "", spec?.meta?.tags);
+  if (!presRef) {
+    return /* @__PURE__ */ jsxDEV21(VStack12, {
+      gap: "lg",
+      className: cn14("mx-auto w-full max-w-5xl p-6", className),
+      children: [
+        /* @__PURE__ */ jsxDEV21(PageHeaderResponsive10, {
+          title: "Presentation Not Found",
+          subtitle: `Presentation ${presentationKey} not found in feature ${feature.meta.key}`,
+          breadcrumb: /* @__PURE__ */ jsxDEV21(Breadcrumbs9, {
+            items: [
+              { label: "Features", href: "/features" },
+              {
+                label: feature.meta.title || feature.meta.key,
+                href: `/features/${feature.meta.key}`
+              },
+              {
+                label: "Presentations",
+                href: `/features/${feature.meta.key}/presentation`
+              }
+            ]
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV21(EmptyState4, {
+          title: "Presentation not found",
+          description: `The presentation '${presentationKey}' could not be found in this feature.`,
+          icon: /* @__PURE__ */ jsxDEV21(Layout5, {
+            className: "text-muted-foreground h-12 w-12"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV21(VStack12, {
+    gap: "lg",
+    className: cn14("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV21(PageHeaderResponsive10, {
+        title: presRef.key,
+        subtitle: `Presentation defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV21(Breadcrumbs9, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            {
+              label: "Presentations",
+              href: `/features/${feature.meta.key}#presentations`
+            },
+            { label: presRef.key }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV21(HStack9, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV21(StatusChip8, {
+            tone: "neutral",
+            label: presRef.key,
+            size: "sm",
+            icon: /* @__PURE__ */ jsxDEV21(Layout5, {
+              className: "h-3 w-3"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV21(StatusChip8, {
+            tone: "neutral",
+            label: `v${presRef.version}`,
+            size: "sm"
+          }, undefined, false, undefined, this),
+          spec?.meta?.stability ? /* @__PURE__ */ jsxDEV21(StatusChip8, {
+            tone: spec.meta.stability === "stable" ? "success" : "warning",
+            label: spec.meta.stability,
+            size: "sm"
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV21("div", {
+        className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+        children: [
+          /* @__PURE__ */ jsxDEV21("div", {
+            className: "space-y-6 lg:col-span-2",
+            children: /* @__PURE__ */ jsxDEV21(Card3, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV21(VStack12, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV21(HStack9, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV21(Code3, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV21("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Component Definition"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  spec ? /* @__PURE__ */ jsxDEV21(VStack12, {
+                    gap: "lg",
+                    children: [
+                      spec.meta.description && /* @__PURE__ */ jsxDEV21("p", {
+                        className: "text-muted-foreground",
+                        children: spec.meta.description
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV21(Box4, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV21("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Spec Details"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV21(CodeBlock3, {
+                            code: JSON.stringify(spec, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this) : /* @__PURE__ */ jsxDEV21(VStack12, {
+                    gap: "md",
+                    children: [
+                      /* @__PURE__ */ jsxDEV21("p", {
+                        className: "text-muted-foreground",
+                        children: "Full component details are not available for this presentation reference."
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV21(CodeBlock3, {
+                        code: JSON.stringify(presRef, null, 2),
+                        language: "json"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV21("div", {
+            className: "space-y-6",
+            children: /* @__PURE__ */ jsxDEV21(Card3, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV21(VStack12, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV21(HStack9, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV21(Database4, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV21("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Metadata"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV21("dl", {
+                    className: "grid grid-cols-1 gap-4 text-sm",
+                    children: [
+                      /* @__PURE__ */ jsxDEV21("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV21("dt", {
+                            className: "text-muted-foreground",
+                            children: "Key"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV21("dd", {
+                            className: "truncate font-medium",
+                            children: presRef.key
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV21("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV21("dt", {
+                            className: "text-muted-foreground",
+                            children: "Version"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV21("dd", {
+                            className: "font-medium",
+                            children: presRef.version
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.owners && /* @__PURE__ */ jsxDEV21("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV21("dt", {
+                            className: "text-muted-foreground",
+                            children: "Owners"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV21("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.owners.map((o) => /* @__PURE__ */ jsxDEV21(StatusChip8, {
+                              label: o,
+                              size: "sm",
+                              tone: "neutral"
+                            }, o, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          relatedDocs?.length ? /* @__PURE__ */ jsxDEV21("div", {
+            className: "lg:col-span-3",
+            children: /* @__PURE__ */ jsxDEV21(Card3, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV21(VStack12, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV21(HStack9, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV21(BookOpen2, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV21("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Related Documentation"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV21("div", {
+                    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+                    children: relatedDocs.map((doc) => /* @__PURE__ */ jsxDEV21(Link3, {
+                      href: doc.route || `/docs/${doc.id}`,
+                      className: "group block",
+                      children: /* @__PURE__ */ jsxDEV21("div", {
+                        className: "hover:border-primary h-full rounded-lg border p-4 transition-colors",
+                        children: [
+                          /* @__PURE__ */ jsxDEV21("h4", {
+                            className: "group-hover:text-primary mb-1 font-semibold",
+                            children: doc.title
+                          }, undefined, false, undefined, this),
+                          doc.summary && /* @__PURE__ */ jsxDEV21("p", {
+                            className: "text-muted-foreground line-clamp-2 text-sm",
+                            children: doc.summary
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    }, doc.id, false, undefined, this))
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureDataViewDetailTemplate/FeatureDataViewDetailTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs10,
+  CodeBlock as CodeBlock4,
+  EmptyState as EmptyState5,
+  PageHeaderResponsive as PageHeaderResponsive11,
+  StatusChip as StatusChip9
+} from "@contractspec/lib.design-system";
+import { Card as Card4 } from "@contractspec/lib.ui-kit-web/ui/card";
+import { Box as Box5, HStack as HStack10, VStack as VStack13 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn15 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { BookOpen as BookOpen3, Code as Code4, Database as Database5, Table as Table2 } from "lucide-react";
+import Link4 from "next/link";
+import { jsxDEV as jsxDEV22 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureDataViewDetailTemplate({
+  feature,
+  viewKey,
+  view,
+  spec,
+  className
+}) {
+  const viewRef = view ?? feature.dataViews?.find((v) => v.key === viewKey);
+  const relatedDocs = useRelatedDocs(viewRef?.key || "", spec?.meta?.tags);
+  if (!viewRef) {
+    return /* @__PURE__ */ jsxDEV22(VStack13, {
+      gap: "lg",
+      className: cn15("mx-auto w-full max-w-5xl p-6", className),
+      children: [
+        /* @__PURE__ */ jsxDEV22(PageHeaderResponsive11, {
+          title: "Data View Not Found",
+          subtitle: `Data View ${viewKey} not found in feature ${feature.meta.key}`,
+          breadcrumb: /* @__PURE__ */ jsxDEV22(Breadcrumbs10, {
+            items: [
+              { label: "Features", href: "/features" },
+              {
+                label: feature.meta.title || feature.meta.key,
+                href: `/features/${feature.meta.key}`
+              },
+              { label: "Data Views" }
+            ]
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV22(EmptyState5, {
+          title: "Data View not found",
+          description: `The data view '${viewKey}' could not be found in this feature.`,
+          icon: /* @__PURE__ */ jsxDEV22(Table2, {
+            className: "text-muted-foreground h-12 w-12"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV22(VStack13, {
+    gap: "lg",
+    className: cn15("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV22(PageHeaderResponsive11, {
+        title: viewRef.key,
+        subtitle: `Data View defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV22(Breadcrumbs10, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            {
+              label: "Data Views",
+              href: `/features/${feature.meta.key}#dataviews`
+            },
+            { label: viewRef.key }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV22(HStack10, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV22(StatusChip9, {
+            tone: "neutral",
+            label: viewRef.key,
+            size: "sm",
+            icon: /* @__PURE__ */ jsxDEV22(Table2, {
+              className: "h-3 w-3"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV22(StatusChip9, {
+            tone: "neutral",
+            label: `v${viewRef.version}`,
+            size: "sm"
+          }, undefined, false, undefined, this),
+          spec?.meta?.stability ? /* @__PURE__ */ jsxDEV22(StatusChip9, {
+            tone: spec.meta.stability === "stable" ? "success" : "warning",
+            label: spec.meta.stability,
+            size: "sm"
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV22("div", {
+        className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+        children: [
+          /* @__PURE__ */ jsxDEV22("div", {
+            className: "space-y-6 lg:col-span-2",
+            children: /* @__PURE__ */ jsxDEV22(Card4, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV22(VStack13, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV22(HStack10, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV22(Code4, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV22("h3", {
+                        className: "text-lg font-semibold",
+                        children: "View Definition"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  spec ? /* @__PURE__ */ jsxDEV22(VStack13, {
+                    gap: "lg",
+                    children: [
+                      spec.meta.description && /* @__PURE__ */ jsxDEV22("p", {
+                        className: "text-muted-foreground",
+                        children: spec.meta.description
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV22(Box5, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Source Query"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV22(CodeBlock4, {
+                            code: JSON.stringify(spec.source, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV22(Box5, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "View Configuration"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV22(CodeBlock4, {
+                            code: JSON.stringify(spec.view, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this) : /* @__PURE__ */ jsxDEV22(VStack13, {
+                    gap: "md",
+                    children: [
+                      /* @__PURE__ */ jsxDEV22("p", {
+                        className: "text-muted-foreground",
+                        children: "Full definition details are not available for this data view reference."
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV22(CodeBlock4, {
+                        code: JSON.stringify(viewRef, null, 2),
+                        language: "json"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV22("div", {
+            className: "space-y-6",
+            children: /* @__PURE__ */ jsxDEV22(Card4, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV22(VStack13, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV22(HStack10, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV22(Database5, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV22("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Metadata"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV22("dl", {
+                    className: "grid grid-cols-1 gap-4 text-sm",
+                    children: [
+                      /* @__PURE__ */ jsxDEV22("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("dt", {
+                            className: "text-muted-foreground",
+                            children: "Key"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV22("dd", {
+                            className: "truncate font-medium",
+                            children: viewRef.key
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV22("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("dt", {
+                            className: "text-muted-foreground",
+                            children: "Version"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV22("dd", {
+                            className: "font-medium",
+                            children: viewRef.version
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.owners && /* @__PURE__ */ jsxDEV22("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("dt", {
+                            className: "text-muted-foreground",
+                            children: "Owners"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV22("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.owners.map((o) => /* @__PURE__ */ jsxDEV22(StatusChip9, {
+                              label: o,
+                              size: "sm",
+                              tone: "neutral"
+                            }, o, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.tags && /* @__PURE__ */ jsxDEV22("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("dt", {
+                            className: "text-muted-foreground",
+                            children: "Tags"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV22("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.tags.map((t) => /* @__PURE__ */ jsxDEV22(StatusChip9, {
+                              label: `#${t}`,
+                              size: "sm",
+                              tone: "neutral"
+                            }, t, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          relatedDocs?.length ? /* @__PURE__ */ jsxDEV22("div", {
+            className: "lg:col-span-3",
+            children: /* @__PURE__ */ jsxDEV22(Card4, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV22(VStack13, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV22(HStack10, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV22(BookOpen3, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV22("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Related Documentation"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV22("div", {
+                    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+                    children: relatedDocs.map((doc) => /* @__PURE__ */ jsxDEV22(Link4, {
+                      href: doc.route || `/docs/${doc.id}`,
+                      className: "group block",
+                      children: /* @__PURE__ */ jsxDEV22("div", {
+                        className: "hover:border-primary h-full rounded-lg border p-4 transition-colors",
+                        children: [
+                          /* @__PURE__ */ jsxDEV22("h4", {
+                            className: "group-hover:text-primary mb-1 font-semibold",
+                            children: doc.title
+                          }, undefined, false, undefined, this),
+                          doc.summary && /* @__PURE__ */ jsxDEV22("p", {
+                            className: "text-muted-foreground line-clamp-2 text-sm",
+                            children: doc.summary
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    }, doc.id, false, undefined, this))
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+// src/presentation/features/templates/FeatureFormDetailTemplate/FeatureFormDetailTemplate.tsx
+import {
+  Breadcrumbs as Breadcrumbs11,
+  CodeBlock as CodeBlock5,
+  EmptyState as EmptyState6,
+  PageHeaderResponsive as PageHeaderResponsive12,
+  StatusChip as StatusChip10
+} from "@contractspec/lib.design-system";
+import { Card as Card5 } from "@contractspec/lib.ui-kit-web/ui/card";
+import { Box as Box6, HStack as HStack11, VStack as VStack14 } from "@contractspec/lib.ui-kit-web/ui/stack";
+import { cn as cn16 } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { BookOpen as BookOpen4, Code as Code5, Database as Database6, PenTool } from "lucide-react";
+import Link5 from "next/link";
+import { jsxDEV as jsxDEV23 } from "react/jsx-dev-runtime";
+"use client";
+function FeatureFormDetailTemplate({
+  feature,
+  formKey,
+  form,
+  spec,
+  className
+}) {
+  const formRef = form ?? feature.forms?.find((f) => f.key === formKey);
+  const relatedDocs = useRelatedDocs(formRef?.key || "", spec?.meta?.tags);
+  if (!formRef) {
+    return /* @__PURE__ */ jsxDEV23(VStack14, {
+      gap: "lg",
+      className: cn16("mx-auto w-full max-w-5xl p-6", className),
+      children: [
+        /* @__PURE__ */ jsxDEV23(PageHeaderResponsive12, {
+          title: "Form Not Found",
+          subtitle: `Form ${formKey} not found in feature ${feature.meta.key}`,
+          breadcrumb: /* @__PURE__ */ jsxDEV23(Breadcrumbs11, {
+            items: [
+              { label: "Features", href: "/features" },
+              {
+                label: feature.meta.title || feature.meta.key,
+                href: `/features/${feature.meta.key}`
+              },
+              { label: "Forms" }
+            ]
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV23(EmptyState6, {
+          title: "Form not found",
+          description: `The form '${formKey}' could not be found in this feature.`,
+          icon: /* @__PURE__ */ jsxDEV23(PenTool, {
+            className: "text-muted-foreground h-12 w-12"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      ]
+    }, undefined, true, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV23(VStack14, {
+    gap: "lg",
+    className: cn16("mx-auto w-full max-w-5xl p-6", className),
+    children: [
+      /* @__PURE__ */ jsxDEV23(PageHeaderResponsive12, {
+        title: formRef.key,
+        subtitle: `Form defined in ${feature.meta.title ?? feature.meta.key}`,
+        breadcrumb: /* @__PURE__ */ jsxDEV23(Breadcrumbs11, {
+          items: [
+            { label: "Features", href: "/features" },
+            {
+              label: feature.meta.title || feature.meta.key,
+              href: `/features/${feature.meta.key}`
+            },
+            { label: "Forms", href: `/features/${feature.meta.key}#forms` },
+            { label: formRef.key }
+          ]
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV23(HStack11, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV23(StatusChip10, {
+            tone: "neutral",
+            label: formRef.key,
+            size: "sm",
+            icon: /* @__PURE__ */ jsxDEV23(PenTool, {
+              className: "h-3 w-3"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV23(StatusChip10, {
+            tone: "neutral",
+            label: `v${formRef.version}`,
+            size: "sm"
+          }, undefined, false, undefined, this),
+          spec?.meta?.stability ? /* @__PURE__ */ jsxDEV23(StatusChip10, {
+            tone: spec.meta.stability === "stable" ? "success" : "warning",
+            label: spec.meta.stability,
+            size: "sm"
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsxDEV23("div", {
+        className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+        children: [
+          /* @__PURE__ */ jsxDEV23("div", {
+            className: "space-y-6 lg:col-span-2",
+            children: /* @__PURE__ */ jsxDEV23(Card5, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV23(VStack14, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV23(HStack11, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV23(Code5, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV23("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Form Definition"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  spec ? /* @__PURE__ */ jsxDEV23(VStack14, {
+                    gap: "lg",
+                    children: [
+                      spec.meta.description && /* @__PURE__ */ jsxDEV23("p", {
+                        className: "text-muted-foreground",
+                        children: spec.meta.description
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV23(Box6, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Fields"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV23(CodeBlock5, {
+                            code: JSON.stringify(spec.fields, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV23(Box6, {
+                        className: "flex-col gap-2",
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("span", {
+                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
+                            children: "Actions"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV23(CodeBlock5, {
+                            code: JSON.stringify(spec.actions, null, 2),
+                            language: "json"
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this) : /* @__PURE__ */ jsxDEV23(VStack14, {
+                    gap: "md",
+                    children: [
+                      /* @__PURE__ */ jsxDEV23("p", {
+                        className: "text-muted-foreground",
+                        children: "Full form definition details are not available for this form reference."
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV23(CodeBlock5, {
+                        code: JSON.stringify(formRef, null, 2),
+                        language: "json"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV23("div", {
+            className: "space-y-6",
+            children: /* @__PURE__ */ jsxDEV23(Card5, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV23(VStack14, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV23(HStack11, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV23(Database6, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV23("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Metadata"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV23("dl", {
+                    className: "grid grid-cols-1 gap-4 text-sm",
+                    children: [
+                      /* @__PURE__ */ jsxDEV23("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("dt", {
+                            className: "text-muted-foreground",
+                            children: "Key"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV23("dd", {
+                            className: "truncate font-medium",
+                            children: formRef.key
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      /* @__PURE__ */ jsxDEV23("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("dt", {
+                            className: "text-muted-foreground",
+                            children: "Version"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV23("dd", {
+                            className: "font-medium",
+                            children: formRef.version
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.owners && /* @__PURE__ */ jsxDEV23("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("dt", {
+                            className: "text-muted-foreground",
+                            children: "Owners"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV23("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.owners.map((o) => /* @__PURE__ */ jsxDEV23(StatusChip10, {
+                              label: o,
+                              size: "sm",
+                              tone: "neutral"
+                            }, o, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this),
+                      spec?.meta?.tags && /* @__PURE__ */ jsxDEV23("div", {
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("dt", {
+                            className: "text-muted-foreground",
+                            children: "Tags"
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV23("dd", {
+                            className: "flex flex-wrap gap-1 font-medium",
+                            children: spec.meta.tags.map((t) => /* @__PURE__ */ jsxDEV23(StatusChip10, {
+                              label: `#${t}`,
+                              size: "sm",
+                              tone: "neutral"
+                            }, t, false, undefined, this))
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          relatedDocs?.length ? /* @__PURE__ */ jsxDEV23("div", {
+            className: "lg:col-span-3",
+            children: /* @__PURE__ */ jsxDEV23(Card5, {
+              className: "p-6",
+              children: /* @__PURE__ */ jsxDEV23(VStack14, {
+                gap: "md",
+                children: [
+                  /* @__PURE__ */ jsxDEV23(HStack11, {
+                    className: "items-center gap-2 border-b pb-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV23(BookOpen4, {
+                        className: "text-muted-foreground h-5 w-5"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV23("h3", {
+                        className: "text-lg font-semibold",
+                        children: "Related Documentation"
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV23("div", {
+                    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
+                    children: relatedDocs.map((doc) => /* @__PURE__ */ jsxDEV23(Link5, {
+                      href: doc.route || `/docs/${doc.id}`,
+                      className: "group block",
+                      children: /* @__PURE__ */ jsxDEV23("div", {
+                        className: "hover:border-primary h-full rounded-lg border p-4 transition-colors",
+                        children: [
+                          /* @__PURE__ */ jsxDEV23("h4", {
+                            className: "group-hover:text-primary mb-1 font-semibold",
+                            children: doc.title
+                          }, undefined, false, undefined, this),
+                          doc.summary && /* @__PURE__ */ jsxDEV23("p", {
+                            className: "text-muted-foreground line-clamp-2 text-sm",
+                            children: doc.summary
+                          }, undefined, false, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    }, doc.id, false, undefined, this))
+                  }, undefined, false, undefined, this)
+                ]
+              }, undefined, true, undefined, this)
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  useRelatedDocs,
+  useFeatureRegistry,
+  useFeatureFilters,
+  useContractsRegistry,
+  getFeatureIconTone,
+  FeaturePresentationsTemplate,
+  FeaturePresentationsList,
+  FeaturePresentationDetailTemplate,
+  FeatureOverviewTemplate,
+  FeatureOperationsTemplate,
+  FeatureOperationsList,
+  FeatureOperationDetailTemplate,
+  FeatureIcon,
+  FeatureHoverPreview,
+  FeatureFormsTemplate,
+  FeatureFormsList,
+  FeatureFormDetailTemplate,
+  FeatureFiltersBar,
+  FeatureEventsTemplate,
+  FeatureEventsList,
+  FeatureEventDetailTemplate,
+  FeatureDiscovery,
+  FeatureDetail,
+  FeatureDataViewsTemplate,
+  FeatureDataViewsList,
+  FeatureDataViewDetailTemplate,
+  FeatureCategoryHeader,
+  FeatureCard
+};