@icos-react/largemodel 1.0.26 → 1.0.28
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/dist/index.js +187 -112
- package/dist/index.mjs +187 -112
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -2147,17 +2147,91 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2147
2147
|
const { styles, cx } = useStyles4();
|
|
2148
2148
|
const rootRef = (0, import_react17.useRef)(null);
|
|
2149
2149
|
const [prefixButtonContainer, setPrefixButtonContainer] = (0, import_react17.useState)(null);
|
|
2150
|
+
const prefixButtonContainerRef = (0, import_react17.useRef)(null);
|
|
2151
|
+
const syncPrefixButtonContainer = (el) => {
|
|
2152
|
+
prefixButtonContainerRef.current = el;
|
|
2153
|
+
setPrefixButtonContainer(el);
|
|
2154
|
+
};
|
|
2150
2155
|
const [hasUserEdited, setHasUserEdited] = (0, import_react17.useState)(false);
|
|
2151
2156
|
const [userClearedContent, setUserClearedContent] = (0, import_react17.useState)(false);
|
|
2152
2157
|
const [contentText, setContentText] = (0, import_react17.useState)("");
|
|
2153
2158
|
const previousInitialValueRef = (0, import_react17.useRef)(null);
|
|
2159
|
+
const isComposingRef = (0, import_react17.useRef)(false);
|
|
2160
|
+
const EDITABLE_ANCHOR = "\u200B";
|
|
2161
|
+
const stripEditableAnchor = (text) => text.replace(/^[\u200B\s]+/, "").replace(/\u200B/g, "");
|
|
2162
|
+
const getEditableTextNodeAfterPrefix = () => {
|
|
2163
|
+
const container = prefixButtonContainerRef.current;
|
|
2164
|
+
if (!rootRef.current || !container)
|
|
2165
|
+
return null;
|
|
2166
|
+
const children = Array.from(rootRef.current.childNodes);
|
|
2167
|
+
const buttonIndex = children.indexOf(container);
|
|
2168
|
+
if (buttonIndex === -1)
|
|
2169
|
+
return null;
|
|
2170
|
+
for (let i = buttonIndex + 1; i < children.length; i++) {
|
|
2171
|
+
if (children[i].nodeType === Node.TEXT_NODE) {
|
|
2172
|
+
return children[i];
|
|
2173
|
+
}
|
|
2174
|
+
}
|
|
2175
|
+
return null;
|
|
2176
|
+
};
|
|
2177
|
+
const ensureEditableAnchor = () => {
|
|
2178
|
+
if (!rootRef.current || disabled)
|
|
2179
|
+
return null;
|
|
2180
|
+
if (prefixButton) {
|
|
2181
|
+
if (!prefixButtonContainerRef.current)
|
|
2182
|
+
return null;
|
|
2183
|
+
let textNode2 = getEditableTextNodeAfterPrefix();
|
|
2184
|
+
if (!textNode2) {
|
|
2185
|
+
textNode2 = document.createTextNode(EDITABLE_ANCHOR);
|
|
2186
|
+
rootRef.current.appendChild(textNode2);
|
|
2187
|
+
return textNode2;
|
|
2188
|
+
}
|
|
2189
|
+
const visible2 = stripEditableAnchor(textNode2.textContent || "");
|
|
2190
|
+
if (!visible2 && !textNode2.textContent?.includes(EDITABLE_ANCHOR)) {
|
|
2191
|
+
textNode2.textContent = (textNode2.textContent || "") + EDITABLE_ANCHOR;
|
|
2192
|
+
} else if (!visible2 && textNode2.textContent === "") {
|
|
2193
|
+
textNode2.textContent = EDITABLE_ANCHOR;
|
|
2194
|
+
}
|
|
2195
|
+
return textNode2;
|
|
2196
|
+
}
|
|
2197
|
+
let textNode = Array.from(rootRef.current.childNodes).find(
|
|
2198
|
+
(n) => n.nodeType === Node.TEXT_NODE
|
|
2199
|
+
);
|
|
2200
|
+
if (!textNode) {
|
|
2201
|
+
textNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2202
|
+
rootRef.current.appendChild(textNode);
|
|
2203
|
+
return textNode;
|
|
2204
|
+
}
|
|
2205
|
+
const visible = stripEditableAnchor(textNode.textContent || "");
|
|
2206
|
+
if (!visible && !textNode.textContent?.includes(EDITABLE_ANCHOR)) {
|
|
2207
|
+
textNode.textContent = EDITABLE_ANCHOR;
|
|
2208
|
+
}
|
|
2209
|
+
return textNode;
|
|
2210
|
+
};
|
|
2211
|
+
const placeCursorInEditableAnchor = () => {
|
|
2212
|
+
const textNode = ensureEditableAnchor();
|
|
2213
|
+
if (!textNode)
|
|
2214
|
+
return;
|
|
2215
|
+
const selection = window.getSelection();
|
|
2216
|
+
if (!selection)
|
|
2217
|
+
return;
|
|
2218
|
+
const range = document.createRange();
|
|
2219
|
+
const offset = textNode.textContent?.length ?? 0;
|
|
2220
|
+
try {
|
|
2221
|
+
range.setStart(textNode, offset);
|
|
2222
|
+
range.collapse(true);
|
|
2223
|
+
selection.removeAllRanges();
|
|
2224
|
+
selection.addRange(range);
|
|
2225
|
+
} catch {
|
|
2226
|
+
}
|
|
2227
|
+
};
|
|
2154
2228
|
const getPureTextContent3 = () => {
|
|
2155
2229
|
if (!rootRef.current)
|
|
2156
2230
|
return "";
|
|
2157
2231
|
let text = "";
|
|
2158
2232
|
const children = Array.from(rootRef.current.childNodes);
|
|
2159
2233
|
children.forEach((node) => {
|
|
2160
|
-
if (node ===
|
|
2234
|
+
if (node === prefixButtonContainerRef.current)
|
|
2161
2235
|
return;
|
|
2162
2236
|
if (node.nodeType === Node.TEXT_NODE) {
|
|
2163
2237
|
text += node.textContent || "";
|
|
@@ -2165,13 +2239,20 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2165
2239
|
text += node.textContent || "";
|
|
2166
2240
|
}
|
|
2167
2241
|
});
|
|
2168
|
-
return text
|
|
2242
|
+
return stripEditableAnchor(text);
|
|
2169
2243
|
};
|
|
2170
2244
|
const initializeContent = (forceInitialize = false) => {
|
|
2171
2245
|
if (!rootRef.current)
|
|
2172
2246
|
return;
|
|
2173
2247
|
if (userClearedContent && !forceInitialize)
|
|
2174
2248
|
return;
|
|
2249
|
+
let preservedText = "";
|
|
2250
|
+
if (forceInitialize && !prefixButton && rootRef.current) {
|
|
2251
|
+
preservedText = Array.from(rootRef.current.childNodes).filter(
|
|
2252
|
+
(node) => !(node.nodeType === Node.ELEMENT_NODE && node.getAttribute("contenteditable") === "false")
|
|
2253
|
+
).map((node) => node.textContent || "").join("");
|
|
2254
|
+
preservedText = stripEditableAnchor(preservedText);
|
|
2255
|
+
}
|
|
2175
2256
|
rootRef.current.innerHTML = "";
|
|
2176
2257
|
let plainText = "";
|
|
2177
2258
|
if (prefixButton) {
|
|
@@ -2181,11 +2262,11 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2181
2262
|
buttonContainer.style.userSelect = "none";
|
|
2182
2263
|
buttonContainer.style.display = "inline-block";
|
|
2183
2264
|
rootRef.current.appendChild(buttonContainer);
|
|
2184
|
-
|
|
2185
|
-
const spaceNode = document.createTextNode(
|
|
2265
|
+
syncPrefixButtonContainer(buttonContainer);
|
|
2266
|
+
const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2186
2267
|
rootRef.current.appendChild(spaceNode);
|
|
2187
2268
|
} else {
|
|
2188
|
-
|
|
2269
|
+
syncPrefixButtonContainer(null);
|
|
2189
2270
|
}
|
|
2190
2271
|
if (initialValue && initialValue.length > 0) {
|
|
2191
2272
|
initialValue.forEach((item) => {
|
|
@@ -2215,10 +2296,28 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2215
2296
|
}
|
|
2216
2297
|
});
|
|
2217
2298
|
}
|
|
2299
|
+
if (preservedText) {
|
|
2300
|
+
const textNode = document.createTextNode(preservedText);
|
|
2301
|
+
rootRef.current.appendChild(textNode);
|
|
2302
|
+
plainText = preservedText;
|
|
2303
|
+
setHasUserEdited(true);
|
|
2304
|
+
}
|
|
2218
2305
|
setContentText(plainText);
|
|
2219
|
-
|
|
2220
|
-
|
|
2221
|
-
|
|
2306
|
+
if (!isComposingRef.current) {
|
|
2307
|
+
onChange?.({ target: { value: plainText } });
|
|
2308
|
+
}
|
|
2309
|
+
if (!preservedText) {
|
|
2310
|
+
setHasUserEdited(false);
|
|
2311
|
+
setUserClearedContent(false);
|
|
2312
|
+
}
|
|
2313
|
+
if (!plainText && rootRef.current) {
|
|
2314
|
+
const hasTextNode = Array.from(rootRef.current.childNodes).some(
|
|
2315
|
+
(n) => n.nodeType === Node.TEXT_NODE
|
|
2316
|
+
);
|
|
2317
|
+
if (!hasTextNode) {
|
|
2318
|
+
rootRef.current.appendChild(document.createTextNode(EDITABLE_ANCHOR));
|
|
2319
|
+
}
|
|
2320
|
+
}
|
|
2222
2321
|
};
|
|
2223
2322
|
const hasInitialValueChanged = () => {
|
|
2224
2323
|
return initialValue !== previousInitialValueRef.current;
|
|
@@ -2229,7 +2328,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2229
2328
|
rootRef.current.setAttribute("contenteditable", "true");
|
|
2230
2329
|
}
|
|
2231
2330
|
return () => {
|
|
2232
|
-
|
|
2331
|
+
syncPrefixButtonContainer(null);
|
|
2233
2332
|
};
|
|
2234
2333
|
}, []);
|
|
2235
2334
|
(0, import_react17.useEffect)(() => {
|
|
@@ -2238,7 +2337,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2238
2337
|
const shouldHaveButton = !!prefixButton;
|
|
2239
2338
|
if (currentHasButton !== shouldHaveButton) {
|
|
2240
2339
|
if (currentHasButton && !shouldHaveButton) {
|
|
2241
|
-
|
|
2340
|
+
syncPrefixButtonContainer(null);
|
|
2242
2341
|
}
|
|
2243
2342
|
initializeContent(true);
|
|
2244
2343
|
if (!currentHasButton && shouldHaveButton) {
|
|
@@ -2248,30 +2347,8 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2248
2347
|
rootRef.current.setAttribute("contenteditable", "true");
|
|
2249
2348
|
rootRef.current.setAttribute("tabindex", "0");
|
|
2250
2349
|
rootRef.current.focus();
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
const range = document.createRange();
|
|
2254
|
-
const children = Array.from(rootRef.current.childNodes);
|
|
2255
|
-
if (children.length > 1) {
|
|
2256
|
-
const targetNode = children[1];
|
|
2257
|
-
try {
|
|
2258
|
-
range.setStart(targetNode, 0);
|
|
2259
|
-
range.collapse(true);
|
|
2260
|
-
selection.removeAllRanges();
|
|
2261
|
-
selection.addRange(range);
|
|
2262
|
-
} catch (error) {
|
|
2263
|
-
range.selectNodeContents(rootRef.current);
|
|
2264
|
-
range.collapse(false);
|
|
2265
|
-
selection.removeAllRanges();
|
|
2266
|
-
selection.addRange(range);
|
|
2267
|
-
}
|
|
2268
|
-
} else {
|
|
2269
|
-
range.selectNodeContents(rootRef.current);
|
|
2270
|
-
range.collapse(false);
|
|
2271
|
-
selection.removeAllRanges();
|
|
2272
|
-
selection.addRange(range);
|
|
2273
|
-
}
|
|
2274
|
-
}
|
|
2350
|
+
ensureEditableAnchor();
|
|
2351
|
+
placeCursorInEditableAnchor();
|
|
2275
2352
|
}
|
|
2276
2353
|
});
|
|
2277
2354
|
});
|
|
@@ -2292,7 +2369,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2292
2369
|
}
|
|
2293
2370
|
timeoutId = setTimeout(() => {
|
|
2294
2371
|
if (prefixButton && rootRef.current && rootRef.current.childNodes.length === 0) {
|
|
2295
|
-
|
|
2372
|
+
syncPrefixButtonContainer(null);
|
|
2296
2373
|
initializeContent(true);
|
|
2297
2374
|
}
|
|
2298
2375
|
}, 30);
|
|
@@ -2323,25 +2400,28 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2323
2400
|
}
|
|
2324
2401
|
}, [initialValue]);
|
|
2325
2402
|
(0, import_react17.useEffect)(() => {
|
|
2403
|
+
if (isComposingRef.current) {
|
|
2404
|
+
return;
|
|
2405
|
+
}
|
|
2326
2406
|
if (value === "" && rootRef.current) {
|
|
2327
2407
|
const currentContent = getPureTextContent3();
|
|
2328
2408
|
if (currentContent !== "" || contentText !== "" && !userClearedContent && !hasUserEdited) {
|
|
2329
2409
|
rootRef.current.innerHTML = "";
|
|
2330
2410
|
setContentText("");
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
setTimeout(() => {
|
|
2336
|
-
initializeContent(true);
|
|
2337
|
-
}, 0);
|
|
2338
|
-
}
|
|
2411
|
+
syncPrefixButtonContainer(null);
|
|
2412
|
+
setTimeout(() => {
|
|
2413
|
+
initializeContent(true);
|
|
2414
|
+
}, 0);
|
|
2339
2415
|
}
|
|
2340
2416
|
}
|
|
2341
2417
|
}, [value, contentText, userClearedContent, hasUserEdited, prefixButton, prefixButtonContainer]);
|
|
2342
|
-
const handleInput = () => {
|
|
2418
|
+
const handleInput = (e) => {
|
|
2343
2419
|
if (disabled)
|
|
2344
2420
|
return;
|
|
2421
|
+
if (!isComposingRef.current) {
|
|
2422
|
+
ensureEditableAnchor();
|
|
2423
|
+
}
|
|
2424
|
+
const nativeIsComposing = e.nativeEvent?.isComposing ?? false;
|
|
2345
2425
|
if (rootRef.current && prefixButtonContainer) {
|
|
2346
2426
|
const selection = window.getSelection();
|
|
2347
2427
|
if (selection && selection.anchorNode) {
|
|
@@ -2365,6 +2445,10 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2365
2445
|
}
|
|
2366
2446
|
}
|
|
2367
2447
|
const text = getPureTextContent3();
|
|
2448
|
+
const isComposing = isComposingRef.current || nativeIsComposing;
|
|
2449
|
+
if (isComposing) {
|
|
2450
|
+
return;
|
|
2451
|
+
}
|
|
2368
2452
|
if (text !== contentText) {
|
|
2369
2453
|
setHasUserEdited(true);
|
|
2370
2454
|
setContentText(text);
|
|
@@ -2375,7 +2459,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2375
2459
|
setUserClearedContent(false);
|
|
2376
2460
|
}
|
|
2377
2461
|
}
|
|
2378
|
-
if (rootRef.current && document.activeElement !== rootRef.current) {
|
|
2462
|
+
if (rootRef.current && document.activeElement !== rootRef.current && !isComposingRef.current) {
|
|
2379
2463
|
requestAnimationFrame(() => {
|
|
2380
2464
|
if (rootRef.current && document.activeElement !== rootRef.current) {
|
|
2381
2465
|
rootRef.current.focus();
|
|
@@ -2406,7 +2490,6 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2406
2490
|
}
|
|
2407
2491
|
}
|
|
2408
2492
|
});
|
|
2409
|
-
} else {
|
|
2410
2493
|
}
|
|
2411
2494
|
};
|
|
2412
2495
|
const handleEnter = (e) => {
|
|
@@ -2418,13 +2501,24 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2418
2501
|
const handleKeyDown = (e) => {
|
|
2419
2502
|
if (disabled)
|
|
2420
2503
|
return;
|
|
2504
|
+
if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && !isComposingRef.current && !e.nativeEvent.isComposing) {
|
|
2505
|
+
ensureEditableAnchor();
|
|
2506
|
+
}
|
|
2421
2507
|
if ((e.key === "Backspace" || e.key === "Delete") && rootRef.current) {
|
|
2422
2508
|
const selection = window.getSelection();
|
|
2423
2509
|
const pureText = getPureTextContent3();
|
|
2424
|
-
if (selection && selection.isCollapsed
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
|
|
2510
|
+
if (selection && selection.isCollapsed) {
|
|
2511
|
+
if (pureText.length === 0) {
|
|
2512
|
+
e.preventDefault();
|
|
2513
|
+
ensureEditableAnchor();
|
|
2514
|
+
placeCursorInEditableAnchor();
|
|
2515
|
+
return;
|
|
2516
|
+
}
|
|
2517
|
+
if (pureText.length <= 1) {
|
|
2518
|
+
e.preventDefault();
|
|
2519
|
+
clearContent();
|
|
2520
|
+
return;
|
|
2521
|
+
}
|
|
2428
2522
|
}
|
|
2429
2523
|
}
|
|
2430
2524
|
if (e.key === "Enter" && !e.shiftKey) {
|
|
@@ -2471,13 +2565,17 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2471
2565
|
rootRef.current?.removeChild(child);
|
|
2472
2566
|
}
|
|
2473
2567
|
});
|
|
2474
|
-
const spaceNode = document.createTextNode(
|
|
2568
|
+
const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2475
2569
|
rootRef.current.appendChild(spaceNode);
|
|
2570
|
+
placeCursorInEditableAnchor();
|
|
2476
2571
|
} else if (prefixButton && !prefixButtonContainer) {
|
|
2477
2572
|
initializeContent(true);
|
|
2478
2573
|
return;
|
|
2479
2574
|
} else {
|
|
2480
2575
|
rootRef.current.innerHTML = "";
|
|
2576
|
+
const anchorNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2577
|
+
rootRef.current.appendChild(anchorNode);
|
|
2578
|
+
placeCursorInEditableAnchor();
|
|
2481
2579
|
}
|
|
2482
2580
|
}
|
|
2483
2581
|
setContentText("");
|
|
@@ -2508,33 +2606,17 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2508
2606
|
(0, import_react17.useEffect)(() => {
|
|
2509
2607
|
if (prefixButton && prefixButtonContainer && rootRef.current) {
|
|
2510
2608
|
const timer = setTimeout(() => {
|
|
2511
|
-
if (rootRef.current) {
|
|
2512
|
-
|
|
2513
|
-
|
|
2514
|
-
|
|
2515
|
-
|
|
2516
|
-
|
|
2517
|
-
|
|
2518
|
-
|
|
2519
|
-
|
|
2520
|
-
|
|
2521
|
-
|
|
2522
|
-
if (selection && rootRef.current) {
|
|
2523
|
-
const children = Array.from(rootRef.current.childNodes);
|
|
2524
|
-
const buttonIndex = children.indexOf(prefixButtonContainer);
|
|
2525
|
-
if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
|
|
2526
|
-
const targetNode = children[buttonIndex + 1];
|
|
2527
|
-
const range = document.createRange();
|
|
2528
|
-
try {
|
|
2529
|
-
range.setStart(targetNode, 0);
|
|
2530
|
-
range.collapse(true);
|
|
2531
|
-
selection.removeAllRanges();
|
|
2532
|
-
selection.addRange(range);
|
|
2533
|
-
} catch (error) {
|
|
2534
|
-
}
|
|
2535
|
-
}
|
|
2536
|
-
}
|
|
2537
|
-
}
|
|
2609
|
+
if (rootRef.current && !disabled) {
|
|
2610
|
+
const currentContentEditable = rootRef.current.getAttribute("contenteditable");
|
|
2611
|
+
const currentTabIndex = rootRef.current.getAttribute("tabindex");
|
|
2612
|
+
if (currentContentEditable === "false" || currentTabIndex === "-1") {
|
|
2613
|
+
rootRef.current.setAttribute("contenteditable", "true");
|
|
2614
|
+
rootRef.current.setAttribute("tabindex", "0");
|
|
2615
|
+
}
|
|
2616
|
+
if (rootRef.current.childNodes.length > 0) {
|
|
2617
|
+
rootRef.current.focus();
|
|
2618
|
+
ensureEditableAnchor();
|
|
2619
|
+
placeCursorInEditableAnchor();
|
|
2538
2620
|
}
|
|
2539
2621
|
}
|
|
2540
2622
|
}, 100);
|
|
@@ -2638,11 +2720,13 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2638
2720
|
onPaste: handlePaste,
|
|
2639
2721
|
onKeyDown: handleKeyDown,
|
|
2640
2722
|
onCompositionStart: (e) => {
|
|
2723
|
+
isComposingRef.current = true;
|
|
2641
2724
|
if (!disabled && onCompositionStart) {
|
|
2642
2725
|
onCompositionStart(e);
|
|
2643
2726
|
}
|
|
2644
2727
|
},
|
|
2645
2728
|
onCompositionEnd: (e) => {
|
|
2729
|
+
isComposingRef.current = false;
|
|
2646
2730
|
if (!disabled) {
|
|
2647
2731
|
onCompositionEnd?.(e);
|
|
2648
2732
|
syncContentToParent();
|
|
@@ -2656,24 +2740,13 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
|
|
|
2656
2740
|
onFocus: () => {
|
|
2657
2741
|
if (!disabled) {
|
|
2658
2742
|
setTimeout(() => {
|
|
2743
|
+
if (ensureEditableAnchor()) {
|
|
2744
|
+
placeCursorInEditableAnchor();
|
|
2745
|
+
return;
|
|
2746
|
+
}
|
|
2659
2747
|
const selection = window.getSelection();
|
|
2660
2748
|
if (selection && rootRef.current) {
|
|
2661
2749
|
const range = document.createRange();
|
|
2662
|
-
if (prefixButtonContainer && rootRef.current.contains(prefixButtonContainer)) {
|
|
2663
|
-
const children = Array.from(rootRef.current.childNodes);
|
|
2664
|
-
const buttonIndex = children.indexOf(prefixButtonContainer);
|
|
2665
|
-
if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
|
|
2666
|
-
const targetNode = children[buttonIndex + 1];
|
|
2667
|
-
try {
|
|
2668
|
-
range.setStart(targetNode, 0);
|
|
2669
|
-
range.collapse(true);
|
|
2670
|
-
selection.removeAllRanges();
|
|
2671
|
-
selection.addRange(range);
|
|
2672
|
-
return;
|
|
2673
|
-
} catch (error) {
|
|
2674
|
-
}
|
|
2675
|
-
}
|
|
2676
|
-
}
|
|
2677
2750
|
range.selectNodeContents(rootRef.current);
|
|
2678
2751
|
range.collapse(false);
|
|
2679
2752
|
selection.removeAllRanges();
|
|
@@ -3809,6 +3882,17 @@ function parseCustomTagsFromFullText(text, genSegmentId) {
|
|
|
3809
3882
|
}
|
|
3810
3883
|
return finalized;
|
|
3811
3884
|
}
|
|
3885
|
+
function appendAnchorToCustomTagStream(stream, anchorMark) {
|
|
3886
|
+
if (!stream.length || !anchorMark)
|
|
3887
|
+
return false;
|
|
3888
|
+
const exists = stream.some(
|
|
3889
|
+
(p) => p.kind === "text" && p.text.includes(anchorMark)
|
|
3890
|
+
);
|
|
3891
|
+
if (exists)
|
|
3892
|
+
return false;
|
|
3893
|
+
stream.push({ kind: "text", text: anchorMark });
|
|
3894
|
+
return true;
|
|
3895
|
+
}
|
|
3812
3896
|
function rootPlainFromStream(stream) {
|
|
3813
3897
|
return stream.filter((p) => p.kind === "text").map((p) => p.text).join("");
|
|
3814
3898
|
}
|
|
@@ -4021,15 +4105,12 @@ var processStreamData = (aiMessageId, jsonData, setChatMessages, conversationId,
|
|
|
4021
4105
|
};
|
|
4022
4106
|
}
|
|
4023
4107
|
if (customTagUpdate && customTagUpdate.stream.length > 0) {
|
|
4024
|
-
|
|
4025
|
-
|
|
4026
|
-
|
|
4027
|
-
|
|
4028
|
-
|
|
4029
|
-
|
|
4030
|
-
}
|
|
4031
|
-
break;
|
|
4032
|
-
}
|
|
4108
|
+
const inserted = appendAnchorToCustomTagStream(
|
|
4109
|
+
customTagUpdate.stream,
|
|
4110
|
+
anchorMark
|
|
4111
|
+
);
|
|
4112
|
+
if (inserted) {
|
|
4113
|
+
hasChanges = true;
|
|
4033
4114
|
}
|
|
4034
4115
|
}
|
|
4035
4116
|
}
|
|
@@ -4247,15 +4328,7 @@ var processHistoryRecords = (history, chatMessages, setChatMessages, setConversa
|
|
|
4247
4328
|
if (actionItem.anchorId && historyCustomTagState.stream.length > 0) {
|
|
4248
4329
|
const anchorMark = `
|
|
4249
4330
|
[ANCHOR:${actionItem.anchorId}]`;
|
|
4250
|
-
|
|
4251
|
-
const part = historyCustomTagState.stream[j];
|
|
4252
|
-
if (part.kind === "text") {
|
|
4253
|
-
if (!part.text.includes(anchorMark)) {
|
|
4254
|
-
part.text += anchorMark;
|
|
4255
|
-
}
|
|
4256
|
-
break;
|
|
4257
|
-
}
|
|
4258
|
-
}
|
|
4331
|
+
appendAnchorToCustomTagStream(historyCustomTagState.stream, anchorMark);
|
|
4259
4332
|
}
|
|
4260
4333
|
});
|
|
4261
4334
|
}
|
|
@@ -6315,7 +6388,9 @@ var ChatDemo = (0, import_react21.forwardRef)(
|
|
|
6315
6388
|
CustomInput_default,
|
|
6316
6389
|
{
|
|
6317
6390
|
value: content,
|
|
6318
|
-
onChange: (e) =>
|
|
6391
|
+
onChange: (e) => {
|
|
6392
|
+
return !isLoading && !isEventChangeProcessing && setContent(e.target.value);
|
|
6393
|
+
},
|
|
6319
6394
|
onPressEnter: () => !isLoading && !isEventChangeProcessing && onSubmit(content),
|
|
6320
6395
|
placeholder: isLoading || isEventChangeProcessing ? "\u7B49\u5F85\u54CD\u5E94\u4E2D..." : "\u8BF7\u8F93\u5165\u60A8\u7684\u95EE\u9898...",
|
|
6321
6396
|
initialValue: customInitialValue || [],
|
package/dist/index.mjs
CHANGED
|
@@ -2098,17 +2098,91 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2098
2098
|
const { styles, cx } = useStyles4();
|
|
2099
2099
|
const rootRef = useRef7(null);
|
|
2100
2100
|
const [prefixButtonContainer, setPrefixButtonContainer] = useState7(null);
|
|
2101
|
+
const prefixButtonContainerRef = useRef7(null);
|
|
2102
|
+
const syncPrefixButtonContainer = (el) => {
|
|
2103
|
+
prefixButtonContainerRef.current = el;
|
|
2104
|
+
setPrefixButtonContainer(el);
|
|
2105
|
+
};
|
|
2101
2106
|
const [hasUserEdited, setHasUserEdited] = useState7(false);
|
|
2102
2107
|
const [userClearedContent, setUserClearedContent] = useState7(false);
|
|
2103
2108
|
const [contentText, setContentText] = useState7("");
|
|
2104
2109
|
const previousInitialValueRef = useRef7(null);
|
|
2110
|
+
const isComposingRef = useRef7(false);
|
|
2111
|
+
const EDITABLE_ANCHOR = "\u200B";
|
|
2112
|
+
const stripEditableAnchor = (text) => text.replace(/^[\u200B\s]+/, "").replace(/\u200B/g, "");
|
|
2113
|
+
const getEditableTextNodeAfterPrefix = () => {
|
|
2114
|
+
const container = prefixButtonContainerRef.current;
|
|
2115
|
+
if (!rootRef.current || !container)
|
|
2116
|
+
return null;
|
|
2117
|
+
const children = Array.from(rootRef.current.childNodes);
|
|
2118
|
+
const buttonIndex = children.indexOf(container);
|
|
2119
|
+
if (buttonIndex === -1)
|
|
2120
|
+
return null;
|
|
2121
|
+
for (let i = buttonIndex + 1; i < children.length; i++) {
|
|
2122
|
+
if (children[i].nodeType === Node.TEXT_NODE) {
|
|
2123
|
+
return children[i];
|
|
2124
|
+
}
|
|
2125
|
+
}
|
|
2126
|
+
return null;
|
|
2127
|
+
};
|
|
2128
|
+
const ensureEditableAnchor = () => {
|
|
2129
|
+
if (!rootRef.current || disabled)
|
|
2130
|
+
return null;
|
|
2131
|
+
if (prefixButton) {
|
|
2132
|
+
if (!prefixButtonContainerRef.current)
|
|
2133
|
+
return null;
|
|
2134
|
+
let textNode2 = getEditableTextNodeAfterPrefix();
|
|
2135
|
+
if (!textNode2) {
|
|
2136
|
+
textNode2 = document.createTextNode(EDITABLE_ANCHOR);
|
|
2137
|
+
rootRef.current.appendChild(textNode2);
|
|
2138
|
+
return textNode2;
|
|
2139
|
+
}
|
|
2140
|
+
const visible2 = stripEditableAnchor(textNode2.textContent || "");
|
|
2141
|
+
if (!visible2 && !textNode2.textContent?.includes(EDITABLE_ANCHOR)) {
|
|
2142
|
+
textNode2.textContent = (textNode2.textContent || "") + EDITABLE_ANCHOR;
|
|
2143
|
+
} else if (!visible2 && textNode2.textContent === "") {
|
|
2144
|
+
textNode2.textContent = EDITABLE_ANCHOR;
|
|
2145
|
+
}
|
|
2146
|
+
return textNode2;
|
|
2147
|
+
}
|
|
2148
|
+
let textNode = Array.from(rootRef.current.childNodes).find(
|
|
2149
|
+
(n) => n.nodeType === Node.TEXT_NODE
|
|
2150
|
+
);
|
|
2151
|
+
if (!textNode) {
|
|
2152
|
+
textNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2153
|
+
rootRef.current.appendChild(textNode);
|
|
2154
|
+
return textNode;
|
|
2155
|
+
}
|
|
2156
|
+
const visible = stripEditableAnchor(textNode.textContent || "");
|
|
2157
|
+
if (!visible && !textNode.textContent?.includes(EDITABLE_ANCHOR)) {
|
|
2158
|
+
textNode.textContent = EDITABLE_ANCHOR;
|
|
2159
|
+
}
|
|
2160
|
+
return textNode;
|
|
2161
|
+
};
|
|
2162
|
+
const placeCursorInEditableAnchor = () => {
|
|
2163
|
+
const textNode = ensureEditableAnchor();
|
|
2164
|
+
if (!textNode)
|
|
2165
|
+
return;
|
|
2166
|
+
const selection = window.getSelection();
|
|
2167
|
+
if (!selection)
|
|
2168
|
+
return;
|
|
2169
|
+
const range = document.createRange();
|
|
2170
|
+
const offset = textNode.textContent?.length ?? 0;
|
|
2171
|
+
try {
|
|
2172
|
+
range.setStart(textNode, offset);
|
|
2173
|
+
range.collapse(true);
|
|
2174
|
+
selection.removeAllRanges();
|
|
2175
|
+
selection.addRange(range);
|
|
2176
|
+
} catch {
|
|
2177
|
+
}
|
|
2178
|
+
};
|
|
2105
2179
|
const getPureTextContent3 = () => {
|
|
2106
2180
|
if (!rootRef.current)
|
|
2107
2181
|
return "";
|
|
2108
2182
|
let text = "";
|
|
2109
2183
|
const children = Array.from(rootRef.current.childNodes);
|
|
2110
2184
|
children.forEach((node) => {
|
|
2111
|
-
if (node ===
|
|
2185
|
+
if (node === prefixButtonContainerRef.current)
|
|
2112
2186
|
return;
|
|
2113
2187
|
if (node.nodeType === Node.TEXT_NODE) {
|
|
2114
2188
|
text += node.textContent || "";
|
|
@@ -2116,13 +2190,20 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2116
2190
|
text += node.textContent || "";
|
|
2117
2191
|
}
|
|
2118
2192
|
});
|
|
2119
|
-
return text
|
|
2193
|
+
return stripEditableAnchor(text);
|
|
2120
2194
|
};
|
|
2121
2195
|
const initializeContent = (forceInitialize = false) => {
|
|
2122
2196
|
if (!rootRef.current)
|
|
2123
2197
|
return;
|
|
2124
2198
|
if (userClearedContent && !forceInitialize)
|
|
2125
2199
|
return;
|
|
2200
|
+
let preservedText = "";
|
|
2201
|
+
if (forceInitialize && !prefixButton && rootRef.current) {
|
|
2202
|
+
preservedText = Array.from(rootRef.current.childNodes).filter(
|
|
2203
|
+
(node) => !(node.nodeType === Node.ELEMENT_NODE && node.getAttribute("contenteditable") === "false")
|
|
2204
|
+
).map((node) => node.textContent || "").join("");
|
|
2205
|
+
preservedText = stripEditableAnchor(preservedText);
|
|
2206
|
+
}
|
|
2126
2207
|
rootRef.current.innerHTML = "";
|
|
2127
2208
|
let plainText = "";
|
|
2128
2209
|
if (prefixButton) {
|
|
@@ -2132,11 +2213,11 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2132
2213
|
buttonContainer.style.userSelect = "none";
|
|
2133
2214
|
buttonContainer.style.display = "inline-block";
|
|
2134
2215
|
rootRef.current.appendChild(buttonContainer);
|
|
2135
|
-
|
|
2136
|
-
const spaceNode = document.createTextNode(
|
|
2216
|
+
syncPrefixButtonContainer(buttonContainer);
|
|
2217
|
+
const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2137
2218
|
rootRef.current.appendChild(spaceNode);
|
|
2138
2219
|
} else {
|
|
2139
|
-
|
|
2220
|
+
syncPrefixButtonContainer(null);
|
|
2140
2221
|
}
|
|
2141
2222
|
if (initialValue && initialValue.length > 0) {
|
|
2142
2223
|
initialValue.forEach((item) => {
|
|
@@ -2166,10 +2247,28 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2166
2247
|
}
|
|
2167
2248
|
});
|
|
2168
2249
|
}
|
|
2250
|
+
if (preservedText) {
|
|
2251
|
+
const textNode = document.createTextNode(preservedText);
|
|
2252
|
+
rootRef.current.appendChild(textNode);
|
|
2253
|
+
plainText = preservedText;
|
|
2254
|
+
setHasUserEdited(true);
|
|
2255
|
+
}
|
|
2169
2256
|
setContentText(plainText);
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2257
|
+
if (!isComposingRef.current) {
|
|
2258
|
+
onChange?.({ target: { value: plainText } });
|
|
2259
|
+
}
|
|
2260
|
+
if (!preservedText) {
|
|
2261
|
+
setHasUserEdited(false);
|
|
2262
|
+
setUserClearedContent(false);
|
|
2263
|
+
}
|
|
2264
|
+
if (!plainText && rootRef.current) {
|
|
2265
|
+
const hasTextNode = Array.from(rootRef.current.childNodes).some(
|
|
2266
|
+
(n) => n.nodeType === Node.TEXT_NODE
|
|
2267
|
+
);
|
|
2268
|
+
if (!hasTextNode) {
|
|
2269
|
+
rootRef.current.appendChild(document.createTextNode(EDITABLE_ANCHOR));
|
|
2270
|
+
}
|
|
2271
|
+
}
|
|
2173
2272
|
};
|
|
2174
2273
|
const hasInitialValueChanged = () => {
|
|
2175
2274
|
return initialValue !== previousInitialValueRef.current;
|
|
@@ -2180,7 +2279,7 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2180
2279
|
rootRef.current.setAttribute("contenteditable", "true");
|
|
2181
2280
|
}
|
|
2182
2281
|
return () => {
|
|
2183
|
-
|
|
2282
|
+
syncPrefixButtonContainer(null);
|
|
2184
2283
|
};
|
|
2185
2284
|
}, []);
|
|
2186
2285
|
useEffect6(() => {
|
|
@@ -2189,7 +2288,7 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2189
2288
|
const shouldHaveButton = !!prefixButton;
|
|
2190
2289
|
if (currentHasButton !== shouldHaveButton) {
|
|
2191
2290
|
if (currentHasButton && !shouldHaveButton) {
|
|
2192
|
-
|
|
2291
|
+
syncPrefixButtonContainer(null);
|
|
2193
2292
|
}
|
|
2194
2293
|
initializeContent(true);
|
|
2195
2294
|
if (!currentHasButton && shouldHaveButton) {
|
|
@@ -2199,30 +2298,8 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2199
2298
|
rootRef.current.setAttribute("contenteditable", "true");
|
|
2200
2299
|
rootRef.current.setAttribute("tabindex", "0");
|
|
2201
2300
|
rootRef.current.focus();
|
|
2202
|
-
|
|
2203
|
-
|
|
2204
|
-
const range = document.createRange();
|
|
2205
|
-
const children = Array.from(rootRef.current.childNodes);
|
|
2206
|
-
if (children.length > 1) {
|
|
2207
|
-
const targetNode = children[1];
|
|
2208
|
-
try {
|
|
2209
|
-
range.setStart(targetNode, 0);
|
|
2210
|
-
range.collapse(true);
|
|
2211
|
-
selection.removeAllRanges();
|
|
2212
|
-
selection.addRange(range);
|
|
2213
|
-
} catch (error) {
|
|
2214
|
-
range.selectNodeContents(rootRef.current);
|
|
2215
|
-
range.collapse(false);
|
|
2216
|
-
selection.removeAllRanges();
|
|
2217
|
-
selection.addRange(range);
|
|
2218
|
-
}
|
|
2219
|
-
} else {
|
|
2220
|
-
range.selectNodeContents(rootRef.current);
|
|
2221
|
-
range.collapse(false);
|
|
2222
|
-
selection.removeAllRanges();
|
|
2223
|
-
selection.addRange(range);
|
|
2224
|
-
}
|
|
2225
|
-
}
|
|
2301
|
+
ensureEditableAnchor();
|
|
2302
|
+
placeCursorInEditableAnchor();
|
|
2226
2303
|
}
|
|
2227
2304
|
});
|
|
2228
2305
|
});
|
|
@@ -2243,7 +2320,7 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2243
2320
|
}
|
|
2244
2321
|
timeoutId = setTimeout(() => {
|
|
2245
2322
|
if (prefixButton && rootRef.current && rootRef.current.childNodes.length === 0) {
|
|
2246
|
-
|
|
2323
|
+
syncPrefixButtonContainer(null);
|
|
2247
2324
|
initializeContent(true);
|
|
2248
2325
|
}
|
|
2249
2326
|
}, 30);
|
|
@@ -2274,25 +2351,28 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2274
2351
|
}
|
|
2275
2352
|
}, [initialValue]);
|
|
2276
2353
|
useEffect6(() => {
|
|
2354
|
+
if (isComposingRef.current) {
|
|
2355
|
+
return;
|
|
2356
|
+
}
|
|
2277
2357
|
if (value === "" && rootRef.current) {
|
|
2278
2358
|
const currentContent = getPureTextContent3();
|
|
2279
2359
|
if (currentContent !== "" || contentText !== "" && !userClearedContent && !hasUserEdited) {
|
|
2280
2360
|
rootRef.current.innerHTML = "";
|
|
2281
2361
|
setContentText("");
|
|
2282
|
-
|
|
2283
|
-
|
|
2284
|
-
|
|
2285
|
-
|
|
2286
|
-
setTimeout(() => {
|
|
2287
|
-
initializeContent(true);
|
|
2288
|
-
}, 0);
|
|
2289
|
-
}
|
|
2362
|
+
syncPrefixButtonContainer(null);
|
|
2363
|
+
setTimeout(() => {
|
|
2364
|
+
initializeContent(true);
|
|
2365
|
+
}, 0);
|
|
2290
2366
|
}
|
|
2291
2367
|
}
|
|
2292
2368
|
}, [value, contentText, userClearedContent, hasUserEdited, prefixButton, prefixButtonContainer]);
|
|
2293
|
-
const handleInput = () => {
|
|
2369
|
+
const handleInput = (e) => {
|
|
2294
2370
|
if (disabled)
|
|
2295
2371
|
return;
|
|
2372
|
+
if (!isComposingRef.current) {
|
|
2373
|
+
ensureEditableAnchor();
|
|
2374
|
+
}
|
|
2375
|
+
const nativeIsComposing = e.nativeEvent?.isComposing ?? false;
|
|
2296
2376
|
if (rootRef.current && prefixButtonContainer) {
|
|
2297
2377
|
const selection = window.getSelection();
|
|
2298
2378
|
if (selection && selection.anchorNode) {
|
|
@@ -2316,6 +2396,10 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2316
2396
|
}
|
|
2317
2397
|
}
|
|
2318
2398
|
const text = getPureTextContent3();
|
|
2399
|
+
const isComposing = isComposingRef.current || nativeIsComposing;
|
|
2400
|
+
if (isComposing) {
|
|
2401
|
+
return;
|
|
2402
|
+
}
|
|
2319
2403
|
if (text !== contentText) {
|
|
2320
2404
|
setHasUserEdited(true);
|
|
2321
2405
|
setContentText(text);
|
|
@@ -2326,7 +2410,7 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2326
2410
|
setUserClearedContent(false);
|
|
2327
2411
|
}
|
|
2328
2412
|
}
|
|
2329
|
-
if (rootRef.current && document.activeElement !== rootRef.current) {
|
|
2413
|
+
if (rootRef.current && document.activeElement !== rootRef.current && !isComposingRef.current) {
|
|
2330
2414
|
requestAnimationFrame(() => {
|
|
2331
2415
|
if (rootRef.current && document.activeElement !== rootRef.current) {
|
|
2332
2416
|
rootRef.current.focus();
|
|
@@ -2357,7 +2441,6 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2357
2441
|
}
|
|
2358
2442
|
}
|
|
2359
2443
|
});
|
|
2360
|
-
} else {
|
|
2361
2444
|
}
|
|
2362
2445
|
};
|
|
2363
2446
|
const handleEnter = (e) => {
|
|
@@ -2369,13 +2452,24 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2369
2452
|
const handleKeyDown = (e) => {
|
|
2370
2453
|
if (disabled)
|
|
2371
2454
|
return;
|
|
2455
|
+
if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && !isComposingRef.current && !e.nativeEvent.isComposing) {
|
|
2456
|
+
ensureEditableAnchor();
|
|
2457
|
+
}
|
|
2372
2458
|
if ((e.key === "Backspace" || e.key === "Delete") && rootRef.current) {
|
|
2373
2459
|
const selection = window.getSelection();
|
|
2374
2460
|
const pureText = getPureTextContent3();
|
|
2375
|
-
if (selection && selection.isCollapsed
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2461
|
+
if (selection && selection.isCollapsed) {
|
|
2462
|
+
if (pureText.length === 0) {
|
|
2463
|
+
e.preventDefault();
|
|
2464
|
+
ensureEditableAnchor();
|
|
2465
|
+
placeCursorInEditableAnchor();
|
|
2466
|
+
return;
|
|
2467
|
+
}
|
|
2468
|
+
if (pureText.length <= 1) {
|
|
2469
|
+
e.preventDefault();
|
|
2470
|
+
clearContent();
|
|
2471
|
+
return;
|
|
2472
|
+
}
|
|
2379
2473
|
}
|
|
2380
2474
|
}
|
|
2381
2475
|
if (e.key === "Enter" && !e.shiftKey) {
|
|
@@ -2422,13 +2516,17 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2422
2516
|
rootRef.current?.removeChild(child);
|
|
2423
2517
|
}
|
|
2424
2518
|
});
|
|
2425
|
-
const spaceNode = document.createTextNode(
|
|
2519
|
+
const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2426
2520
|
rootRef.current.appendChild(spaceNode);
|
|
2521
|
+
placeCursorInEditableAnchor();
|
|
2427
2522
|
} else if (prefixButton && !prefixButtonContainer) {
|
|
2428
2523
|
initializeContent(true);
|
|
2429
2524
|
return;
|
|
2430
2525
|
} else {
|
|
2431
2526
|
rootRef.current.innerHTML = "";
|
|
2527
|
+
const anchorNode = document.createTextNode(EDITABLE_ANCHOR);
|
|
2528
|
+
rootRef.current.appendChild(anchorNode);
|
|
2529
|
+
placeCursorInEditableAnchor();
|
|
2432
2530
|
}
|
|
2433
2531
|
}
|
|
2434
2532
|
setContentText("");
|
|
@@ -2459,33 +2557,17 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2459
2557
|
useEffect6(() => {
|
|
2460
2558
|
if (prefixButton && prefixButtonContainer && rootRef.current) {
|
|
2461
2559
|
const timer = setTimeout(() => {
|
|
2462
|
-
if (rootRef.current) {
|
|
2463
|
-
|
|
2464
|
-
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
|
|
2468
|
-
|
|
2469
|
-
|
|
2470
|
-
|
|
2471
|
-
|
|
2472
|
-
|
|
2473
|
-
if (selection && rootRef.current) {
|
|
2474
|
-
const children = Array.from(rootRef.current.childNodes);
|
|
2475
|
-
const buttonIndex = children.indexOf(prefixButtonContainer);
|
|
2476
|
-
if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
|
|
2477
|
-
const targetNode = children[buttonIndex + 1];
|
|
2478
|
-
const range = document.createRange();
|
|
2479
|
-
try {
|
|
2480
|
-
range.setStart(targetNode, 0);
|
|
2481
|
-
range.collapse(true);
|
|
2482
|
-
selection.removeAllRanges();
|
|
2483
|
-
selection.addRange(range);
|
|
2484
|
-
} catch (error) {
|
|
2485
|
-
}
|
|
2486
|
-
}
|
|
2487
|
-
}
|
|
2488
|
-
}
|
|
2560
|
+
if (rootRef.current && !disabled) {
|
|
2561
|
+
const currentContentEditable = rootRef.current.getAttribute("contenteditable");
|
|
2562
|
+
const currentTabIndex = rootRef.current.getAttribute("tabindex");
|
|
2563
|
+
if (currentContentEditable === "false" || currentTabIndex === "-1") {
|
|
2564
|
+
rootRef.current.setAttribute("contenteditable", "true");
|
|
2565
|
+
rootRef.current.setAttribute("tabindex", "0");
|
|
2566
|
+
}
|
|
2567
|
+
if (rootRef.current.childNodes.length > 0) {
|
|
2568
|
+
rootRef.current.focus();
|
|
2569
|
+
ensureEditableAnchor();
|
|
2570
|
+
placeCursorInEditableAnchor();
|
|
2489
2571
|
}
|
|
2490
2572
|
}
|
|
2491
2573
|
}, 100);
|
|
@@ -2589,11 +2671,13 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2589
2671
|
onPaste: handlePaste,
|
|
2590
2672
|
onKeyDown: handleKeyDown,
|
|
2591
2673
|
onCompositionStart: (e) => {
|
|
2674
|
+
isComposingRef.current = true;
|
|
2592
2675
|
if (!disabled && onCompositionStart) {
|
|
2593
2676
|
onCompositionStart(e);
|
|
2594
2677
|
}
|
|
2595
2678
|
},
|
|
2596
2679
|
onCompositionEnd: (e) => {
|
|
2680
|
+
isComposingRef.current = false;
|
|
2597
2681
|
if (!disabled) {
|
|
2598
2682
|
onCompositionEnd?.(e);
|
|
2599
2683
|
syncContentToParent();
|
|
@@ -2607,24 +2691,13 @@ var CustomInput = forwardRef4((props, ref) => {
|
|
|
2607
2691
|
onFocus: () => {
|
|
2608
2692
|
if (!disabled) {
|
|
2609
2693
|
setTimeout(() => {
|
|
2694
|
+
if (ensureEditableAnchor()) {
|
|
2695
|
+
placeCursorInEditableAnchor();
|
|
2696
|
+
return;
|
|
2697
|
+
}
|
|
2610
2698
|
const selection = window.getSelection();
|
|
2611
2699
|
if (selection && rootRef.current) {
|
|
2612
2700
|
const range = document.createRange();
|
|
2613
|
-
if (prefixButtonContainer && rootRef.current.contains(prefixButtonContainer)) {
|
|
2614
|
-
const children = Array.from(rootRef.current.childNodes);
|
|
2615
|
-
const buttonIndex = children.indexOf(prefixButtonContainer);
|
|
2616
|
-
if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
|
|
2617
|
-
const targetNode = children[buttonIndex + 1];
|
|
2618
|
-
try {
|
|
2619
|
-
range.setStart(targetNode, 0);
|
|
2620
|
-
range.collapse(true);
|
|
2621
|
-
selection.removeAllRanges();
|
|
2622
|
-
selection.addRange(range);
|
|
2623
|
-
return;
|
|
2624
|
-
} catch (error) {
|
|
2625
|
-
}
|
|
2626
|
-
}
|
|
2627
|
-
}
|
|
2628
2701
|
range.selectNodeContents(rootRef.current);
|
|
2629
2702
|
range.collapse(false);
|
|
2630
2703
|
selection.removeAllRanges();
|
|
@@ -3760,6 +3833,17 @@ function parseCustomTagsFromFullText(text, genSegmentId) {
|
|
|
3760
3833
|
}
|
|
3761
3834
|
return finalized;
|
|
3762
3835
|
}
|
|
3836
|
+
function appendAnchorToCustomTagStream(stream, anchorMark) {
|
|
3837
|
+
if (!stream.length || !anchorMark)
|
|
3838
|
+
return false;
|
|
3839
|
+
const exists = stream.some(
|
|
3840
|
+
(p) => p.kind === "text" && p.text.includes(anchorMark)
|
|
3841
|
+
);
|
|
3842
|
+
if (exists)
|
|
3843
|
+
return false;
|
|
3844
|
+
stream.push({ kind: "text", text: anchorMark });
|
|
3845
|
+
return true;
|
|
3846
|
+
}
|
|
3763
3847
|
function rootPlainFromStream(stream) {
|
|
3764
3848
|
return stream.filter((p) => p.kind === "text").map((p) => p.text).join("");
|
|
3765
3849
|
}
|
|
@@ -3972,15 +4056,12 @@ var processStreamData = (aiMessageId, jsonData, setChatMessages, conversationId,
|
|
|
3972
4056
|
};
|
|
3973
4057
|
}
|
|
3974
4058
|
if (customTagUpdate && customTagUpdate.stream.length > 0) {
|
|
3975
|
-
|
|
3976
|
-
|
|
3977
|
-
|
|
3978
|
-
|
|
3979
|
-
|
|
3980
|
-
|
|
3981
|
-
}
|
|
3982
|
-
break;
|
|
3983
|
-
}
|
|
4059
|
+
const inserted = appendAnchorToCustomTagStream(
|
|
4060
|
+
customTagUpdate.stream,
|
|
4061
|
+
anchorMark
|
|
4062
|
+
);
|
|
4063
|
+
if (inserted) {
|
|
4064
|
+
hasChanges = true;
|
|
3984
4065
|
}
|
|
3985
4066
|
}
|
|
3986
4067
|
}
|
|
@@ -4198,15 +4279,7 @@ var processHistoryRecords = (history, chatMessages, setChatMessages, setConversa
|
|
|
4198
4279
|
if (actionItem.anchorId && historyCustomTagState.stream.length > 0) {
|
|
4199
4280
|
const anchorMark = `
|
|
4200
4281
|
[ANCHOR:${actionItem.anchorId}]`;
|
|
4201
|
-
|
|
4202
|
-
const part = historyCustomTagState.stream[j];
|
|
4203
|
-
if (part.kind === "text") {
|
|
4204
|
-
if (!part.text.includes(anchorMark)) {
|
|
4205
|
-
part.text += anchorMark;
|
|
4206
|
-
}
|
|
4207
|
-
break;
|
|
4208
|
-
}
|
|
4209
|
-
}
|
|
4282
|
+
appendAnchorToCustomTagStream(historyCustomTagState.stream, anchorMark);
|
|
4210
4283
|
}
|
|
4211
4284
|
});
|
|
4212
4285
|
}
|
|
@@ -6266,7 +6339,9 @@ var ChatDemo = forwardRef5(
|
|
|
6266
6339
|
CustomInput_default,
|
|
6267
6340
|
{
|
|
6268
6341
|
value: content,
|
|
6269
|
-
onChange: (e) =>
|
|
6342
|
+
onChange: (e) => {
|
|
6343
|
+
return !isLoading && !isEventChangeProcessing && setContent(e.target.value);
|
|
6344
|
+
},
|
|
6270
6345
|
onPressEnter: () => !isLoading && !isEventChangeProcessing && onSubmit(content),
|
|
6271
6346
|
placeholder: isLoading || isEventChangeProcessing ? "\u7B49\u5F85\u54CD\u5E94\u4E2D..." : "\u8BF7\u8F93\u5165\u60A8\u7684\u95EE\u9898...",
|
|
6272
6347
|
initialValue: customInitialValue || [],
|