xertica-ui 2.7.0 → 2.8.0

package/dist/CodeBlock-CK4rO6lM.js

@@ -0,0 +1,221 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { Check, Copy } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+import { B as Button } from './button-BnAW-a_w.js';
+import { Prism } from 'react-syntax-highlighter';
+
+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 { t } = useTranslation();
+  const handleCopy = async () => {
+    try {
+      if (navigator.clipboard && navigator.clipboard.writeText) {
+        try {
+          await navigator.clipboard.writeText(code);
+        } catch (clipboardError) {
+          if (clipboardError instanceof Error && (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 {
+      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 ? t("common.copied") : t("common.copyCode"),
+          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 };

package/dist/CodeBlock-CKXamfVd.cjs

@@ -0,0 +1,223 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const lucideReact = require('lucide-react');
+const reactI18next = require('react-i18next');
+const button = require('./button-BYtQygX5.cjs');
+const reactSyntaxHighlighter = require('react-syntax-highlighter');
+
+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] = React.useState(false);
+  const { t } = reactI18next.useTranslation();
+  const handleCopy = async () => {
+    try {
+      if (navigator.clipboard && navigator.clipboard.writeText) {
+        try {
+          await navigator.clipboard.writeText(code);
+        } catch (clipboardError) {
+          if (clipboardError instanceof Error && (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 {
+      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__ */ jsxRuntime.jsxs("div", { className: "relative group rounded-[var(--radius)] border border-border overflow-hidden bg-muted/30", children: [
+    filename && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-2 bg-muted border-b border-border", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-mono", children: filename }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground uppercase", children: language })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        button.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 ? t("common.copied") : t("common.copyCode"),
+          children: copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "w-4 h-4 text-[var(--toast-success-icon)]", "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "w-4 h-4", "aria-hidden": "true" })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto w-full max-w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+        reactSyntaxHighlighter.Prism,
+        {
+          language,
+          style: elegantTheme,
+          showLineNumbers,
+          wrapLines: true,
+          customStyle: {
+            margin: 0,
+            padding: "1rem",
+            background: "transparent",
+            fontSize: "inherit"
+          },
+          codeTagProps: {
+            className: "text-[length:inherit]"
+          },
+          children: codeString
+        }
+      ) })
+    ] })
+  ] });
+};
+
+exports.CodeBlock = CodeBlock;

package/dist/CodeBlock-CVmE7isS.cjs

@@ -0,0 +1,223 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const lucideReact = require('lucide-react');
+const reactI18next = require('react-i18next');
+const button = require('./button-DV1G6XrI.cjs');
+const reactSyntaxHighlighter = require('react-syntax-highlighter');
+
+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] = React.useState(false);
+  const { t } = reactI18next.useTranslation();
+  const handleCopy = async () => {
+    try {
+      if (navigator.clipboard && navigator.clipboard.writeText) {
+        try {
+          await navigator.clipboard.writeText(code);
+        } catch (clipboardError) {
+          if (clipboardError instanceof Error && (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 {
+      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__ */ jsxRuntime.jsxs("div", { className: "relative group rounded-[var(--radius)] border border-border overflow-hidden bg-muted/30", children: [
+    filename && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-2 bg-muted border-b border-border", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-mono", children: filename }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground uppercase", children: language })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        button.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 ? t("common.copied") : t("common.copyCode"),
+          children: copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "w-4 h-4 text-[var(--toast-success-icon)]", "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "w-4 h-4", "aria-hidden": "true" })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto w-full max-w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+        reactSyntaxHighlighter.Prism,
+        {
+          language,
+          style: elegantTheme,
+          showLineNumbers,
+          wrapLines: true,
+          customStyle: {
+            margin: 0,
+            padding: "1rem",
+            background: "transparent",
+            fontSize: "inherit"
+          },
+          codeTagProps: {
+            className: "text-[length:inherit]"
+          },
+          children: codeString
+        }
+      ) })
+    ] })
+  ] });
+};
+
+exports.CodeBlock = CodeBlock;