@nospt/plugin-dev-ai-hub 0.1.0

package/dist/components/AssetDetailPanel/AssetDetailPanel.esm.js

@@ -0,0 +1,324 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+import Alert from '@mui/material/Alert';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Chip from '@mui/material/Chip';
+import CircularProgress from '@mui/material/CircularProgress';
+import Divider from '@mui/material/Divider';
+import Drawer from '@mui/material/Drawer';
+import IconButton from '@mui/material/IconButton';
+import Link from '@mui/material/Link';
+import Snackbar from '@mui/material/Snackbar';
+import Tab from '@mui/material/Tab';
+import Tabs from '@mui/material/Tabs';
+import Typography from '@mui/material/Typography';
+import CloseIcon from '@mui/icons-material/Close';
+import ContentCopyIcon from '@mui/icons-material/ContentCopy';
+import FolderZipIcon from '@mui/icons-material/FolderZip';
+import OpenInNewIcon from '@mui/icons-material/OpenInNew';
+import { useAssetDetail } from '../../hooks/index.esm.js';
+
+const SyntaxHighlighter = require("react-syntax-highlighter/dist/esm/prism").default;
+const { oneLight } = require("react-syntax-highlighter/dist/esm/styles/prism");
+const TYPE_COLORS = {
+  instruction: "#1976d2",
+  agent: "#7b1fa2",
+  skill: "#388e3c",
+  workflow: "#f57c00"
+};
+function AssetDetailPanel({ assetId, onClose }) {
+  const [tab, setTab] = useState(0);
+  const [snackbar, setSnackbar] = useState(null);
+  const { asset, loading } = useAssetDetail(assetId);
+  const handleCopy = () => {
+    if (!asset) return;
+    navigator.clipboard.writeText(asset.content).then(
+      () => setSnackbar("Markdown copied to clipboard!")
+    );
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Drawer,
+      {
+        anchor: "right",
+        open: !!assetId,
+        onClose,
+        PaperProps: { sx: { width: { xs: "100vw", md: 640 } } },
+        children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", height: "100%" }, children: [
+          /* @__PURE__ */ jsxs(
+            Box,
+            {
+              sx: {
+                p: 2,
+                display: "flex",
+                alignItems: "flex-start",
+                gap: 2,
+                borderBottom: 1,
+                borderColor: "divider"
+              },
+              children: [
+                /* @__PURE__ */ jsx(Box, { sx: { flex: 1 }, children: loading || !asset ? /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+                  /* @__PURE__ */ jsx(CircularProgress, { size: 16 }),
+                  /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", children: "Loading..." })
+                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1, mb: 0.5 }, children: [
+                    /* @__PURE__ */ jsx(Typography, { variant: "h6", fontWeight: 700, children: asset.name }),
+                    /* @__PURE__ */ jsx(
+                      Chip,
+                      {
+                        label: asset.type,
+                        size: "small",
+                        sx: {
+                          backgroundColor: `${TYPE_COLORS[asset.type]}20`,
+                          color: TYPE_COLORS[asset.type],
+                          fontWeight: 600
+                        }
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", children: asset.description })
+                ] }) }),
+                /* @__PURE__ */ jsx(IconButton, { onClick: onClose, size: "small", children: /* @__PURE__ */ jsx(CloseIcon, {}) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Tabs,
+            {
+              value: tab,
+              onChange: (_, v) => setTab(v),
+              sx: { borderBottom: 1, borderColor: "divider", px: 2 },
+              children: [
+                /* @__PURE__ */ jsx(Tab, { label: "Preview" }),
+                /* @__PURE__ */ jsx(Tab, { label: "Metadata" }),
+                /* @__PURE__ */ jsx(Tab, { label: "Raw YAML" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(Box, { sx: { flex: 1, overflow: "auto", p: 2 }, children: [
+            loading && /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "center", pt: 4 }, children: /* @__PURE__ */ jsx(CircularProgress, {}) }),
+            !loading && asset && /* @__PURE__ */ jsxs(Fragment, { children: [
+              tab === 0 && /* @__PURE__ */ jsx(
+                Box,
+                {
+                  sx: {
+                    "& h1,h2,h3,h4,h5,h6": { mt: 2, mb: 1, fontWeight: 700 },
+                    "& p": { mb: 1, lineHeight: 1.7 },
+                    "& ul, & ol": { pl: 2.5, mb: 1 },
+                    "& li": { mb: 0.5 },
+                    "& blockquote": {
+                      borderLeft: "3px solid",
+                      borderColor: "primary.main",
+                      pl: 1.5,
+                      color: "text.secondary",
+                      my: 1,
+                      ml: 0
+                    },
+                    "& table": { width: "100%", borderCollapse: "collapse", mb: 1 },
+                    "& th, & td": {
+                      border: "1px solid",
+                      borderColor: "divider",
+                      px: 1.5,
+                      py: 0.75,
+                      fontSize: "0.875rem"
+                    },
+                    "& th": { backgroundColor: "action.hover", fontWeight: 700 },
+                    "& code": {
+                      bgcolor: "action.hover",
+                      px: 0.5,
+                      py: 0.2,
+                      borderRadius: 0.5,
+                      fontFamily: "monospace",
+                      fontSize: "0.875em"
+                    },
+                    "& pre code": { bgcolor: "transparent", px: 0, py: 0 }
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    ReactMarkdown,
+                    {
+                      remarkPlugins: [remarkGfm],
+                      components: {
+                        pre: ({ children }) => /* @__PURE__ */ jsx(Box, { sx: { my: 1 }, children }),
+                        code({ className, children }) {
+                          const match = /language-(\w+)/.exec(className || "");
+                          const code = String(children).replace(/\n$/, "");
+                          const isBlock = code.includes("\n") || !!match;
+                          return isBlock ? /* @__PURE__ */ jsx(
+                            SyntaxHighlighter,
+                            {
+                              style: oneLight,
+                              language: match?.[1] ?? "text",
+                              PreTag: "div",
+                              customStyle: {
+                                borderRadius: 8,
+                                fontSize: "0.8rem",
+                                margin: 0,
+                                border: "1px solid rgba(0,0,0,0.08)"
+                              },
+                              children: code
+                            }
+                          ) : /* @__PURE__ */ jsx("code", { className, children });
+                        }
+                      },
+                      children: asset.content
+                    }
+                  )
+                }
+              ),
+              tab === 1 && /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+                /* @__PURE__ */ jsx(MetaRow, { label: "Author", value: asset.author }),
+                /* @__PURE__ */ jsx(MetaRow, { label: "Version", value: asset.version }),
+                /* @__PURE__ */ jsx(MetaRow, { label: "Provider", value: asset.providerId }),
+                asset.commitSha && /* @__PURE__ */ jsx(MetaRow, { label: "Commit", value: asset.commitSha.slice(0, 8) }),
+                /* @__PURE__ */ jsx(MetaRow, { label: "Last synced", value: new Date(asset.syncedAt).toLocaleString() }),
+                /* @__PURE__ */ jsx(MetaRow, { label: "Branch", value: asset.branch }),
+                /* @__PURE__ */ jsx(Divider, {}),
+                /* @__PURE__ */ jsxs(Box, { children: [
+                  /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Compatible tools" }),
+                  /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 1, mt: 0.5 }, children: asset.tools.map((t) => /* @__PURE__ */ jsx(Chip, { label: t, size: "small" }, t)) })
+                ] }),
+                asset.tags.length > 0 && /* @__PURE__ */ jsxs(Box, { children: [
+                  /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Tags" }),
+                  /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 0.5, flexWrap: "wrap", mt: 0.5 }, children: asset.tags.map((t) => /* @__PURE__ */ jsx(Chip, { label: t, size: "small", variant: "outlined" }, t)) })
+                ] }),
+                asset.type === "skill" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(Divider, {}),
+                  /* @__PURE__ */ jsxs(Box, { children: [
+                    /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 0.75, mb: 0.5 }, children: [
+                      /* @__PURE__ */ jsx(FolderZipIcon, { sx: { fontSize: "0.85rem", color: "text.secondary" } }),
+                      /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Bundled files" })
+                    ] }),
+                    asset.resourcesContent && Object.keys(asset.resourcesContent).length > 0 ? /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 0.5, mt: 0.5 }, children: [
+                      /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", gap: 0.5, flexWrap: "wrap" }, children: [
+                        /* @__PURE__ */ jsx(
+                          Chip,
+                          {
+                            label: "SKILL.md",
+                            size: "small",
+                            sx: { fontFamily: "monospace", fontSize: "0.7rem", height: 20 }
+                          }
+                        ),
+                        Object.keys(asset.resourcesContent).map((p) => /* @__PURE__ */ jsx(
+                          Chip,
+                          {
+                            label: p,
+                            size: "small",
+                            variant: "outlined",
+                            sx: { fontFamily: "monospace", fontSize: "0.7rem", height: 20 }
+                          },
+                          p
+                        ))
+                      ] }),
+                      /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.disabled", children: "Downloads as .zip containing all files above." })
+                    ] }) : /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 0.5, flexWrap: "wrap", mt: 0.5 }, children: /* @__PURE__ */ jsx(
+                      Chip,
+                      {
+                        label: "SKILL.md",
+                        size: "small",
+                        sx: { fontFamily: "monospace", fontSize: "0.7rem", height: 20 }
+                      }
+                    ) })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(Divider, {}),
+                /* @__PURE__ */ jsxs(Box, { children: [
+                  /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Repository" }),
+                  /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(
+                    Link,
+                    {
+                      href: asset.repoUrl,
+                      target: "_blank",
+                      rel: "noopener noreferrer",
+                      variant: "body2",
+                      children: [
+                        asset.repoUrl,
+                        " ",
+                        /* @__PURE__ */ jsx(OpenInNewIcon, { sx: { fontSize: 12 } })
+                      ]
+                    }
+                  ) })
+                ] })
+              ] }),
+              tab === 2 && /* @__PURE__ */ jsx(
+                Box,
+                {
+                  component: "pre",
+                  sx: {
+                    bgcolor: "action.hover",
+                    p: 2,
+                    borderRadius: 1,
+                    overflow: "auto",
+                    fontSize: "0.8rem",
+                    fontFamily: "monospace",
+                    whiteSpace: "pre-wrap",
+                    wordBreak: "break-word",
+                    border: "1px solid",
+                    borderColor: "divider"
+                  },
+                  children: asset.yamlRaw
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(
+            Box,
+            {
+              sx: {
+                p: 2,
+                borderTop: 1,
+                borderColor: "divider",
+                display: "flex",
+                gap: 1,
+                flexWrap: "wrap"
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "contained",
+                    startIcon: /* @__PURE__ */ jsx(ContentCopyIcon, {}),
+                    onClick: handleCopy,
+                    disabled: !asset,
+                    children: "Copy Markdown"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "outlined",
+                    startIcon: /* @__PURE__ */ jsx(OpenInNewIcon, {}),
+                    onClick: () => asset && window.open(asset.repoUrl, "_blank"),
+                    disabled: !asset,
+                    children: "Open in Repo"
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Snackbar,
+      {
+        open: !!snackbar,
+        autoHideDuration: 2500,
+        onClose: () => setSnackbar(null),
+        anchorOrigin: { vertical: "bottom", horizontal: "center" },
+        children: /* @__PURE__ */ jsx(Alert, { severity: "success", onClose: () => setSnackbar(null), children: snackbar })
+      }
+    )
+  ] });
+}
+function MetaRow({ label, value }) {
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: label }),
+    /* @__PURE__ */ jsx(Typography, { variant: "body2", children: value })
+  ] });
+}
+
+export { AssetDetailPanel };
+//# sourceMappingURL=AssetDetailPanel.esm.js.map

package/dist/components/AssetDetailPanel/AssetDetailPanel.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetDetailPanel.esm.js","sources":["../../../src/components/AssetDetailPanel/AssetDetailPanel.tsx"],"sourcesContent":["import { useState } from 'react';\nimport ReactMarkdown from 'react-markdown';\nimport remarkGfm from 'remark-gfm';\nimport Alert from '@mui/material/Alert';\nimport Box from '@mui/material/Box';\nimport Button from '@mui/material/Button';\nimport Chip from '@mui/material/Chip';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Divider from '@mui/material/Divider';\nimport Drawer from '@mui/material/Drawer';\nimport IconButton from '@mui/material/IconButton';\nimport Link from '@mui/material/Link';\nimport Snackbar from '@mui/material/Snackbar';\nimport Tab from '@mui/material/Tab';\nimport Tabs from '@mui/material/Tabs';\nimport Typography from '@mui/material/Typography';\nimport CloseIcon from '@mui/icons-material/Close';\nimport ContentCopyIcon from '@mui/icons-material/ContentCopy';\nimport FolderZipIcon from '@mui/icons-material/FolderZip';\nimport OpenInNewIcon from '@mui/icons-material/OpenInNew';\nimport type { AssetType } from '@nospt/plugin-dev-ai-hub-common';\nimport { useAssetDetail } from '../../hooks';\n\n// eslint-disable-next-line @typescript-eslint/no-require-imports\nconst SyntaxHighlighter = require('react-syntax-highlighter/dist/esm/prism').default;\n// eslint-disable-next-line @typescript-eslint/no-require-imports\nconst { oneLight } = require('react-syntax-highlighter/dist/esm/styles/prism');\n\nconst TYPE_COLORS: Record<AssetType, string> = {\n  instruction: '#1976d2',\n  agent: '#7b1fa2',\n  skill: '#388e3c',\n  workflow: '#f57c00',\n};\n\ninterface AssetDetailPanelProps {\n  assetId: string | null;\n  onClose: () => void;\n}\n\nexport function AssetDetailPanel({ assetId, onClose }: AssetDetailPanelProps) {\n  const [tab, setTab] = useState(0);\n  const [snackbar, setSnackbar] = useState<string | null>(null);\n  const { asset, loading } = useAssetDetail(assetId);\n\n  const handleCopy = () => {\n    if (!asset) return;\n    navigator.clipboard.writeText(asset.content).then(() =>\n      setSnackbar('Markdown copied to clipboard!'),\n    );\n  };\n\n  return (\n    <>\n      <Drawer\n        anchor=\"right\"\n        open={!!assetId}\n        onClose={onClose}\n        PaperProps={{ sx: { width: { xs: '100vw', md: 640 } } }}\n      >\n        <Box sx={{ display: 'flex', flexDirection: 'column', height: '100%' }}>\n          {/* Header */}\n          <Box\n            sx={{\n              p: 2,\n              display: 'flex',\n              alignItems: 'flex-start',\n              gap: 2,\n              borderBottom: 1,\n              borderColor: 'divider',\n            }}\n          >\n            <Box sx={{ flex: 1 }}>\n              {loading || !asset ? (\n                <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n                  <CircularProgress size={16} />\n                  <Typography variant=\"body2\" color=\"text.secondary\">\n                    Loading...\n                  </Typography>\n                </Box>\n              ) : (\n                <>\n                  <Box sx={{ display: 'flex', alignItems: 'center', gap: 1, mb: 0.5 }}>\n                    <Typography variant=\"h6\" fontWeight={700}>\n                      {asset.name}\n                    </Typography>\n                    <Chip\n                      label={asset.type}\n                      size=\"small\"\n                      sx={{\n                        backgroundColor: `${TYPE_COLORS[asset.type]}20`,\n                        color: TYPE_COLORS[asset.type],\n                        fontWeight: 600,\n                      }}\n                    />\n                  </Box>\n                  <Typography variant=\"body2\" color=\"text.secondary\">\n                    {asset.description}\n                  </Typography>\n                </>\n              )}\n            </Box>\n            <IconButton onClick={onClose} size=\"small\">\n              <CloseIcon />\n            </IconButton>\n          </Box>\n\n          {/* Tabs */}\n          <Tabs\n            value={tab}\n            onChange={(_, v) => setTab(v)}\n            sx={{ borderBottom: 1, borderColor: 'divider', px: 2 }}\n          >\n            <Tab label=\"Preview\" />\n            <Tab label=\"Metadata\" />\n            <Tab label=\"Raw YAML\" />\n          </Tabs>\n\n          {/* Content */}\n          <Box sx={{ flex: 1, overflow: 'auto', p: 2 }}>\n            {loading && (\n              <Box sx={{ display: 'flex', justifyContent: 'center', pt: 4 }}>\n                <CircularProgress />\n              </Box>\n            )}\n\n            {!loading && asset && (\n              <>\n                {tab === 0 && (\n                  <Box\n                    sx={{\n                      '& h1,h2,h3,h4,h5,h6': { mt: 2, mb: 1, fontWeight: 700 },\n                      '& p': { mb: 1, lineHeight: 1.7 },\n                      '& ul, & ol': { pl: 2.5, mb: 1 },\n                      '& li': { mb: 0.5 },\n                      '& blockquote': {\n                        borderLeft: '3px solid',\n                        borderColor: 'primary.main',\n                        pl: 1.5,\n                        color: 'text.secondary',\n                        my: 1,\n                        ml: 0,\n                      },\n                      '& table': { width: '100%', borderCollapse: 'collapse', mb: 1 },\n                      '& th, & td': {\n                        border: '1px solid',\n                        borderColor: 'divider',\n                        px: 1.5,\n                        py: 0.75,\n                        fontSize: '0.875rem',\n                      },\n                      '& th': { backgroundColor: 'action.hover', fontWeight: 700 },\n                      '& code': {\n                        bgcolor: 'action.hover',\n                        px: 0.5,\n                        py: 0.2,\n                        borderRadius: 0.5,\n                        fontFamily: 'monospace',\n                        fontSize: '0.875em',\n                      },\n                      '& pre code': { bgcolor: 'transparent', px: 0, py: 0 },\n                    }}\n                  >\n                    <ReactMarkdown\n                      remarkPlugins={[remarkGfm]}\n                      components={{\n                        pre: ({ children }) => <Box sx={{ my: 1 }}>{children}</Box>,\n                        code({ className, children }) {\n                          const match = /language-(\\w+)/.exec(className || '');\n                          const code = String(children).replace(/\\n$/, '');\n                          const isBlock = code.includes('\\n') || !!match;\n                          return isBlock ? (\n                            <SyntaxHighlighter\n                              style={oneLight}\n                              language={match?.[1] ?? 'text'}\n                              PreTag=\"div\"\n                              customStyle={{\n                                borderRadius: 8,\n                                fontSize: '0.8rem',\n                                margin: 0,\n                                border: '1px solid rgba(0,0,0,0.08)',\n                              }}\n                            >\n                              {code}\n                            </SyntaxHighlighter>\n                          ) : (\n                            <code className={className}>{children}</code>\n                          );\n                        },\n                      }}\n                    >\n                      {asset.content}\n                    </ReactMarkdown>\n                  </Box>\n                )}\n\n                {tab === 1 && (\n                  <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>\n                    <MetaRow label=\"Author\" value={asset.author} />\n                    <MetaRow label=\"Version\" value={asset.version} />\n                    <MetaRow label=\"Provider\" value={asset.providerId} />\n                    {asset.commitSha && (\n                      <MetaRow label=\"Commit\" value={asset.commitSha.slice(0, 8)} />\n                    )}\n                    <MetaRow label=\"Last synced\" value={new Date(asset.syncedAt).toLocaleString()} />\n                    <MetaRow label=\"Branch\" value={asset.branch} />\n\n                    <Divider />\n\n                    <Box>\n                      <Typography variant=\"caption\" color=\"text.secondary\">\n                        Compatible tools\n                      </Typography>\n                      <Box sx={{ display: 'flex', gap: 1, mt: 0.5 }}>\n                        {asset.tools.map(t => (\n                          <Chip key={t} label={t} size=\"small\" />\n                        ))}\n                      </Box>\n                    </Box>\n\n                    {asset.tags.length > 0 && (\n                      <Box>\n                        <Typography variant=\"caption\" color=\"text.secondary\">\n                          Tags\n                        </Typography>\n                        <Box sx={{ display: 'flex', gap: 0.5, flexWrap: 'wrap', mt: 0.5 }}>\n                          {asset.tags.map(t => (\n                            <Chip key={t} label={t} size=\"small\" variant=\"outlined\" />\n                          ))}\n                        </Box>\n                      </Box>\n                    )}\n\n                   {asset.type === 'skill' && (\n                      <>\n                        <Divider />\n                        <Box>\n                          <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75, mb: 0.5 }}>\n                            <FolderZipIcon sx={{ fontSize: '0.85rem', color: 'text.secondary' }} />\n                            <Typography variant=\"caption\" color=\"text.secondary\">\n                              Bundled files\n                            </Typography>\n                          </Box>\n                          {asset.resourcesContent && Object.keys(asset.resourcesContent).length > 0 ? (\n                            <Box sx={{ display: 'flex', flexDirection: 'column', gap: 0.5, mt: 0.5 }}>\n                              <Box sx={{ display: 'flex', gap: 0.5, flexWrap: 'wrap' }}>\n                                <Chip\n                                  label=\"SKILL.md\"\n                                  size=\"small\"\n                                  sx={{ fontFamily: 'monospace', fontSize: '0.7rem', height: 20 }}\n                                />\n                                {Object.keys(asset.resourcesContent).map(p => (\n                                  <Chip\n                                    key={p}\n                                    label={p}\n                                    size=\"small\"\n                                    variant=\"outlined\"\n                                    sx={{ fontFamily: 'monospace', fontSize: '0.7rem', height: 20 }}\n                                  />\n                                ))}\n                              </Box>\n                              <Typography variant=\"caption\" color=\"text.disabled\">\n                                Downloads as .zip containing all files above.\n                              </Typography>\n                            </Box>\n                          ) : (\n                            <Box sx={{ display: 'flex', gap: 0.5, flexWrap: 'wrap', mt: 0.5 }}>\n                              <Chip\n                                label=\"SKILL.md\"\n                                size=\"small\"\n                                sx={{ fontFamily: 'monospace', fontSize: '0.7rem', height: 20 }}\n                              />\n                            </Box>\n                          )}\n                        </Box>\n                      </>\n                    )}\n\n                    <Divider />\n\n                    <Box>\n                      <Typography variant=\"caption\" color=\"text.secondary\">\n                        Repository\n                      </Typography>\n                      <Box>\n                        <Link\n                          href={asset.repoUrl}\n                          target=\"_blank\"\n                          rel=\"noopener noreferrer\"\n                          variant=\"body2\"\n                        >\n                          {asset.repoUrl} <OpenInNewIcon sx={{ fontSize: 12 }} />\n                        </Link>\n                      </Box>\n                    </Box>\n                  </Box>\n                )}\n\n                {tab === 2 && (\n                  <Box\n                    component=\"pre\"\n                    sx={{\n                      bgcolor: 'action.hover',\n                      p: 2,\n                      borderRadius: 1,\n                      overflow: 'auto',\n                      fontSize: '0.8rem',\n                      fontFamily: 'monospace',\n                      whiteSpace: 'pre-wrap',\n                      wordBreak: 'break-word',\n                      border: '1px solid',\n                      borderColor: 'divider',\n                    }}\n                  >\n                    {asset.yamlRaw}\n                  </Box>\n                )}\n              </>\n            )}\n          </Box>\n\n          {/* Actions */}\n          <Box\n            sx={{\n              p: 2,\n              borderTop: 1,\n              borderColor: 'divider',\n              display: 'flex',\n              gap: 1,\n              flexWrap: 'wrap',\n            }}\n          >\n            <Button\n              variant=\"contained\"\n              startIcon={<ContentCopyIcon />}\n              onClick={handleCopy}\n              disabled={!asset}\n            >\n              Copy Markdown\n            </Button>\n\n            <Button\n              variant=\"outlined\"\n              startIcon={<OpenInNewIcon />}\n              onClick={() => asset && window.open(asset.repoUrl, '_blank')}\n              disabled={!asset}\n            >\n              Open in Repo\n            </Button>\n          </Box>\n        </Box>\n      </Drawer>\n\n      <Snackbar\n        open={!!snackbar}\n        autoHideDuration={2500}\n        onClose={() => setSnackbar(null)}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }}\n      >\n        <Alert severity=\"success\" onClose={() => setSnackbar(null)}>\n          {snackbar}\n        </Alert>\n      </Snackbar>\n    </>\n  );\n}\n\nfunction MetaRow({ label, value }: { label: string; value: string }) {\n  return (\n    <Box>\n      <Typography variant=\"caption\" color=\"text.secondary\">\n        {label}\n      </Typography>\n      <Typography variant=\"body2\">{value}</Typography>\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/AssetFilters/AssetFilters.esm.js

@@ -0,0 +1,216 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import Box from '@mui/material/Box';
+import Chip from '@mui/material/Chip';
+import InputAdornment from '@mui/material/InputAdornment';
+import TextField from '@mui/material/TextField';
+import Typography from '@mui/material/Typography';
+import SearchIcon from '@mui/icons-material/Search';
+import StorageIcon from '@mui/icons-material/Storage';
+import ArticleIcon from '@mui/icons-material/Article';
+import SmartToyIcon from '@mui/icons-material/SmartToy';
+import BuildIcon from '@mui/icons-material/Build';
+import AccountTreeIcon from '@mui/icons-material/AccountTree';
+import AppsIcon from '@mui/icons-material/Apps';
+import { ToolIcon } from '../ToolIcon/ToolIcon.esm.js';
+
+const ASSET_TYPES = [
+  { value: "all", label: "All", color: "#64748b", Icon: AppsIcon },
+  { value: "instruction", label: "Instructions", color: "#2563EB", Icon: ArticleIcon },
+  { value: "agent", label: "Agents", color: "#7C3AED", Icon: SmartToyIcon },
+  { value: "skill", label: "Skills", color: "#059669", Icon: BuildIcon },
+  { value: "workflow", label: "Workflows", color: "#D97706", Icon: AccountTreeIcon }
+];
+const AI_TOOLS = [
+  { value: "all", label: "All Tools" },
+  { value: "claude-code", label: "Claude Code" },
+  { value: "github-copilot", label: "GitHub Copilot" },
+  { value: "google-gemini", label: "Google Gemini" },
+  { value: "cursor", label: "Cursor" }
+];
+function AssetFilters({ value, onChange, availableTags = [], providers }) {
+  const selectedType = value.types.length === 1 ? value.types[0] : "all";
+  const selectedTool = value.tools.length === 1 ? value.tools[0] : "all";
+  const showProviderFilter = providers && providers.length > 1;
+  const handleTypeClick = (type) => {
+    onChange({ ...value, types: type === "all" ? [] : [type] });
+  };
+  const handleToolClick = (tool) => {
+    onChange({ ...value, tools: tool === "all" ? [] : [tool] });
+  };
+  const handleTagToggle = (tag) => {
+    const next = value.tags.includes(tag) ? value.tags.filter((t) => t !== tag) : [...value.tags, tag];
+    onChange({ ...value, tags: next });
+  };
+  const handleProviderClick = (id) => {
+    onChange({ ...value, providerId: id });
+  };
+  return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 2, mb: 3 }, children: [
+    /* @__PURE__ */ jsx(
+      TextField,
+      {
+        fullWidth: true,
+        size: "small",
+        placeholder: "Search assets by name, description or content\u2026",
+        value: value.search,
+        onChange: (e) => onChange({ ...value, search: e.target.value }),
+        InputProps: {
+          startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx(SearchIcon, { fontSize: "small" }) })
+        },
+        sx: {
+          "& .MuiOutlinedInput-root": {
+            borderRadius: 2
+          }
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", gap: 3, flexWrap: "wrap", alignItems: "flex-start" }, children: [
+      /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", fontWeight: 600, color: "text.secondary", sx: { mb: 1, display: "block", textTransform: "uppercase", letterSpacing: 0.5 }, children: "Type" }),
+        /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 0.75, flexWrap: "wrap" }, children: ASSET_TYPES.map((t) => {
+          const isSelected = selectedType === t.value;
+          const TypeIcon = t.Icon;
+          return /* @__PURE__ */ jsx(
+            Chip,
+            {
+              icon: /* @__PURE__ */ jsx(TypeIcon, { sx: { fontSize: "0.9rem !important", color: isSelected ? "#fff !important" : t.color } }),
+              label: t.label,
+              size: "small",
+              clickable: true,
+              onClick: () => handleTypeClick(t.value),
+              sx: {
+                fontWeight: 600,
+                fontSize: "0.75rem",
+                borderRadius: 2,
+                border: "1.5px solid",
+                borderColor: isSelected ? t.color : `${t.color}60`,
+                backgroundColor: isSelected ? t.color : "transparent",
+                color: isSelected ? "#fff" : t.color,
+                transition: "all 0.15s ease",
+                "&:hover": {
+                  backgroundColor: isSelected ? t.color : `${t.color}18`,
+                  borderColor: t.color
+                }
+              }
+            },
+            t.value
+          );
+        }) })
+      ] }),
+      /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", fontWeight: 600, color: "text.secondary", sx: { mb: 1, display: "block", textTransform: "uppercase", letterSpacing: 0.5 }, children: "AI Tool" }),
+        /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 0.75, flexWrap: "wrap" }, children: AI_TOOLS.map((t) => {
+          const isSelected = selectedTool === t.value;
+          const iconEl = t.value !== "all" ? /* @__PURE__ */ jsx(ToolIcon, { tool: t.value, branded: !isSelected, sx: { fontSize: "0.85rem !important", color: isSelected ? "background.paper" : "inherit" } }) : void 0;
+          return /* @__PURE__ */ jsx(
+            Chip,
+            {
+              icon: iconEl,
+              label: t.label,
+              size: "small",
+              clickable: true,
+              onClick: () => handleToolClick(t.value),
+              sx: {
+                fontWeight: 600,
+                fontSize: "0.75rem",
+                borderRadius: 2,
+                border: "1.5px solid",
+                borderColor: isSelected ? "text.primary" : "divider",
+                backgroundColor: isSelected ? "text.primary" : "transparent",
+                color: isSelected ? "background.paper" : "text.secondary",
+                transition: "all 0.15s ease",
+                "&:hover": {
+                  borderColor: "text.primary",
+                  backgroundColor: isSelected ? "text.primary" : "action.hover"
+                }
+              }
+            },
+            t.value
+          );
+        }) })
+      ] }),
+      showProviderFilter && /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", fontWeight: 600, color: "text.secondary", sx: { mb: 1, display: "block", textTransform: "uppercase", letterSpacing: 0.5 }, children: "Provider" }),
+        /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", gap: 0.75, flexWrap: "wrap" }, children: [
+          /* @__PURE__ */ jsx(
+            Chip,
+            {
+              icon: /* @__PURE__ */ jsx(AppsIcon, { sx: { fontSize: "0.9rem !important" } }),
+              label: "All",
+              size: "small",
+              clickable: true,
+              onClick: () => handleProviderClick(void 0),
+              sx: {
+                fontWeight: 600,
+                fontSize: "0.75rem",
+                borderRadius: 2,
+                border: "1.5px solid",
+                borderColor: !value.providerId ? "text.primary" : "divider",
+                backgroundColor: !value.providerId ? "text.primary" : "transparent",
+                color: !value.providerId ? "background.paper" : "text.secondary",
+                transition: "all 0.15s ease",
+                "&:hover": {
+                  borderColor: "text.primary",
+                  backgroundColor: !value.providerId ? "text.primary" : "action.hover"
+                }
+              }
+            }
+          ),
+          providers.map((p) => {
+            const isSelected = value.providerId === p.id;
+            const label = p.target.split("/").slice(-1)[0]?.replace(/\.git$/, "") ?? p.id;
+            return /* @__PURE__ */ jsx(
+              Chip,
+              {
+                icon: /* @__PURE__ */ jsx(StorageIcon, { sx: { fontSize: "0.85rem !important", color: isSelected ? "background.paper" : "inherit" } }),
+                label,
+                size: "small",
+                clickable: true,
+                onClick: () => handleProviderClick(p.id),
+                sx: {
+                  fontWeight: 600,
+                  fontSize: "0.75rem",
+                  borderRadius: 2,
+                  border: "1.5px solid",
+                  borderColor: isSelected ? "text.primary" : "divider",
+                  backgroundColor: isSelected ? "text.primary" : "transparent",
+                  color: isSelected ? "background.paper" : "text.secondary",
+                  transition: "all 0.15s ease",
+                  "&:hover": {
+                    borderColor: "text.primary",
+                    backgroundColor: isSelected ? "text.primary" : "action.hover"
+                  }
+                }
+              },
+              p.id
+            );
+          })
+        ] })
+      ] })
+    ] }),
+    availableTags.length > 0 && /* @__PURE__ */ jsxs(Box, { children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", fontWeight: 600, color: "text.secondary", sx: { mb: 1, display: "block", textTransform: "uppercase", letterSpacing: 0.5 }, children: "Tags" }),
+      /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 0.75, flexWrap: "wrap" }, children: availableTags.map((tag) => /* @__PURE__ */ jsx(
+        Chip,
+        {
+          label: `#${tag}`,
+          size: "small",
+          clickable: true,
+          onClick: () => handleTagToggle(tag),
+          sx: {
+            fontSize: "0.7rem",
+            fontWeight: value.tags.includes(tag) ? 700 : 400,
+            borderRadius: 1.5,
+            backgroundColor: value.tags.includes(tag) ? "primary.main" : "transparent",
+            color: value.tags.includes(tag) ? "#fff" : "text.secondary",
+            border: "1px solid",
+            borderColor: value.tags.includes(tag) ? "primary.main" : "divider"
+          }
+        },
+        tag
+      )) })
+    ] })
+  ] });
+}
+
+export { AssetFilters };
+//# sourceMappingURL=AssetFilters.esm.js.map