// @bun
// src/presentation/features/hooks/useRelatedDocs.ts
import { useMemo } from "react";
import { defaultDocRegistry } from "@contractspec/lib.contracts-spec/docs";
"use client";
function useRelatedDocs(key, tags) {
  const docs = useMemo(() => {
    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 docs;
}

// src/presentation/features/templates/FeaturePresentationDetailTemplate/FeaturePresentationDetailTemplate.tsx
import {
  Breadcrumbs,
  CodeBlock,
  EmptyState,
  PageHeaderResponsive,
  StatusChip
} from "@contractspec/lib.design-system";
import { Card } from "@contractspec/lib.ui-kit-web/ui/card";
import { Box, HStack, VStack } from "@contractspec/lib.ui-kit-web/ui/stack";
import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
import { BookOpen, Code, Database, Layout } from "lucide-react";
import Link from "next/link";
import { jsx, jsxs } from "react/jsx-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__ */ jsxs(VStack, {
      gap: "lg",
      className: cn("mx-auto w-full max-w-5xl p-6", className),
      children: [
        /* @__PURE__ */ jsx(PageHeaderResponsive, {
          title: "Presentation Not Found",
          subtitle: `Presentation ${presentationKey} not found in feature ${feature.meta.key}`,
          breadcrumb: /* @__PURE__ */ jsx(Breadcrumbs, {
            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`
              }
            ]
          })
        }),
        /* @__PURE__ */ jsx(EmptyState, {
          title: "Presentation not found",
          description: `The presentation '${presentationKey}' could not be found in this feature.`,
          icon: /* @__PURE__ */ jsx(Layout, {
            className: "text-muted-foreground h-12 w-12"
          })
        })
      ]
    });
  }
  return /* @__PURE__ */ jsxs(VStack, {
    gap: "lg",
    className: cn("mx-auto w-full max-w-5xl p-6", className),
    children: [
      /* @__PURE__ */ jsx(PageHeaderResponsive, {
        title: presRef.key,
        subtitle: `Presentation defined in ${feature.meta.title ?? feature.meta.key}`,
        breadcrumb: /* @__PURE__ */ jsx(Breadcrumbs, {
          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 }
          ]
        })
      }),
      /* @__PURE__ */ jsxs(HStack, {
        gap: "sm",
        children: [
          /* @__PURE__ */ jsx(StatusChip, {
            tone: "neutral",
            label: presRef.key,
            size: "sm",
            icon: /* @__PURE__ */ jsx(Layout, {
              className: "h-3 w-3"
            })
          }),
          /* @__PURE__ */ jsx(StatusChip, {
            tone: "neutral",
            label: `v${presRef.version}`,
            size: "sm"
          }),
          spec?.meta?.stability ? /* @__PURE__ */ jsx(StatusChip, {
            tone: spec.meta.stability === "stable" ? "success" : "warning",
            label: spec.meta.stability,
            size: "sm"
          }) : null
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
        children: [
          /* @__PURE__ */ jsx("div", {
            className: "space-y-6 lg:col-span-2",
            children: /* @__PURE__ */ jsx(Card, {
              className: "p-6",
              children: /* @__PURE__ */ jsxs(VStack, {
                gap: "md",
                children: [
                  /* @__PURE__ */ jsxs(HStack, {
                    className: "items-center gap-2 border-b pb-2",
                    children: [
                      /* @__PURE__ */ jsx(Code, {
                        className: "text-muted-foreground h-5 w-5"
                      }),
                      /* @__PURE__ */ jsx("h3", {
                        className: "text-lg font-semibold",
                        children: "Component Definition"
                      })
                    ]
                  }),
                  spec ? /* @__PURE__ */ jsxs(VStack, {
                    gap: "lg",
                    children: [
                      spec.meta.description && /* @__PURE__ */ jsx("p", {
                        className: "text-muted-foreground",
                        children: spec.meta.description
                      }),
                      /* @__PURE__ */ jsxs(Box, {
                        className: "flex-col gap-2",
                        children: [
                          /* @__PURE__ */ jsx("span", {
                            className: "text-muted-foreground text-sm font-medium tracking-wider uppercase",
                            children: "Spec Details"
                          }),
                          /* @__PURE__ */ jsx(CodeBlock, {
                            code: JSON.stringify(spec, null, 2),
                            language: "json"
                          })
                        ]
                      })
                    ]
                  }) : /* @__PURE__ */ jsxs(VStack, {
                    gap: "md",
                    children: [
                      /* @__PURE__ */ jsx("p", {
                        className: "text-muted-foreground",
                        children: "Full component details are not available for this presentation reference."
                      }),
                      /* @__PURE__ */ jsx(CodeBlock, {
                        code: JSON.stringify(presRef, null, 2),
                        language: "json"
                      })
                    ]
                  })
                ]
              })
            })
          }),
          /* @__PURE__ */ jsx("div", {
            className: "space-y-6",
            children: /* @__PURE__ */ jsx(Card, {
              className: "p-6",
              children: /* @__PURE__ */ jsxs(VStack, {
                gap: "md",
                children: [
                  /* @__PURE__ */ jsxs(HStack, {
                    className: "items-center gap-2 border-b pb-2",
                    children: [
                      /* @__PURE__ */ jsx(Database, {
                        className: "text-muted-foreground h-5 w-5"
                      }),
                      /* @__PURE__ */ jsx("h3", {
                        className: "text-lg font-semibold",
                        children: "Metadata"
                      })
                    ]
                  }),
                  /* @__PURE__ */ jsxs("dl", {
                    className: "grid grid-cols-1 gap-4 text-sm",
                    children: [
                      /* @__PURE__ */ jsxs("div", {
                        children: [
                          /* @__PURE__ */ jsx("dt", {
                            className: "text-muted-foreground",
                            children: "Key"
                          }),
                          /* @__PURE__ */ jsx("dd", {
                            className: "truncate font-medium",
                            children: presRef.key
                          })
                        ]
                      }),
                      /* @__PURE__ */ jsxs("div", {
                        children: [
                          /* @__PURE__ */ jsx("dt", {
                            className: "text-muted-foreground",
                            children: "Version"
                          }),
                          /* @__PURE__ */ jsx("dd", {
                            className: "font-medium",
                            children: presRef.version
                          })
                        ]
                      }),
                      spec?.meta?.owners && /* @__PURE__ */ jsxs("div", {
                        children: [
                          /* @__PURE__ */ jsx("dt", {
                            className: "text-muted-foreground",
                            children: "Owners"
                          }),
                          /* @__PURE__ */ jsx("dd", {
                            className: "flex flex-wrap gap-1 font-medium",
                            children: spec.meta.owners.map((o) => /* @__PURE__ */ jsx(StatusChip, {
                              label: o,
                              size: "sm",
                              tone: "neutral"
                            }, o))
                          })
                        ]
                      })
                    ]
                  })
                ]
              })
            })
          }),
          relatedDocs?.length ? /* @__PURE__ */ jsx("div", {
            className: "lg:col-span-3",
            children: /* @__PURE__ */ jsx(Card, {
              className: "p-6",
              children: /* @__PURE__ */ jsxs(VStack, {
                gap: "md",
                children: [
                  /* @__PURE__ */ jsxs(HStack, {
                    className: "items-center gap-2 border-b pb-2",
                    children: [
                      /* @__PURE__ */ jsx(BookOpen, {
                        className: "text-muted-foreground h-5 w-5"
                      }),
                      /* @__PURE__ */ jsx("h3", {
                        className: "text-lg font-semibold",
                        children: "Related Documentation"
                      })
                    ]
                  }),
                  /* @__PURE__ */ jsx("div", {
                    className: "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3",
                    children: relatedDocs.map((doc) => /* @__PURE__ */ jsx(Link, {
                      href: doc.route || `/docs/${doc.id}`,
                      className: "group block",
                      children: /* @__PURE__ */ jsxs("div", {
                        className: "hover:border-primary h-full rounded-lg border p-4 transition-colors",
                        children: [
                          /* @__PURE__ */ jsx("h4", {
                            className: "group-hover:text-primary mb-1 font-semibold",
                            children: doc.title
                          }),
                          doc.summary && /* @__PURE__ */ jsx("p", {
                            className: "text-muted-foreground line-clamp-2 text-sm",
                            children: doc.summary
                          })
                        ]
                      })
                    }, doc.id))
                  })
                ]
              })
            })
          }) : null
        ]
      })
    ]
  });
}
export {
  FeaturePresentationDetailTemplate
};
