@cyberyozh/text-editor 0.1.10 → 0.1.12
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/editor.css +65 -0
- package/dist/editor.css.map +1 -1
- package/dist/editor.js +294 -122
- package/dist/editor.js.map +1 -1
- package/dist/editor.mjs +254 -82
- package/dist/editor.mjs.map +1 -1
- package/dist/render.js +34 -75
- package/dist/render.js.map +1 -1
- package/dist/render.mjs +32 -73
- package/dist/render.mjs.map +1 -1
- package/dist/styles/index.css +65 -0
- package/package.json +1 -1
- package/src/editor/dialogs/image-dialog/image-dialog.tsx +25 -3
- package/src/extensions/base/figure.ts +5 -5
- package/src/extensions/editor/figure.ts +184 -1
- package/src/extensions/editor/get-editor-extensions.ts +8 -2
- package/src/extensions/editor/index.ts +0 -24
- package/src/extensions/render/get-render-extensions.ts +1 -2
- package/src/extensions/views/components/index.ts +0 -1
- package/src/extensions/views/node-views/figure.tsx +1 -1
- package/src/render/static-renderer-config.tsx +0 -4
- package/src/styles/extensions/figure.css +77 -0
- package/src/extensions/views/components/table.tsx +0 -74
package/dist/render.mjs
CHANGED
|
@@ -628,8 +628,9 @@ var BaseFigure = Image.extend({
|
|
|
628
628
|
isolating: true,
|
|
629
629
|
selectable: false,
|
|
630
630
|
addOptions() {
|
|
631
|
+
const parentOptions = this.parent?.() || {};
|
|
631
632
|
return {
|
|
632
|
-
|
|
633
|
+
...parentOptions,
|
|
633
634
|
getImageById: void 0,
|
|
634
635
|
onFigureClick: void 0
|
|
635
636
|
};
|
|
@@ -1562,9 +1563,8 @@ function getRenderExtensions() {
|
|
|
1562
1563
|
BasePromptContent,
|
|
1563
1564
|
BaseVideo,
|
|
1564
1565
|
BaseFigure,
|
|
1565
|
-
// Need to update
|
|
1566
1566
|
TableKit.configure({
|
|
1567
|
-
table: { resizable: false }
|
|
1567
|
+
table: { resizable: false, renderWrapper: true }
|
|
1568
1568
|
}),
|
|
1569
1569
|
Mathematics.configure({
|
|
1570
1570
|
katexOptions: {
|
|
@@ -2245,44 +2245,6 @@ var PromptContent = ({ children, isEmpty, placeholder }) => /* @__PURE__ */ jsx6
|
|
|
2245
2245
|
}
|
|
2246
2246
|
) });
|
|
2247
2247
|
|
|
2248
|
-
// src/extensions/views/components/table.tsx
|
|
2249
|
-
import { useEffect, useRef, useState } from "react";
|
|
2250
|
-
import { jsx as jsx67, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2251
|
-
function Table({ children }) {
|
|
2252
|
-
const wrapperRef = useRef(null);
|
|
2253
|
-
const [undefinedColWidth, setUndefinedColWidth] = useState(void 0);
|
|
2254
|
-
let colWidths = [];
|
|
2255
|
-
if (Array.isArray(children) && children.length > 0) {
|
|
2256
|
-
const firstRow = children[0];
|
|
2257
|
-
if (firstRow?.props?.children) {
|
|
2258
|
-
const cells = Array.isArray(firstRow.props.children) ? firstRow.props.children : [firstRow.props.children];
|
|
2259
|
-
colWidths = cells.map((cell) => cell?.props?.node?.attrs?.colwidth?.[0]);
|
|
2260
|
-
}
|
|
2261
|
-
}
|
|
2262
|
-
const definedWidths = colWidths.filter((w) => w !== void 0);
|
|
2263
|
-
const totalDefinedWidth = definedWidths.reduce((total, width) => total + width, 0);
|
|
2264
|
-
const undefinedCount = colWidths.filter((w) => w === void 0).length;
|
|
2265
|
-
useEffect(() => {
|
|
2266
|
-
if (wrapperRef.current && undefinedCount > 0) {
|
|
2267
|
-
const containerWidth = wrapperRef.current.clientWidth;
|
|
2268
|
-
const remainingSpace = containerWidth - totalDefinedWidth;
|
|
2269
|
-
const calculatedWidth = Math.floor(remainingSpace / undefinedCount);
|
|
2270
|
-
setUndefinedColWidth(calculatedWidth > 0 ? calculatedWidth : void 0);
|
|
2271
|
-
}
|
|
2272
|
-
}, [totalDefinedWidth, undefinedCount]);
|
|
2273
|
-
const tableWidth = undefinedCount > 0 && undefinedColWidth ? totalDefinedWidth + undefinedColWidth * undefinedCount : totalDefinedWidth > 0 ? totalDefinedWidth : void 0;
|
|
2274
|
-
return /* @__PURE__ */ jsx67("div", { ref: wrapperRef, className: "tableWrapper", children: /* @__PURE__ */ jsxs21("table", { style: tableWidth ? { width: `${tableWidth}px` } : void 0, children: [
|
|
2275
|
-
colWidths.length > 0 && /* @__PURE__ */ jsx67("colgroup", { children: colWidths.map((width, index) => /* @__PURE__ */ jsx67(
|
|
2276
|
-
"col",
|
|
2277
|
-
{
|
|
2278
|
-
style: width ? { width: `${width}px` } : undefinedColWidth ? { width: `${undefinedColWidth}px` } : void 0
|
|
2279
|
-
},
|
|
2280
|
-
index
|
|
2281
|
-
)) }),
|
|
2282
|
-
/* @__PURE__ */ jsx67("tbody", { children })
|
|
2283
|
-
] }) });
|
|
2284
|
-
}
|
|
2285
|
-
|
|
2286
2248
|
// src/utils/detect-video-hosting.ts
|
|
2287
2249
|
var VIDEO_PATTERNS = {
|
|
2288
2250
|
youtube: /(?:https?:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=|shorts\/)?([a-zA-Z0-9_-]{11})/,
|
|
@@ -2355,22 +2317,22 @@ var detectVideoHosting = (src) => {
|
|
|
2355
2317
|
};
|
|
2356
2318
|
|
|
2357
2319
|
// src/extensions/views/components/video.tsx
|
|
2358
|
-
import { jsx as
|
|
2320
|
+
import { jsx as jsx67, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2359
2321
|
var Video = ({ src, children }) => {
|
|
2360
2322
|
const videoInfo = detectVideoHosting(src);
|
|
2361
2323
|
if (!videoInfo?.embedUrl) {
|
|
2362
|
-
return /* @__PURE__ */
|
|
2363
|
-
/* @__PURE__ */
|
|
2324
|
+
return /* @__PURE__ */ jsxs21("div", { className: "video-node", children: [
|
|
2325
|
+
/* @__PURE__ */ jsx67("div", { className: "video-error", children: /* @__PURE__ */ jsx67("span", { children: "Unsupported or invalid video URL" }) }),
|
|
2364
2326
|
children
|
|
2365
2327
|
] });
|
|
2366
2328
|
}
|
|
2367
|
-
return /* @__PURE__ */
|
|
2329
|
+
return /* @__PURE__ */ jsxs21(
|
|
2368
2330
|
"div",
|
|
2369
2331
|
{
|
|
2370
2332
|
className: "video-node",
|
|
2371
2333
|
"data-video": "",
|
|
2372
2334
|
children: [
|
|
2373
|
-
/* @__PURE__ */
|
|
2335
|
+
/* @__PURE__ */ jsx67("div", { className: "video-player-wrapper", children: /* @__PURE__ */ jsx67(
|
|
2374
2336
|
"iframe",
|
|
2375
2337
|
{
|
|
2376
2338
|
className: "video-iframe",
|
|
@@ -2387,10 +2349,10 @@ var Video = ({ src, children }) => {
|
|
|
2387
2349
|
};
|
|
2388
2350
|
|
|
2389
2351
|
// src/render/static-renderer-config.tsx
|
|
2390
|
-
import { jsx as
|
|
2352
|
+
import { jsx as jsx68 } from "react/jsx-runtime";
|
|
2391
2353
|
var getNodeMapping = (getImageById) => ({
|
|
2392
2354
|
callout({ node, children }) {
|
|
2393
|
-
return /* @__PURE__ */
|
|
2355
|
+
return /* @__PURE__ */ jsx68(Callout, { ...node.attrs, children });
|
|
2394
2356
|
},
|
|
2395
2357
|
codeBlock({ node, children }) {
|
|
2396
2358
|
const language = node.attrs.language || "";
|
|
@@ -2414,41 +2376,38 @@ var getNodeMapping = (getImageById) => ({
|
|
|
2414
2376
|
console.warn(`Failed to highlight code for language "${language}":`, error);
|
|
2415
2377
|
highlightedHtml = codeText.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
2416
2378
|
}
|
|
2417
|
-
return /* @__PURE__ */
|
|
2379
|
+
return /* @__PURE__ */ jsx68(
|
|
2418
2380
|
CodeBlock,
|
|
2419
2381
|
{
|
|
2420
2382
|
language,
|
|
2421
2383
|
isEditable: false,
|
|
2422
|
-
children: /* @__PURE__ */
|
|
2384
|
+
children: /* @__PURE__ */ jsx68("code", { dangerouslySetInnerHTML: { __html: highlightedHtml } })
|
|
2423
2385
|
}
|
|
2424
2386
|
);
|
|
2425
2387
|
},
|
|
2426
2388
|
customQuote({ children }) {
|
|
2427
|
-
return /* @__PURE__ */
|
|
2389
|
+
return /* @__PURE__ */ jsx68(CustomQuote, { children });
|
|
2428
2390
|
},
|
|
2429
2391
|
customQuoteText({ children }) {
|
|
2430
|
-
return /* @__PURE__ */
|
|
2392
|
+
return /* @__PURE__ */ jsx68(CustomQuoteText, { children });
|
|
2431
2393
|
},
|
|
2432
2394
|
customQuoteAuthor({ children }) {
|
|
2433
|
-
return /* @__PURE__ */
|
|
2395
|
+
return /* @__PURE__ */ jsx68(CustomQuoteAuthor, { children });
|
|
2434
2396
|
},
|
|
2435
2397
|
customQuoteSign({ children }) {
|
|
2436
|
-
return /* @__PURE__ */
|
|
2398
|
+
return /* @__PURE__ */ jsx68(CustomQuoteSign, { children });
|
|
2437
2399
|
},
|
|
2438
2400
|
promptHeader({ children }) {
|
|
2439
|
-
return /* @__PURE__ */
|
|
2401
|
+
return /* @__PURE__ */ jsx68(PromptHeader, { children });
|
|
2440
2402
|
},
|
|
2441
2403
|
promptContent({ children }) {
|
|
2442
|
-
return /* @__PURE__ */
|
|
2404
|
+
return /* @__PURE__ */ jsx68(PromptContent, { children });
|
|
2443
2405
|
},
|
|
2444
2406
|
video({ node }) {
|
|
2445
|
-
return /* @__PURE__ */
|
|
2446
|
-
},
|
|
2447
|
-
table({ children }) {
|
|
2448
|
-
return /* @__PURE__ */ jsx69(Table, { children });
|
|
2407
|
+
return /* @__PURE__ */ jsx68(Video, { src: node.attrs.src });
|
|
2449
2408
|
},
|
|
2450
2409
|
figure({ node }) {
|
|
2451
|
-
return /* @__PURE__ */
|
|
2410
|
+
return /* @__PURE__ */ jsx68(
|
|
2452
2411
|
Figure,
|
|
2453
2412
|
{
|
|
2454
2413
|
...node.attrs,
|
|
@@ -2457,7 +2416,7 @@ var getNodeMapping = (getImageById) => ({
|
|
|
2457
2416
|
);
|
|
2458
2417
|
},
|
|
2459
2418
|
image({ node }) {
|
|
2460
|
-
return /* @__PURE__ */
|
|
2419
|
+
return /* @__PURE__ */ jsx68(
|
|
2461
2420
|
Figure,
|
|
2462
2421
|
{
|
|
2463
2422
|
...node.attrs,
|
|
@@ -2476,7 +2435,7 @@ var getNodeMapping = (getImageById) => ({
|
|
|
2476
2435
|
} catch (error) {
|
|
2477
2436
|
console.warn("KaTeX rendering error for inline math:", error);
|
|
2478
2437
|
}
|
|
2479
|
-
return /* @__PURE__ */
|
|
2438
|
+
return /* @__PURE__ */ jsx68(
|
|
2480
2439
|
"span",
|
|
2481
2440
|
{
|
|
2482
2441
|
className: "react-renderer node-inlineMath",
|
|
@@ -2497,7 +2456,7 @@ var getNodeMapping = (getImageById) => ({
|
|
|
2497
2456
|
} catch (error) {
|
|
2498
2457
|
console.warn("KaTeX rendering error for block math:", error);
|
|
2499
2458
|
}
|
|
2500
|
-
return /* @__PURE__ */
|
|
2459
|
+
return /* @__PURE__ */ jsx68("div", { className: "react-renderer node-blockMath", children: /* @__PURE__ */ jsx68(
|
|
2501
2460
|
"div",
|
|
2502
2461
|
{
|
|
2503
2462
|
className: "tiptap-mathematics-render",
|
|
@@ -2518,7 +2477,7 @@ var getNodeMapping = (getImageById) => ({
|
|
|
2518
2477
|
} catch (error) {
|
|
2519
2478
|
console.warn("KaTeX rendering error for inline latex:", error);
|
|
2520
2479
|
}
|
|
2521
|
-
return /* @__PURE__ */
|
|
2480
|
+
return /* @__PURE__ */ jsx68(
|
|
2522
2481
|
"span",
|
|
2523
2482
|
{
|
|
2524
2483
|
className: "react-renderer node-inlineLatex inline-latex",
|
|
@@ -2531,33 +2490,33 @@ var getNodeMapping = (getImageById) => ({
|
|
|
2531
2490
|
*/
|
|
2532
2491
|
calloutAlert({ node, children }) {
|
|
2533
2492
|
const type = node.attrs.type || "info";
|
|
2534
|
-
return /* @__PURE__ */
|
|
2493
|
+
return /* @__PURE__ */ jsx68(Callout, { type, children });
|
|
2535
2494
|
},
|
|
2536
2495
|
calloutTip({ node, children }) {
|
|
2537
2496
|
const type = node.attrs.type || "info";
|
|
2538
|
-
return /* @__PURE__ */
|
|
2497
|
+
return /* @__PURE__ */ jsx68(Callout, { type, children });
|
|
2539
2498
|
},
|
|
2540
2499
|
customQuoteV2({ children }) {
|
|
2541
|
-
return /* @__PURE__ */
|
|
2500
|
+
return /* @__PURE__ */ jsx68(CustomQuote, { children });
|
|
2542
2501
|
},
|
|
2543
2502
|
promptV2Header({ children }) {
|
|
2544
|
-
return /* @__PURE__ */
|
|
2503
|
+
return /* @__PURE__ */ jsx68(PromptHeader, { children });
|
|
2545
2504
|
},
|
|
2546
2505
|
promptV2Content({ children }) {
|
|
2547
|
-
return /* @__PURE__ */
|
|
2506
|
+
return /* @__PURE__ */ jsx68(PromptContent, { children });
|
|
2548
2507
|
}
|
|
2549
2508
|
});
|
|
2550
2509
|
var nodeMapping = getNodeMapping();
|
|
2551
2510
|
var markMapping = {
|
|
2552
2511
|
"copyable-text"({ children }) {
|
|
2553
|
-
return /* @__PURE__ */
|
|
2512
|
+
return /* @__PURE__ */ jsx68(CopyableText2, { children });
|
|
2554
2513
|
}
|
|
2555
2514
|
};
|
|
2556
2515
|
|
|
2557
2516
|
// src/render/tiptap-render.tsx
|
|
2558
2517
|
import "highlight.js/styles/github-dark.css";
|
|
2559
2518
|
import "katex/dist/katex.min.css";
|
|
2560
|
-
import { jsx as
|
|
2519
|
+
import { jsx as jsx69 } from "react/jsx-runtime";
|
|
2561
2520
|
function renderTiptapToReact(content, getImageById) {
|
|
2562
2521
|
let parsedContent;
|
|
2563
2522
|
try {
|
|
@@ -2578,7 +2537,7 @@ function renderTiptapToReact(content, getImageById) {
|
|
|
2578
2537
|
markMapping
|
|
2579
2538
|
}
|
|
2580
2539
|
});
|
|
2581
|
-
return /* @__PURE__ */
|
|
2540
|
+
return /* @__PURE__ */ jsx69(
|
|
2582
2541
|
"div",
|
|
2583
2542
|
{
|
|
2584
2543
|
className: "tiptap",
|