@contractspec/bundle.library 1.11.1 → 1.13.0

package/dist/presentation/features/organisms/FeatureDiscovery/index.js

@@ -1,3 +1,910 @@
-import { FeatureDiscovery } from "./FeatureDiscovery.js";
+// @bun
+// 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: []
+  }
+};
 
-export { FeatureDiscovery };
+// 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/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/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);
+}
+export {
+  FeatureDiscovery
+};