@copilotkit/react-textarea 1.5.9 → 1.5.10

package/dist/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.js

@@ -0,0 +1,112 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.tsx
+var track_cursor_moved_since_last_text_change_exports = {};
+__export(track_cursor_moved_since_last_text_change_exports, {
+  TrackerTextEditedSinceLastCursorMovement: () => TrackerTextEditedSinceLastCursorMovement
+});
+module.exports = __toCommonJS(track_cursor_moved_since_last_text_change_exports);
+var import_react = require("react");
+var import_slate_react = require("slate-react");
+var import_slate2 = require("slate");
+
+// src/lib/editor-to-text.ts
+var import_slate = require("slate");
+function nodeChildrenToTextComponents(editor, nodes) {
+  const indeciesOfInlineElements = new Set(
+    nodes.map((node, index) => {
+      if (import_slate.Element.isElement(node) && editor.isInline(node)) {
+        return index;
+      }
+      return -1;
+    }).filter((index) => index !== -1)
+  );
+  const nonIgnorableItems = nodes.filter((node, index) => {
+    const isInline = indeciesOfInlineElements.has(index);
+    if (isInline) {
+      return false;
+    }
+    const isNeighbourOfInline = indeciesOfInlineElements.has(index - 1) || indeciesOfInlineElements.has(index + 1);
+    if (isNeighbourOfInline) {
+      return node.text !== "";
+    }
+    return true;
+  });
+  return nonIgnorableItems.map((node) => {
+    if (import_slate.Element.isElement(node)) {
+      switch (node.type) {
+        case "paragraph":
+          return nodeChildrenToTextComponents(editor, node.children);
+        case "suggestion":
+          return [];
+      }
+    } else {
+      return [node];
+    }
+  }).reduce((acc, val) => acc.concat(val), []);
+}
+var editorToText = (editor) => {
+  const flattened = nodeChildrenToTextComponents(editor, editor.children);
+  const text = flattened.map((textComponent) => textComponent.text).join("\n");
+  return text;
+};
+
+// src/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function TrackerTextEditedSinceLastCursorMovement(props) {
+  const cursorState = (0, import_slate_react.useSlateSelector)((state) => ({
+    selection: state.selection,
+    text: editorToText(state)
+  }));
+  const previousState = usePrevious(cursorState);
+  (0, import_react.useEffect)(() => {
+    if (!previousState) {
+      return;
+    }
+    if (cursorChangedWithoutTextChanged(previousState, cursorState)) {
+      props.setCursorMovedSinceLastTextChange(true);
+    }
+  }, [props.setCursorMovedSinceLastTextChange, cursorState]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {});
+}
+var cursorChangedWithoutTextChanged = (prev, next) => {
+  const isSelectionChanged = !isSelectionEqual(prev.selection, next.selection);
+  const isTextSame = prev.text === next.text;
+  return isSelectionChanged && isTextSame;
+};
+var isSelectionEqual = (a, b) => {
+  if (!a && !b)
+    return true;
+  if (!a || !b)
+    return false;
+  return import_slate2.Range.equals(a, b);
+};
+function usePrevious(value) {
+  const ref = (0, import_react.useRef)();
+  (0, import_react.useEffect)(() => {
+    ref.current = value;
+  });
+  return ref.current;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TrackerTextEditedSinceLastCursorMovement
+});
+//# sourceMappingURL=track-cursor-moved-since-last-text-change.js.map

package/dist/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.tsx","../../../src/lib/editor-to-text.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { BaseSelection } from \"slate\";\nimport { useSlateSelector } from \"slate-react\";\nimport { Range } from \"slate\";\nimport { editorToText } from \"../../lib/editor-to-text\";\n\ninterface TrackerTextEditedSinceLastCursorMovementProps {\n  setCursorMovedSinceLastTextChange: (value: boolean) => void;\n}\nexport function TrackerTextEditedSinceLastCursorMovement(\n  props: TrackerTextEditedSinceLastCursorMovementProps,\n) {\n  const cursorState: RelevantEditorState = useSlateSelector((state) => ({\n    selection: state.selection,\n    text: editorToText(state),\n  }));\n\n  const previousState = usePrevious(cursorState);\n\n  useEffect(() => {\n    if (!previousState) {\n      return;\n    }\n\n    if (cursorChangedWithoutTextChanged(previousState, cursorState)) {\n      props.setCursorMovedSinceLastTextChange(true);\n    }\n  }, [props.setCursorMovedSinceLastTextChange, cursorState]);\n\n  return <></>;\n}\n\ntype RelevantEditorState = {\n  selection: BaseSelection;\n  text: string;\n};\n\nconst cursorChangedWithoutTextChanged = (\n  prev: RelevantEditorState,\n  next: RelevantEditorState,\n): boolean => {\n  // Check if the selection has changed\n  const isSelectionChanged = !isSelectionEqual(prev.selection, next.selection);\n\n  // Check if the text content remains the same\n  const isTextSame = prev.text === next.text;\n\n  return isSelectionChanged && isTextSame;\n};\n\nconst isSelectionEqual = (a: BaseSelection, b: BaseSelection) => {\n  if (!a && !b) return true;\n  if (!a || !b) return false;\n  return Range.equals(a, b);\n};\n\n/**\n * Easily keep track of the *previous* value of a variable.\n *\n * Example:\n * ```\n * const [count, setCount] = useState(0);\n * const prevCount = usePrevious(count);\n *\n * useEffect(() => {\n *  if (count > prevCount) {\n *   console.log('Now I know that count is bigger than before');\n * }\n * }, [count, prevCount]);\n * ```\n */\nfunction usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  });\n\n  return ref.current;\n}\n","import { BaseEditor, Descendant, Element } from \"slate\";\nimport { HistoryEditor } from \"slate-history\";\nimport { ReactEditor } from \"slate-react\";\nimport { SuggestionAwareText } from \"../types/base/custom-editor\";\n\nfunction nodeChildrenToTextComponents(\n  editor: BaseEditor & ReactEditor & HistoryEditor,\n  nodes: Descendant[],\n): SuggestionAwareText[] {\n  // find inlineable elements\n  const indeciesOfInlineElements = new Set(\n    nodes\n      .map((node, index) => {\n        if (Element.isElement(node) && editor.isInline(node)) {\n          return index;\n        }\n        return -1;\n      })\n      .filter((index) => index !== -1),\n  );\n\n  // ignorable elements = inline elements,\n  // or neighbors of inline elements that are {text: \"\"}\n  const nonIgnorableItems = nodes.filter((node, index) => {\n    const isInline = indeciesOfInlineElements.has(index);\n    if (isInline) {\n      return false;\n    }\n\n    const isNeighbourOfInline =\n      indeciesOfInlineElements.has(index - 1) || indeciesOfInlineElements.has(index + 1);\n    if (isNeighbourOfInline) {\n      return (node as any).text !== \"\";\n    }\n\n    return true;\n  });\n\n  return nonIgnorableItems\n    .map((node) => {\n      if (Element.isElement(node)) {\n        switch (node.type) {\n          case \"paragraph\":\n            return nodeChildrenToTextComponents(editor, node.children);\n          case \"suggestion\":\n            return [];\n        }\n      } else {\n        return [node];\n      }\n    })\n    .reduce((acc, val) => acc.concat(val), []);\n}\n\nexport const editorToText = (editor: BaseEditor & ReactEditor & HistoryEditor) => {\n  const flattened = nodeChildrenToTextComponents(editor, editor.children);\n\n  const text = flattened.map((textComponent) => textComponent.text).join(\"\\n\");\n\n  return text;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkC;AAElC,yBAAiC;AACjC,IAAAA,gBAAsB;;;ACHtB,mBAAgD;AAKhD,SAAS,6BACP,QACA,OACuB;AAEvB,QAAM,2BAA2B,IAAI;AAAA,IACnC,MACG,IAAI,CAAC,MAAM,UAAU;AACpB,UAAI,qBAAQ,UAAU,IAAI,KAAK,OAAO,SAAS,IAAI,GAAG;AACpD,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC,EACA,OAAO,CAAC,UAAU,UAAU,EAAE;AAAA,EACnC;AAIA,QAAM,oBAAoB,MAAM,OAAO,CAAC,MAAM,UAAU;AACtD,UAAM,WAAW,yBAAyB,IAAI,KAAK;AACnD,QAAI,UAAU;AACZ,aAAO;AAAA,IACT;AAEA,UAAM,sBACJ,yBAAyB,IAAI,QAAQ,CAAC,KAAK,yBAAyB,IAAI,QAAQ,CAAC;AACnF,QAAI,qBAAqB;AACvB,aAAQ,KAAa,SAAS;AAAA,IAChC;AAEA,WAAO;AAAA,EACT,CAAC;AAED,SAAO,kBACJ,IAAI,CAAC,SAAS;AACb,QAAI,qBAAQ,UAAU,IAAI,GAAG;AAC3B,cAAQ,KAAK,MAAM;AAAA,QACjB,KAAK;AACH,iBAAO,6BAA6B,QAAQ,KAAK,QAAQ;AAAA,QAC3D,KAAK;AACH,iBAAO,CAAC;AAAA,MACZ;AAAA,IACF,OAAO;AACL,aAAO,CAAC,IAAI;AAAA,IACd;AAAA,EACF,CAAC,EACA,OAAO,CAAC,KAAK,QAAQ,IAAI,OAAO,GAAG,GAAG,CAAC,CAAC;AAC7C;AAEO,IAAM,eAAe,CAAC,WAAqD;AAChF,QAAM,YAAY,6BAA6B,QAAQ,OAAO,QAAQ;AAEtE,QAAM,OAAO,UAAU,IAAI,CAAC,kBAAkB,cAAc,IAAI,EAAE,KAAK,IAAI;AAE3E,SAAO;AACT;;;AD/BS;AApBF,SAAS,yCACd,OACA;AACA,QAAM,kBAAmC,qCAAiB,CAAC,WAAW;AAAA,IACpE,WAAW,MAAM;AAAA,IACjB,MAAM,aAAa,KAAK;AAAA,EAC1B,EAAE;AAEF,QAAM,gBAAgB,YAAY,WAAW;AAE7C,8BAAU,MAAM;AACd,QAAI,CAAC,eAAe;AAClB;AAAA,IACF;AAEA,QAAI,gCAAgC,eAAe,WAAW,GAAG;AAC/D,YAAM,kCAAkC,IAAI;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,MAAM,mCAAmC,WAAW,CAAC;AAEzD,SAAO,2EAAE;AACX;AAOA,IAAM,kCAAkC,CACtC,MACA,SACY;AAEZ,QAAM,qBAAqB,CAAC,iBAAiB,KAAK,WAAW,KAAK,SAAS;AAG3E,QAAM,aAAa,KAAK,SAAS,KAAK;AAEtC,SAAO,sBAAsB;AAC/B;AAEA,IAAM,mBAAmB,CAAC,GAAkB,MAAqB;AAC/D,MAAI,CAAC,KAAK,CAAC;AAAG,WAAO;AACrB,MAAI,CAAC,KAAK,CAAC;AAAG,WAAO;AACrB,SAAO,oBAAM,OAAO,GAAG,CAAC;AAC1B;AAiBA,SAAS,YAAe,OAAyB;AAC/C,QAAM,UAAM,qBAAU;AAEtB,8BAAU,MAAM;AACd,QAAI,UAAU;AAAA,EAChB,CAAC;AAED,SAAO,IAAI;AACb;","names":["import_slate"]}

package/dist/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.mjs

@@ -0,0 +1,9 @@
+import {
+  TrackerTextEditedSinceLastCursorMovement
+} from "../../chunk-LQ2OWQU7.mjs";
+import "../../chunk-T6MTDQZ7.mjs";
+import "../../chunk-MRXNTQOX.mjs";
+export {
+  TrackerTextEditedSinceLastCursorMovement
+};
+//# sourceMappingURL=track-cursor-moved-since-last-text-change.mjs.map

package/dist/components/base-copilot-textarea/track-cursor-moved-since-last-text-change.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/base-copilot-textarea/use-add-branding-css.d.ts

@@ -0,0 +1,3 @@
+declare function useAddBrandingCss(suggestionStyleAugmented: React.CSSProperties, disableBranding: boolean | undefined): void;
+
+export { useAddBrandingCss };

package/dist/components/base-copilot-textarea/use-add-branding-css.js

@@ -0,0 +1,83 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/base-copilot-textarea/use-add-branding-css.tsx
+var use_add_branding_css_exports = {};
+__export(use_add_branding_css_exports, {
+  useAddBrandingCss: () => useAddBrandingCss
+});
+module.exports = __toCommonJS(use_add_branding_css_exports);
+var import_react = require("react");
+function useAddBrandingCss(suggestionStyleAugmented, disableBranding) {
+  const cssSelector = ".copilot-textarea.with-branding";
+  (0, import_react.useEffect)(() => {
+    if (disableBranding) {
+      return;
+    }
+    const styleEl = document.createElement("style");
+    styleEl.id = "dynamic-styles";
+    let dynamicStyles = Object.entries(suggestionStyleAugmented).map(([key, value]) => {
+      const kebabCaseKey = key.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
+      return `${kebabCaseKey}: ${value};`;
+    }).join(" ");
+    dynamicStyles += `font-style: normal; font-size: x-small;`;
+    dynamicStyles += `content: "CopilotKit";`;
+    dynamicStyles += `bottom: 6px;`;
+    dynamicStyles += `right: 6px;`;
+    dynamicStyles += `pointer-events: none;`;
+    dynamicStyles += `font-weight: 200;`;
+    dynamicStyles += `padding: 0;`;
+    dynamicStyles += `margin: 0;`;
+    dynamicStyles += `border: 0;`;
+    dynamicStyles += `line-height: 1;`;
+    dynamicStyles += `position: absolute;`;
+    styleEl.innerHTML = `
+      ${cssSelector}::after {
+        ${dynamicStyles}
+      }
+    `;
+    document.head.appendChild(styleEl);
+    const textarea = document.querySelector(cssSelector);
+    const handleScroll = () => {
+      const styleEl2 = document.getElementById("dynamic-styles");
+      if (styleEl2 && textarea) {
+        const offsetFromBottom = -textarea.scrollTop + 6;
+        const offsetFromRight = -textarea.scrollLeft + 6;
+        styleEl2.innerHTML = `
+          ${cssSelector}::after {
+            ${dynamicStyles}
+            bottom: ${offsetFromBottom}px;
+            right: ${offsetFromRight}px;
+          }
+        `;
+      }
+    };
+    textarea == null ? void 0 : textarea.addEventListener("scroll", handleScroll);
+    return () => {
+      var _a;
+      (_a = document.getElementById("dynamic-styles")) == null ? void 0 : _a.remove();
+      textarea == null ? void 0 : textarea.removeEventListener("scroll", handleScroll);
+    };
+  }, [disableBranding, suggestionStyleAugmented]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useAddBrandingCss
+});
+//# sourceMappingURL=use-add-branding-css.js.map

package/dist/components/base-copilot-textarea/use-add-branding-css.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/base-copilot-textarea/use-add-branding-css.tsx"],"sourcesContent":["import { useEffect } from \"react\";\n\nexport function useAddBrandingCss(\n  suggestionStyleAugmented: React.CSSProperties,\n  disableBranding: boolean | undefined,\n) {\n  const cssSelector = \".copilot-textarea.with-branding\";\n  useEffect(() => {\n    if (disableBranding) {\n      return;\n    }\n\n    // ---\n    // 1: Add the CSS to the DOM\n    const styleEl = document.createElement(\"style\");\n    styleEl.id = \"dynamic-styles\";\n\n    // Build the CSS string dynamically\n    let dynamicStyles = Object.entries(suggestionStyleAugmented)\n      .map(([key, value]) => {\n        const kebabCaseKey = key.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, \"$1-$2\").toLowerCase();\n        return `${kebabCaseKey}: ${value};`;\n      })\n      .join(\" \");\n\n    // Append overrides for italics and font-size\n    dynamicStyles += `font-style: normal; font-size: x-small;`;\n    dynamicStyles += `content: \"CopilotKit\";`;\n    dynamicStyles += `bottom: 6px;`;\n    dynamicStyles += `right: 6px;`;\n    dynamicStyles += `pointer-events: none;`;\n    dynamicStyles += `font-weight: 200;`;\n    dynamicStyles += `padding: 0;`;\n    dynamicStyles += `margin: 0;`;\n    dynamicStyles += `border: 0;`;\n    dynamicStyles += `line-height: 1;`;\n    dynamicStyles += `position: absolute;`;\n\n    // Append it to the ::after class\n    styleEl.innerHTML = `\n      ${cssSelector}::after {\n        ${dynamicStyles}\n      }\n    `;\n\n    document.head.appendChild(styleEl);\n\n    // ---\n    // 2: Add the scroll listener (to keep the branding in the bottom right as the textarea scrolls)\n    const textarea = document.querySelector(cssSelector);\n    const handleScroll = () => {\n      const styleEl = document.getElementById(\"dynamic-styles\");\n      if (styleEl && textarea) {\n        const offsetFromBottom = -textarea.scrollTop + 6;\n        const offsetFromRight = -textarea.scrollLeft + 6;\n        styleEl.innerHTML = `\n          ${cssSelector}::after {\n            ${dynamicStyles}\n            bottom: ${offsetFromBottom}px;\n            right: ${offsetFromRight}px;\n          }\n        `;\n      }\n    };\n\n    textarea?.addEventListener(\"scroll\", handleScroll);\n\n    // Cleanup\n    return () => {\n      document.getElementById(\"dynamic-styles\")?.remove();\n      textarea?.removeEventListener(\"scroll\", handleScroll);\n    };\n  }, [disableBranding, suggestionStyleAugmented]);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA0B;AAEnB,SAAS,kBACd,0BACA,iBACA;AACA,QAAM,cAAc;AACpB,8BAAU,MAAM;AACd,QAAI,iBAAiB;AACnB;AAAA,IACF;AAIA,UAAM,UAAU,SAAS,cAAc,OAAO;AAC9C,YAAQ,KAAK;AAGb,QAAI,gBAAgB,OAAO,QAAQ,wBAAwB,EACxD,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM;AACrB,YAAM,eAAe,IAAI,QAAQ,gCAAgC,OAAO,EAAE,YAAY;AACtF,aAAO,GAAG,iBAAiB;AAAA,IAC7B,CAAC,EACA,KAAK,GAAG;AAGX,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AACjB,qBAAiB;AAGjB,YAAQ,YAAY;AAAA,QAChB;AAAA,UACE;AAAA;AAAA;AAIN,aAAS,KAAK,YAAY,OAAO;AAIjC,UAAM,WAAW,SAAS,cAAc,WAAW;AACnD,UAAM,eAAe,MAAM;AACzB,YAAMA,WAAU,SAAS,eAAe,gBAAgB;AACxD,UAAIA,YAAW,UAAU;AACvB,cAAM,mBAAmB,CAAC,SAAS,YAAY;AAC/C,cAAM,kBAAkB,CAAC,SAAS,aAAa;AAC/C,QAAAA,SAAQ,YAAY;AAAA,YAChB;AAAA,cACE;AAAA,sBACQ;AAAA,qBACD;AAAA;AAAA;AAAA,MAGf;AAAA,IACF;AAEA,yCAAU,iBAAiB,UAAU;AAGrC,WAAO,MAAM;AApEjB;AAqEM,qBAAS,eAAe,gBAAgB,MAAxC,mBAA2C;AAC3C,2CAAU,oBAAoB,UAAU;AAAA,IAC1C;AAAA,EACF,GAAG,CAAC,iBAAiB,wBAAwB,CAAC;AAChD;","names":["styleEl"]}

package/dist/components/base-copilot-textarea/use-add-branding-css.mjs

@@ -0,0 +1,8 @@
+import {
+  useAddBrandingCss
+} from "../../chunk-7LSRNPNI.mjs";
+import "../../chunk-MRXNTQOX.mjs";
+export {
+  useAddBrandingCss
+};
+//# sourceMappingURL=use-add-branding-css.mjs.map

package/dist/components/base-copilot-textarea/use-add-branding-css.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/copilot-textarea/copilot-textarea.css

@@ -0,0 +1,9 @@
+/* src/components/base-copilot-textarea/base-copilot-textarea.css */
+.copilot-kit-textarea-css-scope .copilot-textarea.with-branding::after {
+  content: "";
+  position: absolute;
+}
+.copilot-kit-textarea-css-scope .copilot-textarea.no-branding::after {
+  content: "";
+}
+/*# sourceMappingURL=copilot-textarea.css.map */

package/dist/components/copilot-textarea/copilot-textarea.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/base-copilot-textarea/base-copilot-textarea.css"],"sourcesContent":[".copilot-kit-textarea-css-scope .copilot-textarea.with-branding::after {\n    content: ''; /* Initially empty because we overrdie this CSS dynamically and we want to avoid flashing */\n    position: absolute;\n}\n    \n  \n.copilot-kit-textarea-css-scope .copilot-textarea.no-branding::after {\n    content: '';\n}"],"mappings":";AAAA;AACI;AACA;AAAA;AAIJ;AACI;AAAA;","names":[]}

package/dist/components/copilot-textarea/copilot-textarea.d.ts

@@ -0,0 +1,171 @@
+import React__default from 'react';
+import { BaseCopilotTextareaProps } from '../../types/base/index.js';
+import { HTMLCopilotTextAreaElement } from '../../types/html-copilot-textarea-element.js';
+import { AutosuggestionsConfigUserSpecified } from '../../types/autosuggestions-config/autosuggestions-config-user-specified.js';
+import '../../types/base/base-autosuggestions-config.js';
+import '../../types/base/autosuggestions-bare-function.js';
+import '@copilotkit/react-core';
+import '../../types/autosuggestions-config/autosuggestions-config.js';
+import '../../types/autosuggestions-config/suggestions-api-config.js';
+import '@copilotkit/runtime-client-gql';
+import '../../types/autosuggestions-config/subtypes/make-system-prompt.js';
+import '../../types/autosuggestions-config/insertions-api-config.js';
+import '../../types/autosuggestions-config/editing-api-config.js';
+
+/**
+ * <br/>
+ * <img src="/images/CopilotTextarea.gif" width="500" />
+ *
+ * `<CopilotTextarea>` is a React component that acts as a drop-in replacement for the standard `<textarea>`,
+ *  offering enhanced autocomplete features powered by AI. It is context-aware, integrating seamlessly with the
+ * [`useCopilotReadable`](/reference/hooks/useCopilotReadable) hook to provide intelligent suggestions based on the application context.
+ *
+ * In addition, it provides a hovering editor window (available by default via `Cmd + K` on Mac and `Ctrl + K` on Windows) that allows the user to
+ * suggest changes to the text, for example providing a summary or rephrasing the text.
+ *
+ * ## Example
+ *
+ * ```tsx
+ * import { CopilotTextarea } from '@copilotkit/react-textarea';
+ * import "@copilotkit/react-textarea/styles.css";
+ *
+ * <CopilotTextarea
+ *   autosuggestionsConfig={{
+ *     textareaPurpose:
+ *      "the body of an email message",
+ *     chatApiConfigs: {},
+ *   }}
+ * />
+ * ```
+ *
+ * ## Usage
+ *
+ * ### Install Dependencies
+ *
+ * This component is part of the [@copilotkit/react-textarea](https://npmjs.com/package/@copilotkit/react-textarea) package.
+ *
+ * ```shell npm2yarn \"@copilotkit/react-textarea"\
+ * npm install @copilotkit/react-core @copilotkit/react-textarea
+ * ```
+ *
+ * ### Usage
+ *
+ * Use the CopilotTextarea component in your React application similarly to a standard `<textarea />`,
+ * with additional configurations for AI-powered features.
+ *
+ * For example:
+ *
+ * ```tsx
+ * import { useState } from "react";
+ * import { CopilotTextarea } from "@copilotkit/react-textarea";
+ * import "@copilotkit/react-textarea/styles.css";
+ *
+ * export function ExampleComponent() {
+ *   const [text, setText] = useState("");
+ *
+ *   return (
+ *     <CopilotTextarea
+ *       className="custom-textarea-class"
+ *       value={text}
+ *       onValueChange={(value: string) => setText(value)}
+ *       placeholder="Enter your text here..."
+ *       autosuggestionsConfig={{
+ *         textareaPurpose: "Provide context or purpose of the textarea.",
+ *         chatApiConfigs: {
+ *           suggestionsApiConfig: {
+ *             maxTokens: 20,
+ *             stop: [".", "?", "!"],
+ *           },
+ *         },
+ *       }}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * ### Look & Feel
+ *
+ * By default, CopilotKit components do not have any styles. You can import CopilotKit's stylesheet at the root of your project:
+ * ```tsx title="YourRootComponent.tsx"
+ * ...
+ * import "@copilotkit/react-textarea/styles.css"; // [!code highlight]
+ *
+ * export function YourRootComponent() {
+ *   return (
+ *     <CopilotKit>
+ *       ...
+ *     </CopilotKit>
+ *   );
+ * }
+ * ```
+ * For more information about how to customize the styles, check out the [Customize Look & Feel](/guides/custom-look-and-feel/customize-built-in-ui-components) guide.
+ * */
+
+interface CopilotTextareaProps extends Omit<BaseCopilotTextareaProps, "baseAutosuggestionsConfig"> {
+    /**
+     * Configuration settings for the autosuggestions feature.
+     * For full reference, [check the interface on GitHub](https://github.com/CopilotKit/CopilotKit/blob/main/CopilotKit/packages/react-textarea/src/types/base/base-copilot-textarea-props.tsx#L8).
+     *
+     * <PropertyReference name="textareaPurpose" type="string" required={true} >
+     *   The purpose of the text area in plain text.
+     *
+     *   Example: *"The body of the email response"*
+     * </PropertyReference>
+     *
+     * <PropertyReference name="chatApiConfigs" type="ChatApiConfigs" >
+     *   The chat API configurations.
+     *
+     *   <strong>NOTE:</strong> You must provide specify at least one of `suggestionsApiConfig` or `insertionApiConfig`.
+     *
+     *   <PropertyReference name="suggestionsApiConfig" type="SuggestionsApiConfig">
+     *       For full reference, please [click here](https://github.com/CopilotKit/CopilotKit/blob/main/CopilotKit/packages/react-textarea/src/types/autosuggestions-config/suggestions-api-config.tsx#L4).
+     *   </PropertyReference>
+     *   <PropertyReference name="insertionApiConfig" type="InsertionApiConfig">
+     *       For full reference, please [click here](https://github.com/CopilotKit/CopilotKit/blob/main/CopilotKit/packages/react-textarea/src/types/autosuggestions-config/insertions-api-config.tsx#L4).
+     *   </PropertyReference>
+     * </PropertyReference>
+     *
+     * <PropertyReference name="disabled" type="boolean" >
+     *   Whether the textarea is disabled.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="disableBranding" type="boolean" >
+     *   Whether to disable the CopilotKit branding.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="placeholderStyle" type="React.CSSProperties" >
+     *   Specifies the CSS styles to apply to the placeholder text.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="suggestionsStyle" type="React.CSSProperties" >
+     *   Specifies the CSS styles to apply to the suggestions list.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="hoverMenuClassname" type="string" >
+     *   A class name to apply to the editor popover window.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="value" type="string" >
+     *   The initial value of the textarea. Can be controlled via `onValueChange`.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="onValueChange" type="(value: string) => void" >
+     *   Callback invoked when the value of the textarea changes.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="onChange" type="(event: React.ChangeEvent<HTMLTextAreaElement>) => void" >
+     *   Callback invoked when a `change` event is triggered on the textarea element.
+     * </PropertyReference>
+     *
+     * <PropertyReference name="shortcut" type="string" >
+     *   The shortcut to use to open the editor popover window. Default is `"Cmd-k"`.
+     * </PropertyReference>
+     */
+    autosuggestionsConfig: AutosuggestionsConfigUserSpecified;
+}
+/**
+ * A copilot textarea that uses the standard autosuggestions function.
+ */
+declare const CopilotTextarea: React__default.ForwardRefExoticComponent<CopilotTextareaProps & React__default.RefAttributes<HTMLCopilotTextAreaElement>>;
+
+export { CopilotTextarea, CopilotTextareaProps };