@consilioweb/payload-support 0.5.2 → 0.6.0

package/dist/components/TicketConversation/components/AISummaryPanel.js

@@ -0,0 +1,76 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { s } from '../constants';
+
+function AISummaryPanel({
+  showAiSummary,
+  setShowAiSummary,
+  aiSummary,
+  aiGenerating,
+  aiSaving,
+  aiSaved,
+  handleAiGenerate,
+  handleAiSave
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => {
+          setShowAiSummary(!showAiSummary);
+          if (!showAiSummary && !aiSummary) handleAiGenerate();
+        },
+        style: {
+          ...s.ghostBtn("#7c3aed", false),
+          fontSize: "12px",
+          display: "inline-flex",
+          alignItems: "center",
+          gap: "6px"
+        },
+        children: showAiSummary ? "Masquer la synth\xE8se IA" : "Synth\xE8se IA"
+      }
+    ),
+    showAiSummary && /* @__PURE__ */ jsxs("div", { style: {
+      marginTop: "10px",
+      padding: "14px 18px",
+      borderRadius: "8px",
+      backgroundColor: "#faf5ff",
+      border: "1px solid #e9d5ff"
+    }, children: [
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: "10px" }, children: [
+        /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, color: "#7c3aed", margin: 0 }, children: "Synth\xE8se IA" }),
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px" }, children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: handleAiGenerate,
+              disabled: aiGenerating,
+              style: { ...s.outlineBtn("#7c3aed", aiGenerating), fontSize: "11px", padding: "4px 10px" },
+              children: aiGenerating ? "G\xE9n\xE9ration..." : "R\xE9g\xE9n\xE9rer"
+            }
+          ),
+          aiSummary && !aiGenerating && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: handleAiSave,
+              disabled: aiSaving || aiSaved,
+              style: { ...s.btn(aiSaved ? "#16a34a" : "#2563eb", aiSaving), fontSize: "11px", padding: "4px 10px" },
+              children: aiSaved ? "Sauvegard\xE9" : aiSaving ? "Sauvegarde..." : "Sauvegarder (note interne)"
+            }
+          )
+        ] })
+      ] }),
+      aiGenerating ? /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "10px", color: "#7c3aed", fontSize: "13px" }, children: "Analyse de la conversation en cours..." }) : aiSummary ? /* @__PURE__ */ jsx(
+        "div",
+        {
+          style: { fontSize: "13px", lineHeight: "1.7", color: "#1e1b4b", whiteSpace: "pre-wrap" },
+          dangerouslySetInnerHTML: {
+            __html: aiSummary.replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>").replace(/\n/g, "<br/>")
+          }
+        }
+      ) : /* @__PURE__ */ jsx("p", { style: { color: "#999", fontStyle: "italic", fontSize: "13px", margin: 0 }, children: `Cliquez sur "R\xE9g\xE9n\xE9rer" pour lancer l'analyse` })
+    ] })
+  ] });
+}
+
+export { AISummaryPanel };

package/dist/components/TicketConversation/components/ActionPanels.js

@@ -0,0 +1,118 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRef } from 'react';
+import { s } from '../constants';
+
+function MergePanel({
+  mergeTarget,
+  setMergeTarget,
+  mergeTargetInfo,
+  setMergeTargetInfo,
+  mergeError,
+  setMergeError,
+  merging,
+  handleMergeLookup,
+  handleMerge
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "14px 18px", borderRadius: "8px", backgroundColor: "#fdf2f8", border: "1px solid #fbcfe8", marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, marginBottom: "10px", color: "#831843" }, children: "Fusionner ce ticket dans un autre" }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center", marginBottom: "8px" }, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: mergeTarget,
+          onChange: (e) => {
+            setMergeTarget(e.target.value);
+            setMergeTargetInfo(null);
+            setMergeError("");
+          },
+          placeholder: "TK-0001",
+          style: { ...s.input, width: "130px" }
+        }
+      ),
+      /* @__PURE__ */ jsx("button", { onClick: handleMergeLookup, style: { ...s.outlineBtn("#ec4899"), fontSize: "12px", padding: "6px 14px" }, children: "Rechercher" }),
+      mergeError && /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", color: "#be185d", fontWeight: 600 }, children: mergeError })
+    ] }),
+    mergeTargetInfo && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsxs("span", { style: { fontSize: "13px", fontWeight: 600 }, children: [
+        mergeTargetInfo.ticketNumber,
+        " \u2014 ",
+        mergeTargetInfo.subject
+      ] }),
+      /* @__PURE__ */ jsx("button", { onClick: handleMerge, disabled: merging, style: { ...s.btn("#ec4899", merging), color: "#fff", fontSize: "12px", padding: "6px 14px" }, children: merging ? "Fusion..." : "Confirmer la fusion" })
+    ] })
+  ] });
+}
+function ExtMessagePanel({
+  extMsgBody,
+  setExtMsgBody,
+  extMsgAuthor,
+  setExtMsgAuthor,
+  extMsgDate,
+  setExtMsgDate,
+  extMsgFiles,
+  setExtMsgFiles,
+  sendingExtMsg,
+  handleSendExtMsg,
+  handleExtFileChange
+}) {
+  const extFileInputRef = useRef(null);
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "14px 18px", borderRadius: "8px", backgroundColor: "#eef2ff", border: "1px solid #c7d2fe", marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, marginBottom: "10px", color: "#312e81" }, children: "Ajouter un message re\xE7u (email, SMS, WhatsApp...)" }),
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        value: extMsgBody,
+        onChange: (e) => setExtMsgBody(e.target.value),
+        placeholder: "Coller le contenu du message re\xE7u...",
+        rows: 3,
+        style: { ...s.input, width: "100%", resize: "vertical", marginBottom: "10px" }
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center", flexWrap: "wrap", marginBottom: "10px" }, children: [
+      /* @__PURE__ */ jsxs("select", { value: extMsgAuthor, onChange: (e) => setExtMsgAuthor(e.target.value), style: { ...s.input, fontSize: "12px" }, children: [
+        /* @__PURE__ */ jsx("option", { value: "client", children: "Envoy\xE9 par le client" }),
+        /* @__PURE__ */ jsx("option", { value: "admin", children: "Envoy\xE9 par le support" })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "datetime-local",
+          value: extMsgDate,
+          onChange: (e) => setExtMsgDate(e.target.value),
+          style: { ...s.input, fontSize: "12px" }
+        }
+      ),
+      /* @__PURE__ */ jsx("input", { ref: extFileInputRef, type: "file", multiple: true, onChange: handleExtFileChange, style: { display: "none" }, accept: "image/*,.pdf,.doc,.docx,.txt,.zip" }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => extFileInputRef.current?.click(), style: { ...s.ghostBtn("#6b7280"), fontSize: "12px", padding: "6px 12px" }, children: "+ PJ" })
+    ] }),
+    extMsgFiles.length > 0 && /* @__PURE__ */ jsx("div", { style: { marginBottom: "10px", display: "flex", gap: "6px", flexWrap: "wrap" }, children: extMsgFiles.map((file, i) => /* @__PURE__ */ jsxs("span", { style: { ...s.badge("#f1f5f9", "#374151"), display: "inline-flex", alignItems: "center", gap: "4px" }, children: [
+      file.name,
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => setExtMsgFiles((prev) => prev.filter((_, idx) => idx !== i)), style: { border: "none", background: "none", color: "#ef4444", fontWeight: 700, cursor: "pointer", fontSize: "14px", lineHeight: 1 }, children: "\xD7" })
+    ] }, i)) }),
+    /* @__PURE__ */ jsx("button", { onClick: handleSendExtMsg, disabled: sendingExtMsg || !extMsgBody.trim(), style: s.btn("#818cf8", sendingExtMsg || !extMsgBody.trim()), children: sendingExtMsg ? "Ajout..." : "Ajouter (sans notification)" })
+  ] });
+}
+function SnoozePanel({ snoozeSaving, handleSnooze }) {
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "14px 18px", borderRadius: "8px", backgroundColor: "#faf5ff", border: "1px solid #e9d5ff", marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, marginBottom: "10px", color: "#5b21b6" }, children: "Snooze \u2014 masquer temporairement" }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", flexWrap: "wrap", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsx("button", { onClick: () => handleSnooze(1), disabled: snoozeSaving, style: { ...s.outlineBtn("#8b5cf6", snoozeSaving), fontSize: "12px" }, children: "1 jour" }),
+      /* @__PURE__ */ jsx("button", { onClick: () => handleSnooze(3), disabled: snoozeSaving, style: { ...s.outlineBtn("#8b5cf6", snoozeSaving), fontSize: "12px" }, children: "3 jours" }),
+      /* @__PURE__ */ jsx("button", { onClick: () => handleSnooze(7), disabled: snoozeSaving, style: { ...s.outlineBtn("#8b5cf6", snoozeSaving), fontSize: "12px" }, children: "1 semaine" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "datetime-local",
+          onChange: (e) => {
+            if (e.target.value) handleSnooze(null, e.target.value);
+          },
+          style: { ...s.input, fontSize: "12px" }
+        }
+      )
+    ] })
+  ] });
+}
+
+export { ExtMessagePanel, MergePanel, SnoozePanel };

package/dist/components/TicketConversation/components/ActivityLog.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { s, C } from '../constants';
+
+function ActivityLog({ activityLog }) {
+  const [showActivity, setShowActivity] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { style: s.section, children: [
+    /* @__PURE__ */ jsxs("h4", { style: { ...s.sectionTitle, cursor: "pointer" }, onClick: () => setShowActivity(!showActivity), children: [
+      "Historique ",
+      /* @__PURE__ */ jsx("span", { style: s.badge("#f1f5f9", "#475569"), children: activityLog.length }),
+      /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", color: C.textMuted, transition: "transform 0.2s", display: "inline-block", transform: showActivity ? "rotate(90deg)" : "none" }, children: "\u25B6" })
+    ] }),
+    showActivity && (activityLog.length === 0 ? /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: C.textMuted, fontStyle: "italic" }, children: "Aucune activit\xE9 enregistr\xE9e." }) : /* @__PURE__ */ jsx("div", { style: { fontSize: "12px", display: "flex", flexDirection: "column", gap: "2px", borderLeft: "2px solid #bfdbfe", paddingLeft: "14px", marginLeft: "4px" }, children: activityLog.map((entry) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "10px", alignItems: "center", padding: "5px 0", borderBottom: "1px solid #f8fafc" }, children: [
+      /* @__PURE__ */ jsx("span", { style: { color: C.textMuted, fontSize: "11px", whiteSpace: "nowrap", fontWeight: 500 }, children: new Date(entry.createdAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" }) }),
+      /* @__PURE__ */ jsx("span", { style: s.badge(entry.actorType === "admin" ? "#eff6ff" : "#dcfce7", entry.actorType === "admin" ? "#1e40af" : "#166534"), children: entry.actorType || "system" }),
+      /* @__PURE__ */ jsx("span", { style: { color: "#374151", fontWeight: 500 }, children: (entry.detail || entry.action).replace(/\[object Object\]/g, "(utilisateur)") }),
+      /* @__PURE__ */ jsx("span", { style: { color: C.textMuted, fontSize: "11px" }, children: entry.actorEmail })
+    ] }, entry.id)) }))
+  ] });
+}
+
+export { ActivityLog };

package/dist/components/TicketConversation/components/ClientBar.js

@@ -0,0 +1,42 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { C, s } from '../constants';
+
+function ClientBar({ client }) {
+  return /* @__PURE__ */ jsxs("div", { style: {
+    display: "flex",
+    alignItems: "center",
+    gap: "12px",
+    padding: "10px 16px",
+    borderRadius: "8px",
+    backgroundColor: "var(--theme-elevation-100)",
+    marginBottom: "16px",
+    flexWrap: "wrap"
+  }, children: [
+    /* @__PURE__ */ jsx("span", { style: { fontSize: "16px" }, children: "\u{1F464}" }),
+    /* @__PURE__ */ jsx("span", { style: { fontWeight: 700, fontSize: "13px", color: C.textPrimary }, children: client.company }),
+    /* @__PURE__ */ jsxs("span", { style: { color: C.textSecondary, fontSize: "13px" }, children: [
+      client.firstName,
+      " ",
+      client.lastName
+    ] }),
+    /* @__PURE__ */ jsx("span", { style: { color: C.textMuted, fontSize: "12px" }, children: "|" }),
+    /* @__PURE__ */ jsx("a", { href: `mailto:${client.email}`, style: { color: "#2563eb", fontSize: "12px", fontWeight: 600, textDecoration: "none" }, children: client.email }),
+    client.phone && /* @__PURE__ */ jsx("span", { style: { color: C.textSecondary, fontSize: "12px" }, children: client.phone }),
+    /* @__PURE__ */ jsxs("span", { style: { marginLeft: "auto", display: "inline-flex", gap: "8px", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsx("a", { href: `/admin/collections/support-clients/${client.id}`, style: { ...s.ghostBtn("#475569"), fontSize: "11px", padding: "4px 10px", textDecoration: "none" }, children: "Fiche client" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => window.open(`/api/admin/impersonate?clientId=${client.id}`, "_blank"),
+          style: { ...s.ghostBtn("#7c3aed"), fontSize: "11px", padding: "4px 10px" },
+          title: "Se connecter au portail support en tant que ce client",
+          children: "Voir en tant que client"
+        }
+      )
+    ] })
+  ] });
+}
+
+export { ClientBar };

package/dist/components/TicketConversation/components/ClientHistory.js

@@ -0,0 +1,137 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { s, C, statusLabels, projectStatusLabels } from '../constants';
+
+function ClientHistory({
+  client: _client,
+  clientTickets,
+  clientProjects,
+  clientNotes,
+  onNotesChange,
+  onNotesSave,
+  savingNotes,
+  notesSaved
+}) {
+  const [showClientHistory, setShowClientHistory] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { style: s.section, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setShowClientHistory(!showClientHistory),
+        style: {
+          background: "none",
+          border: `1px dashed ${C.border}`,
+          borderRadius: "6px",
+          padding: "8px 14px",
+          cursor: "pointer",
+          color: C.textSecondary,
+          fontSize: "13px",
+          fontWeight: 600,
+          width: "100%",
+          textAlign: "left",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between"
+        },
+        children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            "Historique client (",
+            clientTickets.length,
+            " ticket",
+            clientTickets.length !== 1 ? "s" : "",
+            ", ",
+            clientProjects.length,
+            " projet",
+            clientProjects.length !== 1 ? "s" : "",
+            ")"
+          ] }),
+          /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", transition: "transform 0.2s", display: "inline-block", transform: showClientHistory ? "rotate(90deg)" : "none" }, children: "\u25B6" })
+        ]
+      }
+    ),
+    showClientHistory && /* @__PURE__ */ jsxs("div", { style: { marginTop: "10px", padding: "14px 18px", borderRadius: "8px", backgroundColor: C.white, border: `1px solid ${C.border}` }, children: [
+      /* @__PURE__ */ jsx("h5", { style: { fontSize: "12px", fontWeight: 600, color: C.textSecondary, marginBottom: "8px" }, children: "Derniers tickets" }),
+      clientTickets.length === 0 ? /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: C.textMuted, fontStyle: "italic", marginBottom: "14px" }, children: "Aucun autre ticket" }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "4px", marginBottom: "14px" }, children: clientTickets.map((t) => {
+        const st = statusLabels[t.status] || statusLabels.open;
+        return /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: `/admin/support/ticket?id=${t.id}`,
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: "8px",
+              padding: "6px 10px",
+              borderRadius: "6px",
+              border: `1px solid ${C.border}`,
+              textDecoration: "none",
+              fontSize: "12px",
+              color: "#374151",
+              backgroundColor: "#fafafa"
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { style: { fontFamily: "'SF Mono', 'Fira Code', 'JetBrains Mono', 'Cascadia Code', monospace", fontWeight: 600, color: C.textMuted, fontSize: "11px", whiteSpace: "nowrap" }, children: t.ticketNumber }),
+              /* @__PURE__ */ jsx("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", fontWeight: 600 }, children: t.subject }),
+              /* @__PURE__ */ jsx("span", { style: s.badge(st.bg, st.color), children: st.label }),
+              /* @__PURE__ */ jsx("span", { style: { fontSize: "10px", color: C.textMuted, whiteSpace: "nowrap" }, children: new Date(t.createdAt).toLocaleDateString("fr-FR", { day: "numeric", month: "short" }) })
+            ]
+          },
+          t.id
+        );
+      }) }),
+      /* @__PURE__ */ jsx("h5", { style: { fontSize: "12px", fontWeight: 600, color: C.textSecondary, marginBottom: "8px" }, children: "Projets" }),
+      clientProjects.length === 0 ? /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: C.textMuted, fontStyle: "italic", marginBottom: "14px" }, children: "Aucun projet" }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "6px", flexWrap: "wrap", marginBottom: "14px" }, children: clientProjects.map((p) => {
+        const ps = projectStatusLabels[p.status] || projectStatusLabels.active;
+        return /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: `/admin/collections/projects/${p.id}`,
+            style: {
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "6px",
+              padding: "5px 10px",
+              borderRadius: "6px",
+              border: `1px solid ${C.border}`,
+              textDecoration: "none",
+              fontSize: "12px",
+              fontWeight: 600,
+              color: "#374151",
+              backgroundColor: "#fafafa"
+            },
+            children: [
+              p.name,
+              /* @__PURE__ */ jsx("span", { style: s.badge(ps.bg, ps.color), children: ps.label })
+            ]
+          },
+          p.id
+        );
+      }) }),
+      /* @__PURE__ */ jsx("h5", { style: { fontSize: "12px", fontWeight: 600, color: C.textSecondary, marginBottom: "8px" }, children: "Notes internes" }),
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          value: clientNotes,
+          onChange: (e) => onNotesChange(e.target.value),
+          rows: 3,
+          style: { ...s.input, width: "100%", resize: "vertical", fontSize: "12px", marginBottom: "8px" },
+          placeholder: "Notes sur ce client..."
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onNotesSave,
+          disabled: savingNotes,
+          style: { ...s.btn(notesSaved ? "#16a34a" : C.blue, savingNotes), fontSize: "11px", padding: "5px 12px" },
+          children: notesSaved ? "Sauvegarde OK" : savingNotes ? "Sauvegarde..." : "Sauvegarder les notes"
+        }
+      )
+    ] })
+  ] });
+}
+
+export { ClientHistory };

package/dist/components/TicketConversation/components/CodeBlock.js

@@ -0,0 +1,152 @@
+"use client";
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
+
+const LANG_CONFIG = {
+  javascript: { label: "JavaScript", accent: "#f7df1e" },
+  js: { label: "JavaScript", accent: "#f7df1e" },
+  typescript: { label: "TypeScript", accent: "#3178c6" },
+  ts: { label: "TypeScript", accent: "#3178c6" },
+  tsx: { label: "TSX", accent: "#3178c6" },
+  jsx: { label: "JSX", accent: "#f7df1e" },
+  php: { label: "PHP", accent: "#777bb4" },
+  python: { label: "Python", accent: "#3776ab" },
+  py: { label: "Python", accent: "#3776ab" },
+  html: { label: "HTML", accent: "#e34f26" },
+  css: { label: "CSS", accent: "#1572b6" },
+  scss: { label: "SCSS", accent: "#cc6699" },
+  json: { label: "JSON", accent: "#292929" },
+  sql: { label: "SQL", accent: "#e48e00" },
+  bash: { label: "Bash", accent: "#4eaa25" },
+  sh: { label: "Shell", accent: "#4eaa25" },
+  yaml: { label: "YAML", accent: "#cb171e" },
+  yml: { label: "YAML", accent: "#cb171e" },
+  xml: { label: "XML", accent: "#f16529" },
+  markdown: { label: "Markdown", accent: "#083fa1" },
+  md: { label: "Markdown", accent: "#083fa1" },
+  diff: { label: "Diff", accent: "#41b883" },
+  go: { label: "Go", accent: "#00add8" },
+  rust: { label: "Rust", accent: "#dea584" },
+  java: { label: "Java", accent: "#ed8b00" },
+  c: { label: "C", accent: "#555555" },
+  cpp: { label: "C++", accent: "#00599c" },
+  ruby: { label: "Ruby", accent: "#cc342d" },
+  swift: { label: "Swift", accent: "#f05138" },
+  nginx: { label: "Nginx", accent: "#009639" },
+  docker: { label: "Docker", accent: "#2496ed" },
+  dockerfile: { label: "Dockerfile", accent: "#2496ed" },
+  env: { label: ".env", accent: "#ecd53f" }
+};
+const DEFAULT_CONFIG = { label: "Code", accent: "#6b7280" };
+function SingleCodeBlock({ lang, code }) {
+  const [copied, setCopied] = useState(false);
+  const config = LANG_CONFIG[lang.toLowerCase()] || (lang ? { label: lang.toUpperCase(), accent: "#6b7280" } : DEFAULT_CONFIG);
+  const handleCopy = () => {
+    navigator.clipboard.writeText(code);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  };
+  const lines = code.split("\n");
+  return /* @__PURE__ */ jsxs("div", { style: {
+    marginTop: 8,
+    marginBottom: 8,
+    borderRadius: 8,
+    overflow: "hidden",
+    border: "1px solid #334155",
+    backgroundColor: "#0f172a",
+    fontSize: 13
+  }, children: [
+    /* @__PURE__ */ jsxs("div", { style: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      padding: "6px 12px",
+      backgroundColor: "#1e293b",
+      borderBottom: "1px solid #334155"
+    }, children: [
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+        /* @__PURE__ */ jsx("span", { style: {
+          display: "inline-block",
+          width: 8,
+          height: 8,
+          borderRadius: "50%",
+          backgroundColor: config.accent,
+          flexShrink: 0
+        } }),
+        /* @__PURE__ */ jsx("span", { style: {
+          fontSize: 11,
+          fontWeight: 700,
+          color: "#e2e8f0",
+          letterSpacing: "0.02em"
+        }, children: config.label })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: handleCopy,
+          style: {
+            background: "none",
+            border: "1px solid #475569",
+            borderRadius: 4,
+            padding: "2px 10px",
+            fontSize: 11,
+            color: copied ? "#4ade80" : "#94a3b8",
+            cursor: "pointer",
+            fontWeight: 600,
+            transition: "color 150ms"
+          },
+          children: copied ? "Copi\xE9 !" : "Copier"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", overflowX: "auto" }, children: [
+      /* @__PURE__ */ jsx("div", { style: {
+        padding: "12px 0",
+        borderRight: "1px solid #334155",
+        userSelect: "none",
+        flexShrink: 0
+      }, children: lines.map((_, i) => /* @__PURE__ */ jsx("div", { style: {
+        padding: "0 12px",
+        fontSize: 12,
+        lineHeight: "20px",
+        color: "#475569",
+        textAlign: "right",
+        fontFamily: '"SF Mono", "Fira Code", "JetBrains Mono", monospace'
+      }, children: i + 1 }, i)) }),
+      /* @__PURE__ */ jsx("pre", { style: {
+        margin: 0,
+        padding: 12,
+        overflow: "auto",
+        flex: 1
+      }, children: /* @__PURE__ */ jsx("code", { style: {
+        fontSize: 12,
+        lineHeight: "20px",
+        fontFamily: '"SF Mono", "Fira Code", "JetBrains Mono", monospace',
+        color: "#e2e8f0",
+        whiteSpace: "pre"
+      }, children: code }) })
+    ] })
+  ] });
+}
+function CodeBlockRenderer({ text }) {
+  const parts = text.split(/(```[\s\S]*?```)/g);
+  const hasCodeBlock = parts.some((p) => p.startsWith("```"));
+  if (!hasCodeBlock) return null;
+  return /* @__PURE__ */ jsx(Fragment, { children: parts.map((part, i) => {
+    if (part.startsWith("```")) {
+      const match = part.match(/^```(\w*)\n?([\s\S]*?)```$/);
+      if (match) {
+        const lang = match[1] || "";
+        const code = match[2].replace(/\n$/, "");
+        return /* @__PURE__ */ jsx(SingleCodeBlock, { lang, code }, i);
+      }
+    }
+    return null;
+  }) });
+}
+function CodeBlockRendererHtml({ html }) {
+  const stripped = html.replace(/<[^>]+>/g, "");
+  return /* @__PURE__ */ jsx(CodeBlockRenderer, { text: stripped });
+}
+
+export { CodeBlockRenderer, CodeBlockRendererHtml };