@copilotkit/react-ui 0.21.0-mme-esm-error.1 → 0.21.0

package/dist/index.mjs

@@ -4,17 +4,17 @@ import "./chunk-UGQQ4WEQ.mjs";
 import "./chunk-WB3YULQ4.mjs";
 import {
   CopilotPopup
-} from "./chunk-OTE2PMAQ.mjs";
+} from "./chunk-YAORLSQ3.mjs";
 import {
   CopilotSidebar
-} from "./chunk-7UK4MYTF.mjs";
-import "./chunk-BJ75DW3Z.mjs";
-import "./chunk-3SXQEFGW.mjs";
-import "./chunk-PGPR52GM.mjs";
+} from "./chunk-T3WYKWNC.mjs";
+import "./chunk-6U3O2JZP.mjs";
+import "./chunk-73EBDGYK.mjs";
+import "./chunk-WDHLWSSU.mjs";
 import "./chunk-YEHO5VMA.mjs";
 import "./chunk-B7DNOYVQ.mjs";
 import "./chunk-YTIGBBTC.mjs";
-import "./chunk-ZRJSYYXC.mjs";
+import "./chunk-MBYUBR3F.mjs";
 import "./chunk-7JYUCW7H.mjs";
 import "./chunk-KE3N45ZY.mjs";
 import "./chunk-WM6BS77F.mjs";

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.21.0-mme-esm-error.1",
+  "version": "0.21.0",
   "sideEffects": [
     "**/*.css"
   ],
@@ -35,9 +35,9 @@
     "ts-jest": "^29.1.1",
     "tsup": "^6.7.0",
     "typescript": "^5.2.3",
-    "eslint-config-custom": "0.9.0-mme-esm-error.1",
-    "tailwind-config": "0.8.0-mme-esm-error.1",
-    "tsconfig": "0.13.0-mme-esm-error.1"
+    "eslint-config-custom": "0.9.0",
+    "tailwind-config": "0.8.0",
+    "tsconfig": "0.13.0"
   },
   "dependencies": {
     "nanoid": "^4.0.2",
@@ -45,8 +45,8 @@
     "react-syntax-highlighter": "^15.5.0",
     "remark-gfm": "^3.0.1",
     "remark-math": "^5.1.1",
-    "@copilotkit/shared": "0.8.0-mme-esm-error.1",
-    "@copilotkit/react-core": "0.24.0-mme-esm-error.1"
+    "@copilotkit/shared": "0.8.0",
+    "@copilotkit/react-core": "0.24.0"
   },
   "scripts": {
     "build": "tsup --clean",

package/src/components/chat/CodeBlock.tsx

@@ -1,7 +1,5 @@
 import { FC, memo } from "react";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
-import { vscDarkPlus as highlightStyle } from "react-syntax-highlighter/dist/esm/styles/prism";
-
 import { useCopyToClipboard } from "../../hooks/use-copy-to-clipboard";
 import { CheckIcon, CopyIcon, DownloadIcon } from "./Icons";
 
@@ -121,3 +119,290 @@ const CodeBlock: FC<Props> = memo(({ language, value }) => {
 CodeBlock.displayName = "CodeBlock";
 
 export { CodeBlock };
+
+// import { vscDarkPlus as highlightStyle } from "react-syntax-highlighter/dist/esm/styles/prism";
+// As a workaround, we inline the vscDarkPlus from react-syntax-highlighter.
+// Importing it as recommended in the documentation leads to build errors in the non app router
+// (Next.js classic) setup.
+const highlightStyle: any = {
+  'pre[class*="language-"]': {
+    color: "#d4d4d4",
+    fontSize: "13px",
+    textShadow: "none",
+    fontFamily: 'Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace',
+    direction: "ltr",
+    textAlign: "left",
+    whiteSpace: "pre",
+    wordSpacing: "normal",
+    wordBreak: "normal",
+    lineHeight: "1.5",
+    MozTabSize: "4",
+    OTabSize: "4",
+    tabSize: "4",
+    WebkitHyphens: "none",
+    MozHyphens: "none",
+    msHyphens: "none",
+    hyphens: "none",
+    padding: "1em",
+    margin: ".5em 0",
+    overflow: "auto",
+    background: "#1e1e1e",
+  },
+  'code[class*="language-"]': {
+    color: "#d4d4d4",
+    fontSize: "13px",
+    textShadow: "none",
+    fontFamily: 'Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace',
+    direction: "ltr",
+    textAlign: "left",
+    whiteSpace: "pre",
+    wordSpacing: "normal",
+    wordBreak: "normal",
+    lineHeight: "1.5",
+    MozTabSize: "4",
+    OTabSize: "4",
+    tabSize: "4",
+    WebkitHyphens: "none",
+    MozHyphens: "none",
+    msHyphens: "none",
+    hyphens: "none",
+  },
+  'pre[class*="language-"]::selection': {
+    textShadow: "none",
+    background: "#264F78",
+  },
+  'code[class*="language-"]::selection': {
+    textShadow: "none",
+    background: "#264F78",
+  },
+  'pre[class*="language-"] *::selection': {
+    textShadow: "none",
+    background: "#264F78",
+  },
+  'code[class*="language-"] *::selection': {
+    textShadow: "none",
+    background: "#264F78",
+  },
+  ':not(pre) > code[class*="language-"]': {
+    padding: ".1em .3em",
+    borderRadius: ".3em",
+    color: "#db4c69",
+    background: "#1e1e1e",
+  },
+  ".namespace": {
+    Opacity: ".7",
+  },
+  "doctype.doctype-tag": {
+    color: "#569CD6",
+  },
+  "doctype.name": {
+    color: "#9cdcfe",
+  },
+  comment: {
+    color: "#6a9955",
+  },
+  prolog: {
+    color: "#6a9955",
+  },
+  punctuation: {
+    color: "#d4d4d4",
+  },
+  ".language-html .language-css .token.punctuation": {
+    color: "#d4d4d4",
+  },
+  ".language-html .language-javascript .token.punctuation": {
+    color: "#d4d4d4",
+  },
+  property: {
+    color: "#9cdcfe",
+  },
+  tag: {
+    color: "#569cd6",
+  },
+  boolean: {
+    color: "#569cd6",
+  },
+  number: {
+    color: "#b5cea8",
+  },
+  constant: {
+    color: "#9cdcfe",
+  },
+  symbol: {
+    color: "#b5cea8",
+  },
+  inserted: {
+    color: "#b5cea8",
+  },
+  unit: {
+    color: "#b5cea8",
+  },
+  selector: {
+    color: "#d7ba7d",
+  },
+  "attr-name": {
+    color: "#9cdcfe",
+  },
+  string: {
+    color: "#ce9178",
+  },
+  char: {
+    color: "#ce9178",
+  },
+  builtin: {
+    color: "#ce9178",
+  },
+  deleted: {
+    color: "#ce9178",
+  },
+  ".language-css .token.string.url": {
+    textDecoration: "underline",
+  },
+  operator: {
+    color: "#d4d4d4",
+  },
+  entity: {
+    color: "#569cd6",
+  },
+  "operator.arrow": {
+    color: "#569CD6",
+  },
+  atrule: {
+    color: "#ce9178",
+  },
+  "atrule.rule": {
+    color: "#c586c0",
+  },
+  "atrule.url": {
+    color: "#9cdcfe",
+  },
+  "atrule.url.function": {
+    color: "#dcdcaa",
+  },
+  "atrule.url.punctuation": {
+    color: "#d4d4d4",
+  },
+  keyword: {
+    color: "#569CD6",
+  },
+  "keyword.module": {
+    color: "#c586c0",
+  },
+  "keyword.control-flow": {
+    color: "#c586c0",
+  },
+  function: {
+    color: "#dcdcaa",
+  },
+  "function.maybe-class-name": {
+    color: "#dcdcaa",
+  },
+  regex: {
+    color: "#d16969",
+  },
+  important: {
+    color: "#569cd6",
+  },
+  italic: {
+    fontStyle: "italic",
+  },
+  "class-name": {
+    color: "#4ec9b0",
+  },
+  "maybe-class-name": {
+    color: "#4ec9b0",
+  },
+  console: {
+    color: "#9cdcfe",
+  },
+  parameter: {
+    color: "#9cdcfe",
+  },
+  interpolation: {
+    color: "#9cdcfe",
+  },
+  "punctuation.interpolation-punctuation": {
+    color: "#569cd6",
+  },
+  variable: {
+    color: "#9cdcfe",
+  },
+  "imports.maybe-class-name": {
+    color: "#9cdcfe",
+  },
+  "exports.maybe-class-name": {
+    color: "#9cdcfe",
+  },
+  escape: {
+    color: "#d7ba7d",
+  },
+  "tag.punctuation": {
+    color: "#808080",
+  },
+  cdata: {
+    color: "#808080",
+  },
+  "attr-value": {
+    color: "#ce9178",
+  },
+  "attr-value.punctuation": {
+    color: "#ce9178",
+  },
+  "attr-value.punctuation.attr-equals": {
+    color: "#d4d4d4",
+  },
+  namespace: {
+    color: "#4ec9b0",
+  },
+  'pre[class*="language-javascript"]': {
+    color: "#9cdcfe",
+  },
+  'code[class*="language-javascript"]': {
+    color: "#9cdcfe",
+  },
+  'pre[class*="language-jsx"]': {
+    color: "#9cdcfe",
+  },
+  'code[class*="language-jsx"]': {
+    color: "#9cdcfe",
+  },
+  'pre[class*="language-typescript"]': {
+    color: "#9cdcfe",
+  },
+  'code[class*="language-typescript"]': {
+    color: "#9cdcfe",
+  },
+  'pre[class*="language-tsx"]': {
+    color: "#9cdcfe",
+  },
+  'code[class*="language-tsx"]': {
+    color: "#9cdcfe",
+  },
+  'pre[class*="language-css"]': {
+    color: "#ce9178",
+  },
+  'code[class*="language-css"]': {
+    color: "#ce9178",
+  },
+  'pre[class*="language-html"]': {
+    color: "#d4d4d4",
+  },
+  'code[class*="language-html"]': {
+    color: "#d4d4d4",
+  },
+  ".language-regex .token.anchor": {
+    color: "#dcdcaa",
+  },
+  ".language-html .token.punctuation": {
+    color: "#808080",
+  },
+  'pre[class*="language-"] > code[class*="language-"]': {
+    position: "relative",
+    zIndex: "1",
+  },
+  ".line-highlight.line-highlight": {
+    background: "#f7ebc6",
+    boxShadow: "inset 5px 0 0 #f7d87c",
+    zIndex: "0",
+  },
+};

package/dist/chunk-ZRJSYYXC.mjs

@@ -1,114 +0,0 @@
-import {
-  CheckIcon,
-  CopyIcon,
-  DownloadIcon
-} from "./chunk-7YXG7D47.mjs";
-import {
-  useCopyToClipboard
-} from "./chunk-54JAUBUJ.mjs";
-
-// src/components/chat/CodeBlock.tsx
-import { memo } from "react";
-import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
-import { vscDarkPlus as highlightStyle } from "react-syntax-highlighter/dist/esm/styles/prism";
-import { jsx, jsxs } from "react/jsx-runtime";
-var programmingLanguages = {
-  javascript: ".js",
-  python: ".py",
-  java: ".java",
-  c: ".c",
-  cpp: ".cpp",
-  "c++": ".cpp",
-  "c#": ".cs",
-  ruby: ".rb",
-  php: ".php",
-  swift: ".swift",
-  "objective-c": ".m",
-  kotlin: ".kt",
-  typescript: ".ts",
-  go: ".go",
-  perl: ".pl",
-  rust: ".rs",
-  scala: ".scala",
-  haskell: ".hs",
-  lua: ".lua",
-  shell: ".sh",
-  sql: ".sql",
-  html: ".html",
-  css: ".css"
-  // add more file extensions here, make sure the key is same as language prop in CodeBlock.tsx component
-};
-var generateRandomString = (length, lowercase = false) => {
-  const chars = "ABCDEFGHJKLMNPQRSTUVWXY3456789";
-  let result = "";
-  for (let i = 0; i < length; i++) {
-    result += chars.charAt(Math.floor(Math.random() * chars.length));
-  }
-  return lowercase ? result.toLowerCase() : result;
-};
-var CodeBlock = memo(({ language, value }) => {
-  const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2e3 });
-  const downloadAsFile = () => {
-    if (typeof window === "undefined") {
-      return;
-    }
-    const fileExtension = programmingLanguages[language] || ".file";
-    const suggestedFileName = `file-${generateRandomString(3, true)}${fileExtension}`;
-    const fileName = window.prompt("Enter file name", suggestedFileName);
-    if (!fileName) {
-      return;
-    }
-    const blob = new Blob([value], { type: "text/plain" });
-    const url = URL.createObjectURL(blob);
-    const link = document.createElement("a");
-    link.download = fileName;
-    link.href = url;
-    link.style.display = "none";
-    document.body.appendChild(link);
-    link.click();
-    document.body.removeChild(link);
-    URL.revokeObjectURL(url);
-  };
-  const onCopy = () => {
-    if (isCopied)
-      return;
-    copyToClipboard(value);
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "copilotKitCodeBlock", children: [
-    /* @__PURE__ */ jsxs("div", { className: "copilotKitCodeBlockToolbar", children: [
-      /* @__PURE__ */ jsx("span", { className: "copilotKitCodeBlockToolbarLanguage", children: language }),
-      /* @__PURE__ */ jsxs("div", { className: "copilotKitCodeBlockToolbarButtons", children: [
-        /* @__PURE__ */ jsxs("button", { className: "copilotKitCodeBlockToolbarButton", onClick: downloadAsFile, children: [
-          /* @__PURE__ */ jsx(DownloadIcon, {}),
-          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Download" })
-        ] }),
-        /* @__PURE__ */ jsxs("button", { className: "copilotKitCodeBlockToolbarButton", onClick: onCopy, children: [
-          isCopied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {}),
-          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Copy code" })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(
-      SyntaxHighlighter,
-      {
-        language,
-        style: highlightStyle,
-        PreTag: "div",
-        customStyle: {
-          margin: 0,
-          borderBottomLeftRadius: "0.375rem",
-          borderBottomRightRadius: "0.375rem"
-        },
-        children: value
-      }
-    )
-  ] });
-});
-CodeBlock.displayName = "CodeBlock";
-
-export {
-  programmingLanguages,
-  generateRandomString,
-  CodeBlock
-};
-//# sourceMappingURL=chunk-ZRJSYYXC.mjs.map

package/dist/chunk-ZRJSYYXC.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/chat/CodeBlock.tsx"],"sourcesContent":["import { FC, memo } from \"react\";\nimport { Prism as SyntaxHighlighter } from \"react-syntax-highlighter\";\nimport { vscDarkPlus as highlightStyle } from \"react-syntax-highlighter/dist/esm/styles/prism\";\n\nimport { useCopyToClipboard } from \"../../hooks/use-copy-to-clipboard\";\nimport { CheckIcon, CopyIcon, DownloadIcon } from \"./Icons\";\n\ninterface CodeActionButtonProps {\n  onClick: () => void;\n  children: React.ReactNode;\n}\n\ninterface Props {\n  language: string;\n  value: string;\n}\n\ninterface languageMap {\n  [key: string]: string | undefined;\n}\n\nexport const programmingLanguages: languageMap = {\n  javascript: \".js\",\n  python: \".py\",\n  java: \".java\",\n  c: \".c\",\n  cpp: \".cpp\",\n  \"c++\": \".cpp\",\n  \"c#\": \".cs\",\n  ruby: \".rb\",\n  php: \".php\",\n  swift: \".swift\",\n  \"objective-c\": \".m\",\n  kotlin: \".kt\",\n  typescript: \".ts\",\n  go: \".go\",\n  perl: \".pl\",\n  rust: \".rs\",\n  scala: \".scala\",\n  haskell: \".hs\",\n  lua: \".lua\",\n  shell: \".sh\",\n  sql: \".sql\",\n  html: \".html\",\n  css: \".css\",\n  // add more file extensions here, make sure the key is same as language prop in CodeBlock.tsx component\n};\n\nexport const generateRandomString = (length: number, lowercase = false) => {\n  const chars = \"ABCDEFGHJKLMNPQRSTUVWXY3456789\"; // excluding similar looking characters like Z, 2, I, 1, O, 0\n  let result = \"\";\n  for (let i = 0; i < length; i++) {\n    result += chars.charAt(Math.floor(Math.random() * chars.length));\n  }\n  return lowercase ? result.toLowerCase() : result;\n};\n\nconst CodeBlock: FC<Props> = memo(({ language, value }) => {\n  const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2000 });\n\n  const downloadAsFile = () => {\n    if (typeof window === \"undefined\") {\n      return;\n    }\n    const fileExtension = programmingLanguages[language] || \".file\";\n    const suggestedFileName = `file-${generateRandomString(3, true)}${fileExtension}`;\n    const fileName = window.prompt(\"Enter file name\" || \"\", suggestedFileName);\n\n    if (!fileName) {\n      // User pressed cancel on prompt.\n      return;\n    }\n\n    const blob = new Blob([value], { type: \"text/plain\" });\n    const url = URL.createObjectURL(blob);\n    const link = document.createElement(\"a\");\n    link.download = fileName;\n    link.href = url;\n    link.style.display = \"none\";\n    document.body.appendChild(link);\n    link.click();\n    document.body.removeChild(link);\n    URL.revokeObjectURL(url);\n  };\n\n  const onCopy = () => {\n    if (isCopied) return;\n    copyToClipboard(value);\n  };\n\n  return (\n    <div className=\"copilotKitCodeBlock\">\n      <div className=\"copilotKitCodeBlockToolbar\">\n        <span className=\"copilotKitCodeBlockToolbarLanguage\">{language}</span>\n        <div className=\"copilotKitCodeBlockToolbarButtons\">\n          <button className=\"copilotKitCodeBlockToolbarButton\" onClick={downloadAsFile}>\n            <DownloadIcon />\n            <span className=\"sr-only\">Download</span>\n          </button>\n          <button className=\"copilotKitCodeBlockToolbarButton\" onClick={onCopy}>\n            {isCopied ? <CheckIcon /> : <CopyIcon />}\n            <span className=\"sr-only\">Copy code</span>\n          </button>\n        </div>\n      </div>\n      <SyntaxHighlighter\n        language={language}\n        style={highlightStyle}\n        PreTag=\"div\"\n        customStyle={{\n          margin: 0,\n          borderBottomLeftRadius: \"0.375rem\",\n          borderBottomRightRadius: \"0.375rem\",\n        }}\n      >\n        {value}\n      </SyntaxHighlighter>\n    </div>\n  );\n});\nCodeBlock.displayName = \"CodeBlock\";\n\nexport { CodeBlock };\n"],"mappings":";;;;;;;;;;AAAA,SAAa,YAAY;AACzB,SAAS,SAAS,yBAAyB;AAC3C,SAAS,eAAe,sBAAsB;AA2FtC,cAEE,YAFF;AAxED,IAAM,uBAAoC;AAAA,EAC/C,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,GAAG;AAAA,EACH,KAAK;AAAA,EACL,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AAAA,EACP,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,SAAS;AAAA,EACT,KAAK;AAAA,EACL,OAAO;AAAA,EACP,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA;AAEP;AAEO,IAAM,uBAAuB,CAAC,QAAgB,YAAY,UAAU;AACzE,QAAM,QAAQ;AACd,MAAI,SAAS;AACb,WAAS,IAAI,GAAG,IAAI,QAAQ,KAAK;AAC/B,cAAU,MAAM,OAAO,KAAK,MAAM,KAAK,OAAO,IAAI,MAAM,MAAM,CAAC;AAAA,EACjE;AACA,SAAO,YAAY,OAAO,YAAY,IAAI;AAC5C;AAEA,IAAM,YAAuB,KAAK,CAAC,EAAE,UAAU,MAAM,MAAM;AACzD,QAAM,EAAE,UAAU,gBAAgB,IAAI,mBAAmB,EAAE,SAAS,IAAK,CAAC;AAE1E,QAAM,iBAAiB,MAAM;AAC3B,QAAI,OAAO,WAAW,aAAa;AACjC;AAAA,IACF;AACA,UAAM,gBAAgB,qBAAqB,QAAQ,KAAK;AACxD,UAAM,oBAAoB,QAAQ,qBAAqB,GAAG,IAAI,IAAI;AAClE,UAAM,WAAW,OAAO,OAAO,mBAAyB,iBAAiB;AAEzE,QAAI,CAAC,UAAU;AAEb;AAAA,IACF;AAEA,UAAM,OAAO,IAAI,KAAK,CAAC,KAAK,GAAG,EAAE,MAAM,aAAa,CAAC;AACrD,UAAM,MAAM,IAAI,gBAAgB,IAAI;AACpC,UAAM,OAAO,SAAS,cAAc,GAAG;AACvC,SAAK,WAAW;AAChB,SAAK,OAAO;AACZ,SAAK,MAAM,UAAU;AACrB,aAAS,KAAK,YAAY,IAAI;AAC9B,SAAK,MAAM;AACX,aAAS,KAAK,YAAY,IAAI;AAC9B,QAAI,gBAAgB,GAAG;AAAA,EACzB;AAEA,QAAM,SAAS,MAAM;AACnB,QAAI;AAAU;AACd,oBAAgB,KAAK;AAAA,EACvB;AAEA,SACE,qBAAC,SAAI,WAAU,uBACb;AAAA,yBAAC,SAAI,WAAU,8BACb;AAAA,0BAAC,UAAK,WAAU,sCAAsC,oBAAS;AAAA,MAC/D,qBAAC,SAAI,WAAU,qCACb;AAAA,6BAAC,YAAO,WAAU,oCAAmC,SAAS,gBAC5D;AAAA,8BAAC,gBAAa;AAAA,UACd,oBAAC,UAAK,WAAU,WAAU,sBAAQ;AAAA,WACpC;AAAA,QACA,qBAAC,YAAO,WAAU,oCAAmC,SAAS,QAC3D;AAAA,qBAAW,oBAAC,aAAU,IAAK,oBAAC,YAAS;AAAA,UACtC,oBAAC,UAAK,WAAU,WAAU,uBAAS;AAAA,WACrC;AAAA,SACF;AAAA,OACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,QACP,QAAO;AAAA,QACP,aAAa;AAAA,UACX,QAAQ;AAAA,UACR,wBAAwB;AAAA,UACxB,yBAAyB;AAAA,QAC3B;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,KACF;AAEJ,CAAC;AACD,UAAU,cAAc;","names":[]}