import { e as createComponent, k as renderComponent, l as renderScript, r as renderTemplate, h as createAstro, m as maybeRenderHead, g as addAttribute, u as unescapeHTML } from '../chunks/astro/server_B-2LxKLH.mjs';
import 'piccolore';
import { _ as _export_sfc, $ as $$Base } from '../chunks/_plugin-vue_export-helper_B1lnwsE2.mjs';
import { useSSRContext, defineComponent, ref, mergeProps } from 'vue';
import { ssrRenderAttrs, ssrInterpolate } from 'vue/server-renderer';
import { g as getSkill } from '../chunks/skills_COWfD5oy.mjs';
import { marked } from 'marked';
export { renderers } from '../renderers.mjs';

const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "DeleteButton",
  props: {
    slug: {}
  },
  setup(__props, { expose: __expose }) {
    __expose();
    const props = __props;
    const deleting = ref(false);
    async function handleDelete() {
      if (!confirm(`Delete "${props.slug}"? This cannot be undone.`)) return;
      deleting.value = true;
      try {
        const res = await fetch(`/api/skills/${props.slug}`, { method: "DELETE" });
        if (!res.ok && res.status !== 204) {
          throw new Error("Failed to delete");
        }
        window.location.href = "/";
      } catch {
        alert("Failed to delete skill.");
        deleting.value = false;
      }
    }
    const __returned__ = { props, deleting, handleDelete };
    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
    return __returned__;
  }
});
function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
  _push(`<button${ssrRenderAttrs(mergeProps({
    disabled: $setup.deleting,
    class: "inline-flex items-center gap-1.5 rounded-lg border border-red-500/20 bg-red-500/5 px-3.5 py-2 text-sm font-medium text-red-400 hover:bg-red-500/10 hover:border-red-500/30 disabled:opacity-50 active:scale-[0.97] transition-all"
  }, _attrs))}><svg class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0"></path></svg> ${ssrInterpolate($setup.deleting ? "Deleting..." : "Delete")}</button>`);
}
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/DeleteButton.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
const DeleteButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["ssrRender", _sfc_ssrRender]]);

const $$Astro = createAstro();
const $$slug = createComponent(async ($$result, $$props, $$slots) => {
  const Astro2 = $$result.createAstro($$Astro, $$props, $$slots);
  Astro2.self = $$slug;
  const { slug } = Astro2.params;
  const skill = await getSkill(slug);
  if (!skill) {
    return Astro2.redirect("/");
  }
  const accept = Astro2.request.headers.get("accept") || "";
  if (!accept.includes("text/html")) {
    return new Response(skill.raw, {
      headers: { "Content-Type": "text/markdown; charset=utf-8" }
    });
  }
  const html = await marked(skill.content);
  const installCmd = `curl -fsSL ${Astro2.url.origin}/${slug} -o .claude/skills/${slug}.md`;
  return renderTemplate`${renderComponent($$result, "Base", $$Base, { "title": `${skill.name} \u2014 Skillit` }, { "default": async ($$result2) => renderTemplate` ${maybeRenderHead()}<div class="mb-8"> <a href="/" class="inline-flex items-center gap-1 text-sm text-gray-600 hover:text-gray-300 transition-colors mb-4"> <svg class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5 8.25 12l7.5-7.5"></path> </svg>
Back
</a> <div class="flex items-start justify-between gap-4"> <div> <h1 class="text-2xl font-bold tracking-tight text-white">${skill.name}</h1> ${skill.description && renderTemplate`<p class="text-gray-500 mt-1.5 leading-relaxed">${skill.description}</p>`} </div> <div class="flex items-center gap-2 shrink-0"> <a${addAttribute(`/${slug}/edit`, "href")} class="inline-flex items-center gap-1.5 rounded-lg border border-white/[0.08] bg-surface-200 px-3.5 py-2 text-sm font-medium text-gray-300 hover:border-white/[0.15] hover:text-white transition-all"> <svg class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"></path> </svg>
Edit
</a> ${renderComponent($$result2, "DeleteButton", DeleteButton, { "slug": slug, "client:load": true, "client:component-hydration": "load", "client:component-path": "/Users/alex/projects/skillit/src/components/DeleteButton.vue", "client:component-export": "default" })} </div> </div> </div> ${skill["allowed-tools"].length > 0 && renderTemplate`<div class="flex flex-wrap gap-1.5 mb-8"> ${skill["allowed-tools"].map((tool) => renderTemplate`<span class="rounded-md bg-white/[0.04] border border-white/[0.06] px-2.5 py-1 text-xs font-medium text-gray-400"> ${tool} </span>`)} </div>`} <div class="rounded-2xl border border-white/[0.06] bg-surface-100 p-6 mb-8 max-w-2xl space-y-4"> <h2 class="text-sm font-semibold text-white">Install this skill</h2> <p class="text-xs text-gray-500 leading-relaxed">Run this in your project root. The skill file will be saved to <code class="text-gray-400 font-mono bg-white/[0.04] px-1 py-0.5 rounded">.claude/skills/${slug}.md</code> and Claude Code will load it automatically.</p> <div class="flex items-center gap-3 rounded-xl bg-surface-50 border border-white/[0.06] px-4 py-3"> <code class="flex-1 text-xs font-mono text-gray-500 select-all truncate">${installCmd}</code> <button id="copy-install" class="shrink-0 rounded-md bg-white/[0.06] border border-white/[0.06] px-2.5 py-1 text-xs font-medium text-gray-400 hover:text-white hover:bg-white/[0.1] transition-all">
Copy
</button> </div> ${skill["allowed-tools"].length > 0 && renderTemplate`<p class="text-xs text-gray-600 leading-relaxed">This skill uses: ${skill["allowed-tools"].join(", ")}. Claude will have access to these tools when this skill is active.</p>`} </div> <article class="skill-prose rounded-2xl border border-white/[0.06] bg-surface-100 p-8">${unescapeHTML(html)}</article> ` })} ${renderScript($$result, "/Users/alex/projects/skillit/src/pages/[slug].astro?astro&type=script&index=0&lang.ts")}`;
}, "/Users/alex/projects/skillit/src/pages/[slug].astro", void 0);

const $$file = "/Users/alex/projects/skillit/src/pages/[slug].astro";
const $$url = "/[slug]";

const _page = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
  __proto__: null,
  default: $$slug,
  file: $$file,
  url: $$url
}, Symbol.toStringTag, { value: 'Module' }));

const page = () => _page;

export { page };