xertica-ui 2.1.2 → 2.1.3

package/dist/{xertica-assistant-gnCJdcZY.js → CodeBlock-BeSt1h5P.js}

@@ -3,14 +3,14 @@ import React__default, { useState, useRef, useEffect } from "react";
 import { AnimatePresence, motion } from "framer-motion";
 import { ChevronUp, ChevronDown, X, Plus, FileText, Radio, Search, Paperclip, Mic, Send, BarChart3, ImageIcon, Table, Check, Maximize2, ChevronRight, PanelRight, MessageSquare, Heart, History, MoreHorizontal, ChevronLeft, Download, Edit, Music, Image, AlertCircle, FolderOpen, Folder, Users, ExternalLink, Clock, Loader2, ThumbsUp, ThumbsDown, Copy } from "lucide-react";
 import { BarChart, CartesianGrid, XAxis, Bar } from "recharts";
-import { R as RichTextEditor, c as ChartContainer, g as ChartTooltip, h as ChartTooltipContent, d as ChartLegend, e as ChartLegendContent, T as Table$1, G as TableCaption, M as TableHeader, N as TableRow, L as TableHead, F as TableBody, J as TableCell, k as Dialog, n as DialogContent, q as DialogHeader, t as DialogTitle, o as DialogDescription, O as Textarea, p as DialogFooter } from "./rich-text-editor-BrdC5evx.js";
-import { D as DropdownMenu, n as DropdownMenuTrigger, b as DropdownMenuContent, d as DropdownMenuItem } from "./dropdown-menu-nc_Lvg-u.js";
-import { B as Button, c as cn } from "./button-qkz7Icqf.js";
-import { P as Popover, c as PopoverTrigger, b as PopoverContent, S as ScrollArea } from "./input-D-6IsAca.js";
+import { R as RichTextEditor, j as ChartContainer, n as ChartTooltip, o as ChartTooltipContent, k as ChartLegend, l as ChartLegendContent, T as Table$1, P as TableCaption, W as TableHeader, X as TableRow, V as TableHead, O as TableBody, Q as TableCell, r as Dialog, u as DialogContent, x as DialogHeader, B as DialogTitle, v as DialogDescription, Y as Textarea, w as DialogFooter } from "./rich-text-editor-D76gD-QI.js";
+import { D as DropdownMenu, n as DropdownMenuTrigger, b as DropdownMenuContent, d as DropdownMenuItem } from "./dropdown-menu-DQidbKBD.js";
+import { B as Button, e as cn, T as Tooltip, c as TooltipTrigger } from "./tooltip-HDOoD2-0.js";
+import { P as Popover, b as PopoverTrigger, a as PopoverContent, S as ScrollArea } from "./input-2R4loU86.js";
 import { toast } from "sonner";
-import { X as XerticaOrbe } from "./XerticaOrbe-BGIB1CTK.js";
-import { T as Tooltip, c as TooltipTrigger } from "./tooltip-CTyZCD8h.js";
+import { X as XerticaOrbe } from "./XerticaOrbe-zwS1p2a8.js";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { Prism } from "react-syntax-highlighter";
 function MarkdownMessage({ content, className = "" }) {
   const convertMarkdownToHtml = (markdown) => {
     let html = markdown;
@@ -1227,7 +1227,7 @@ function XerticaAssistant({
               transition: { duration: 0.2 },
               className: "flex-1 flex flex-col overflow-hidden",
               children: [
-                !isFullPage && (showHistory || showFavorites) && /* @__PURE__ */ jsx(
+                !isFullPage && /* @__PURE__ */ jsx(
                   "div",
                   {
                     className: "px-4 py-2 border-b border-border",
@@ -1857,7 +1857,219 @@ function XerticaAssistant({
     ] }) })
   ] });
 }
+const elegantTheme = {
+  'code[class*="language-"]': {
+    color: "var(--foreground)",
+    fontFamily: "var(--font-mono)",
+    fontSize: "0.875rem",
+    textAlign: "left",
+    whiteSpace: "pre",
+    wordSpacing: "normal",
+    wordBreak: "normal",
+    lineHeight: "1.6",
+    tabSize: 2,
+    hyphens: "none"
+  },
+  'pre[class*="language-"]': {
+    color: "var(--foreground)",
+    fontFamily: "var(--font-mono)",
+    fontSize: "0.875rem",
+    textAlign: "left",
+    whiteSpace: "pre",
+    wordSpacing: "normal",
+    wordBreak: "normal",
+    lineHeight: "1.6",
+    tabSize: 2,
+    hyphens: "none",
+    padding: "1rem",
+    margin: 0,
+    overflow: "auto",
+    background: "transparent"
+  },
+  "comment": {
+    color: "var(--muted-foreground)",
+    fontStyle: "italic"
+  },
+  "prolog": {
+    color: "var(--muted-foreground)"
+  },
+  "doctype": {
+    color: "var(--muted-foreground)"
+  },
+  "cdata": {
+    color: "var(--muted-foreground)"
+  },
+  "punctuation": {
+    color: "var(--muted-foreground)"
+  },
+  "property": {
+    color: "var(--chart-4)"
+  },
+  "tag": {
+    color: "var(--chart-1)"
+  },
+  "boolean": {
+    color: "var(--chart-5)"
+  },
+  "number": {
+    color: "var(--chart-5)"
+  },
+  "constant": {
+    color: "var(--chart-5)"
+  },
+  "symbol": {
+    color: "var(--chart-5)"
+  },
+  "deleted": {
+    color: "var(--chart-5)"
+  },
+  "selector": {
+    color: "var(--chart-2)"
+  },
+  "attr-name": {
+    color: "var(--chart-4)"
+  },
+  "string": {
+    color: "var(--chart-2)"
+  },
+  "char": {
+    color: "var(--chart-2)"
+  },
+  "builtin": {
+    color: "var(--chart-4)"
+  },
+  "inserted": {
+    color: "var(--chart-2)"
+  },
+  "operator": {
+    color: "var(--primary)"
+  },
+  "entity": {
+    color: "var(--chart-4)"
+  },
+  "url": {
+    color: "var(--chart-1)"
+  },
+  ".language-css .token.string": {
+    color: "var(--chart-2)"
+  },
+  ".style .token.string": {
+    color: "var(--chart-2)"
+  },
+  "atrule": {
+    color: "var(--chart-3)"
+  },
+  "attr-value": {
+    color: "var(--chart-2)"
+  },
+  "keyword": {
+    color: "var(--chart-3)"
+  },
+  "function": {
+    color: "var(--chart-1)"
+  },
+  "class-name": {
+    color: "var(--chart-4)"
+  },
+  "regex": {
+    color: "var(--chart-5)"
+  },
+  "important": {
+    color: "var(--chart-5)",
+    fontWeight: "bold"
+  },
+  "variable": {
+    color: "var(--chart-5)"
+  }
+};
+const CodeBlock = ({
+  code,
+  language = "tsx",
+  filename,
+  showLineNumbers = false
+}) => {
+  const [copied, setCopied] = useState(false);
+  const handleCopy = async () => {
+    try {
+      if (navigator.clipboard && navigator.clipboard.writeText) {
+        try {
+          await navigator.clipboard.writeText(code);
+        } catch (clipboardError) {
+          if (clipboardError.name === "NotAllowedError" || clipboardError.message.includes("permissions policy")) {
+            throw new Error("Clipboard permission denied, falling back");
+          }
+          throw clipboardError;
+        }
+      } else {
+        throw new Error("Clipboard API not available");
+      }
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch (err) {
+      try {
+        const textArea = document.createElement("textarea");
+        textArea.value = code;
+        textArea.style.position = "fixed";
+        textArea.style.left = "-999999px";
+        textArea.style.top = "-999999px";
+        document.body.appendChild(textArea);
+        textArea.focus();
+        textArea.select();
+        const successful = document.execCommand("copy");
+        document.body.removeChild(textArea);
+        if (successful) {
+          setCopied(true);
+          setTimeout(() => setCopied(false), 2e3);
+        } else {
+          console.error("Failed to copy text: execCommand returned false");
+        }
+      } catch (fallbackErr) {
+        console.error("All copy methods failed:", fallbackErr);
+      }
+    }
+  };
+  const codeString = typeof code === "string" ? code : String(code || "");
+  return /* @__PURE__ */ jsxs("div", { className: "relative group rounded-[var(--radius)] border border-border overflow-hidden bg-muted/30", children: [
+    filename && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-2 bg-muted border-b border-border", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-mono", children: filename }),
+      /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground uppercase", children: language })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          className: "absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity z-10 bg-background/80 hover:bg-background",
+          onClick: handleCopy,
+          "aria-label": copied ? "Copiado" : "Copiar código",
+          children: copied ? /* @__PURE__ */ jsx(Check, { className: "w-4 h-4 text-[var(--toast-success-icon)]", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Copy, { className: "w-4 h-4", "aria-hidden": "true" })
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "overflow-x-auto w-full max-w-full", children: /* @__PURE__ */ jsx(
+        Prism,
+        {
+          language,
+          style: elegantTheme,
+          showLineNumbers,
+          wrapLines: true,
+          customStyle: {
+            margin: 0,
+            padding: "1rem",
+            background: "transparent",
+            fontSize: "inherit"
+          },
+          codeTagProps: {
+            className: "text-[length:inherit]"
+          },
+          children: codeString
+        }
+      ) })
+    ] })
+  ] });
+};
 export {
+  CodeBlock as C,
   FormattedDocument as F,
   MarkdownMessage as M,
   XerticaAssistant as X,