@copilotkit/react-textarea 1.3.13 → 1.3.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +10 -0
- package/dist/{chunk-UGEKMSRR.mjs → chunk-2VMZ5ZWT.mjs} +5 -1
- package/dist/chunk-2VMZ5ZWT.mjs.map +1 -0
- package/dist/{chunk-4AMCUMC7.mjs → chunk-4XXU5BSA.mjs} +4 -3
- package/dist/{chunk-4AMCUMC7.mjs.map → chunk-4XXU5BSA.mjs.map} +1 -1
- package/dist/{chunk-224UKA7C.mjs → chunk-7L6GIHDM.mjs} +2 -1
- package/dist/{chunk-224UKA7C.mjs.map → chunk-7L6GIHDM.mjs.map} +1 -1
- package/dist/{chunk-I3SPIGAI.mjs → chunk-ABYCGF77.mjs} +2 -2
- package/dist/{chunk-CF5GISTC.mjs → chunk-HDBI2WN5.mjs} +2 -2
- package/dist/chunk-HDBI2WN5.mjs.map +1 -0
- package/dist/{chunk-2FAXLWPD.mjs → chunk-OTBX4FPZ.mjs} +2 -2
- package/dist/{chunk-J62KUPFZ.mjs → chunk-PZYM7K4Y.mjs} +4 -3
- package/dist/{chunk-J62KUPFZ.mjs.map → chunk-PZYM7K4Y.mjs.map} +1 -1
- package/dist/components/base-copilot-textarea/base-copilot-textarea.js +8 -1
- package/dist/components/base-copilot-textarea/base-copilot-textarea.js.map +1 -1
- package/dist/components/base-copilot-textarea/base-copilot-textarea.mjs +6 -6
- package/dist/components/base-copilot-textarea/render-element.js +1 -0
- package/dist/components/base-copilot-textarea/render-element.js.map +1 -1
- package/dist/components/base-copilot-textarea/render-element.mjs +1 -1
- package/dist/components/copilot-textarea/copilot-textarea.js +8 -1
- package/dist/components/copilot-textarea/copilot-textarea.js.map +1 -1
- package/dist/components/copilot-textarea/copilot-textarea.mjs +7 -7
- package/dist/components/hovering-toolbar/hovering-toolbar-components.js +1 -1
- package/dist/components/hovering-toolbar/hovering-toolbar-components.js.map +1 -1
- package/dist/components/hovering-toolbar/hovering-toolbar-components.mjs +1 -1
- package/dist/components/hovering-toolbar/hovering-toolbar.js +6 -1
- package/dist/components/hovering-toolbar/hovering-toolbar.js.map +1 -1
- package/dist/components/hovering-toolbar/hovering-toolbar.mjs +4 -4
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box-core.js +4 -0
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box-core.js.map +1 -1
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box-core.mjs +1 -1
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box.js +4 -0
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box.js.map +1 -1
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box.mjs +2 -2
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/index.js +4 -0
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/index.js.map +1 -1
- package/dist/components/hovering-toolbar/text-insertion-prompt-box/index.mjs +2 -2
- package/dist/components/index.js +8 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/index.mjs +7 -7
- package/dist/index.js +8 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +7 -7
- package/package.json +7 -7
- package/src/components/base-copilot-textarea/base-copilot-textarea.tsx +1 -0
- package/src/components/base-copilot-textarea/render-element.tsx +1 -0
- package/src/components/hovering-toolbar/hovering-toolbar-components.tsx +1 -1
- package/src/components/hovering-toolbar/hovering-toolbar.tsx +1 -0
- package/src/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box-core.tsx +4 -0
- package/dist/chunk-CF5GISTC.mjs.map +0 -1
- package/dist/chunk-UGEKMSRR.mjs.map +0 -1
- /package/dist/{chunk-I3SPIGAI.mjs.map → chunk-ABYCGF77.mjs.map} +0 -0
- /package/dist/{chunk-2FAXLWPD.mjs.map → chunk-OTBX4FPZ.mjs.map} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# ui
|
|
2
2
|
|
|
3
|
+
## 1.3.14
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Add data-test-id to some elements for testing
|
|
8
|
+
- Updated dependencies
|
|
9
|
+
- @copilotkit/react-core@1.3.14
|
|
10
|
+
- @copilotkit/runtime-client-gql@1.3.14
|
|
11
|
+
- @copilotkit/shared@1.3.14
|
|
12
|
+
|
|
3
13
|
## 1.3.13
|
|
4
14
|
|
|
5
15
|
### Patch Changes
|
|
@@ -127,6 +127,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
127
127
|
/* @__PURE__ */ jsx(
|
|
128
128
|
"textarea",
|
|
129
129
|
{
|
|
130
|
+
"data-testid": "adjustment-prompt",
|
|
130
131
|
disabled: suggestionIsLoading,
|
|
131
132
|
ref: adjustmentTextAreaRef,
|
|
132
133
|
value: adjustmentPrompt,
|
|
@@ -154,6 +155,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
154
155
|
{
|
|
155
156
|
onClick: beginGeneratingAdjustment,
|
|
156
157
|
className: "absolute right-2 bg-blue-500 text-white w-8 h-8 rounded-full flex items-center justify-center",
|
|
158
|
+
"data-testid": "generate-button",
|
|
157
159
|
children: /* @__PURE__ */ jsx("i", { className: "material-icons", children: "arrow_forward" })
|
|
158
160
|
}
|
|
159
161
|
)
|
|
@@ -174,6 +176,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
174
176
|
/* @__PURE__ */ jsx(
|
|
175
177
|
"textarea",
|
|
176
178
|
{
|
|
179
|
+
"data-testid": "suggestion-result",
|
|
177
180
|
ref: suggestionTextAreaRef,
|
|
178
181
|
value: editSuggestion,
|
|
179
182
|
disabled: suggestionIsLoading,
|
|
@@ -186,6 +189,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
186
189
|
const SubmitComponent = /* @__PURE__ */ jsx("div", { className: "flex w-full gap-4 justify-start", children: /* @__PURE__ */ jsxs(
|
|
187
190
|
Button,
|
|
188
191
|
{
|
|
192
|
+
"data-testid": "insert-button",
|
|
189
193
|
className: " bg-green-700 text-white",
|
|
190
194
|
onClick: () => {
|
|
191
195
|
performInsertion(editSuggestion);
|
|
@@ -222,4 +226,4 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
222
226
|
export {
|
|
223
227
|
HoveringInsertionPromptBoxCore
|
|
224
228
|
};
|
|
225
|
-
//# sourceMappingURL=chunk-
|
|
229
|
+
//# sourceMappingURL=chunk-2VMZ5ZWT.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box-core.tsx"],"sourcesContent":["import useAutosizeTextArea from \"../../../hooks/misc/use-autosize-textarea\";\nimport {\n EditingEditorState,\n Generator_InsertionOrEditingSuggestion,\n} from \"../../../types/base/autosuggestions-bare-function\";\nimport { SourceSearchBox } from \"../../source-search-box/source-search-box\";\nimport { DocumentPointer, useCopilotContext } from \"@copilotkit/react-core\";\nimport { Button } from \"../../ui/button\";\nimport { Label } from \"../../ui/label\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { streamPromiseFlatten } from \"../../../lib/stream-promise-flatten\";\nimport { IncludedFilesPreview } from \"./included-files-preview\";\nimport { useHoveringEditorContext } from \"../hovering-editor-provider\";\n\nexport type SuggestionState = {\n editorState: EditingEditorState;\n};\n\nexport interface HoveringInsertionPromptBoxCoreProps {\n state: SuggestionState;\n performInsertion: (insertedText: string) => void;\n insertionOrEditingFunction: Generator_InsertionOrEditingSuggestion;\n contextCategories: string[];\n}\n\nexport const HoveringInsertionPromptBoxCore = ({\n performInsertion,\n state,\n insertionOrEditingFunction,\n contextCategories,\n}: HoveringInsertionPromptBoxCoreProps) => {\n const { getDocumentsContext } = useCopilotContext();\n\n const [editSuggestion, setEditSuggestion] = useState<string>(\"\");\n const [suggestionIsLoading, setSuggestionIsLoading] = useState<boolean>(false);\n\n const [adjustmentPrompt, setAdjustmentPrompt] = useState<string>(\"\");\n\n const [generatingSuggestion, setGeneratingSuggestion] = useState<ReadableStream<string> | null>(\n null,\n );\n\n const adjustmentTextAreaRef = useRef<HTMLTextAreaElement>(null);\n const suggestionTextAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const [filePointers, setFilePointers] = useState<DocumentPointer[]>([]);\n\n const [suggestedFiles, setSuggestedFiles] = useState<DocumentPointer[]>([]);\n useEffect(() => {\n setSuggestedFiles(getDocumentsContext(contextCategories));\n }, [contextCategories, getDocumentsContext]);\n\n useAutosizeTextArea(suggestionTextAreaRef, editSuggestion || \"\");\n useAutosizeTextArea(adjustmentTextAreaRef, adjustmentPrompt || \"\");\n\n // initially focus on the adjustment prompt text area\n useEffect(() => {\n adjustmentTextAreaRef.current?.focus();\n }, []);\n\n // continuously read the generating suggestion stream and update the edit suggestion\n useEffect(() => {\n // if no generating suggestion, do nothing\n if (!generatingSuggestion) {\n return;\n }\n\n // Check if the stream is already locked (i.e. already reading from it)\n if (generatingSuggestion.locked) {\n return;\n }\n\n // reset the edit suggestion\n setEditSuggestion(\"\");\n\n // read the generating suggestion stream and continuously update the edit suggestion\n const reader = generatingSuggestion.getReader();\n const read = async () => {\n setSuggestionIsLoading(true);\n while (true) {\n const { done, value } = await reader.read();\n if (done) {\n break;\n }\n setEditSuggestion((prev) => {\n const newSuggestion = prev + value;\n\n // Scroll to the bottom of the textarea. We call this here to make sure scroll-to-bottom is synchronous with the state update.\n if (suggestionTextAreaRef.current) {\n suggestionTextAreaRef.current.scrollTop = suggestionTextAreaRef.current.scrollHeight;\n }\n return newSuggestion;\n });\n }\n\n setSuggestionIsLoading(false);\n };\n read();\n\n return () => {\n // release the lock if the reader is not closed on unmount\n const releaseLockIfNotClosed = async () => {\n try {\n await reader.closed;\n } catch {\n reader.releaseLock();\n }\n };\n\n releaseLockIfNotClosed();\n };\n }, [generatingSuggestion]);\n\n // generate an adjustment to the completed text, based on the adjustment prompt\n const beginGeneratingAdjustment = useCallback(async () => {\n // don't generate text if the prompt is empty\n if (!adjustmentPrompt.trim()) {\n return;\n }\n\n // editor state includes the text being edited, and the text before/after the selection\n // if the current edit suggestion is not empty, then use *it* as the \"selected text\" - instead of the editor state's selected text\n let modificationState = state.editorState;\n if (editSuggestion !== \"\") {\n modificationState.selectedText = editSuggestion;\n }\n\n // generate the adjustment suggestion\n const adjustmentSuggestionTextStreamPromise = insertionOrEditingFunction(\n modificationState,\n adjustmentPrompt,\n filePointers,\n new AbortController().signal,\n );\n const adjustmentSuggestionTextStream = streamPromiseFlatten(\n adjustmentSuggestionTextStreamPromise,\n );\n\n setGeneratingSuggestion(adjustmentSuggestionTextStream);\n }, [\n adjustmentPrompt,\n editSuggestion,\n state.editorState,\n insertionOrEditingFunction,\n filePointers,\n ]);\n\n const isLoading = suggestionIsLoading;\n\n const textToEdit = editSuggestion || state.editorState.selectedText;\n const adjustmentLabel =\n textToEdit === \"\"\n ? \"Describe the text you want to insert\"\n : \"Describe adjustments to the suggested text\";\n const placeholder =\n textToEdit === \"\"\n ? \"e.g. 'summarize the client's top 3 pain-points from @CallTranscript'\"\n : \"e.g. 'make it more formal', 'be more specific', ...\";\n\n const { setIsDisplayed } = useHoveringEditorContext();\n\n const AdjustmentPromptComponent = (\n <>\n <Label className=\"\">{adjustmentLabel}</Label>\n <div className=\"relative w-full flex items-center\">\n <textarea\n data-testid=\"adjustment-prompt\"\n disabled={suggestionIsLoading}\n ref={adjustmentTextAreaRef}\n value={adjustmentPrompt}\n onChange={(e) => setAdjustmentPrompt(e.target.value)}\n onKeyDown={(e) => {\n if (e.key === \"Enter\" && e.shiftKey) {\n e.preventDefault();\n setAdjustmentPrompt(adjustmentPrompt + \"\\n\");\n } else if (e.key === \"Enter\") {\n e.preventDefault();\n beginGeneratingAdjustment();\n } else if (e.key == \"Escape\") {\n e.preventDefault();\n setIsDisplayed(false);\n }\n }}\n placeholder={placeholder}\n style={{ minHeight: \"3rem\" }}\n className=\"w-full bg-slate-100 h-auto h-min-14 text-sm p-2 rounded-md resize-none overflow-visible focus:outline-none focus:ring-0 focus:border-non pr-[3rem]\"\n rows={1}\n />\n <button\n onClick={beginGeneratingAdjustment}\n className=\"absolute right-2 bg-blue-500 text-white w-8 h-8 rounded-full flex items-center justify-center\"\n data-testid=\"generate-button\"\n >\n <i className=\"material-icons\">arrow_forward</i>\n </button>\n </div>\n </>\n );\n\n const SuggestionComponent = (\n <>\n <div className=\"flex justify-between items-end w-full\">\n <Label className=\"mt-4\">Suggested:</Label>\n <div className=\"ml-auto\">\n {isLoading && (\n <div className=\"flex justify-center items-center\">\n <div\n className=\"inline-block h-4 w-4 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\"\n role=\"status\"\n >\n <span className=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n Loading...\n </span>\n </div>\n </div>\n )}\n </div>\n </div>\n <textarea\n data-testid=\"suggestion-result\"\n ref={suggestionTextAreaRef}\n value={editSuggestion}\n disabled={suggestionIsLoading}\n onChange={(e) => setEditSuggestion(e.target.value)}\n className=\"w-full text-base p-2 border border-gray-300 rounded-md resize-none bg-green-50\"\n style={{ overflow: \"auto\", maxHeight: \"10em\" }}\n />\n </>\n );\n\n const SubmitComponent = (\n <div className=\"flex w-full gap-4 justify-start\">\n <Button\n data-testid=\"insert-button\"\n className=\" bg-green-700 text-white\"\n onClick={() => {\n performInsertion(editSuggestion);\n }}\n >\n Insert <i className=\"material-icons\">check</i>\n </Button>\n </div>\n );\n\n // show source search if the last word in the adjustment prompt BEGINS with an @\n const sourceSearchCandidate = adjustmentPrompt.split(\" \").pop();\n // if the candidate is @someCandidate, then 'someCandidate', otherwise undefined\n const sourceSearchWord = sourceSearchCandidate?.startsWith(\"@\")\n ? sourceSearchCandidate.slice(1)\n : undefined;\n\n return (\n <div className=\"w-full flex flex-col items-start relative gap-2\">\n {AdjustmentPromptComponent}\n {filePointers.length > 0 && (\n <IncludedFilesPreview includedFiles={filePointers} setIncludedFiles={setFilePointers} />\n )}\n {sourceSearchWord !== undefined && (\n <SourceSearchBox\n searchTerm={sourceSearchWord}\n suggestedFiles={suggestedFiles}\n onSelectedFile={(filePointer) => {\n setAdjustmentPrompt(adjustmentPrompt.replace(new RegExp(`@${sourceSearchWord}$`), \"\"));\n setFilePointers((prev) => [...prev, filePointer]);\n\n // focus back on the adjustment prompt, and move the cursor to the end\n adjustmentTextAreaRef.current?.focus();\n }}\n />\n )}\n {generatingSuggestion ? SuggestionComponent : null}\n {generatingSuggestion ? SubmitComponent : null}\n </div>\n );\n};\n"],"mappings":"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","names":[]}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import {
|
|
2
2
|
HoveringInsertionPromptBox
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-ABYCGF77.mjs";
|
|
4
4
|
import {
|
|
5
5
|
useHoveringEditorContext
|
|
6
6
|
} from "./chunk-LYB4B6MK.mjs";
|
|
7
7
|
import {
|
|
8
8
|
Menu,
|
|
9
9
|
Portal
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-HDBI2WN5.mjs";
|
|
11
11
|
import {
|
|
12
12
|
getFullEditorTextWithNewlines,
|
|
13
13
|
getTextAroundSelection
|
|
@@ -85,6 +85,7 @@ var HoveringToolbar = (props) => {
|
|
|
85
85
|
{
|
|
86
86
|
ref,
|
|
87
87
|
className: "copilot-kit-textarea-css-scope " + (props.hoverMenuClassname || "p-2 absolute z-10 top-[-10000px] left-[-10000px] mt-[-6px] opacity-0 transition-opacity duration-700"),
|
|
88
|
+
"data-testid": "hovering-toolbar",
|
|
88
89
|
children: isDisplayed && selection && /* @__PURE__ */ jsx(
|
|
89
90
|
HoveringInsertionPromptBox,
|
|
90
91
|
{
|
|
@@ -121,4 +122,4 @@ function editorState(editor, selection) {
|
|
|
121
122
|
export {
|
|
122
123
|
HoveringToolbar
|
|
123
124
|
};
|
|
124
|
-
//# sourceMappingURL=chunk-
|
|
125
|
+
//# sourceMappingURL=chunk-4XXU5BSA.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/hovering-toolbar/hovering-toolbar.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { Editor, Location, Transforms } from \"slate\";\nimport { useSlate, useSlateSelection } from \"slate-react\";\nimport { HoveringInsertionPromptBox } from \"./text-insertion-prompt-box\";\nimport { Menu, Portal } from \"./hovering-toolbar-components\";\nimport { useHoveringEditorContext } from \"./hovering-editor-provider\";\nimport {\n getFullEditorTextWithNewlines,\n getTextAroundSelection,\n} from \"../../lib/get-text-around-cursor\";\nimport {\n EditingEditorState,\n InsertionEditorApiConfig,\n} from \"../../types/base/autosuggestions-bare-function\";\n\nexport interface HoveringToolbarProps {\n apiConfig: InsertionEditorApiConfig;\n contextCategories: string[];\n hoverMenuClassname: string | undefined;\n}\n\nexport const HoveringToolbar = (props: HoveringToolbarProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const editor = useSlate();\n const selection = useSlateSelection();\n const { isDisplayed, setIsDisplayed } = useHoveringEditorContext();\n\n // only render on client\n const [isClient, setIsClient] = useState(false);\n useEffect(() => {\n setIsClient(true);\n }, []);\n\n useEffect(() => {\n const el = ref.current;\n const { selection } = editor;\n\n if (!el) {\n return;\n }\n\n if (!selection) {\n el.removeAttribute(\"style\");\n return;\n }\n\n const domSelection = window.getSelection();\n if (!domSelection || domSelection.rangeCount === 0) {\n return;\n }\n\n const domRange = domSelection.getRangeAt(0);\n const rect = domRange.getBoundingClientRect();\n\n // We use window = (0,0,0,0) as a signal that the selection is not in the original copilot-textarea,\n // but inside the hovering window.\n //\n // in such case, we simply do nothing.\n if (rect.top === 0 && rect.left === 0 && rect.width === 0 && rect.height === 0) {\n return;\n }\n const minGapFromEdge = 60;\n const verticalOffsetFromCorner = 35;\n const horizontalOffsetFromCorner = 15;\n let top = rect.top + window.scrollY - el.offsetHeight + verticalOffsetFromCorner;\n // make sure top is in the viewport and not too close to the edge\n if (top < minGapFromEdge) {\n top = rect.bottom + window.scrollY + minGapFromEdge;\n } else if (top + el.offsetHeight > window.innerHeight - minGapFromEdge) {\n top = rect.top + window.scrollY - el.offsetHeight - minGapFromEdge;\n }\n\n let left =\n rect.left + window.scrollX - el.offsetWidth / 2 + rect.width / 2 + horizontalOffsetFromCorner;\n // make sure left is in the viewport and not too close to the edge\n if (left < minGapFromEdge) {\n left = minGapFromEdge;\n } else if (left + el.offsetWidth > window.innerWidth - minGapFromEdge) {\n left = window.innerWidth - el.offsetWidth - minGapFromEdge;\n }\n\n el.style.opacity = \"1\";\n el.style.position = \"absolute\";\n\n el.style.top = `${top}px`;\n el.style.left = `${left}px`;\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (ref.current && !ref.current.contains(event.target as Node)) {\n setIsDisplayed(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [ref, setIsDisplayed]);\n\n if (!isClient) {\n return null;\n }\n\n return (\n <Portal>\n <Menu\n ref={ref}\n className={\n \"copilot-kit-textarea-css-scope \" +\n (props.hoverMenuClassname ||\n \"p-2 absolute z-10 top-[-10000px] left-[-10000px] mt-[-6px] opacity-0 transition-opacity duration-700\")\n }\n >\n {isDisplayed && selection && (\n <HoveringInsertionPromptBox\n editorState={editorState(editor, selection)}\n apiConfig={props.apiConfig}\n closeWindow={() => {\n setIsDisplayed(false);\n }}\n performInsertion={(insertedText) => {\n // replace the selection with the inserted text\n Transforms.delete(editor, { at: selection });\n Transforms.insertText(editor, insertedText, {\n at: selection,\n });\n setIsDisplayed(false);\n }}\n contextCategories={props.contextCategories}\n />\n )}\n </Menu>\n </Portal>\n );\n};\n\nfunction editorState(editor: Editor, selection: Location): EditingEditorState {\n const textAroundCursor = getTextAroundSelection(editor);\n if (textAroundCursor) {\n return textAroundCursor;\n }\n\n return {\n textBeforeCursor: getFullEditorTextWithNewlines(editor),\n textAfterCursor: \"\",\n selectedText: \"\",\n };\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,SAAS,WAAW,QAAQ,gBAAgB;AAC5C,SAA2B,kBAAkB;AAC7C,SAAS,UAAU,yBAAyB;
|
|
1
|
+
{"version":3,"sources":["../src/components/hovering-toolbar/hovering-toolbar.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { Editor, Location, Transforms } from \"slate\";\nimport { useSlate, useSlateSelection } from \"slate-react\";\nimport { HoveringInsertionPromptBox } from \"./text-insertion-prompt-box\";\nimport { Menu, Portal } from \"./hovering-toolbar-components\";\nimport { useHoveringEditorContext } from \"./hovering-editor-provider\";\nimport {\n getFullEditorTextWithNewlines,\n getTextAroundSelection,\n} from \"../../lib/get-text-around-cursor\";\nimport {\n EditingEditorState,\n InsertionEditorApiConfig,\n} from \"../../types/base/autosuggestions-bare-function\";\n\nexport interface HoveringToolbarProps {\n apiConfig: InsertionEditorApiConfig;\n contextCategories: string[];\n hoverMenuClassname: string | undefined;\n}\n\nexport const HoveringToolbar = (props: HoveringToolbarProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const editor = useSlate();\n const selection = useSlateSelection();\n const { isDisplayed, setIsDisplayed } = useHoveringEditorContext();\n\n // only render on client\n const [isClient, setIsClient] = useState(false);\n useEffect(() => {\n setIsClient(true);\n }, []);\n\n useEffect(() => {\n const el = ref.current;\n const { selection } = editor;\n\n if (!el) {\n return;\n }\n\n if (!selection) {\n el.removeAttribute(\"style\");\n return;\n }\n\n const domSelection = window.getSelection();\n if (!domSelection || domSelection.rangeCount === 0) {\n return;\n }\n\n const domRange = domSelection.getRangeAt(0);\n const rect = domRange.getBoundingClientRect();\n\n // We use window = (0,0,0,0) as a signal that the selection is not in the original copilot-textarea,\n // but inside the hovering window.\n //\n // in such case, we simply do nothing.\n if (rect.top === 0 && rect.left === 0 && rect.width === 0 && rect.height === 0) {\n return;\n }\n const minGapFromEdge = 60;\n const verticalOffsetFromCorner = 35;\n const horizontalOffsetFromCorner = 15;\n let top = rect.top + window.scrollY - el.offsetHeight + verticalOffsetFromCorner;\n // make sure top is in the viewport and not too close to the edge\n if (top < minGapFromEdge) {\n top = rect.bottom + window.scrollY + minGapFromEdge;\n } else if (top + el.offsetHeight > window.innerHeight - minGapFromEdge) {\n top = rect.top + window.scrollY - el.offsetHeight - minGapFromEdge;\n }\n\n let left =\n rect.left + window.scrollX - el.offsetWidth / 2 + rect.width / 2 + horizontalOffsetFromCorner;\n // make sure left is in the viewport and not too close to the edge\n if (left < minGapFromEdge) {\n left = minGapFromEdge;\n } else if (left + el.offsetWidth > window.innerWidth - minGapFromEdge) {\n left = window.innerWidth - el.offsetWidth - minGapFromEdge;\n }\n\n el.style.opacity = \"1\";\n el.style.position = \"absolute\";\n\n el.style.top = `${top}px`;\n el.style.left = `${left}px`;\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (ref.current && !ref.current.contains(event.target as Node)) {\n setIsDisplayed(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [ref, setIsDisplayed]);\n\n if (!isClient) {\n return null;\n }\n\n return (\n <Portal>\n <Menu\n ref={ref}\n className={\n \"copilot-kit-textarea-css-scope \" +\n (props.hoverMenuClassname ||\n \"p-2 absolute z-10 top-[-10000px] left-[-10000px] mt-[-6px] opacity-0 transition-opacity duration-700\")\n }\n data-testid=\"hovering-toolbar\"\n >\n {isDisplayed && selection && (\n <HoveringInsertionPromptBox\n editorState={editorState(editor, selection)}\n apiConfig={props.apiConfig}\n closeWindow={() => {\n setIsDisplayed(false);\n }}\n performInsertion={(insertedText) => {\n // replace the selection with the inserted text\n Transforms.delete(editor, { at: selection });\n Transforms.insertText(editor, insertedText, {\n at: selection,\n });\n setIsDisplayed(false);\n }}\n contextCategories={props.contextCategories}\n />\n )}\n </Menu>\n </Portal>\n );\n};\n\nfunction editorState(editor: Editor, selection: Location): EditingEditorState {\n const textAroundCursor = getTextAroundSelection(editor);\n if (textAroundCursor) {\n return textAroundCursor;\n }\n\n return {\n textBeforeCursor: getFullEditorTextWithNewlines(editor),\n textAfterCursor: \"\",\n selectedText: \"\",\n };\n}\n"],"mappings":"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","names":["selection"]}
|
|
@@ -23,6 +23,7 @@ var SuggestionElement = (props) => {
|
|
|
23
23
|
"span",
|
|
24
24
|
__spreadProps(__spreadValues({}, props.attributes), {
|
|
25
25
|
style: __spreadValues({}, props.suggestionsStyle),
|
|
26
|
+
"data-testid": "suggestion",
|
|
26
27
|
contentEditable: false,
|
|
27
28
|
children: [
|
|
28
29
|
props.children,
|
|
@@ -35,4 +36,4 @@ var SuggestionElement = (props) => {
|
|
|
35
36
|
export {
|
|
36
37
|
makeRenderElementFunction
|
|
37
38
|
};
|
|
38
|
-
//# sourceMappingURL=chunk-
|
|
39
|
+
//# sourceMappingURL=chunk-7L6GIHDM.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/base-copilot-textarea/render-element.tsx"],"sourcesContent":["import { RenderElementProps } from \"slate-react\";\n\nexport type RenderElementFunction = (props: RenderElementProps) => JSX.Element;\n\nexport function makeRenderElementFunction(\n suggestionsStyle: React.CSSProperties,\n): RenderElementFunction {\n return (props: RenderElementProps) => {\n switch (props.element.type) {\n case \"paragraph\":\n return <DefaultElement {...props} />;\n case \"suggestion\":\n return <SuggestionElement {...props} suggestionsStyle={suggestionsStyle} />;\n }\n };\n}\n\nconst DefaultElement = (props: RenderElementProps) => {\n return <div {...props.attributes}>{props.children}</div>;\n};\nconst SuggestionElement = (\n props: RenderElementProps & {\n suggestionsStyle: React.CSSProperties;\n },\n) => {\n return (\n <span\n {...props.attributes}\n style={{\n ...props.suggestionsStyle,\n }}\n contentEditable={false}\n >\n {props.children /* https://github.com/ianstormtaylor/slate/issues/3930 */}\n {props.element.type === \"suggestion\" && props.element.content}\n </span>\n );\n};\n"],"mappings":";;;;;;AAUe,cAgBX,YAhBW;AANR,SAAS,0BACd,kBACuB;AACvB,SAAO,CAAC,UAA8B;AACpC,YAAQ,MAAM,QAAQ,MAAM;AAAA,MAC1B,KAAK;AACH,eAAO,oBAAC,mCAAmB,MAAO;AAAA,MACpC,KAAK;AACH,eAAO,oBAAC,oDAAsB,QAAtB,EAA6B,mBAAoC;AAAA,IAC7E;AAAA,EACF;AACF;AAEA,IAAM,iBAAiB,CAAC,UAA8B;AACpD,SAAO,oBAAC,wCAAQ,MAAM,aAAd,EAA2B,gBAAM,WAAS;AACpD;AACA,IAAM,oBAAoB,CACxB,UAGG;AACH,SACE;AAAA,IAAC;AAAA,qCACK,MAAM,aADX;AAAA,MAEC,OAAO,mBACF,MAAM;AAAA,MAEX,iBAAiB;AAAA,MAEhB;AAAA,cAAM;AAAA,QACN,MAAM,QAAQ,SAAS,gBAAgB,MAAM,QAAQ;AAAA;AAAA;AAAA,EACxD;AAEJ;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../src/components/base-copilot-textarea/render-element.tsx"],"sourcesContent":["import { RenderElementProps } from \"slate-react\";\n\nexport type RenderElementFunction = (props: RenderElementProps) => JSX.Element;\n\nexport function makeRenderElementFunction(\n suggestionsStyle: React.CSSProperties,\n): RenderElementFunction {\n return (props: RenderElementProps) => {\n switch (props.element.type) {\n case \"paragraph\":\n return <DefaultElement {...props} />;\n case \"suggestion\":\n return <SuggestionElement {...props} suggestionsStyle={suggestionsStyle} />;\n }\n };\n}\n\nconst DefaultElement = (props: RenderElementProps) => {\n return <div {...props.attributes}>{props.children}</div>;\n};\nconst SuggestionElement = (\n props: RenderElementProps & {\n suggestionsStyle: React.CSSProperties;\n },\n) => {\n return (\n <span\n {...props.attributes}\n style={{\n ...props.suggestionsStyle,\n }}\n data-testid=\"suggestion\"\n contentEditable={false}\n >\n {props.children /* https://github.com/ianstormtaylor/slate/issues/3930 */}\n {props.element.type === \"suggestion\" && props.element.content}\n </span>\n );\n};\n"],"mappings":";;;;;;AAUe,cAgBX,YAhBW;AANR,SAAS,0BACd,kBACuB;AACvB,SAAO,CAAC,UAA8B;AACpC,YAAQ,MAAM,QAAQ,MAAM;AAAA,MAC1B,KAAK;AACH,eAAO,oBAAC,mCAAmB,MAAO;AAAA,MACpC,KAAK;AACH,eAAO,oBAAC,oDAAsB,QAAtB,EAA6B,mBAAoC;AAAA,IAC7E;AAAA,EACF;AACF;AAEA,IAAM,iBAAiB,CAAC,UAA8B;AACpD,SAAO,oBAAC,wCAAQ,MAAM,aAAd,EAA2B,gBAAM,WAAS;AACpD;AACA,IAAM,oBAAoB,CACxB,UAGG;AACH,SACE;AAAA,IAAC;AAAA,qCACK,MAAM,aADX;AAAA,MAEC,OAAO,mBACF,MAAM;AAAA,MAEX,eAAY;AAAA,MACZ,iBAAiB;AAAA,MAEhB;AAAA,cAAM;AAAA,QACN,MAAM,QAAQ,SAAS,gBAAgB,MAAM,QAAQ;AAAA;AAAA;AAAA,EACxD;AAEJ;","names":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
HoveringInsertionPromptBoxCore
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-2VMZ5ZWT.mjs";
|
|
4
4
|
|
|
5
5
|
// src/components/hovering-toolbar/text-insertion-prompt-box/hovering-insertion-prompt-box.tsx
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -28,4 +28,4 @@ var HoveringInsertionPromptBox = (props) => {
|
|
|
28
28
|
export {
|
|
29
29
|
HoveringInsertionPromptBox
|
|
30
30
|
};
|
|
31
|
-
//# sourceMappingURL=chunk-
|
|
31
|
+
//# sourceMappingURL=chunk-ABYCGF77.mjs.map
|
|
@@ -60,7 +60,7 @@ var Menu = React.forwardRef(
|
|
|
60
60
|
return /* @__PURE__ */ jsx(
|
|
61
61
|
"div",
|
|
62
62
|
__spreadProps(__spreadValues({}, props), {
|
|
63
|
-
"data-
|
|
63
|
+
"data-testid": "menu",
|
|
64
64
|
ref,
|
|
65
65
|
className: cx(
|
|
66
66
|
className,
|
|
@@ -110,4 +110,4 @@ export {
|
|
|
110
110
|
Portal,
|
|
111
111
|
Toolbar
|
|
112
112
|
};
|
|
113
|
-
//# sourceMappingURL=chunk-
|
|
113
|
+
//# sourceMappingURL=chunk-HDBI2WN5.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/hovering-toolbar/hovering-toolbar-components.tsx"],"sourcesContent":["import { css, cx } from \"@emotion/css\";\nimport React, { PropsWithChildren, Ref } from \"react\";\nimport ReactDOM from \"react-dom\";\n\ninterface BaseProps {\n className: string;\n [key: string]: unknown;\n}\n\nexport const Button = React.forwardRef(\n (\n {\n className,\n active,\n reversed,\n ...props\n }: PropsWithChildren<\n {\n active: boolean;\n reversed: boolean;\n } & BaseProps\n >,\n ref: Ref<HTMLSpanElement | null>,\n ) => (\n <span\n {...props}\n ref={ref as Ref<HTMLSpanElement>}\n className={cx(\n className,\n css`\n cursor: pointer;\n color: ${reversed ? (active ? \"white\" : \"#aaa\") : active ? \"black\" : \"#ccc\"};\n `,\n )}\n />\n ),\n);\n\nexport const Icon = React.forwardRef(\n ({ className, ...props }: PropsWithChildren<BaseProps>, ref: Ref<HTMLSpanElement | null>) => (\n <span\n {...props}\n ref={ref as Ref<HTMLSpanElement>}\n className={cx(\n \"material-icons\",\n className,\n css`\n font-size: 18px;\n vertical-align: text-bottom;\n `,\n )}\n />\n ),\n);\n\nexport const Menu = React.forwardRef(\n ({ className, ...props }: PropsWithChildren<BaseProps>, ref: Ref<HTMLDivElement | null>) => {\n return (\n <div\n {...props}\n data-testid=\"menu\"\n ref={ref as Ref<HTMLDivElement>}\n className={cx(\n className,\n css`\n & > * {\n display: inline-block;\n }\n\n & > * + * {\n margin-left: 15px;\n }\n `,\n )}\n />\n );\n },\n);\nexport const Portal = ({ children }: { children: React.ReactNode }) => {\n return typeof document === \"object\" ? ReactDOM.createPortal(children, document.body) : null;\n};\n\nexport const Toolbar = React.forwardRef(\n ({ className, ...props }: PropsWithChildren<BaseProps>, ref?: Ref<HTMLDivElement>) => (\n <Menu\n {...props}\n ref={ref}\n className={cx(\n className,\n css`\n position: relative;\n padding: 1px 18px 17px;\n margin: 0 -20px;\n border-bottom: 2px solid #eee;\n margin-bottom: 20px;\n `,\n )}\n />\n ),\n);\n"],"mappings":";;;;;;;AAAA,SAAS,KAAK,UAAU;AACxB,OAAO,WAAuC;AAC9C,OAAO,cAAc;AAsBjB;AAfG,IAAM,SAAS,MAAM;AAAA,EAC1B,CACE,IAWA,QACA;AAZA,iBACE;AAAA;AAAA,MACA;AAAA,MACA;AAAA,IAdN,IAWI,IAIK,kBAJL,IAIK;AAAA,MAHH;AAAA,MACA;AAAA,MACA;AAAA;AAUF;AAAA,MAAC;AAAA,uCACK,QADL;AAAA,QAEC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA;AAAA,mBAEW,WAAY,SAAS,UAAU,SAAU,SAAS,UAAU;AAAA;AAAA,QAEzE;AAAA;AAAA,IACF;AAAA;AAEJ;AAEO,IAAM,OAAO,MAAM;AAAA,EACxB,CAAC,IAAuD,QAAkC;AAAzF,iBAAE,YAvCL,IAuCG,IAAgB,kBAAhB,IAAgB,CAAd;AACD;AAAA,MAAC;AAAA,uCACK,QADL;AAAA,QAEC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA;AAAA;AAAA;AAAA,QAIF;AAAA;AAAA,IACF;AAAA;AAEJ;AAEO,IAAM,OAAO,MAAM;AAAA,EACxB,CAAC,IAAuD,QAAoC;AAA3F,iBAAE,YAxDL,IAwDG,IAAgB,kBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA,uCACK,QADL;AAAA,QAEC,eAAY;AAAA,QACZ;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACO,IAAM,SAAS,CAAC,EAAE,SAAS,MAAqC;AACrE,SAAO,OAAO,aAAa,WAAW,SAAS,aAAa,UAAU,SAAS,IAAI,IAAI;AACzF;AAEO,IAAM,UAAU,MAAM;AAAA,EAC3B,CAAC,IAAuD,QAA2B;AAAlF,iBAAE,YAnFL,IAmFG,IAAgB,kBAAhB,IAAgB,CAAd;AACD;AAAA,MAAC;AAAA,uCACK,QADL;AAAA,QAEC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAOF;AAAA;AAAA,IACF;AAAA;AAEJ;","names":[]}
|
|
@@ -9,7 +9,7 @@ import {
|
|
|
9
9
|
} from "./chunk-ZTYA6QOT.mjs";
|
|
10
10
|
import {
|
|
11
11
|
BaseCopilotTextarea
|
|
12
|
-
} from "./chunk-
|
|
12
|
+
} from "./chunk-PZYM7K4Y.mjs";
|
|
13
13
|
import {
|
|
14
14
|
__objRest,
|
|
15
15
|
__spreadProps,
|
|
@@ -57,4 +57,4 @@ var CopilotTextarea = React.forwardRef(
|
|
|
57
57
|
export {
|
|
58
58
|
CopilotTextarea
|
|
59
59
|
};
|
|
60
|
-
//# sourceMappingURL=chunk-
|
|
60
|
+
//# sourceMappingURL=chunk-OTBX4FPZ.mjs.map
|
|
@@ -24,7 +24,7 @@ import {
|
|
|
24
24
|
} from "./chunk-7LSRNPNI.mjs";
|
|
25
25
|
import {
|
|
26
26
|
HoveringToolbar
|
|
27
|
-
} from "./chunk-
|
|
27
|
+
} from "./chunk-4XXU5BSA.mjs";
|
|
28
28
|
import {
|
|
29
29
|
HoveringEditorProvider,
|
|
30
30
|
useHoveringEditorContext
|
|
@@ -34,7 +34,7 @@ import {
|
|
|
34
34
|
} from "./chunk-4CVSOOJY.mjs";
|
|
35
35
|
import {
|
|
36
36
|
makeRenderElementFunction
|
|
37
|
-
} from "./chunk-
|
|
37
|
+
} from "./chunk-7L6GIHDM.mjs";
|
|
38
38
|
import {
|
|
39
39
|
makeRenderPlaceholderFunction
|
|
40
40
|
} from "./chunk-XW3ICO4S.mjs";
|
|
@@ -232,6 +232,7 @@ var BaseCopilotTextareaWithHoveringContext = React.forwardRef(
|
|
|
232
232
|
onTouchStart: (event) => {
|
|
233
233
|
onTouchStartHandlerForAutocomplete(event);
|
|
234
234
|
},
|
|
235
|
+
"data-testid": "copilot-textarea-editable",
|
|
235
236
|
className: moddedClassName,
|
|
236
237
|
onBlur: (ev) => {
|
|
237
238
|
var _a2;
|
|
@@ -261,4 +262,4 @@ function makeSemiFakeReactTextAreaEvent(currentText) {
|
|
|
261
262
|
export {
|
|
262
263
|
BaseCopilotTextarea
|
|
263
264
|
};
|
|
264
|
-
//# sourceMappingURL=chunk-
|
|
265
|
+
//# sourceMappingURL=chunk-PZYM7K4Y.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/base-copilot-textarea/base-copilot-textarea.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { Descendant, Editor } from \"slate\";\nimport { Editable, Slate } from \"slate-react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useAutosuggestions } from \"../../hooks/base-copilot-textarea-implementation/use-autosuggestions\";\nimport { useCopilotTextareaEditor } from \"../../hooks/base-copilot-textarea-implementation/use-copilot-textarea-editor\";\nimport { usePopulateCopilotTextareaRef } from \"../../hooks/base-copilot-textarea-implementation/use-populate-copilot-textarea-ref\";\nimport {\n getFullEditorTextWithNewlines,\n getTextAroundCollapsedCursor,\n} from \"../../lib/get-text-around-cursor\";\nimport { addAutocompletionsToEditor } from \"../../lib/slatejs-edits/add-autocompletions\";\nimport { clearAutocompletionsFromEditor } from \"../../lib/slatejs-edits/clear-autocompletions\";\nimport { replaceEditorText } from \"../../lib/slatejs-edits/replace-text\";\nimport { BaseAutosuggestionsConfig, defaultBaseAutosuggestionsConfig } from \"../../types/base\";\nimport { AutosuggestionState } from \"../../types/base/autosuggestion-state\";\nimport { BaseCopilotTextareaProps } from \"../../types/base/base-copilot-textarea-props\";\nimport \"./base-copilot-textarea.css\";\nimport { HoveringToolbar } from \"../hovering-toolbar/hovering-toolbar\";\nimport { makeRenderElementFunction } from \"./render-element\";\nimport { makeRenderPlaceholderFunction } from \"./render-placeholder\";\nimport { useAddBrandingCss } from \"./use-add-branding-css\";\nimport {\n HoveringEditorProvider,\n useHoveringEditorContext,\n} from \"../hovering-toolbar/hovering-editor-provider\";\nimport { TrackerTextEditedSinceLastCursorMovement } from \"./track-cursor-moved-since-last-text-change\";\n\n/**\n * Purpose: to be used as the `ref` type for `CopilotTextarea` and `BaseCopilotTextarea`.\n *\n * This interface extends `HTMLElement`, and is the subset of `HTMLTextAreaElement` that \"actually matters\".\n * It provides the core functionality that consumers of `HTMLTextAreaElement` need 99.9% of the time:\n * - `value`: the current value of the textarea\n * - `focus`: make the textarea focused\n * - `blur`: make the textarea unfocused\n */\nexport interface HTMLCopilotTextAreaElement extends HTMLElement {\n /**\n * The current value of the textarea.\n */\n value: string;\n\n /**\n * focus on the textarea\n */\n focus: () => void;\n\n /**\n * unfocus the textarea.\n *\n * Called `blur` for syntactic compatibility with `HTMLTextAreaElement`.\n */\n blur: () => void;\n}\n\n/**\n * Not intended for direct use. Use CopilotTextarea instead.\n *\n * The `BaseCopilotTextarea` includes the basic UX component,\n * without the business logic / AI logic that makes the content useful and coherent.\n *\n * It is useful if you want to build your own backend, with fully custom business logic\n * for figuring out which contnet to fill in.\n */\nexport const BaseCopilotTextarea = React.forwardRef(\n (props: BaseCopilotTextareaProps, ref: React.Ref<HTMLCopilotTextAreaElement>) => {\n return (\n <HoveringEditorProvider>\n <BaseCopilotTextareaWithHoveringContext {...props} ref={ref} />\n </HoveringEditorProvider>\n );\n },\n);\n\n/**\n * Not intended for direct use. Use `CopilotTextarea` instead.\n *\n * This is the private core of the `BaseCopilotTextarea` component.\n * For practical purposes the implementation is cleaner assuming containment in a `HoveringEditorProviderContext`.\n *\n * Therefore we separate the core logic into this component,\n * and wrap it in a `HoveringEditorProviderContext` in `BaseCopilotTextarea`.\n */\nconst BaseCopilotTextareaWithHoveringContext = React.forwardRef(\n (props: BaseCopilotTextareaProps, ref: React.Ref<HTMLCopilotTextAreaElement>) => {\n const autosuggestionsConfig: BaseAutosuggestionsConfig = {\n ...defaultBaseAutosuggestionsConfig,\n ...props.baseAutosuggestionsConfig,\n };\n\n const valueOnInitialRender = useMemo(() => props.value ?? \"\", []);\n const [lastKnownFullEditorText, setLastKnownFullEditorText] = useState(valueOnInitialRender);\n const [cursorMovedSinceLastTextChange, setCursorMovedSinceLastTextChange] = useState(false);\n\n // // When the editor text changes, we want to reset the `textEditedSinceLastCursorMovement` state.\n // useEffect(() => {\n // setCursorMovedSinceLastTextChange(false);\n // }, [lastKnownFullEditorText]);\n\n const initialValue: Descendant[] = useMemo(() => {\n return [\n {\n type: \"paragraph\",\n children: [{ text: valueOnInitialRender }],\n },\n ];\n }, [valueOnInitialRender]);\n\n const editor = useCopilotTextareaEditor();\n\n const { isDisplayed: hoveringEditorIsDisplayed, setIsDisplayed: setHoveringEditorIsDisplayed } =\n useHoveringEditorContext();\n\n const insertText = useCallback(\n (autosuggestion: AutosuggestionState) => {\n Editor.insertText(editor, autosuggestion.text, {\n at: autosuggestion.point,\n });\n },\n [editor],\n );\n\n const shouldDisableAutosuggestions =\n // textarea is manually disabled:\n autosuggestionsConfig.disabled ||\n // hovering editor is displayed:\n hoveringEditorIsDisplayed ||\n // the cursor has moved since the last text change AND we are configured to disable autosuggestions in this case:\n (cursorMovedSinceLastTextChange &&\n autosuggestionsConfig.temporarilyDisableWhenMovingCursorWithoutChangingText);\n\n const {\n currentAutocompleteSuggestion,\n onChangeHandler: onChangeHandlerForAutocomplete,\n onKeyDownHandler: onKeyDownHandlerForAutocomplete,\n onTouchStartHandler: onTouchStartHandlerForAutocomplete,\n } = useAutosuggestions(\n autosuggestionsConfig.debounceTime,\n autosuggestionsConfig.shouldAcceptAutosuggestionOnKeyPress,\n autosuggestionsConfig.shouldAcceptAutosuggestionOnTouch,\n autosuggestionsConfig.apiConfig.autosuggestionsFunction,\n insertText,\n autosuggestionsConfig.disableWhenEmpty,\n shouldDisableAutosuggestions,\n );\n\n const onKeyDownHandlerForHoveringEditor = useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (\n autosuggestionsConfig.shouldToggleHoveringEditorOnKeyPress(event, props.shortcut ?? \"k\")\n ) {\n event.preventDefault();\n setHoveringEditorIsDisplayed(!hoveringEditorIsDisplayed);\n }\n },\n [\n hoveringEditorIsDisplayed,\n setHoveringEditorIsDisplayed,\n autosuggestionsConfig.shouldToggleHoveringEditorOnKeyPress,\n ],\n );\n\n // sync autosuggestions state with the editor\n useEffect(() => {\n clearAutocompletionsFromEditor(editor);\n if (currentAutocompleteSuggestion) {\n addAutocompletionsToEditor(\n editor,\n currentAutocompleteSuggestion.text,\n currentAutocompleteSuggestion.point,\n );\n }\n }, [currentAutocompleteSuggestion]);\n\n const suggestionStyleAugmented: React.CSSProperties = useMemo(() => {\n return {\n fontStyle: \"italic\",\n color: \"gray\",\n ...props.suggestionsStyle,\n };\n }, [props.suggestionsStyle]);\n\n const renderElementMemoized = useMemo(() => {\n return makeRenderElementFunction(suggestionStyleAugmented);\n }, [suggestionStyleAugmented]);\n\n const renderPlaceholderMemoized = useMemo(() => {\n // For some reason slateJS specifies a top value of 0, which makes for strange styling. We override this here.\n const placeholderStyleSlatejsOverrides: React.CSSProperties = {\n top: undefined,\n };\n\n const placeholderStyleAugmented: React.CSSProperties = {\n ...placeholderStyleSlatejsOverrides,\n ...props.placeholderStyle,\n };\n\n return makeRenderPlaceholderFunction(placeholderStyleAugmented);\n }, [props.placeholderStyle]);\n\n // update the editor text, but only when the value changes from outside the component\n useEffect(() => {\n if (props.value === lastKnownFullEditorText) {\n return;\n }\n\n setLastKnownFullEditorText(props.value ?? \"\");\n replaceEditorText(editor, props.value ?? \"\");\n }, [props.value]);\n\n // separate into TextareaHTMLAttributes<HTMLDivElement> and CopilotTextareaProps\n const {\n placeholderStyle,\n value,\n hoverMenuClassname,\n onValueChange,\n baseAutosuggestionsConfig: autosuggestionsConfigFromProps,\n className,\n onChange,\n onKeyDown,\n disableBranding,\n ...propsToForward\n } = props;\n\n useAddBrandingCss(suggestionStyleAugmented, disableBranding);\n usePopulateCopilotTextareaRef(editor, ref);\n\n const moddedClassName = (() => {\n const baseClassName = \"copilot-textarea\";\n const brandingClass = disableBranding ? \"no-branding\" : \"with-branding\";\n const defaultTailwindClassName = \"bg-white overflow-y-auto resize-y\";\n const mergedClassName = twMerge(defaultTailwindClassName, className ?? \"\");\n return `${baseClassName} ${brandingClass} ${mergedClassName}`;\n })();\n\n return (\n <Slate\n editor={editor}\n initialValue={initialValue}\n onChange={(value) => {\n const newEditorState = getTextAroundCollapsedCursor(editor);\n\n const fullEditorText = newEditorState\n ? newEditorState.textBeforeCursor + newEditorState.textAfterCursor\n : getFullEditorTextWithNewlines(editor); // we don't double-parse the editor. When `newEditorState` is null, we didn't parse the editor yet.\n\n setLastKnownFullEditorText((prev) => {\n if (prev !== fullEditorText) {\n setCursorMovedSinceLastTextChange(false);\n }\n return fullEditorText;\n });\n onChangeHandlerForAutocomplete(newEditorState);\n\n props.onValueChange?.(fullEditorText);\n props.onChange?.(makeSemiFakeReactTextAreaEvent(fullEditorText));\n }}\n >\n <TrackerTextEditedSinceLastCursorMovement\n setCursorMovedSinceLastTextChange={setCursorMovedSinceLastTextChange}\n />\n <HoveringToolbar\n apiConfig={autosuggestionsConfig.apiConfig}\n contextCategories={autosuggestionsConfig.contextCategories}\n hoverMenuClassname={hoverMenuClassname}\n />\n <Editable\n renderElement={renderElementMemoized}\n renderPlaceholder={renderPlaceholderMemoized}\n onKeyDown={(event) => {\n onKeyDownHandlerForHoveringEditor(event); // forward the event for internal use\n onKeyDownHandlerForAutocomplete(event); // forward the event for internal use\n props.onKeyDown?.(event); // forward the event for external use\n }}\n onTouchStart={(event) => {\n onTouchStartHandlerForAutocomplete(event); // forward the event for internal use\n }}\n className={moddedClassName}\n onBlur={(ev) => {\n // clear autocompletion on blur\n props.onBlur?.(ev);\n clearAutocompletionsFromEditor(editor);\n }}\n {...propsToForward}\n />\n </Slate>\n );\n },\n);\n\n// Consumers of <textarea> expect a `onChange: (React.ChangeEvent<HTMLTextAreaElement>) => void` event handler to be passed in.\n// This is *extremely* common, and we want to support it.\n//\n// We can't support the full functionality, but in 99% of cases, the consumer only cares about the `event.target.value` property --\n// that's how they get the new value of the textarea.\n//\n// So, the tradeoff we are making is minimizing compiler complaint, with a small chance of runtime error.\n// The alternative would be defining a different onChange entrypoint (we actually do have that in `onValueChange`),\n// And starting to explain subtleties to users the moment they try to use the component for the first time for very basic functionality.\n//\n// If this proves problematic, we can always revisit this decision.\nfunction makeSemiFakeReactTextAreaEvent(\n currentText: string,\n): React.ChangeEvent<HTMLTextAreaElement> {\n return {\n target: {\n value: currentText,\n type: \"copilot-textarea\",\n },\n currentTarget: {\n value: currentText,\n type: \"copilot-textarea\",\n },\n } as React.ChangeEvent<HTMLTextAreaElement>;\n}\n"],"mappings":"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","names":["_a","value"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/base-copilot-textarea/base-copilot-textarea.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { Descendant, Editor } from \"slate\";\nimport { Editable, Slate } from \"slate-react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useAutosuggestions } from \"../../hooks/base-copilot-textarea-implementation/use-autosuggestions\";\nimport { useCopilotTextareaEditor } from \"../../hooks/base-copilot-textarea-implementation/use-copilot-textarea-editor\";\nimport { usePopulateCopilotTextareaRef } from \"../../hooks/base-copilot-textarea-implementation/use-populate-copilot-textarea-ref\";\nimport {\n getFullEditorTextWithNewlines,\n getTextAroundCollapsedCursor,\n} from \"../../lib/get-text-around-cursor\";\nimport { addAutocompletionsToEditor } from \"../../lib/slatejs-edits/add-autocompletions\";\nimport { clearAutocompletionsFromEditor } from \"../../lib/slatejs-edits/clear-autocompletions\";\nimport { replaceEditorText } from \"../../lib/slatejs-edits/replace-text\";\nimport { BaseAutosuggestionsConfig, defaultBaseAutosuggestionsConfig } from \"../../types/base\";\nimport { AutosuggestionState } from \"../../types/base/autosuggestion-state\";\nimport { BaseCopilotTextareaProps } from \"../../types/base/base-copilot-textarea-props\";\nimport \"./base-copilot-textarea.css\";\nimport { HoveringToolbar } from \"../hovering-toolbar/hovering-toolbar\";\nimport { makeRenderElementFunction } from \"./render-element\";\nimport { makeRenderPlaceholderFunction } from \"./render-placeholder\";\nimport { useAddBrandingCss } from \"./use-add-branding-css\";\nimport {\n HoveringEditorProvider,\n useHoveringEditorContext,\n} from \"../hovering-toolbar/hovering-editor-provider\";\nimport { TrackerTextEditedSinceLastCursorMovement } from \"./track-cursor-moved-since-last-text-change\";\n\n/**\n * Purpose: to be used as the `ref` type for `CopilotTextarea` and `BaseCopilotTextarea`.\n *\n * This interface extends `HTMLElement`, and is the subset of `HTMLTextAreaElement` that \"actually matters\".\n * It provides the core functionality that consumers of `HTMLTextAreaElement` need 99.9% of the time:\n * - `value`: the current value of the textarea\n * - `focus`: make the textarea focused\n * - `blur`: make the textarea unfocused\n */\nexport interface HTMLCopilotTextAreaElement extends HTMLElement {\n /**\n * The current value of the textarea.\n */\n value: string;\n\n /**\n * focus on the textarea\n */\n focus: () => void;\n\n /**\n * unfocus the textarea.\n *\n * Called `blur` for syntactic compatibility with `HTMLTextAreaElement`.\n */\n blur: () => void;\n}\n\n/**\n * Not intended for direct use. Use CopilotTextarea instead.\n *\n * The `BaseCopilotTextarea` includes the basic UX component,\n * without the business logic / AI logic that makes the content useful and coherent.\n *\n * It is useful if you want to build your own backend, with fully custom business logic\n * for figuring out which contnet to fill in.\n */\nexport const BaseCopilotTextarea = React.forwardRef(\n (props: BaseCopilotTextareaProps, ref: React.Ref<HTMLCopilotTextAreaElement>) => {\n return (\n <HoveringEditorProvider>\n <BaseCopilotTextareaWithHoveringContext {...props} ref={ref} />\n </HoveringEditorProvider>\n );\n },\n);\n\n/**\n * Not intended for direct use. Use `CopilotTextarea` instead.\n *\n * This is the private core of the `BaseCopilotTextarea` component.\n * For practical purposes the implementation is cleaner assuming containment in a `HoveringEditorProviderContext`.\n *\n * Therefore we separate the core logic into this component,\n * and wrap it in a `HoveringEditorProviderContext` in `BaseCopilotTextarea`.\n */\nconst BaseCopilotTextareaWithHoveringContext = React.forwardRef(\n (props: BaseCopilotTextareaProps, ref: React.Ref<HTMLCopilotTextAreaElement>) => {\n const autosuggestionsConfig: BaseAutosuggestionsConfig = {\n ...defaultBaseAutosuggestionsConfig,\n ...props.baseAutosuggestionsConfig,\n };\n\n const valueOnInitialRender = useMemo(() => props.value ?? \"\", []);\n const [lastKnownFullEditorText, setLastKnownFullEditorText] = useState(valueOnInitialRender);\n const [cursorMovedSinceLastTextChange, setCursorMovedSinceLastTextChange] = useState(false);\n\n // // When the editor text changes, we want to reset the `textEditedSinceLastCursorMovement` state.\n // useEffect(() => {\n // setCursorMovedSinceLastTextChange(false);\n // }, [lastKnownFullEditorText]);\n\n const initialValue: Descendant[] = useMemo(() => {\n return [\n {\n type: \"paragraph\",\n children: [{ text: valueOnInitialRender }],\n },\n ];\n }, [valueOnInitialRender]);\n\n const editor = useCopilotTextareaEditor();\n\n const { isDisplayed: hoveringEditorIsDisplayed, setIsDisplayed: setHoveringEditorIsDisplayed } =\n useHoveringEditorContext();\n\n const insertText = useCallback(\n (autosuggestion: AutosuggestionState) => {\n Editor.insertText(editor, autosuggestion.text, {\n at: autosuggestion.point,\n });\n },\n [editor],\n );\n\n const shouldDisableAutosuggestions =\n // textarea is manually disabled:\n autosuggestionsConfig.disabled ||\n // hovering editor is displayed:\n hoveringEditorIsDisplayed ||\n // the cursor has moved since the last text change AND we are configured to disable autosuggestions in this case:\n (cursorMovedSinceLastTextChange &&\n autosuggestionsConfig.temporarilyDisableWhenMovingCursorWithoutChangingText);\n\n const {\n currentAutocompleteSuggestion,\n onChangeHandler: onChangeHandlerForAutocomplete,\n onKeyDownHandler: onKeyDownHandlerForAutocomplete,\n onTouchStartHandler: onTouchStartHandlerForAutocomplete,\n } = useAutosuggestions(\n autosuggestionsConfig.debounceTime,\n autosuggestionsConfig.shouldAcceptAutosuggestionOnKeyPress,\n autosuggestionsConfig.shouldAcceptAutosuggestionOnTouch,\n autosuggestionsConfig.apiConfig.autosuggestionsFunction,\n insertText,\n autosuggestionsConfig.disableWhenEmpty,\n shouldDisableAutosuggestions,\n );\n\n const onKeyDownHandlerForHoveringEditor = useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (\n autosuggestionsConfig.shouldToggleHoveringEditorOnKeyPress(event, props.shortcut ?? \"k\")\n ) {\n event.preventDefault();\n setHoveringEditorIsDisplayed(!hoveringEditorIsDisplayed);\n }\n },\n [\n hoveringEditorIsDisplayed,\n setHoveringEditorIsDisplayed,\n autosuggestionsConfig.shouldToggleHoveringEditorOnKeyPress,\n ],\n );\n\n // sync autosuggestions state with the editor\n useEffect(() => {\n clearAutocompletionsFromEditor(editor);\n if (currentAutocompleteSuggestion) {\n addAutocompletionsToEditor(\n editor,\n currentAutocompleteSuggestion.text,\n currentAutocompleteSuggestion.point,\n );\n }\n }, [currentAutocompleteSuggestion]);\n\n const suggestionStyleAugmented: React.CSSProperties = useMemo(() => {\n return {\n fontStyle: \"italic\",\n color: \"gray\",\n ...props.suggestionsStyle,\n };\n }, [props.suggestionsStyle]);\n\n const renderElementMemoized = useMemo(() => {\n return makeRenderElementFunction(suggestionStyleAugmented);\n }, [suggestionStyleAugmented]);\n\n const renderPlaceholderMemoized = useMemo(() => {\n // For some reason slateJS specifies a top value of 0, which makes for strange styling. We override this here.\n const placeholderStyleSlatejsOverrides: React.CSSProperties = {\n top: undefined,\n };\n\n const placeholderStyleAugmented: React.CSSProperties = {\n ...placeholderStyleSlatejsOverrides,\n ...props.placeholderStyle,\n };\n\n return makeRenderPlaceholderFunction(placeholderStyleAugmented);\n }, [props.placeholderStyle]);\n\n // update the editor text, but only when the value changes from outside the component\n useEffect(() => {\n if (props.value === lastKnownFullEditorText) {\n return;\n }\n\n setLastKnownFullEditorText(props.value ?? \"\");\n replaceEditorText(editor, props.value ?? \"\");\n }, [props.value]);\n\n // separate into TextareaHTMLAttributes<HTMLDivElement> and CopilotTextareaProps\n const {\n placeholderStyle,\n value,\n hoverMenuClassname,\n onValueChange,\n baseAutosuggestionsConfig: autosuggestionsConfigFromProps,\n className,\n onChange,\n onKeyDown,\n disableBranding,\n ...propsToForward\n } = props;\n\n useAddBrandingCss(suggestionStyleAugmented, disableBranding);\n usePopulateCopilotTextareaRef(editor, ref);\n\n const moddedClassName = (() => {\n const baseClassName = \"copilot-textarea\";\n const brandingClass = disableBranding ? \"no-branding\" : \"with-branding\";\n const defaultTailwindClassName = \"bg-white overflow-y-auto resize-y\";\n const mergedClassName = twMerge(defaultTailwindClassName, className ?? \"\");\n return `${baseClassName} ${brandingClass} ${mergedClassName}`;\n })();\n\n return (\n <Slate\n editor={editor}\n initialValue={initialValue}\n onChange={(value) => {\n const newEditorState = getTextAroundCollapsedCursor(editor);\n\n const fullEditorText = newEditorState\n ? newEditorState.textBeforeCursor + newEditorState.textAfterCursor\n : getFullEditorTextWithNewlines(editor); // we don't double-parse the editor. When `newEditorState` is null, we didn't parse the editor yet.\n\n setLastKnownFullEditorText((prev) => {\n if (prev !== fullEditorText) {\n setCursorMovedSinceLastTextChange(false);\n }\n return fullEditorText;\n });\n onChangeHandlerForAutocomplete(newEditorState);\n\n props.onValueChange?.(fullEditorText);\n props.onChange?.(makeSemiFakeReactTextAreaEvent(fullEditorText));\n }}\n >\n <TrackerTextEditedSinceLastCursorMovement\n setCursorMovedSinceLastTextChange={setCursorMovedSinceLastTextChange}\n />\n <HoveringToolbar\n apiConfig={autosuggestionsConfig.apiConfig}\n contextCategories={autosuggestionsConfig.contextCategories}\n hoverMenuClassname={hoverMenuClassname}\n />\n <Editable\n renderElement={renderElementMemoized}\n renderPlaceholder={renderPlaceholderMemoized}\n onKeyDown={(event) => {\n onKeyDownHandlerForHoveringEditor(event); // forward the event for internal use\n onKeyDownHandlerForAutocomplete(event); // forward the event for internal use\n props.onKeyDown?.(event); // forward the event for external use\n }}\n onTouchStart={(event) => {\n onTouchStartHandlerForAutocomplete(event); // forward the event for internal use\n }}\n data-testid=\"copilot-textarea-editable\"\n className={moddedClassName}\n onBlur={(ev) => {\n // clear autocompletion on blur\n props.onBlur?.(ev);\n clearAutocompletionsFromEditor(editor);\n }}\n {...propsToForward}\n />\n </Slate>\n );\n },\n);\n\n// Consumers of <textarea> expect a `onChange: (React.ChangeEvent<HTMLTextAreaElement>) => void` event handler to be passed in.\n// This is *extremely* common, and we want to support it.\n//\n// We can't support the full functionality, but in 99% of cases, the consumer only cares about the `event.target.value` property --\n// that's how they get the new value of the textarea.\n//\n// So, the tradeoff we are making is minimizing compiler complaint, with a small chance of runtime error.\n// The alternative would be defining a different onChange entrypoint (we actually do have that in `onValueChange`),\n// And starting to explain subtleties to users the moment they try to use the component for the first time for very basic functionality.\n//\n// If this proves problematic, we can always revisit this decision.\nfunction makeSemiFakeReactTextAreaEvent(\n currentText: string,\n): React.ChangeEvent<HTMLTextAreaElement> {\n return {\n target: {\n value: currentText,\n type: \"copilot-textarea\",\n },\n currentTarget: {\n value: currentText,\n type: \"copilot-textarea\",\n },\n } as React.ChangeEvent<HTMLTextAreaElement>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,SAAS,aAAa,WAAW,SAAS,gBAAgB;AACjE,SAAqB,cAAc;AACnC,SAAS,UAAU,aAAa;AAChC,SAAS,eAAe;AAkEhB,cAwKF,YAxKE;AAJD,IAAM,sBAAsB,MAAM;AAAA,EACvC,CAAC,OAAiC,QAA+C;AAC/E,WACE,oBAAC,0BACC,8BAAC,yEAA2C,QAA3C,EAAkD,MAAU,GAC/D;AAAA,EAEJ;AACF;AAWA,IAAM,yCAAyC,MAAM;AAAA,EACnD,CAAC,OAAiC,QAA+C;AAC/E,UAAM,wBAAmD,kCACpD,mCACA,MAAM;AAGX,UAAM,uBAAuB,QAAQ,MAAG;AA3F5C,UAAAA;AA2F+C,cAAAA,MAAA,MAAM,UAAN,OAAAA,MAAe;AAAA,OAAI,CAAC,CAAC;AAChE,UAAM,CAAC,yBAAyB,0BAA0B,IAAI,SAAS,oBAAoB;AAC3F,UAAM,CAAC,gCAAgC,iCAAiC,IAAI,SAAS,KAAK;AAO1F,UAAM,eAA6B,QAAQ,MAAM;AAC/C,aAAO;AAAA,QACL;AAAA,UACE,MAAM;AAAA,UACN,UAAU,CAAC,EAAE,MAAM,qBAAqB,CAAC;AAAA,QAC3C;AAAA,MACF;AAAA,IACF,GAAG,CAAC,oBAAoB,CAAC;AAEzB,UAAM,SAAS,yBAAyB;AAExC,UAAM,EAAE,aAAa,2BAA2B,gBAAgB,6BAA6B,IAC3F,yBAAyB;AAE3B,UAAM,aAAa;AAAA,MACjB,CAAC,mBAAwC;AACvC,eAAO,WAAW,QAAQ,eAAe,MAAM;AAAA,UAC7C,IAAI,eAAe;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,CAAC,MAAM;AAAA,IACT;AAEA,UAAM;AAAA;AAAA,MAEJ,sBAAsB;AAAA,MAEtB;AAAA,MAEC,kCACC,sBAAsB;AAAA;AAE1B,UAAM;AAAA,MACJ;AAAA,MACA,iBAAiB;AAAA,MACjB,kBAAkB;AAAA,MAClB,qBAAqB;AAAA,IACvB,IAAI;AAAA,MACF,sBAAsB;AAAA,MACtB,sBAAsB;AAAA,MACtB,sBAAsB;AAAA,MACtB,sBAAsB,UAAU;AAAA,MAChC;AAAA,MACA,sBAAsB;AAAA,MACtB;AAAA,IACF;AAEA,UAAM,oCAAoC;AAAA,MACxC,CAAC,UAA+C;AApJtD,YAAAA;AAqJQ,YACE,sBAAsB,qCAAqC,QAAOA,MAAA,MAAM,aAAN,OAAAA,MAAkB,GAAG,GACvF;AACA,gBAAM,eAAe;AACrB,uCAA6B,CAAC,yBAAyB;AAAA,QACzD;AAAA,MACF;AAAA,MACA;AAAA,QACE;AAAA,QACA;AAAA,QACA,sBAAsB;AAAA,MACxB;AAAA,IACF;AAGA,cAAU,MAAM;AACd,qCAA+B,MAAM;AACrC,UAAI,+BAA+B;AACjC;AAAA,UACE;AAAA,UACA,8BAA8B;AAAA,UAC9B,8BAA8B;AAAA,QAChC;AAAA,MACF;AAAA,IACF,GAAG,CAAC,6BAA6B,CAAC;AAElC,UAAM,2BAAgD,QAAQ,MAAM;AAClE,aAAO;AAAA,QACL,WAAW;AAAA,QACX,OAAO;AAAA,SACJ,MAAM;AAAA,IAEb,GAAG,CAAC,MAAM,gBAAgB,CAAC;AAE3B,UAAM,wBAAwB,QAAQ,MAAM;AAC1C,aAAO,0BAA0B,wBAAwB;AAAA,IAC3D,GAAG,CAAC,wBAAwB,CAAC;AAE7B,UAAM,4BAA4B,QAAQ,MAAM;AAE9C,YAAM,mCAAwD;AAAA,QAC5D,KAAK;AAAA,MACP;AAEA,YAAM,4BAAiD,kCAClD,mCACA,MAAM;AAGX,aAAO,8BAA8B,yBAAyB;AAAA,IAChE,GAAG,CAAC,MAAM,gBAAgB,CAAC;AAG3B,cAAU,MAAM;AA1MpB,UAAAA,KAAA;AA2MM,UAAI,MAAM,UAAU,yBAAyB;AAC3C;AAAA,MACF;AAEA,kCAA2BA,MAAA,MAAM,UAAN,OAAAA,MAAe,EAAE;AAC5C,wBAAkB,SAAQ,WAAM,UAAN,YAAe,EAAE;AAAA,IAC7C,GAAG,CAAC,MAAM,KAAK,CAAC;AAGhB,UAWI,YAVF;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,2BAA2B;AAAA,MAC3B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IA7NN,IA+NQ,IADC,2BACD,IADC;AAAA,MATH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAIF,sBAAkB,0BAA0B,eAAe;AAC3D,kCAA8B,QAAQ,GAAG;AAEzC,UAAM,mBAAmB,MAAM;AAC7B,YAAM,gBAAgB;AACtB,YAAM,gBAAgB,kBAAkB,gBAAgB;AACxD,YAAM,2BAA2B;AACjC,YAAM,kBAAkB,QAAQ,0BAA0B,gCAAa,EAAE;AACzE,aAAO,GAAG,iBAAiB,iBAAiB;AAAA,IAC9C,GAAG;AAEH,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,UAAU,CAACC,WAAU;AAhP7B,cAAAD,KAAA;AAiPU,gBAAM,iBAAiB,6BAA6B,MAAM;AAE1D,gBAAM,iBAAiB,iBACnB,eAAe,mBAAmB,eAAe,kBACjD,8BAA8B,MAAM;AAExC,qCAA2B,CAAC,SAAS;AACnC,gBAAI,SAAS,gBAAgB;AAC3B,gDAAkC,KAAK;AAAA,YACzC;AACA,mBAAO;AAAA,UACT,CAAC;AACD,yCAA+B,cAAc;AAE7C,WAAAA,MAAA,MAAM,kBAAN,gBAAAA,IAAA,YAAsB;AACtB,sBAAM,aAAN,+BAAiB,+BAA+B,cAAc;AAAA,QAChE;AAAA,QAEA;AAAA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA;AAAA,UACF;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,sBAAsB;AAAA,cACjC,mBAAmB,sBAAsB;AAAA,cACzC;AAAA;AAAA,UACF;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,eAAe;AAAA,cACf,mBAAmB;AAAA,cACnB,WAAW,CAAC,UAAU;AA9QhC,oBAAAA;AA+QY,kDAAkC,KAAK;AACvC,gDAAgC,KAAK;AACrC,iBAAAA,MAAA,MAAM,cAAN,gBAAAA,IAAA,YAAkB;AAAA,cACpB;AAAA,cACA,cAAc,CAAC,UAAU;AACvB,mDAAmC,KAAK;AAAA,cAC1C;AAAA,cACA,eAAY;AAAA,cACZ,WAAW;AAAA,cACX,QAAQ,CAAC,OAAO;AAxR1B,oBAAAA;AA0RY,iBAAAA,MAAA,MAAM,WAAN,gBAAAA,IAAA,YAAe;AACf,+CAA+B,MAAM;AAAA,cACvC;AAAA,eACI;AAAA,UACN;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAaA,SAAS,+BACP,aACwC;AACxC,SAAO;AAAA,IACL,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,MAAM;AAAA,IACR;AAAA,IACA,eAAe;AAAA,MACb,OAAO;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AACF;","names":["_a","value"]}
|
|
@@ -1077,6 +1077,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
1077
1077
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
1078
1078
|
"textarea",
|
|
1079
1079
|
{
|
|
1080
|
+
"data-testid": "adjustment-prompt",
|
|
1080
1081
|
disabled: suggestionIsLoading,
|
|
1081
1082
|
ref: adjustmentTextAreaRef,
|
|
1082
1083
|
value: adjustmentPrompt,
|
|
@@ -1104,6 +1105,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
1104
1105
|
{
|
|
1105
1106
|
onClick: beginGeneratingAdjustment,
|
|
1106
1107
|
className: "absolute right-2 bg-blue-500 text-white w-8 h-8 rounded-full flex items-center justify-center",
|
|
1108
|
+
"data-testid": "generate-button",
|
|
1107
1109
|
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("i", { className: "material-icons", children: "arrow_forward" })
|
|
1108
1110
|
}
|
|
1109
1111
|
)
|
|
@@ -1124,6 +1126,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
1124
1126
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
1125
1127
|
"textarea",
|
|
1126
1128
|
{
|
|
1129
|
+
"data-testid": "suggestion-result",
|
|
1127
1130
|
ref: suggestionTextAreaRef,
|
|
1128
1131
|
value: editSuggestion,
|
|
1129
1132
|
disabled: suggestionIsLoading,
|
|
@@ -1136,6 +1139,7 @@ var HoveringInsertionPromptBoxCore = ({
|
|
|
1136
1139
|
const SubmitComponent = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex w-full gap-4 justify-start", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
1137
1140
|
Button,
|
|
1138
1141
|
{
|
|
1142
|
+
"data-testid": "insert-button",
|
|
1139
1143
|
className: " bg-green-700 text-white",
|
|
1140
1144
|
onClick: () => {
|
|
1141
1145
|
performInsertion(editSuggestion);
|
|
@@ -1248,7 +1252,7 @@ var Menu = import_react8.default.forwardRef(
|
|
|
1248
1252
|
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1249
1253
|
"div",
|
|
1250
1254
|
__spreadProps(__spreadValues({}, props), {
|
|
1251
|
-
"data-
|
|
1255
|
+
"data-testid": "menu",
|
|
1252
1256
|
ref,
|
|
1253
1257
|
className: (0, import_css.cx)(
|
|
1254
1258
|
className,
|
|
@@ -1360,6 +1364,7 @@ var HoveringToolbar = (props) => {
|
|
|
1360
1364
|
{
|
|
1361
1365
|
ref,
|
|
1362
1366
|
className: "copilot-kit-textarea-css-scope " + (props.hoverMenuClassname || "p-2 absolute z-10 top-[-10000px] left-[-10000px] mt-[-6px] opacity-0 transition-opacity duration-700"),
|
|
1367
|
+
"data-testid": "hovering-toolbar",
|
|
1363
1368
|
children: isDisplayed && selection && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1364
1369
|
HoveringInsertionPromptBox,
|
|
1365
1370
|
{
|
|
@@ -1413,6 +1418,7 @@ var SuggestionElement = (props) => {
|
|
|
1413
1418
|
"span",
|
|
1414
1419
|
__spreadProps(__spreadValues({}, props.attributes), {
|
|
1415
1420
|
style: __spreadValues({}, props.suggestionsStyle),
|
|
1421
|
+
"data-testid": "suggestion",
|
|
1416
1422
|
contentEditable: false,
|
|
1417
1423
|
children: [
|
|
1418
1424
|
props.children,
|
|
@@ -1756,6 +1762,7 @@ var BaseCopilotTextareaWithHoveringContext = import_react12.default.forwardRef(
|
|
|
1756
1762
|
onTouchStart: (event) => {
|
|
1757
1763
|
onTouchStartHandlerForAutocomplete(event);
|
|
1758
1764
|
},
|
|
1765
|
+
"data-testid": "copilot-textarea-editable",
|
|
1759
1766
|
className: moddedClassName,
|
|
1760
1767
|
onBlur: (ev) => {
|
|
1761
1768
|
var _a2;
|