@taterboom/shiteki 0.1.2 → 0.1.3
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 +166 -143
- package/dist/index.mjs +166 -143
- package/dist/standalone.global.js +9 -9
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -482,8 +482,37 @@ var import_react8 = require("motion/react");
|
|
|
482
482
|
// src/utils/spring.ts
|
|
483
483
|
var spring = { type: "spring", bounce: 0.1, duration: 0.3 };
|
|
484
484
|
|
|
485
|
-
// src/components/
|
|
485
|
+
// src/components/Logo.tsx
|
|
486
486
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
487
|
+
var Logo = () => {
|
|
488
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
489
|
+
"svg",
|
|
490
|
+
{
|
|
491
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
492
|
+
width: "22",
|
|
493
|
+
height: "22",
|
|
494
|
+
viewBox: "0 0 256 256",
|
|
495
|
+
fill: "currentColor",
|
|
496
|
+
children: [
|
|
497
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
498
|
+
"path",
|
|
499
|
+
{
|
|
500
|
+
d: "M 247.81,77.89 C 245.98,73.37 241.11,74.53 235.48,73.96 C 227.24,73.12 223.31,71.04 220.48,70.11 C 216.92,68.91 215.26,71.07 214.61,74.16 C 213.26,80.65 209.08,85.14 208.17,87.42 C 206.52,91.71 209.63,96.73 218.18,97.13 C 232.12,97.81 250.88,87.09 247.81,77.89 Z"
|
|
501
|
+
}
|
|
502
|
+
),
|
|
503
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
504
|
+
"path",
|
|
505
|
+
{
|
|
506
|
+
d: "M 226.81,110.84 C 226.56,106.67 226.51,105.11 226.15,104.34 C 225.84,103.66 225.86,103.98 225.16,104.13 C 223.16,104.58 214.15,105.42 207.69,101.21 C 202.06,97.59 198.08,90.98 201.42,84.48 C 203.75,79.86 206.15,78.28 208.27,70.79 C 209.83,65.03 211.98,64.17 214.19,63.26 C 214.85,62.97 214.62,62.88 214.25,61.79 C 212.98,58.57 197.91,22.25 154.31,22.25 C 120.74,22.25 99.34,43.86 90.92,75.12 C 86.39,92.17 82.95,108.72 64.16,108.72 C 54.19,108.08 48.41,104.41 43.82,98.75 C 36.81,91.63 33.06,87.11 24.09,87.11 C 12.17,87.11 7.88,109.92 7.88,130.65 C 7.88,173.15 36.13,232.54 115.14,232.54 C 179.88,232.54 230.95,189.87 226.81,110.84 Z M 181.96,59.19 C 187.91,59.19 189.92,66.52 189.92,70.09 C 189.92,76.29 187.29,81.66 182.58,81.66 C 176.84,81.66 173.79,74.91 173.79,70.09 C 173.79,64.72 176.27,59.19 181.96,59.19 Z M 109.32,193.56 C 92.41,193.56 75.41,185.76 75.41,175.28 C 75.41,173.21 76.03,171.74 76.52,170.31 C 67.56,166.67 57.66,157.68 57.66,146.48 C 57.66,138.16 63.95,135.45 69.89,134.75 C 79.11,133.59 86.92,131.94 96.76,131.09 C 98.17,130.97 97.19,132.06 96.41,132.49 C 88.26,137.11 79.68,138.83 72.02,140.57 C 67.22,141.66 64.78,143.11 64.78,146.13 C 64.78,153.75 73.75,163.71 89.46,167.81 C 89.82,167.93 89.68,168.28 89.41,168.36 C 86.07,169.52 83.07,171.91 83.07,175.13 C 83.07,182.39 95.68,186.48 108.05,186.48 C 129.97,186.48 145.81,172.16 149.31,153.37 C 149.81,150.85 149.76,149.48 150.29,149.48 C 151.12,149.48 151.37,153.81 151.37,155.58 C 151.37,173.91 134.62,193.56 109.32,193.56 Z"
|
|
507
|
+
}
|
|
508
|
+
)
|
|
509
|
+
]
|
|
510
|
+
}
|
|
511
|
+
);
|
|
512
|
+
};
|
|
513
|
+
|
|
514
|
+
// src/components/Toolbar.tsx
|
|
515
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
487
516
|
function Toolbar({
|
|
488
517
|
open,
|
|
489
518
|
annotationCount,
|
|
@@ -500,7 +529,7 @@ function Toolbar({
|
|
|
500
529
|
showHint,
|
|
501
530
|
onDismissHint
|
|
502
531
|
}) {
|
|
503
|
-
return /* @__PURE__ */ (0,
|
|
532
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
504
533
|
import_react8.motion.div,
|
|
505
534
|
{
|
|
506
535
|
layout: true,
|
|
@@ -523,24 +552,18 @@ function Toolbar({
|
|
|
523
552
|
whileHover: !open ? { scale: 1.08, boxShadow: "0 4px 20px rgba(37, 99, 235, 0.4)" } : void 0,
|
|
524
553
|
whileTap: !open ? { scale: 0.95 } : void 0,
|
|
525
554
|
children: [
|
|
526
|
-
/* @__PURE__ */ (0,
|
|
527
|
-
/* @__PURE__ */ (0,
|
|
555
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "shiteki-toolbar-picker", children: [
|
|
556
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
528
557
|
import_react8.motion.div,
|
|
529
558
|
{
|
|
530
559
|
className: `shiteki-toolbar-btn ${open ? "shiteki-toolbar-btn--active" : ""}`,
|
|
531
560
|
whileHover: { scale: 1.1 },
|
|
532
561
|
whileTap: { scale: 0.9 },
|
|
533
562
|
style: !open ? { color: "#fff", pointerEvents: "none" } : { pointerEvents: "none" },
|
|
534
|
-
children: /* @__PURE__ */ (0,
|
|
535
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
|
|
536
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "12", y1: "2", x2: "12", y2: "6" }),
|
|
537
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "12", y1: "18", x2: "12", y2: "22" }),
|
|
538
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "2", y1: "12", x2: "6", y2: "12" }),
|
|
539
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "18", y1: "12", x2: "22", y2: "12" })
|
|
540
|
-
] })
|
|
563
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Logo, {})
|
|
541
564
|
}
|
|
542
565
|
),
|
|
543
|
-
open && annotationCount > 0 && /* @__PURE__ */ (0,
|
|
566
|
+
open && annotationCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
544
567
|
import_react8.motion.span,
|
|
545
568
|
{
|
|
546
569
|
className: "shiteki-toolbar-badge",
|
|
@@ -551,7 +574,7 @@ function Toolbar({
|
|
|
551
574
|
}
|
|
552
575
|
)
|
|
553
576
|
] }),
|
|
554
|
-
/* @__PURE__ */ (0,
|
|
577
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react8.AnimatePresence, { children: open && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
555
578
|
import_react8.motion.div,
|
|
556
579
|
{
|
|
557
580
|
initial: { opacity: 0, width: 0 },
|
|
@@ -560,50 +583,50 @@ function Toolbar({
|
|
|
560
583
|
transition: spring,
|
|
561
584
|
style: { overflow: "hidden", display: "flex", alignItems: "center", gap: 4 },
|
|
562
585
|
children: [
|
|
563
|
-
/* @__PURE__ */ (0,
|
|
564
|
-
/* @__PURE__ */ (0,
|
|
565
|
-
/* @__PURE__ */ (0,
|
|
566
|
-
/* @__PURE__ */ (0,
|
|
586
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "shiteki-toolbar-sep" }),
|
|
587
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { className: "shiteki-toolbar-btn", onClick: onCopy, disabled: annotationCount === 0, title: "Copy to clipboard", children: copied ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
588
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
|
|
589
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
|
|
567
590
|
] }) }),
|
|
568
|
-
/* @__PURE__ */ (0,
|
|
591
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
569
592
|
"button",
|
|
570
593
|
{
|
|
571
594
|
className: "shiteki-toolbar-btn",
|
|
572
595
|
onClick: canSend ? onSend : onSettings,
|
|
573
596
|
disabled: sending || annotationCount === 0,
|
|
574
597
|
title: canSend ? "Send as GitHub Issue" : "Configure settings to enable send",
|
|
575
|
-
children: /* @__PURE__ */ (0,
|
|
576
|
-
/* @__PURE__ */ (0,
|
|
577
|
-
/* @__PURE__ */ (0,
|
|
598
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
599
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
|
|
600
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
|
|
578
601
|
] })
|
|
579
602
|
}
|
|
580
603
|
),
|
|
581
|
-
/* @__PURE__ */ (0,
|
|
582
|
-
/* @__PURE__ */ (0,
|
|
583
|
-
/* @__PURE__ */ (0,
|
|
604
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { className: "shiteki-toolbar-btn", onClick: onClear, disabled: annotationCount === 0, title: "Clear all annotations", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
605
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("polyline", { points: "3 6 5 6 21 6" }),
|
|
606
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
|
|
584
607
|
] }) }),
|
|
585
|
-
/* @__PURE__ */ (0,
|
|
608
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
586
609
|
"button",
|
|
587
610
|
{
|
|
588
611
|
className: `shiteki-toolbar-btn ${settingsOpen ? "shiteki-toolbar-btn--active" : ""}`,
|
|
589
612
|
onClick: onSettings,
|
|
590
613
|
title: "Settings",
|
|
591
|
-
children: /* @__PURE__ */ (0,
|
|
592
|
-
/* @__PURE__ */ (0,
|
|
593
|
-
/* @__PURE__ */ (0,
|
|
614
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
615
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "12", r: "3" }),
|
|
616
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" })
|
|
594
617
|
] })
|
|
595
618
|
}
|
|
596
619
|
),
|
|
597
|
-
/* @__PURE__ */ (0,
|
|
598
|
-
/* @__PURE__ */ (0,
|
|
599
|
-
/* @__PURE__ */ (0,
|
|
600
|
-
/* @__PURE__ */ (0,
|
|
620
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "shiteki-toolbar-sep" }),
|
|
621
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { className: "shiteki-toolbar-btn", onClick: onClose, title: "Close", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
622
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
623
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
601
624
|
] }) })
|
|
602
625
|
]
|
|
603
626
|
},
|
|
604
627
|
"expand"
|
|
605
628
|
) }),
|
|
606
|
-
/* @__PURE__ */ (0,
|
|
629
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react8.AnimatePresence, { children: open && showHint && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
607
630
|
import_react8.motion.div,
|
|
608
631
|
{
|
|
609
632
|
className: "shiteki-shortcut-hint",
|
|
@@ -612,29 +635,29 @@ function Toolbar({
|
|
|
612
635
|
exit: { opacity: 0, y: 4 },
|
|
613
636
|
transition: { duration: 0.15 },
|
|
614
637
|
children: [
|
|
615
|
-
/* @__PURE__ */ (0,
|
|
616
|
-
/* @__PURE__ */ (0,
|
|
617
|
-
/* @__PURE__ */ (0,
|
|
638
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { className: "shiteki-shortcut-hint-close", onClick: onDismissHint, "aria-label": "Dismiss", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
639
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
640
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
618
641
|
] }) }),
|
|
619
|
-
/* @__PURE__ */ (0,
|
|
620
|
-
/* @__PURE__ */ (0,
|
|
621
|
-
/* @__PURE__ */ (0,
|
|
642
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "shiteki-shortcut-hint-list", children: [
|
|
643
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { children: [
|
|
644
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "X" }),
|
|
622
645
|
" Toggle"
|
|
623
646
|
] }),
|
|
624
|
-
/* @__PURE__ */ (0,
|
|
625
|
-
/* @__PURE__ */ (0,
|
|
647
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { children: [
|
|
648
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "C" }),
|
|
626
649
|
" Copy"
|
|
627
650
|
] }),
|
|
628
|
-
/* @__PURE__ */ (0,
|
|
629
|
-
/* @__PURE__ */ (0,
|
|
651
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { children: [
|
|
652
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "S" }),
|
|
630
653
|
" Send"
|
|
631
654
|
] }),
|
|
632
|
-
/* @__PURE__ */ (0,
|
|
633
|
-
/* @__PURE__ */ (0,
|
|
655
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { children: [
|
|
656
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { children: "DD" }),
|
|
634
657
|
" Clear"
|
|
635
658
|
] }),
|
|
636
|
-
/* @__PURE__ */ (0,
|
|
637
|
-
/* @__PURE__ */ (0,
|
|
659
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { children: [
|
|
660
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("kbd", { children: [
|
|
638
661
|
navigator.userAgent.includes("Mac") ? "\u2318" : "Ctrl",
|
|
639
662
|
"+Click"
|
|
640
663
|
] }),
|
|
@@ -651,10 +674,10 @@ function Toolbar({
|
|
|
651
674
|
}
|
|
652
675
|
|
|
653
676
|
// src/components/ElementHighlight.tsx
|
|
654
|
-
var
|
|
677
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
655
678
|
function ElementHighlight({ rect }) {
|
|
656
679
|
if (!rect) return null;
|
|
657
|
-
return /* @__PURE__ */ (0,
|
|
680
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
658
681
|
"div",
|
|
659
682
|
{
|
|
660
683
|
className: "shiteki-highlight",
|
|
@@ -671,7 +694,7 @@ function ElementHighlight({ rect }) {
|
|
|
671
694
|
// src/components/AnnotationPopover.tsx
|
|
672
695
|
var import_react9 = require("react");
|
|
673
696
|
var import_react10 = require("motion/react");
|
|
674
|
-
var
|
|
697
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
675
698
|
function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
676
699
|
const [comment, setComment] = (0, import_react9.useState)("");
|
|
677
700
|
const textareaRef = (0, import_react9.useRef)(null);
|
|
@@ -706,7 +729,7 @@ function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
|
706
729
|
if (!comment.trim()) return;
|
|
707
730
|
onAdd(comment.trim());
|
|
708
731
|
};
|
|
709
|
-
return /* @__PURE__ */ (0,
|
|
732
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
710
733
|
import_react10.motion.div,
|
|
711
734
|
{
|
|
712
735
|
className: "shiteki-popover",
|
|
@@ -716,7 +739,7 @@ function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
|
716
739
|
exit: { opacity: 0, scale: 0.95, y: yOffset },
|
|
717
740
|
transition: spring,
|
|
718
741
|
children: [
|
|
719
|
-
/* @__PURE__ */ (0,
|
|
742
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
720
743
|
"div",
|
|
721
744
|
{
|
|
722
745
|
className: "shiteki-popover-info",
|
|
@@ -725,12 +748,12 @@ function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
|
725
748
|
onPointerMove: handlePointerMove,
|
|
726
749
|
onPointerUp: handlePointerUp,
|
|
727
750
|
children: [
|
|
728
|
-
/* @__PURE__ */ (0,
|
|
751
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "shiteki-popover-tag", children: [
|
|
729
752
|
"<",
|
|
730
753
|
elementInfo.tagName,
|
|
731
754
|
">"
|
|
732
755
|
] }),
|
|
733
|
-
elementInfo.textContent && /* @__PURE__ */ (0,
|
|
756
|
+
elementInfo.textContent && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "shiteki-popover-text", children: [
|
|
734
757
|
'"',
|
|
735
758
|
elementInfo.textContent,
|
|
736
759
|
'"'
|
|
@@ -738,8 +761,8 @@ function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
|
738
761
|
]
|
|
739
762
|
}
|
|
740
763
|
),
|
|
741
|
-
/* @__PURE__ */ (0,
|
|
742
|
-
/* @__PURE__ */ (0,
|
|
764
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("form", { className: "shiteki-popover-form", onSubmit: handleSubmit, children: [
|
|
765
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
743
766
|
"textarea",
|
|
744
767
|
{
|
|
745
768
|
ref: textareaRef,
|
|
@@ -750,9 +773,9 @@ function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
|
750
773
|
rows: 3
|
|
751
774
|
}
|
|
752
775
|
),
|
|
753
|
-
/* @__PURE__ */ (0,
|
|
754
|
-
/* @__PURE__ */ (0,
|
|
755
|
-
/* @__PURE__ */ (0,
|
|
776
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "shiteki-popover-actions", children: [
|
|
777
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("button", { type: "button", className: "shiteki-btn shiteki-btn--ghost", onClick: onCancel, children: "Cancel" }),
|
|
778
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("button", { type: "submit", className: "shiteki-btn shiteki-btn--primary", disabled: !comment.trim(), children: "Add" })
|
|
756
779
|
] })
|
|
757
780
|
] })
|
|
758
781
|
]
|
|
@@ -763,7 +786,7 @@ function AnnotationPopover({ elementInfo, onAdd, onCancel }) {
|
|
|
763
786
|
// src/components/AnnotationDetailPopover.tsx
|
|
764
787
|
var import_react11 = require("react");
|
|
765
788
|
var import_react12 = require("motion/react");
|
|
766
|
-
var
|
|
789
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
767
790
|
function AnnotationDetailPopover({ annotation, index, onUpdate, onRemove, onClose }) {
|
|
768
791
|
const [comment, setComment] = (0, import_react11.useState)(annotation.comment);
|
|
769
792
|
const textareaRef = (0, import_react11.useRef)(null);
|
|
@@ -798,7 +821,7 @@ function AnnotationDetailPopover({ annotation, index, onUpdate, onRemove, onClos
|
|
|
798
821
|
if (!comment.trim()) return;
|
|
799
822
|
onUpdate(comment.trim());
|
|
800
823
|
};
|
|
801
|
-
return /* @__PURE__ */ (0,
|
|
824
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
802
825
|
import_react12.motion.div,
|
|
803
826
|
{
|
|
804
827
|
className: "shiteki-popover",
|
|
@@ -808,7 +831,7 @@ function AnnotationDetailPopover({ annotation, index, onUpdate, onRemove, onClos
|
|
|
808
831
|
exit: { opacity: 0, scale: 0.95, y: yOffset },
|
|
809
832
|
transition: spring,
|
|
810
833
|
children: [
|
|
811
|
-
/* @__PURE__ */ (0,
|
|
834
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
812
835
|
"div",
|
|
813
836
|
{
|
|
814
837
|
className: "shiteki-popover-info",
|
|
@@ -817,14 +840,14 @@ function AnnotationDetailPopover({ annotation, index, onUpdate, onRemove, onClos
|
|
|
817
840
|
onPointerMove: handlePointerMove,
|
|
818
841
|
onPointerUp: handlePointerUp,
|
|
819
842
|
children: [
|
|
820
|
-
/* @__PURE__ */ (0,
|
|
843
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "shiteki-popover-tag", children: [
|
|
821
844
|
"#",
|
|
822
845
|
index,
|
|
823
846
|
" <",
|
|
824
847
|
annotation.elementInfo.tagName,
|
|
825
848
|
">"
|
|
826
849
|
] }),
|
|
827
|
-
annotation.elementInfo.textContent && /* @__PURE__ */ (0,
|
|
850
|
+
annotation.elementInfo.textContent && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "shiteki-popover-text", children: [
|
|
828
851
|
'"',
|
|
829
852
|
annotation.elementInfo.textContent,
|
|
830
853
|
'"'
|
|
@@ -832,8 +855,8 @@ function AnnotationDetailPopover({ annotation, index, onUpdate, onRemove, onClos
|
|
|
832
855
|
]
|
|
833
856
|
}
|
|
834
857
|
),
|
|
835
|
-
/* @__PURE__ */ (0,
|
|
836
|
-
/* @__PURE__ */ (0,
|
|
858
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("form", { className: "shiteki-popover-form", onSubmit: handleSubmit, children: [
|
|
859
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
837
860
|
"textarea",
|
|
838
861
|
{
|
|
839
862
|
ref: textareaRef,
|
|
@@ -844,14 +867,14 @@ function AnnotationDetailPopover({ annotation, index, onUpdate, onRemove, onClos
|
|
|
844
867
|
rows: 3
|
|
845
868
|
}
|
|
846
869
|
),
|
|
847
|
-
/* @__PURE__ */ (0,
|
|
848
|
-
/* @__PURE__ */ (0,
|
|
849
|
-
/* @__PURE__ */ (0,
|
|
850
|
-
/* @__PURE__ */ (0,
|
|
870
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "shiteki-popover-actions", children: [
|
|
871
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { type: "button", className: "shiteki-btn shiteki-btn--danger shiteki-btn--icon", onClick: onRemove, title: "Remove annotation", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
872
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("polyline", { points: "3 6 5 6 21 6" }),
|
|
873
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
|
|
851
874
|
] }) }),
|
|
852
|
-
/* @__PURE__ */ (0,
|
|
853
|
-
/* @__PURE__ */ (0,
|
|
854
|
-
/* @__PURE__ */ (0,
|
|
875
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { flex: 1 } }),
|
|
876
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { type: "button", className: "shiteki-btn shiteki-btn--ghost", onClick: onClose, children: "Cancel" }),
|
|
877
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { type: "submit", className: "shiteki-btn shiteki-btn--primary", disabled: !comment.trim(), children: "Save" })
|
|
855
878
|
] })
|
|
856
879
|
] })
|
|
857
880
|
]
|
|
@@ -893,9 +916,9 @@ function useMarkerPositions(annotations) {
|
|
|
893
916
|
|
|
894
917
|
// src/components/AnnotationMarker.tsx
|
|
895
918
|
var import_react14 = require("motion/react");
|
|
896
|
-
var
|
|
919
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
897
920
|
function AnnotationMarker({ id, index, top, left, onClick }) {
|
|
898
|
-
return /* @__PURE__ */ (0,
|
|
921
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
899
922
|
import_react14.motion.div,
|
|
900
923
|
{
|
|
901
924
|
className: "shiteki-marker",
|
|
@@ -913,10 +936,10 @@ function AnnotationMarker({ id, index, top, left, onClick }) {
|
|
|
913
936
|
}
|
|
914
937
|
|
|
915
938
|
// src/components/AnnotationMarkers.tsx
|
|
916
|
-
var
|
|
939
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
917
940
|
function AnnotationMarkers({ annotations, onClick }) {
|
|
918
941
|
const positions = useMarkerPositions(annotations);
|
|
919
|
-
return /* @__PURE__ */ (0,
|
|
942
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react15.AnimatePresence, { children: positions.map((pos) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
920
943
|
AnnotationMarker,
|
|
921
944
|
{
|
|
922
945
|
id: pos.id,
|
|
@@ -932,7 +955,7 @@ function AnnotationMarkers({ annotations, onClick }) {
|
|
|
932
955
|
// src/components/StatusMessage.tsx
|
|
933
956
|
var import_react16 = require("react");
|
|
934
957
|
var import_react17 = require("motion/react");
|
|
935
|
-
var
|
|
958
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
936
959
|
function StatusMessage({ state, onDismiss }) {
|
|
937
960
|
(0, import_react16.useEffect)(() => {
|
|
938
961
|
if (state.status === "success" || state.status === "error") {
|
|
@@ -941,7 +964,7 @@ function StatusMessage({ state, onDismiss }) {
|
|
|
941
964
|
}
|
|
942
965
|
}, [state.status, onDismiss]);
|
|
943
966
|
if (state.status === "success") {
|
|
944
|
-
return /* @__PURE__ */ (0,
|
|
967
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
945
968
|
import_react17.motion.div,
|
|
946
969
|
{
|
|
947
970
|
className: "shiteki-status shiteki-status--success",
|
|
@@ -952,7 +975,7 @@ function StatusMessage({ state, onDismiss }) {
|
|
|
952
975
|
children: [
|
|
953
976
|
"Issue created!",
|
|
954
977
|
" ",
|
|
955
|
-
/* @__PURE__ */ (0,
|
|
978
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("a", { href: state.result.issueUrl, target: "_blank", rel: "noopener noreferrer", children: [
|
|
956
979
|
"#",
|
|
957
980
|
state.result.issueNumber
|
|
958
981
|
] })
|
|
@@ -961,7 +984,7 @@ function StatusMessage({ state, onDismiss }) {
|
|
|
961
984
|
);
|
|
962
985
|
}
|
|
963
986
|
if (state.status === "error") {
|
|
964
|
-
return /* @__PURE__ */ (0,
|
|
987
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
965
988
|
import_react17.motion.div,
|
|
966
989
|
{
|
|
967
990
|
className: "shiteki-status shiteki-status--error",
|
|
@@ -974,7 +997,7 @@ function StatusMessage({ state, onDismiss }) {
|
|
|
974
997
|
);
|
|
975
998
|
}
|
|
976
999
|
if (state.status === "loading") {
|
|
977
|
-
return /* @__PURE__ */ (0,
|
|
1000
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
978
1001
|
import_react17.motion.div,
|
|
979
1002
|
{
|
|
980
1003
|
className: "shiteki-status",
|
|
@@ -992,9 +1015,9 @@ function StatusMessage({ state, onDismiss }) {
|
|
|
992
1015
|
// src/components/SettingsPanel.tsx
|
|
993
1016
|
var import_react18 = require("react");
|
|
994
1017
|
var import_react19 = require("motion/react");
|
|
995
|
-
var
|
|
1018
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
996
1019
|
function HelpLink({ href }) {
|
|
997
|
-
return /* @__PURE__ */ (0,
|
|
1020
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
998
1021
|
"a",
|
|
999
1022
|
{
|
|
1000
1023
|
className: "shiteki-settings-help",
|
|
@@ -1002,9 +1025,9 @@ function HelpLink({ href }) {
|
|
|
1002
1025
|
target: "_blank",
|
|
1003
1026
|
rel: "noopener noreferrer",
|
|
1004
1027
|
onClick: (e) => e.stopPropagation(),
|
|
1005
|
-
children: /* @__PURE__ */ (0,
|
|
1006
|
-
/* @__PURE__ */ (0,
|
|
1007
|
-
/* @__PURE__ */ (0,
|
|
1028
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", children: [
|
|
1029
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "8", cy: "8", r: "7", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
1030
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1008
1031
|
"text",
|
|
1009
1032
|
{
|
|
1010
1033
|
x: "8",
|
|
@@ -1040,7 +1063,7 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1040
1063
|
clearAfterCopy
|
|
1041
1064
|
});
|
|
1042
1065
|
}, [mode, endpoint, githubToken, owner, repo, labels, clearAfterCopy, onSave]);
|
|
1043
|
-
return /* @__PURE__ */ (0,
|
|
1066
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
1044
1067
|
import_react19.motion.div,
|
|
1045
1068
|
{
|
|
1046
1069
|
className: "shiteki-settings",
|
|
@@ -1049,13 +1072,13 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1049
1072
|
exit: { opacity: 0, y: 12 },
|
|
1050
1073
|
transition: spring,
|
|
1051
1074
|
children: [
|
|
1052
|
-
/* @__PURE__ */ (0,
|
|
1053
|
-
/* @__PURE__ */ (0,
|
|
1054
|
-
/* @__PURE__ */ (0,
|
|
1055
|
-
/* @__PURE__ */ (0,
|
|
1056
|
-
/* @__PURE__ */ (0,
|
|
1057
|
-
/* @__PURE__ */ (0,
|
|
1058
|
-
/* @__PURE__ */ (0,
|
|
1075
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "shiteki-settings-header", children: "Settings" }),
|
|
1076
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "shiteki-settings-body", children: [
|
|
1077
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "shiteki-settings-field", children: [
|
|
1078
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "shiteki-settings-label", children: "Submit mode" }),
|
|
1079
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "shiteki-radio-group", children: [
|
|
1080
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-radio", children: [
|
|
1081
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1059
1082
|
"input",
|
|
1060
1083
|
{
|
|
1061
1084
|
type: "radio",
|
|
@@ -1064,10 +1087,10 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1064
1087
|
onChange: () => setMode("endpoint")
|
|
1065
1088
|
}
|
|
1066
1089
|
),
|
|
1067
|
-
/* @__PURE__ */ (0,
|
|
1090
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Endpoint" })
|
|
1068
1091
|
] }),
|
|
1069
|
-
/* @__PURE__ */ (0,
|
|
1070
|
-
/* @__PURE__ */ (0,
|
|
1092
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-radio", children: [
|
|
1093
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1071
1094
|
"input",
|
|
1072
1095
|
{
|
|
1073
1096
|
type: "radio",
|
|
@@ -1076,16 +1099,16 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1076
1099
|
onChange: () => setMode("direct")
|
|
1077
1100
|
}
|
|
1078
1101
|
),
|
|
1079
|
-
/* @__PURE__ */ (0,
|
|
1102
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Direct" })
|
|
1080
1103
|
] })
|
|
1081
1104
|
] })
|
|
1082
1105
|
] }),
|
|
1083
|
-
mode === "endpoint" ? /* @__PURE__ */ (0,
|
|
1084
|
-
/* @__PURE__ */ (0,
|
|
1106
|
+
mode === "endpoint" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-settings-field", children: [
|
|
1107
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "shiteki-settings-label", children: [
|
|
1085
1108
|
"Endpoint",
|
|
1086
|
-
/* @__PURE__ */ (0,
|
|
1109
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(HelpLink, { href: "https://github.com/taterboom/shiteki/tree/main/apps/api" })
|
|
1087
1110
|
] }),
|
|
1088
|
-
/* @__PURE__ */ (0,
|
|
1111
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1089
1112
|
"input",
|
|
1090
1113
|
{
|
|
1091
1114
|
className: "shiteki-settings-input",
|
|
@@ -1095,12 +1118,12 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1095
1118
|
placeholder: "https://..."
|
|
1096
1119
|
}
|
|
1097
1120
|
)
|
|
1098
|
-
] }) : /* @__PURE__ */ (0,
|
|
1099
|
-
/* @__PURE__ */ (0,
|
|
1121
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-settings-field", children: [
|
|
1122
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "shiteki-settings-label", children: [
|
|
1100
1123
|
"GitHub Token",
|
|
1101
|
-
/* @__PURE__ */ (0,
|
|
1124
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(HelpLink, { href: "https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/managing-your-personal-access-tokens" })
|
|
1102
1125
|
] }),
|
|
1103
|
-
/* @__PURE__ */ (0,
|
|
1126
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1104
1127
|
"input",
|
|
1105
1128
|
{
|
|
1106
1129
|
className: "shiteki-settings-input",
|
|
@@ -1111,9 +1134,9 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1111
1134
|
}
|
|
1112
1135
|
)
|
|
1113
1136
|
] }),
|
|
1114
|
-
/* @__PURE__ */ (0,
|
|
1115
|
-
/* @__PURE__ */ (0,
|
|
1116
|
-
/* @__PURE__ */ (0,
|
|
1137
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-settings-field", children: [
|
|
1138
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "shiteki-settings-label", children: "Owner" }),
|
|
1139
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1117
1140
|
"input",
|
|
1118
1141
|
{
|
|
1119
1142
|
className: "shiteki-settings-input",
|
|
@@ -1124,9 +1147,9 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1124
1147
|
}
|
|
1125
1148
|
)
|
|
1126
1149
|
] }),
|
|
1127
|
-
/* @__PURE__ */ (0,
|
|
1128
|
-
/* @__PURE__ */ (0,
|
|
1129
|
-
/* @__PURE__ */ (0,
|
|
1150
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-settings-field", children: [
|
|
1151
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "shiteki-settings-label", children: "Repo" }),
|
|
1152
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1130
1153
|
"input",
|
|
1131
1154
|
{
|
|
1132
1155
|
className: "shiteki-settings-input",
|
|
@@ -1137,12 +1160,12 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1137
1160
|
}
|
|
1138
1161
|
)
|
|
1139
1162
|
] }),
|
|
1140
|
-
/* @__PURE__ */ (0,
|
|
1141
|
-
/* @__PURE__ */ (0,
|
|
1163
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-settings-field", children: [
|
|
1164
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "shiteki-settings-label", children: [
|
|
1142
1165
|
"Labels",
|
|
1143
|
-
/* @__PURE__ */ (0,
|
|
1166
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(HelpLink, { href: "https://docs.github.com/en/issues/using-labels-and-milestones-to-track-work/managing-labels" })
|
|
1144
1167
|
] }),
|
|
1145
|
-
/* @__PURE__ */ (0,
|
|
1168
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1146
1169
|
"input",
|
|
1147
1170
|
{
|
|
1148
1171
|
className: "shiteki-settings-input",
|
|
@@ -1153,9 +1176,9 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1153
1176
|
}
|
|
1154
1177
|
)
|
|
1155
1178
|
] }),
|
|
1156
|
-
/* @__PURE__ */ (0,
|
|
1157
|
-
/* @__PURE__ */ (0,
|
|
1158
|
-
/* @__PURE__ */ (0,
|
|
1179
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "shiteki-settings-field shiteki-settings-field--row", children: [
|
|
1180
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "shiteki-settings-label", children: "Clear after copy" }),
|
|
1181
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
1159
1182
|
"input",
|
|
1160
1183
|
{
|
|
1161
1184
|
type: "checkbox",
|
|
@@ -1166,9 +1189,9 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1166
1189
|
)
|
|
1167
1190
|
] })
|
|
1168
1191
|
] }),
|
|
1169
|
-
/* @__PURE__ */ (0,
|
|
1170
|
-
/* @__PURE__ */ (0,
|
|
1171
|
-
/* @__PURE__ */ (0,
|
|
1192
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "shiteki-settings-actions", children: [
|
|
1193
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { className: "shiteki-btn shiteki-btn--ghost", onClick: onCancel, children: "Cancel" }),
|
|
1194
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { className: "shiteki-btn shiteki-btn--primary", onClick: handleSave, children: "Save" })
|
|
1172
1195
|
] })
|
|
1173
1196
|
]
|
|
1174
1197
|
}
|
|
@@ -1178,7 +1201,7 @@ function SettingsPanel({ config, onSave, onCancel }) {
|
|
|
1178
1201
|
// src/components/SendDialog.tsx
|
|
1179
1202
|
var import_react20 = require("react");
|
|
1180
1203
|
var import_react21 = require("motion/react");
|
|
1181
|
-
var
|
|
1204
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
1182
1205
|
function SendDialog({ defaultTitle, sending, onConfirm, onCancel }) {
|
|
1183
1206
|
const [title, setTitle] = (0, import_react20.useState)(defaultTitle);
|
|
1184
1207
|
const inputRef = (0, import_react20.useRef)(null);
|
|
@@ -1194,7 +1217,7 @@ function SendDialog({ defaultTitle, sending, onConfirm, onCancel }) {
|
|
|
1194
1217
|
},
|
|
1195
1218
|
[title, sending, onConfirm]
|
|
1196
1219
|
);
|
|
1197
|
-
return /* @__PURE__ */ (0,
|
|
1220
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
|
|
1198
1221
|
import_react21.motion.div,
|
|
1199
1222
|
{
|
|
1200
1223
|
className: "shiteki-popover",
|
|
@@ -1209,9 +1232,9 @@ function SendDialog({ defaultTitle, sending, onConfirm, onCancel }) {
|
|
|
1209
1232
|
exit: { opacity: 0, y: 12 },
|
|
1210
1233
|
transition: spring,
|
|
1211
1234
|
children: [
|
|
1212
|
-
/* @__PURE__ */ (0,
|
|
1213
|
-
/* @__PURE__ */ (0,
|
|
1214
|
-
/* @__PURE__ */ (0,
|
|
1235
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "shiteki-popover-info", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "shiteki-popover-tag", children: "Create Issue" }) }),
|
|
1236
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("form", { className: "shiteki-popover-form", onSubmit: handleSubmit, children: [
|
|
1237
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1215
1238
|
"input",
|
|
1216
1239
|
{
|
|
1217
1240
|
ref: inputRef,
|
|
@@ -1222,8 +1245,8 @@ function SendDialog({ defaultTitle, sending, onConfirm, onCancel }) {
|
|
|
1222
1245
|
placeholder: "Issue title"
|
|
1223
1246
|
}
|
|
1224
1247
|
),
|
|
1225
|
-
/* @__PURE__ */ (0,
|
|
1226
|
-
/* @__PURE__ */ (0,
|
|
1248
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "shiteki-popover-actions", children: [
|
|
1249
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1227
1250
|
"button",
|
|
1228
1251
|
{
|
|
1229
1252
|
type: "button",
|
|
@@ -1233,7 +1256,7 @@ function SendDialog({ defaultTitle, sending, onConfirm, onCancel }) {
|
|
|
1233
1256
|
children: "Cancel"
|
|
1234
1257
|
}
|
|
1235
1258
|
),
|
|
1236
|
-
/* @__PURE__ */ (0,
|
|
1259
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1237
1260
|
"button",
|
|
1238
1261
|
{
|
|
1239
1262
|
type: "submit",
|
|
@@ -1275,7 +1298,7 @@ function styleInject(css, { insertAt } = {}) {
|
|
|
1275
1298
|
styleInject('.shiteki-root {\n --shiteki-primary: #2563eb;\n --shiteki-primary-hover: #1d4ed8;\n --shiteki-bg: #ffffff;\n --shiteki-border: #e5e7eb;\n --shiteki-text: #111827;\n --shiteki-text-secondary: #6b7280;\n --shiteki-radius: 12px;\n --shiteki-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n sans-serif;\n font-size: 14px;\n line-height: 1.5;\n color: var(--shiteki-text);\n box-sizing: border-box;\n}\n.shiteki-toolbar {\n position: fixed;\n bottom: 20px;\n right: 20px;\n display: flex;\n align-items: center;\n gap: 2px;\n border-radius: 9999px;\n z-index: 99999;\n background: var(--shiteki-bg);\n border: 1px solid var(--shiteki-border);\n box-shadow: var(--shiteki-shadow);\n}\n.shiteki-toolbar-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 36px;\n height: 36px;\n border: none;\n border-radius: 50%;\n background: transparent;\n color: var(--shiteki-text);\n cursor: pointer;\n transition: background 0.15s, color 0.15s;\n}\n.shiteki-toolbar-btn:hover {\n background: #f3f4f6;\n}\n.shiteki-toolbar-btn:active {\n transform: scale(0.9);\n}\n.shiteki-toolbar-btn--active {\n background: var(--shiteki-primary);\n color: #fff;\n}\n.shiteki-toolbar-btn--active:hover {\n background: var(--shiteki-primary-hover);\n}\n.shiteki-toolbar-btn:disabled {\n opacity: 0.4;\n cursor: not-allowed;\n}\n.shiteki-toolbar-picker {\n position: relative;\n}\n.shiteki-toolbar-badge {\n position: absolute;\n top: -4px;\n right: -6px;\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background: #ef4444;\n color: #fff;\n font-size: 10px;\n font-weight: 700;\n line-height: 1;\n pointer-events: none;\n box-sizing: border-box;\n}\n.shiteki-toolbar-sep {\n width: 1px;\n height: 24px;\n background: var(--shiteki-border);\n margin: 0 4px;\n}\n.shiteki-highlight {\n position: fixed;\n pointer-events: none;\n border: 1.5px solid var(--shiteki-primary, #2563eb);\n background: rgba(37, 99, 235, 0.08);\n z-index: 99997;\n transition: all 0.05s ease-out;\n box-sizing: border-box;\n}\n.shiteki-marker {\n position: fixed;\n width: 22px;\n height: 22px;\n border-radius: 50%;\n background: var(--shiteki-primary, #2563eb);\n color: #fff;\n font-size: 11px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n z-index: 99998;\n box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);\n user-select: none;\n}\n.shiteki-popover {\n position: fixed;\n width: 320px;\n background: var(--shiteki-bg);\n border: 1px solid var(--shiteki-border);\n border-radius: var(--shiteki-radius);\n box-shadow: var(--shiteki-shadow);\n z-index: 99999;\n overflow: hidden;\n}\n.shiteki-popover-info {\n padding: 10px 14px;\n background: #f9fafb;\n border-bottom: 1px solid var(--shiteki-border);\n display: flex;\n align-items: baseline;\n gap: 8px;\n overflow: hidden;\n}\n.shiteki-popover-tag {\n font-family:\n ui-monospace,\n SFMono-Regular,\n "SF Mono",\n Menlo,\n monospace;\n font-size: 12px;\n font-weight: 600;\n color: var(--shiteki-primary);\n white-space: nowrap;\n}\n.shiteki-popover-text {\n font-size: 12px;\n color: var(--shiteki-text-secondary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.shiteki-popover-form {\n padding: 12px 14px;\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.shiteki-popover-textarea {\n width: 100%;\n padding: 8px 10px;\n border: 1px solid var(--shiteki-border);\n border-radius: 8px;\n font: inherit;\n font-size: 13px;\n color: var(--shiteki-text);\n background: transparent;\n outline: none;\n resize: vertical;\n min-height: 60px;\n box-sizing: border-box;\n transition: border-color 0.15s;\n}\n.shiteki-popover-textarea:focus {\n border-color: var(--shiteki-primary);\n}\n.shiteki-popover-comment {\n font-size: 13px;\n color: var(--shiteki-text);\n white-space: pre-wrap;\n word-break: break-word;\n}\n.shiteki-popover-actions {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n}\n.shiteki-btn {\n padding: 6px 14px;\n border: none;\n border-radius: 8px;\n font: inherit;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition: background 0.15s;\n}\n.shiteki-btn:active {\n transform: scale(0.95);\n}\n.shiteki-btn--primary {\n background: var(--shiteki-primary);\n color: #fff;\n}\n.shiteki-btn--primary:hover:not(:disabled) {\n background: var(--shiteki-primary-hover);\n}\n.shiteki-btn--primary:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.shiteki-btn--ghost {\n background: transparent;\n color: var(--shiteki-text-secondary);\n}\n.shiteki-btn--ghost:hover {\n background: #f3f4f6;\n}\n.shiteki-btn--danger {\n background: #fee2e2;\n color: #dc2626;\n}\n.shiteki-btn--danger:hover {\n background: #fecaca;\n}\n.shiteki-btn--icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 30px;\n height: 30px;\n padding: 0;\n}\n.shiteki-status {\n position: fixed;\n bottom: 76px;\n right: 20px;\n padding: 8px 18px;\n background: var(--shiteki-bg);\n border: 1px solid var(--shiteki-border);\n border-radius: 8px;\n box-shadow: var(--shiteki-shadow);\n font-size: 13px;\n white-space: nowrap;\n z-index: 99998;\n}\n.shiteki-status--success {\n color: #059669;\n}\n.shiteki-status--error {\n color: #dc2626;\n}\n.shiteki-status a {\n color: inherit;\n text-decoration: underline;\n}\n.shiteki-settings {\n position: fixed;\n bottom: 76px;\n right: 20px;\n width: 280px;\n background: var(--shiteki-bg);\n border: 1px solid var(--shiteki-border);\n border-radius: var(--shiteki-radius);\n box-shadow: var(--shiteki-shadow);\n z-index: 99999;\n overflow: hidden;\n}\n.shiteki-settings-header {\n padding: 10px 14px;\n font-size: 13px;\n font-weight: 600;\n border-bottom: 1px solid var(--shiteki-border);\n background: #f9fafb;\n}\n.shiteki-settings-body {\n padding: 12px 14px;\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.shiteki-settings-field {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n.shiteki-settings-field--row {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n}\n.shiteki-settings-checkbox {\n margin: 0;\n accent-color: var(--shiteki-primary);\n cursor: pointer;\n}\n.shiteki-settings-label {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n font-weight: 500;\n color: var(--shiteki-text-secondary);\n}\n.shiteki-settings-help {\n display: inline-flex;\n align-items: center;\n color: var(--shiteki-text-secondary);\n opacity: 0.5;\n transition: opacity 0.15s;\n}\n.shiteki-settings-help:hover {\n opacity: 1;\n}\n.shiteki-settings-input {\n width: 100%;\n padding: 6px 8px;\n border: 1px solid var(--shiteki-border);\n border-radius: 8px;\n font: inherit;\n font-size: 13px;\n color: var(--shiteki-text);\n background: transparent;\n outline: none;\n box-sizing: border-box;\n transition: border-color 0.15s;\n}\n.shiteki-settings-input:focus {\n border-color: var(--shiteki-primary);\n}\n.shiteki-radio-group {\n display: flex;\n gap: 12px;\n}\n.shiteki-radio {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 13px;\n cursor: pointer;\n}\n.shiteki-radio input[type=radio] {\n margin: 0;\n accent-color: var(--shiteki-primary);\n cursor: pointer;\n}\n.shiteki-settings-actions {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n padding: 0 14px 12px;\n}\n.shiteki-shortcut-hint {\n position: absolute;\n bottom: calc(100% + 8px);\n right: 0;\n display: flex;\n flex-direction: column;\n gap: 0;\n padding: 8px 12px;\n background: var(--shiteki-bg);\n border: 1px solid var(--shiteki-border);\n border-radius: 8px;\n box-shadow: var(--shiteki-shadow);\n font-size: 12px;\n color: var(--shiteki-text-secondary);\n white-space: nowrap;\n}\n.shiteki-shortcut-hint-close {\n position: absolute;\n top: 6px;\n right: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 18px;\n height: 18px;\n border: none;\n border-radius: 4px;\n background: transparent;\n color: var(--shiteki-text-secondary);\n cursor: pointer;\n padding: 0;\n}\n.shiteki-shortcut-hint-close:hover {\n background: #f3f4f6;\n}\n.shiteki-shortcut-hint-list {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n.shiteki-shortcut-hint-list span {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.shiteki-shortcut-hint kbd {\n display: inline-block;\n padding: 1px 5px;\n background: #f3f4f6;\n border: 1px solid var(--shiteki-border);\n border-radius: 4px;\n font-family: inherit;\n font-size: 11px;\n font-weight: 600;\n color: var(--shiteki-text);\n line-height: 1.4;\n min-width: 20px;\n text-align: center;\n}\n.shiteki-shortcut-hint-close:hover {\n background: #f3f4f6;\n}\n');
|
|
1276
1299
|
|
|
1277
1300
|
// src/components/ShitekiWidget.tsx
|
|
1278
|
-
var
|
|
1301
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1279
1302
|
function ShitekiWidget(props) {
|
|
1280
1303
|
const { config, updateConfig } = useConfig(props);
|
|
1281
1304
|
const [open, setOpen] = (0, import_react22.useState)(false);
|
|
@@ -1425,8 +1448,8 @@ function ShitekiWidget(props) {
|
|
|
1425
1448
|
onCloseSendDialog: handleSendCancel
|
|
1426
1449
|
});
|
|
1427
1450
|
return import_react_dom.default.createPortal(
|
|
1428
|
-
/* @__PURE__ */ (0,
|
|
1429
|
-
/* @__PURE__ */ (0,
|
|
1451
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "shiteki-root", children: [
|
|
1452
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1430
1453
|
Toolbar,
|
|
1431
1454
|
{
|
|
1432
1455
|
open,
|
|
@@ -1445,9 +1468,9 @@ function ShitekiWidget(props) {
|
|
|
1445
1468
|
onDismissHint: dismissHint
|
|
1446
1469
|
}
|
|
1447
1470
|
),
|
|
1448
|
-
open && /* @__PURE__ */ (0,
|
|
1449
|
-
/* @__PURE__ */ (0,
|
|
1450
|
-
/* @__PURE__ */ (0,
|
|
1471
|
+
open && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
|
|
1472
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ElementHighlight, { rect: hoveredRect }),
|
|
1473
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react23.AnimatePresence, { children: mode === "annotating" && selectedElement && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1451
1474
|
AnnotationPopover,
|
|
1452
1475
|
{
|
|
1453
1476
|
elementInfo: selectedElement,
|
|
@@ -1456,8 +1479,8 @@ function ShitekiWidget(props) {
|
|
|
1456
1479
|
},
|
|
1457
1480
|
"popover"
|
|
1458
1481
|
) }),
|
|
1459
|
-
/* @__PURE__ */ (0,
|
|
1460
|
-
/* @__PURE__ */ (0,
|
|
1482
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(AnnotationMarkers, { annotations, onClick: handleMarkerClick }),
|
|
1483
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react23.AnimatePresence, { children: viewingAnnotation && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1461
1484
|
AnnotationDetailPopover,
|
|
1462
1485
|
{
|
|
1463
1486
|
annotation: viewingAnnotation,
|
|
@@ -1468,8 +1491,8 @@ function ShitekiWidget(props) {
|
|
|
1468
1491
|
},
|
|
1469
1492
|
"detail"
|
|
1470
1493
|
) }),
|
|
1471
|
-
/* @__PURE__ */ (0,
|
|
1472
|
-
settingsOpen && /* @__PURE__ */ (0,
|
|
1494
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react23.AnimatePresence, { children: [
|
|
1495
|
+
settingsOpen && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1473
1496
|
SettingsPanel,
|
|
1474
1497
|
{
|
|
1475
1498
|
config,
|
|
@@ -1478,7 +1501,7 @@ function ShitekiWidget(props) {
|
|
|
1478
1501
|
},
|
|
1479
1502
|
"settings"
|
|
1480
1503
|
),
|
|
1481
|
-
sendDialogOpen && /* @__PURE__ */ (0,
|
|
1504
|
+
sendDialogOpen && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1482
1505
|
SendDialog,
|
|
1483
1506
|
{
|
|
1484
1507
|
defaultTitle: `Visual Annotations (${annotations.length}) \u2014 ${document.title || location.href}`,
|
|
@@ -1489,7 +1512,7 @@ function ShitekiWidget(props) {
|
|
|
1489
1512
|
"send-dialog"
|
|
1490
1513
|
)
|
|
1491
1514
|
] }),
|
|
1492
|
-
/* @__PURE__ */ (0,
|
|
1515
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react23.AnimatePresence, { children: submitState.status !== "idle" && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StatusMessage, { state: submitState, onDismiss: resetSubmit }, "status") })
|
|
1493
1516
|
] })
|
|
1494
1517
|
] }),
|
|
1495
1518
|
document.body
|