@mvriu5/payload-ai 0.5.10 → 1.2.0

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.
@@ -1,3 +1,4 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
1
2
  import { XIcon } from "@payloadcms/ui/icons/X";
2
3
  import { useEffect, useState } from "react";
3
4
  import { getJSONLineKey } from "../payload/shared.js";
@@ -270,127 +271,227 @@ export const DiffDialog = ({ change, diff, onClose, proposal, tokenUsage })=>{
270
271
  }, [
271
272
  onClose
272
273
  ]);
273
- return /*#__PURE__*/ React.createElement("div", {
274
+ return /*#__PURE__*/ _jsx("div", {
274
275
  "aria-modal": "true",
275
276
  className: styles.dialogOverlay,
276
- role: "dialog"
277
- }, /*#__PURE__*/ React.createElement("div", {
278
- className: styles.dialog
279
- }, /*#__PURE__*/ React.createElement("div", {
280
- className: styles.dialogHeader
281
- }, /*#__PURE__*/ React.createElement("div", null, /*#__PURE__*/ React.createElement("div", {
282
- className: styles.dialogTitle
283
- }, proposal.label), /*#__PURE__*/ React.createElement("div", {
284
- className: styles.meta
285
- }, proposal.action, " in ", proposal.collection || proposal.slug, proposal.id ? ` #${proposal.id}` : "")), /*#__PURE__*/ React.createElement("button", {
286
- "aria-label": "Close",
287
- className: styles.closeButton,
288
- onClick: onClose,
289
- type: "button"
290
- }, /*#__PURE__*/ React.createElement(XIcon, null))), /*#__PURE__*/ React.createElement("div", {
291
- className: styles.dialogContent
292
- }, change ? /*#__PURE__*/ React.createElement("div", {
293
- className: styles.detailSection
294
- }, /*#__PURE__*/ React.createElement("div", {
295
- className: styles.detailGrid
296
- }, /*#__PURE__*/ React.createElement("span", {
297
- className: styles.detailLabel
298
- }, "User"), /*#__PURE__*/ React.createElement("span", {
299
- className: styles.detailValue
300
- }, change.userLabel || change.userID || "Unknown"), /*#__PURE__*/ React.createElement("span", {
301
- className: styles.detailLabel
302
- }, "Date"), /*#__PURE__*/ React.createElement("span", {
303
- className: styles.detailValue
304
- }, formatDateTime(change.createdAt) || "Unknown"), totalTokens && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("span", {
305
- className: styles.detailLabel
306
- }, "Tokens"), /*#__PURE__*/ React.createElement("span", {
307
- className: styles.detailValue
308
- }, totalTokens, inputTokens && outputTokens ? ` (${inputTokens} in / ${outputTokens} out)` : "")))) : totalTokens && /*#__PURE__*/ React.createElement("div", {
309
- className: styles.detailSection
310
- }, /*#__PURE__*/ React.createElement("div", {
311
- className: styles.detailGrid
312
- }, /*#__PURE__*/ React.createElement("span", {
313
- className: styles.detailLabel
314
- }, "Tokens"), /*#__PURE__*/ React.createElement("span", {
315
- className: styles.detailValue
316
- }, totalTokens, inputTokens && outputTokens ? ` (${inputTokens} in / ${outputTokens} out)` : ""))), diffSections.map((section)=>{
317
- const diffRows = getDiffRows(section.beforeValue, section.afterValue);
318
- const displayRows = buildDisplayRows(diffRows, expandedGroups, section.id);
319
- const longestLineLength = Math.max(...section.beforeValue.split("\n").map((line)=>line.length), ...section.afterValue.split("\n").map((line)=>line.length), 80);
320
- const diffShellStyle = {
321
- "--diff-line-offset": `-${scrollLeft}px`,
322
- "--diff-line-width": `${longestLineLength + 8}ch`
323
- };
324
- return /*#__PURE__*/ React.createElement("div", {
325
- className: styles.diffSection,
326
- key: section.id
327
- }, section.label ? /*#__PURE__*/ React.createElement("div", {
328
- className: styles.diffSectionLabel
329
- }, section.label) : null, /*#__PURE__*/ React.createElement("div", {
330
- className: styles.diffShell,
331
- style: diffShellStyle
332
- }, /*#__PURE__*/ React.createElement("div", {
333
- className: styles.diffScroll
334
- }, /*#__PURE__*/ React.createElement("div", {
335
- className: styles.diffHeaderGrid
336
- }, /*#__PURE__*/ React.createElement("div", {
337
- className: styles.diffPaneHeader
338
- }, "Current"), /*#__PURE__*/ React.createElement("div", {
339
- className: styles.diffPaneHeader
340
- }, "Proposed")), /*#__PURE__*/ React.createElement("div", {
341
- className: styles.diffRows
342
- }, displayRows.map((displayRow)=>{
343
- if (displayRow.type === "collapsed") {
344
- return /*#__PURE__*/ React.createElement("button", {
345
- className: styles.diffCollapsedRow,
346
- key: `${section.id}-collapsed-${displayRow.id}`,
347
- onClick: ()=>{
348
- setExpandedGroups((current)=>{
349
- const next = new Set(current);
350
- const groupID = `${section.id}:${displayRow.id}`;
351
- if (displayRow.expanded) {
352
- next.delete(groupID);
353
- } else {
354
- next.add(groupID);
355
- }
356
- return next;
357
- });
358
- },
359
- type: "button"
360
- }, displayRow.expanded ? "Hide" : "Show", " ", displayRow.count, " unchanged lines", displayRow.path && /*#__PURE__*/ React.createElement("span", {
361
- className: styles.diffCollapsedPath
362
- }, displayRow.path));
363
- }
364
- const row = displayRow.row;
365
- return /*#__PURE__*/ React.createElement("div", {
366
- className: styles.diffRow,
367
- key: `${section.id}-row-${displayRow.index}`
368
- }, /*#__PURE__*/ React.createElement("span", {
369
- className: [
370
- styles.diffLine,
371
- row.before.changed && styles.diffLineRemoved,
372
- row.before.placeholder && styles.diffLinePlaceholder
373
- ].filter(Boolean).join(" ")
374
- }, row.before.changed && row.before.path && /*#__PURE__*/ React.createElement("span", {
375
- className: styles.diffPathBadge
376
- }, row.before.path), /*#__PURE__*/ React.createElement("span", {
377
- className: styles.diffLineContent
378
- }, row.before.text || " ")), /*#__PURE__*/ React.createElement("span", {
379
- className: [
380
- styles.diffLine,
381
- row.after.changed && styles.diffLineAdded,
382
- row.after.placeholder && styles.diffLinePlaceholder
383
- ].filter(Boolean).join(" ")
384
- }, row.after.changed && row.after.path && /*#__PURE__*/ React.createElement("span", {
385
- className: styles.diffPathBadge
386
- }, row.after.path), /*#__PURE__*/ React.createElement("span", {
387
- className: styles.diffLineContent
388
- }, row.after.text || " ")));
389
- }))), /*#__PURE__*/ React.createElement("div", {
390
- className: styles.horizontalScroll,
391
- onScroll: (event)=>setScrollLeft(event.currentTarget.scrollLeft)
392
- }, /*#__PURE__*/ React.createElement("div", {
393
- className: styles.horizontalScrollSpacer
394
- }))));
395
- }))));
277
+ role: "dialog",
278
+ children: /*#__PURE__*/ _jsxs("div", {
279
+ className: styles.dialog,
280
+ children: [
281
+ /*#__PURE__*/ _jsxs("div", {
282
+ className: styles.dialogHeader,
283
+ children: [
284
+ /*#__PURE__*/ _jsxs("div", {
285
+ children: [
286
+ /*#__PURE__*/ _jsx("div", {
287
+ className: styles.dialogTitle,
288
+ children: proposal.label
289
+ }),
290
+ /*#__PURE__*/ _jsxs("div", {
291
+ className: styles.meta,
292
+ children: [
293
+ proposal.action,
294
+ " in ",
295
+ proposal.collection || proposal.slug,
296
+ proposal.id ? ` #${proposal.id}` : ""
297
+ ]
298
+ })
299
+ ]
300
+ }),
301
+ /*#__PURE__*/ _jsx("button", {
302
+ "aria-label": "Close",
303
+ className: styles.closeButton,
304
+ onClick: onClose,
305
+ type: "button",
306
+ children: /*#__PURE__*/ _jsx(XIcon, {})
307
+ })
308
+ ]
309
+ }),
310
+ /*#__PURE__*/ _jsxs("div", {
311
+ className: styles.dialogContent,
312
+ children: [
313
+ change ? /*#__PURE__*/ _jsx("div", {
314
+ className: styles.detailSection,
315
+ children: /*#__PURE__*/ _jsxs("div", {
316
+ className: styles.detailGrid,
317
+ children: [
318
+ /*#__PURE__*/ _jsx("span", {
319
+ className: styles.detailLabel,
320
+ children: "User"
321
+ }),
322
+ /*#__PURE__*/ _jsx("span", {
323
+ className: styles.detailValue,
324
+ children: change.userLabel || change.userID || "Unknown"
325
+ }),
326
+ /*#__PURE__*/ _jsx("span", {
327
+ className: styles.detailLabel,
328
+ children: "Date"
329
+ }),
330
+ /*#__PURE__*/ _jsx("span", {
331
+ className: styles.detailValue,
332
+ children: formatDateTime(change.createdAt) || "Unknown"
333
+ }),
334
+ totalTokens && /*#__PURE__*/ _jsxs(_Fragment, {
335
+ children: [
336
+ /*#__PURE__*/ _jsx("span", {
337
+ className: styles.detailLabel,
338
+ children: "Tokens"
339
+ }),
340
+ /*#__PURE__*/ _jsxs("span", {
341
+ className: styles.detailValue,
342
+ children: [
343
+ totalTokens,
344
+ inputTokens && outputTokens ? ` (${inputTokens} in / ${outputTokens} out)` : ""
345
+ ]
346
+ })
347
+ ]
348
+ })
349
+ ]
350
+ })
351
+ }) : totalTokens && /*#__PURE__*/ _jsx("div", {
352
+ className: styles.detailSection,
353
+ children: /*#__PURE__*/ _jsxs("div", {
354
+ className: styles.detailGrid,
355
+ children: [
356
+ /*#__PURE__*/ _jsx("span", {
357
+ className: styles.detailLabel,
358
+ children: "Tokens"
359
+ }),
360
+ /*#__PURE__*/ _jsxs("span", {
361
+ className: styles.detailValue,
362
+ children: [
363
+ totalTokens,
364
+ inputTokens && outputTokens ? ` (${inputTokens} in / ${outputTokens} out)` : ""
365
+ ]
366
+ })
367
+ ]
368
+ })
369
+ }),
370
+ diffSections.map((section)=>{
371
+ const diffRows = getDiffRows(section.beforeValue, section.afterValue);
372
+ const displayRows = buildDisplayRows(diffRows, expandedGroups, section.id);
373
+ const longestLineLength = Math.max(...section.beforeValue.split("\n").map((line)=>line.length), ...section.afterValue.split("\n").map((line)=>line.length), 80);
374
+ const diffShellStyle = {
375
+ "--diff-line-offset": `-${scrollLeft}px`,
376
+ "--diff-line-width": `${longestLineLength + 8}ch`
377
+ };
378
+ return /*#__PURE__*/ _jsxs("div", {
379
+ className: styles.diffSection,
380
+ children: [
381
+ section.label ? /*#__PURE__*/ _jsx("div", {
382
+ className: styles.diffSectionLabel,
383
+ children: section.label
384
+ }) : null,
385
+ /*#__PURE__*/ _jsxs("div", {
386
+ className: styles.diffShell,
387
+ style: diffShellStyle,
388
+ children: [
389
+ /*#__PURE__*/ _jsxs("div", {
390
+ className: styles.diffScroll,
391
+ children: [
392
+ /*#__PURE__*/ _jsxs("div", {
393
+ className: styles.diffHeaderGrid,
394
+ children: [
395
+ /*#__PURE__*/ _jsx("div", {
396
+ className: styles.diffPaneHeader,
397
+ children: "Current"
398
+ }),
399
+ /*#__PURE__*/ _jsx("div", {
400
+ className: styles.diffPaneHeader,
401
+ children: "Proposed"
402
+ })
403
+ ]
404
+ }),
405
+ /*#__PURE__*/ _jsx("div", {
406
+ className: styles.diffRows,
407
+ children: displayRows.map((displayRow)=>{
408
+ if (displayRow.type === "collapsed") {
409
+ return /*#__PURE__*/ _jsxs("button", {
410
+ className: styles.diffCollapsedRow,
411
+ onClick: ()=>{
412
+ setExpandedGroups((current)=>{
413
+ const next = new Set(current);
414
+ const groupID = `${section.id}:${displayRow.id}`;
415
+ if (displayRow.expanded) {
416
+ next.delete(groupID);
417
+ } else {
418
+ next.add(groupID);
419
+ }
420
+ return next;
421
+ });
422
+ },
423
+ type: "button",
424
+ children: [
425
+ displayRow.expanded ? "Hide" : "Show",
426
+ " ",
427
+ displayRow.count,
428
+ " unchanged lines",
429
+ displayRow.path && /*#__PURE__*/ _jsx("span", {
430
+ className: styles.diffCollapsedPath,
431
+ children: displayRow.path
432
+ })
433
+ ]
434
+ }, `${section.id}-collapsed-${displayRow.id}`);
435
+ }
436
+ const row = displayRow.row;
437
+ return /*#__PURE__*/ _jsxs("div", {
438
+ className: styles.diffRow,
439
+ children: [
440
+ /*#__PURE__*/ _jsxs("span", {
441
+ className: [
442
+ styles.diffLine,
443
+ row.before.changed && styles.diffLineRemoved,
444
+ row.before.placeholder && styles.diffLinePlaceholder
445
+ ].filter(Boolean).join(" "),
446
+ children: [
447
+ row.before.changed && row.before.path && /*#__PURE__*/ _jsx("span", {
448
+ className: styles.diffPathBadge,
449
+ children: row.before.path
450
+ }),
451
+ /*#__PURE__*/ _jsx("span", {
452
+ className: styles.diffLineContent,
453
+ children: row.before.text || " "
454
+ })
455
+ ]
456
+ }),
457
+ /*#__PURE__*/ _jsxs("span", {
458
+ className: [
459
+ styles.diffLine,
460
+ row.after.changed && styles.diffLineAdded,
461
+ row.after.placeholder && styles.diffLinePlaceholder
462
+ ].filter(Boolean).join(" "),
463
+ children: [
464
+ row.after.changed && row.after.path && /*#__PURE__*/ _jsx("span", {
465
+ className: styles.diffPathBadge,
466
+ children: row.after.path
467
+ }),
468
+ /*#__PURE__*/ _jsx("span", {
469
+ className: styles.diffLineContent,
470
+ children: row.after.text || " "
471
+ })
472
+ ]
473
+ })
474
+ ]
475
+ }, `${section.id}-row-${displayRow.index}`);
476
+ })
477
+ })
478
+ ]
479
+ }),
480
+ /*#__PURE__*/ _jsx("div", {
481
+ className: styles.horizontalScroll,
482
+ onScroll: (event)=>setScrollLeft(event.currentTarget.scrollLeft),
483
+ children: /*#__PURE__*/ _jsx("div", {
484
+ className: styles.horizontalScrollSpacer
485
+ })
486
+ })
487
+ ]
488
+ })
489
+ ]
490
+ }, section.id);
491
+ })
492
+ ]
493
+ })
494
+ ]
495
+ })
496
+ });
396
497
  };