@arbidocs/blocks 0.4.137 → 0.4.138

package/dist/{chunk-ATJUVHVB.js → chunk-XVME4XYD.js}

@@ -1,19 +1,19 @@
 "use client";
-import { UploadDropzone } from './chunk-EVUEIBNU.js';
+import { FoldSection, QuickActionDialogHeader, AddFilesFirst, StartTiles, ScopePicker } from './chunk-3RJN2VTL.js';
 import { DocumentPicker, TriStateFilterMenu } from './chunk-KSHKTOY2.js';
 import { EmptyState } from './chunk-P6GHJSLR.js';
-import { FoldSection, QuickActionDialogHeader, AddFilesFirst, StartTiles, ScopePicker } from './chunk-3RJN2VTL.js';
+import { UploadDropzone } from './chunk-EVUEIBNU.js';
 import { SelectionBar, SelectionBarAction } from './chunk-NUNKSZKU.js';
 import { FilterInput } from './chunk-YU2KUMGE.js';
 import { GridView } from './chunk-N5YEF3LC.js';
 import { TabHeader } from './chunk-4WWM3GQ5.js';
-import { defaultInputs, validateInputs, workflowSteps, canAssign, fieldToFrontmatter, workflowFromFrontmatter, nextAction, validateStep, assigneeName, runFieldsOf, failedUpstream, stepPhase, useElementSize, sendBackTargets, formatDate, shownValue, stepKindOf, stepLevels, waitingDocuments, stepDependencies, reviewInstructions, splitDocRef, isPersonStep, eventWaitingDocuments, waitingForDocumentsText, StepBadgeMark, StepChip, buildLaunch, STEP_KIND_ICONS, DEFAULT_STEP_KIND_LABELS, composeStepPrompt, isRunFinished, runFields, isWorkflowScope } from './chunk-YOMPLCP6.js';
+import { defaultInputs, validateInputs, workflowSteps, canAssign, fieldToFrontmatter, workflowFromFrontmatter, nextAction, validateStep, assigneeName, runFieldsOf, failedUpstream, stepPhase, useElementSize, sendBackTargets, formatDate, shownValue, stepKindOf, stepLevels, waitingDocuments, stepDependencies, reviewInstructions, splitDocRef, isPersonStep, mergeSkillWorkflows, eventWaitingDocuments, waitingForDocumentsText, StepBadgeMark, StepChip, buildLaunch, STEP_KIND_ICONS, DEFAULT_STEP_KIND_LABELS, composeStepPrompt, isRunFinished, runFields, isWorkflowScope } from './chunk-Y5KTM3V5.js';
 import { TONE_DOT, TONE_SURFACE, TONE_SOLID_BORDER, TONE_BORDER } from './chunk-AUS3KBHJ.js';
 import { testIdOr, prefixedTestId } from './chunk-7F6CBP3Z.js';
 import { initials } from './chunk-OXF2IFXG.js';
 import { useState, useRef, useCallback, useId, useMemo, useEffect } from 'react';
-import { Loader2, Play, FolderPlus, ImageIcon, X, UserRound, CornerUpLeft, ShieldCheck, MessageSquare, Check, Hourglass, Clock, PenLine, ExternalLink, Mail, Table2, CheckCircle2, ArrowLeft, ArrowRight, RotateCw, GitBranch, AlertTriangle, MoreHorizontal, History, Pencil, Trash2, Workflow, ChevronLeft, ChevronRight, FileText, Link2, Bell, MousePointerClick, ArrowUpRight, BellRing, Flag, RotateCcw, Disc, Phone, UserRoundCog, Sparkles, MessageSquareReply, Square, KeyRound, Lock } from 'lucide-react';
-import { cn, Label, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, Dialog, DialogContent, Button, getEntityColor, Popover, PopoverTrigger, PopoverContent, Textarea, Card, UserEntity, getEntityColorStyles, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, badgeVariants, VisibilityToggle, Switch, Input } from '@arbidocs/react/ui';
+import { Loader2, Play, FolderPlus, ImageIcon, X, UserRound, CornerUpLeft, ShieldCheck, MessageSquare, Check, Hourglass, Clock, PenLine, ExternalLink, Mail, Table2, CheckCircle2, ArrowLeft, ArrowRight, RotateCw, GitBranch, AlertTriangle, Globe, Wand2, Copy, Pencil, Lock, Download, Trash2, MoreHorizontal, History, Workflow, LayoutGrid, List, ChevronLeft, ChevronRight, FileText, Link2, Bell, MousePointerClick, ArrowUpRight, BellRing, Flag, RotateCcw, Disc, Phone, UserRoundCog, Sparkles, MessageSquareReply, Square, KeyRound } from 'lucide-react';
+import { cn, Label, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, Dialog, DialogContent, Button, getEntityColor, Popover, PopoverTrigger, PopoverContent, Textarea, Card, Tooltip, TooltipTrigger, TooltipContent, Input, UserEntity, getEntityColorStyles, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, badgeVariants, VisibilityToggle, Switch } from '@arbidocs/react/ui';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { unzip, strFromU8 } from 'fflate';
 
@@ -2972,6 +2972,407 @@ function StepNotices({
     ))
   ] });
 }
+function SkillTypeBadge({ type, className }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "shrink-0 rounded bg-background px-1.5 py-0.5 text-xs uppercase tracking-wide text-muted-foreground",
+        className
+      ),
+      "data-slot": "skill-type-badge",
+      children: type
+    }
+  );
+}
+var DEFAULT_SKILL_GLOBAL_BADGE_LABELS = {
+  global: "Global",
+  globalTitle: "Shared with everyone in the marketplace"
+};
+function SkillGlobalBadge({
+  className,
+  labels
+}) {
+  const l = { ...DEFAULT_SKILL_GLOBAL_BADGE_LABELS, ...labels };
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: cn(
+        "inline-flex shrink-0 items-center gap-1 rounded bg-accent px-1.5 py-0.5 text-xs uppercase tracking-wide text-accent-foreground",
+        className
+      ),
+      title: l.globalTitle,
+      "data-slot": "skill-global-badge",
+      children: [
+        /* @__PURE__ */ jsx(Globe, { className: "size-3" }),
+        l.global
+      ]
+    }
+  );
+}
+function SkillActionButton({
+  label,
+  tooltip,
+  onClick,
+  children,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, onFocusCapture: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        className: "size-7 shrink-0 pointer-coarse:size-11",
+        onClick: (e) => {
+          e.stopPropagation();
+          onClick(e);
+        },
+        "aria-label": label,
+        "data-testid": testId,
+        children
+      }
+    ) }),
+    /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: tooltip ?? label }) })
+  ] });
+}
+function activateOnKey(handler) {
+  return (e) => {
+    if (e.target !== e.currentTarget) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handler();
+    }
+  };
+}
+var DEFAULT_SKILL_GENERATE_FORM_LABELS = {
+  title: "Generate with AI",
+  hint: "Describe what the skill should do. The assistant drafts it in chat, then you can edit it here.",
+  placeholder: "e.g. Summarize a contract into key obligations, dates, and parties",
+  generate: "Generate with AI",
+  writeManually: "\u2026or write it manually"
+};
+function SkillGenerateForm({
+  onGenerate,
+  onManual,
+  icon,
+  labels,
+  testIds
+}) {
+  const l = { ...DEFAULT_SKILL_GENERATE_FORM_LABELS, ...labels };
+  const [desc, setDesc] = useState("");
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-4 overflow-y-auto p-4", "data-slot": "skill-generate-form", children: [
+    /* @__PURE__ */ jsxs("div", { className: "rounded-lg bg-muted p-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "mb-1 flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(Wand2, { className: "size-4 text-primary" }),
+        /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: l.title })
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "mb-3 text-xs text-muted-foreground", children: l.hint }),
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          value: desc,
+          onChange: (e) => setDesc(e.target.value),
+          rows: 4,
+          placeholder: l.placeholder,
+          "data-testid": testIdOr(testIds?.description, { testId: "skills-panel-ai-desc" })
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "mt-3 flex justify-end", children: /* @__PURE__ */ jsxs(
+        Button,
+        {
+          size: "sm",
+          disabled: !desc.trim(),
+          onClick: () => onGenerate(desc.trim()),
+          "data-testid": testIdOr(testIds?.generate, { testId: "skills-panel-ai-generate" }),
+          children: [
+            icon && /* @__PURE__ */ jsx("span", { className: "mr-1 [&>svg]:size-4", children: icon }),
+            l.generate
+          ]
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "self-start text-sm text-muted-foreground underline-offset-2 hover:text-foreground hover:underline pointer-coarse:min-h-11",
+        onClick: onManual,
+        "data-testid": testIdOr(testIds?.writeManually, { testId: "skills-panel-write-manually" }),
+        children: l.writeManually
+      }
+    )
+  ] });
+}
+var DEFAULT_SKILL_EDIT_FORM_LABELS = {
+  name: "Name",
+  namePlaceholder: "contract-summary",
+  invokedAs: (name) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    "Invoked as ",
+    /* @__PURE__ */ jsxs("span", { className: "font-mono", children: [
+      "/",
+      name || "skill-name"
+    ] })
+  ] }),
+  description: "Description",
+  descriptionPlaceholder: "What it does and when to use it",
+  instructions: "Instructions",
+  cancel: "Cancel",
+  saving: "Saving\u2026",
+  saveChanges: "Save changes",
+  create: "Create skill"
+};
+var FIELD_LABEL = "text-xs font-semibold uppercase tracking-wide text-muted-foreground";
+function SkillEditForm({
+  name,
+  onNameChange,
+  isNameLocked,
+  nameError,
+  description,
+  onDescriptionChange,
+  editor,
+  isSaving,
+  isEditing,
+  onSave,
+  onCancel,
+  labels,
+  testIds
+}) {
+  const l = { ...DEFAULT_SKILL_EDIT_FORM_LABELS, ...labels };
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-0 flex-col", "data-slot": "skill-edit-form", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto p-4", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "sp-name", className: FIELD_LABEL, children: l.name }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "sp-name",
+            value: name,
+            disabled: isNameLocked,
+            placeholder: l.namePlaceholder,
+            onChange: (e) => onNameChange(e.target.value),
+            className: "mt-1",
+            "data-testid": testIdOr(testIds?.name, { testId: "skills-panel-edit-name" })
+          }
+        ),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: l.invokedAs(name) }),
+        nameError && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-destructive", children: nameError })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "sp-desc", className: FIELD_LABEL, children: l.description }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "sp-desc",
+            value: description,
+            placeholder: l.descriptionPlaceholder,
+            onChange: (e) => onDescriptionChange(e.target.value),
+            className: "mt-1",
+            "data-testid": testIdOr(testIds?.description, { testId: "skills-panel-edit-desc" })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [
+        /* @__PURE__ */ jsx(Label, { className: `${FIELD_LABEL} mb-1`, children: l.instructions }),
+        /* @__PURE__ */ jsx("div", { className: "min-h-[240px] flex-1 overflow-hidden rounded-md border border-border", children: editor })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col-reverse sm:flex-row sm:justify-end gap-2 border-t border-border px-4 py-3", children: [
+      /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onClick: onCancel, children: l.cancel }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "sm",
+          onClick: onSave,
+          disabled: isSaving,
+          "data-testid": testIdOr(testIds?.save, { testId: "skills-panel-edit-save" }),
+          children: isSaving ? l.saving : isEditing ? l.saveChanges : l.create
+        }
+      )
+    ] })
+  ] });
+}
+function SkillFilterChips({
+  options,
+  value,
+  onChange,
+  label,
+  testIdPrefix = "skills-filter",
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "radiogroup",
+      "aria-label": label,
+      className: cn("flex flex-wrap gap-2", className),
+      "data-slot": "skill-filter-chips",
+      children: options.map((option) => {
+        const selected = option.id === value;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            role: "radio",
+            "aria-checked": selected,
+            onClick: () => onChange(option.id),
+            "data-testid": `${testIdPrefix}-${option.id}`,
+            className: cn(
+              "inline-flex min-h-8 items-center gap-1.5 rounded-full border px-3 text-sm transition-colors pointer-coarse:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              selected ? "border-primary bg-primary/10 text-foreground" : "border-border bg-background text-muted-foreground [&:hover]:bg-muted"
+            ),
+            children: [
+              option.label,
+              option.count !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: option.count })
+            ]
+          },
+          option.id
+        );
+      })
+    }
+  );
+}
+var DEFAULT_SKILL_VIEW_TOGGLE_LABELS = {
+  group: "View",
+  gallery: "Gallery",
+  list: "List"
+};
+function SkillViewToggle({ value, onChange, labels, testId }) {
+  const l = { ...DEFAULT_SKILL_VIEW_TOGGLE_LABELS, ...labels };
+  const item = (view, label, icon) => /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      role: "radio",
+      "aria-checked": value === view,
+      "aria-label": label,
+      title: label,
+      onClick: () => onChange(view),
+      "data-testid": `${testId ?? "skills-view-toggle"}-${view}`,
+      className: cn(
+        "flex size-8 items-center justify-center rounded-md pointer-coarse:size-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        value === view ? "bg-background text-foreground shadow-sm" : "text-muted-foreground"
+      ),
+      children: icon
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "radiogroup",
+      "aria-label": l.group,
+      className: "inline-flex shrink-0 gap-0.5 rounded-lg bg-muted p-0.5",
+      "data-testid": testId ?? "skills-view-toggle",
+      children: [
+        item("gallery", l.gallery, /* @__PURE__ */ jsx(LayoutGrid, { className: "size-4" })),
+        item("list", l.list, /* @__PURE__ */ jsx(List, { className: "size-4" }))
+      ]
+    }
+  );
+}
+function SkillTile({
+  name,
+  description,
+  sourceLabel,
+  type,
+  icon,
+  layout,
+  selected,
+  onSelect,
+  testId
+}) {
+  const isRow = layout === "list";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "button",
+      tabIndex: 0,
+      "aria-pressed": selected,
+      onClick: onSelect,
+      onKeyDown: activateOnKey(onSelect),
+      "data-testid": testId ?? `skill-tile-${name}`,
+      "data-skill-name": name,
+      "data-slot": "skill-tile",
+      className: cn(
+        "flex cursor-pointer rounded-lg border p-3 text-left transition-colors pointer-coarse:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        isRow ? "items-center gap-3" : "h-full flex-col gap-2",
+        selected ? "border-primary bg-primary/5" : "border-transparent bg-muted [&:hover]:bg-accent"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+          icon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-ai-ink [&>svg]:size-5", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-sm font-semibold text-foreground", children: name })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: cn(
+              "min-w-0 text-sm text-muted-foreground",
+              isRow ? "flex-1 truncate max-sm:hidden" : "line-clamp-3"
+            ),
+            children: description
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: cn("flex shrink-0 items-center gap-1.5", isRow && "ml-auto"), children: [
+          type && type !== "markdown" && /* @__PURE__ */ jsx("span", { className: "rounded bg-background px-1.5 py-0.5 text-xs uppercase tracking-wide text-muted-foreground", children: type }),
+          /* @__PURE__ */ jsx("span", { className: "rounded bg-background px-1.5 py-0.5 text-xs text-muted-foreground", children: sourceLabel })
+        ] })
+      ]
+    }
+  );
+}
+function SkillDetail({
+  title,
+  sourceLabel,
+  description,
+  icon,
+  notice,
+  children,
+  actions,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: "flex min-h-0 flex-1 flex-col",
+      "data-testid": testId ?? "skill-detail",
+      "data-slot": "skill-detail",
+      "aria-label": title,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "min-h-0 flex-1 space-y-4 overflow-y-auto p-4", children: [
+          /* @__PURE__ */ jsxs("header", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+              icon && /* @__PURE__ */ jsx("span", { className: "text-ai-ink [&>svg]:size-5", children: icon }),
+              /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold text-foreground", children: title }),
+              /* @__PURE__ */ jsx("span", { className: "rounded bg-muted px-1.5 py-0.5 text-xs text-muted-foreground", children: sourceLabel })
+            ] }),
+            description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description }),
+            notice && /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground", children: notice })
+          ] }),
+          children
+        ] }),
+        actions && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "flex flex-wrap gap-2 border-t border-border bg-background p-3",
+            "data-slot": "skill-detail-actions",
+            children: actions
+          }
+        )
+      ]
+    }
+  );
+}
+function SkillDetailSection({
+  title,
+  children,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", "data-testid": testId, children: [
+    /* @__PURE__ */ jsx("h4", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: title }),
+    children
+  ] });
+}
 
 // src/agents/skills/skillFiles.ts
 var SKILL_TYPES = ["markdown", "python", "shell", "javascript", "typescript"];
@@ -3174,6 +3575,201 @@ async function importSkillFromUrl(url) {
   const last = parsed.pathname.split("/").filter(Boolean).pop() ?? "skill";
   return importMarkdownSkill(last.includes(".") ? last : `${last}.md`, text);
 }
+
+// src/agents/skills/skillLibrary.ts
+var SKILL_SOURCE_LABELS = {
+  builtin: "Built in",
+  mine: "Yours",
+  shared: "Shared"
+};
+var SKILL_TYPE_LABELS = {
+  markdown: "Instructions",
+  python: "Python",
+  shell: "Shell",
+  javascript: "JavaScript",
+  typescript: "TypeScript"
+};
+var SKILL_FIELD_TYPE_LABELS = {
+  text: "Short answer",
+  longtext: "Free text",
+  boolean: "Yes or no",
+  select: "A choice",
+  number: "A number",
+  date: "A date",
+  scope: "Which files",
+  documents: "Pick files",
+  person: "A person"
+};
+function buildLibrarySkills(builtins, listings) {
+  const { host, skills } = mergeSkillWorkflows(builtins, listings);
+  const builtinIds = new Set(builtins.map((w) => w.id));
+  const stored = new Map(listings.filter((s) => s.doc_ext_id).map((s) => [s.slug, s]));
+  return [...host, ...skills].flatMap((workflow) => {
+    if (workflow.run.kind !== "prompt") return [];
+    const listing = stored.get(workflow.id);
+    if (!listing?.doc_ext_id) {
+      if (!builtinIds.has(workflow.id)) return [];
+      return [
+        {
+          slug: workflow.id,
+          title: workflow.title,
+          description: workflow.description,
+          source: "builtin",
+          type: "markdown",
+          isShared: false,
+          replacesBuiltin: false,
+          workflow
+        }
+      ];
+    }
+    const mine = listing.is_owner ?? true;
+    return [
+      {
+        slug: workflow.id,
+        title: workflow.title,
+        description: listing.description || workflow.description,
+        source: mine ? "mine" : "shared",
+        type: listing.skill_type ?? "markdown",
+        isShared: mine && listing.visibility === "global",
+        replacesBuiltin: mine && builtinIds.has(listing.slug),
+        workflow,
+        docExtId: listing.doc_ext_id
+      }
+    ];
+  });
+}
+function filterLibrarySkills(skills, f) {
+  const q = f.query.trim().toLowerCase();
+  return skills.filter((s) => f.source === "all" || s.source === f.source).filter((s) => f.type === "all" || s.type === f.type).filter(
+    (s) => !q || s.title.toLowerCase().includes(q) || s.slug.toLowerCase().includes(q) || s.description.toLowerCase().includes(q)
+  );
+}
+var ACTION = "pointer-coarse:min-h-11";
+function SkillLibraryDetail({
+  skill,
+  instructions,
+  isLoading,
+  actions,
+  icon
+}) {
+  const fields = skill.workflow.inputs;
+  const isOwner = skill.source === "mine";
+  const canCopy = skill.source !== "mine";
+  const notice = skill.replacesBuiltin ? "Your copy is used instead of the original; delete it to go back." : skill.isShared ? "Shared with everyone." : void 0;
+  return /* @__PURE__ */ jsxs(
+    SkillDetail,
+    {
+      title: skill.title,
+      sourceLabel: SKILL_SOURCE_LABELS[skill.source],
+      description: skill.description,
+      icon,
+      notice,
+      testId: "skill-detail",
+      actions: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(Button, { onClick: actions.onRun, className: ACTION, "data-testid": "skill-run", children: [
+          /* @__PURE__ */ jsx(Play, { className: "mr-1.5 size-4" }),
+          "Run"
+        ] }),
+        canCopy && /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "outline",
+            onClick: actions.onCopy,
+            disabled: actions.isBusy,
+            className: ACTION,
+            "data-testid": "skill-copy",
+            children: [
+              /* @__PURE__ */ jsx(Copy, { className: "mr-1.5 size-4" }),
+              "Make a copy"
+            ]
+          }
+        ),
+        isOwner && /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "outline",
+            onClick: actions.onEdit,
+            className: ACTION,
+            "data-testid": "skill-edit",
+            children: [
+              /* @__PURE__ */ jsx(Pencil, { className: "mr-1.5 size-4" }),
+              "Edit"
+            ]
+          }
+        ),
+        isOwner && /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "outline",
+            onClick: actions.onToggleShare,
+            disabled: actions.isBusy,
+            className: ACTION,
+            "data-testid": "skill-share",
+            children: [
+              skill.isShared ? /* @__PURE__ */ jsx(Lock, { className: "mr-1.5 size-4" }) : /* @__PURE__ */ jsx(Globe, { className: "mr-1.5 size-4" }),
+              skill.isShared ? "Make private" : "Share with everyone"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "outline",
+            onClick: actions.onExport,
+            className: ACTION,
+            "data-testid": "skill-export",
+            children: [
+              /* @__PURE__ */ jsx(Download, { className: "mr-1.5 size-4" }),
+              "Export"
+            ]
+          }
+        ),
+        isOwner && /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "ghost",
+            onClick: actions.onDelete,
+            disabled: actions.isBusy,
+            className: `${ACTION} ml-auto text-destructive`,
+            "data-testid": "skill-delete",
+            children: [
+              /* @__PURE__ */ jsx(Trash2, { className: "mr-1.5 size-4" }),
+              "Delete"
+            ]
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ jsx(SkillDetailSection, { title: "What it asks you", testId: "skill-inputs", children: fields.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Nothing: it starts right away." }) : /* @__PURE__ */ jsx("ul", { className: "space-y-1 text-sm", children: fields.map((field) => /* @__PURE__ */ jsxs("li", { className: "flex flex-wrap items-baseline gap-x-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "font-medium", children: field.label }),
+          /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+            SKILL_FIELD_TYPE_LABELS[field.type],
+            field.required ? "" : ", optional"
+          ] })
+        ] }, field.name)) }) }),
+        /* @__PURE__ */ jsxs(
+          SkillDetailSection,
+          {
+            title: skill.type === "markdown" ? "Instructions" : `Instructions (${SKILL_TYPE_LABELS[skill.type] ?? skill.type})`,
+            children: [
+              isLoading ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Loading\u2026" }) : /* @__PURE__ */ jsx(
+                "pre",
+                {
+                  className: "max-h-72 overflow-auto whitespace-pre-wrap break-words rounded-md bg-muted p-3 font-mono text-xs",
+                  tabIndex: 0,
+                  "aria-label": "Instructions",
+                  "data-testid": "skill-instructions",
+                  children: instructions || "No instructions."
+                }
+              ),
+              !isOwner && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "You can read these. Make a copy to change them." })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
 function PersonPill({ person, size = "sm", testId }) {
   return /* @__PURE__ */ jsx("span", { "data-testid": testId, className: "inline-flex min-w-0", children: /* @__PURE__ */ jsx(
     UserEntity,
@@ -4048,6 +4644,6 @@ function TaskActivityTimeline({
   }) });
 }
 
-export { ActionStepBody, AgentSelect, ApprovalEvidence, AssigneeLine, DEFAULT_AGENT_SELECT_LABELS, DEFAULT_SCHEMA_FORM_LABELS, DEFAULT_STEP_BAR_LABELS, DEFAULT_TASK_ACTIVITY_LABELS, DEFAULT_TASK_TRIGGER_CHIP_LABELS, DEFAULT_WORKFLOW_CONFIG_DIALOG_LABELS, DEFAULT_WORKFLOW_DOCUMENTS_FIELD_LABELS, DEFAULT_WORKFLOW_LIST_LABELS, DEFAULT_WORKFLOW_RUNNER_LABELS, DEFAULT_WORKFLOW_STEP_PARTS_LABELS, PersonPill, SKILL_MAIN_FILENAME, SKILL_TYPES, STEP_LABEL, STEP_LABEL_CURRENT, STEP_LABEL_MAX, SchemaForm, SendBackControl, StepBarFrame, TaskActivityTimeline, TaskTriggerChip, WORKFLOW_COLUMN_ORDER, WorkflowConfigDialog, WorkflowDocumentsField, WorkflowLauncher, WorkflowRunner, WorkflowStepBar, WorkflowsTable, activeStepId, buildWorkflowScopeSource, buildZipSkillImport, createWorkflowColumns, documentScopeLabels, fromPlanAssignee, fromPlanDocumentRef, fromPlanSteps, hasTrigger, importMarkdownSkill, importSkillFile, importSkillFromUrl, isIncompleteSignal, isMainSkillFile, isSkillRow, layoutFromPlanSteps, matchWorkflowScope, parseSkillFrontmatter, readSkillArchive, serializeSkill, skillSlug, stepWindow, taskActivityHeadline, toPlanAssignee, toPlanDocumentRef, toPlanSteps, useControllableState, useWorkflowView, workflowFromSkillMarkdown, workflowRunStatusLabel, workflowStatus, workflowToSkillMarkdown, workflowTriggerType };
-//# sourceMappingURL=chunk-ATJUVHVB.js.map
-//# sourceMappingURL=chunk-ATJUVHVB.js.map
+export { ActionStepBody, AgentSelect, ApprovalEvidence, AssigneeLine, DEFAULT_AGENT_SELECT_LABELS, DEFAULT_SCHEMA_FORM_LABELS, DEFAULT_SKILL_EDIT_FORM_LABELS, DEFAULT_SKILL_GENERATE_FORM_LABELS, DEFAULT_SKILL_GLOBAL_BADGE_LABELS, DEFAULT_SKILL_VIEW_TOGGLE_LABELS, DEFAULT_STEP_BAR_LABELS, DEFAULT_TASK_ACTIVITY_LABELS, DEFAULT_TASK_TRIGGER_CHIP_LABELS, DEFAULT_WORKFLOW_CONFIG_DIALOG_LABELS, DEFAULT_WORKFLOW_DOCUMENTS_FIELD_LABELS, DEFAULT_WORKFLOW_LIST_LABELS, DEFAULT_WORKFLOW_RUNNER_LABELS, DEFAULT_WORKFLOW_STEP_PARTS_LABELS, PersonPill, SKILL_FIELD_TYPE_LABELS, SKILL_MAIN_FILENAME, SKILL_SOURCE_LABELS, SKILL_TYPES, SKILL_TYPE_LABELS, STEP_LABEL, STEP_LABEL_CURRENT, STEP_LABEL_MAX, SchemaForm, SendBackControl, SkillActionButton, SkillDetail, SkillDetailSection, SkillEditForm, SkillFilterChips, SkillGenerateForm, SkillGlobalBadge, SkillLibraryDetail, SkillTile, SkillTypeBadge, SkillViewToggle, StepBarFrame, TaskActivityTimeline, TaskTriggerChip, WORKFLOW_COLUMN_ORDER, WorkflowConfigDialog, WorkflowDocumentsField, WorkflowLauncher, WorkflowRunner, WorkflowStepBar, WorkflowsTable, activateOnKey, activeStepId, buildLibrarySkills, buildWorkflowScopeSource, buildZipSkillImport, createWorkflowColumns, documentScopeLabels, filterLibrarySkills, fromPlanAssignee, fromPlanDocumentRef, fromPlanSteps, hasTrigger, importMarkdownSkill, importSkillFile, importSkillFromUrl, isIncompleteSignal, isMainSkillFile, isSkillRow, layoutFromPlanSteps, matchWorkflowScope, parseSkillFrontmatter, readSkillArchive, serializeSkill, skillSlug, stepWindow, taskActivityHeadline, toPlanAssignee, toPlanDocumentRef, toPlanSteps, useControllableState, useWorkflowView, workflowFromSkillMarkdown, workflowRunStatusLabel, workflowStatus, workflowToSkillMarkdown, workflowTriggerType };
+//# sourceMappingURL=chunk-XVME4XYD.js.map
+//# sourceMappingURL=chunk-XVME4XYD.js.map