Initial commit

dist/server/pages/_slug_.astro.mjs

@@ -0,0 +1,90 @@
+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 };