pdfjs-reader-core 0.1.3 → 0.1.5
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.cjs +682 -267
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +238 -9
- package/dist/index.d.ts +238 -9
- package/dist/index.js +647 -226
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -338,13 +338,21 @@ function createViewerStore(initialOverrides = {}) {
|
|
|
338
338
|
...initialOverrides,
|
|
339
339
|
// Document actions
|
|
340
340
|
setDocument: (document2) => {
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
341
|
+
if (document2) {
|
|
342
|
+
set({
|
|
343
|
+
document: document2,
|
|
344
|
+
numPages: document2.numPages,
|
|
345
|
+
isLoading: false,
|
|
346
|
+
error: null,
|
|
347
|
+
currentPage: 1
|
|
348
|
+
});
|
|
349
|
+
} else {
|
|
350
|
+
set({
|
|
351
|
+
document: null,
|
|
352
|
+
numPages: 0,
|
|
353
|
+
isLoading: false
|
|
354
|
+
});
|
|
355
|
+
}
|
|
348
356
|
},
|
|
349
357
|
setLoading: (isLoading) => {
|
|
350
358
|
set({ isLoading });
|
|
@@ -1376,6 +1384,12 @@ function createSearchStore(initialOverrides = {}) {
|
|
|
1376
1384
|
set({ currentResultIndex: index });
|
|
1377
1385
|
}
|
|
1378
1386
|
},
|
|
1387
|
+
setCaseSensitive: (value) => {
|
|
1388
|
+
set({ caseSensitive: value });
|
|
1389
|
+
},
|
|
1390
|
+
setWholeWord: (value) => {
|
|
1391
|
+
set({ wholeWord: value });
|
|
1392
|
+
},
|
|
1379
1393
|
toggleCaseSensitive: () => {
|
|
1380
1394
|
set((state) => ({ caseSensitive: !state.caseSensitive }));
|
|
1381
1395
|
},
|
|
@@ -8772,16 +8786,181 @@ var init_DualPageContainer = __esm({
|
|
|
8772
8786
|
}
|
|
8773
8787
|
});
|
|
8774
8788
|
|
|
8789
|
+
// src/components/FloatingZoomControls/FloatingZoomControls.tsx
|
|
8790
|
+
var import_react39, import_jsx_runtime25, FloatingZoomControls;
|
|
8791
|
+
var init_FloatingZoomControls = __esm({
|
|
8792
|
+
"src/components/FloatingZoomControls/FloatingZoomControls.tsx"() {
|
|
8793
|
+
"use strict";
|
|
8794
|
+
import_react39 = require("react");
|
|
8795
|
+
init_hooks();
|
|
8796
|
+
init_utils();
|
|
8797
|
+
import_jsx_runtime25 = require("react/jsx-runtime");
|
|
8798
|
+
FloatingZoomControls = (0, import_react39.memo)(function FloatingZoomControls2({
|
|
8799
|
+
position = "bottom-right",
|
|
8800
|
+
className,
|
|
8801
|
+
showFitToWidth = true,
|
|
8802
|
+
showFitToPage = false,
|
|
8803
|
+
showZoomLevel = true
|
|
8804
|
+
}) {
|
|
8805
|
+
const { viewerStore } = usePDFViewerStores();
|
|
8806
|
+
const scale = useViewerStore((s) => s.scale);
|
|
8807
|
+
const document2 = useViewerStore((s) => s.document);
|
|
8808
|
+
const handleZoomIn = (0, import_react39.useCallback)(() => {
|
|
8809
|
+
viewerStore.getState().zoomIn();
|
|
8810
|
+
}, [viewerStore]);
|
|
8811
|
+
const handleZoomOut = (0, import_react39.useCallback)(() => {
|
|
8812
|
+
viewerStore.getState().zoomOut();
|
|
8813
|
+
}, [viewerStore]);
|
|
8814
|
+
const handleFitToWidth = (0, import_react39.useCallback)(() => {
|
|
8815
|
+
viewerStore.getState().setScale(1);
|
|
8816
|
+
}, [viewerStore]);
|
|
8817
|
+
const handleFitToPage = (0, import_react39.useCallback)(() => {
|
|
8818
|
+
viewerStore.getState().setScale(0.75);
|
|
8819
|
+
}, [viewerStore]);
|
|
8820
|
+
if (!document2) return null;
|
|
8821
|
+
const positionClasses = {
|
|
8822
|
+
"bottom-right": "bottom-4 right-4",
|
|
8823
|
+
"bottom-left": "bottom-4 left-4",
|
|
8824
|
+
"top-right": "top-4 right-4",
|
|
8825
|
+
"top-left": "top-4 left-4"
|
|
8826
|
+
};
|
|
8827
|
+
const zoomPercentage = Math.round(scale * 100);
|
|
8828
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
8829
|
+
"div",
|
|
8830
|
+
{
|
|
8831
|
+
className: cn(
|
|
8832
|
+
"fixed z-50 flex items-center gap-1",
|
|
8833
|
+
"bg-white dark:bg-gray-800 rounded-lg shadow-lg",
|
|
8834
|
+
"border border-gray-200 dark:border-gray-700",
|
|
8835
|
+
"p-1",
|
|
8836
|
+
positionClasses[position],
|
|
8837
|
+
className
|
|
8838
|
+
),
|
|
8839
|
+
children: [
|
|
8840
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8841
|
+
"button",
|
|
8842
|
+
{
|
|
8843
|
+
onClick: handleZoomOut,
|
|
8844
|
+
className: cn(
|
|
8845
|
+
"w-8 h-8 flex items-center justify-center rounded",
|
|
8846
|
+
"text-gray-700 dark:text-gray-300",
|
|
8847
|
+
"hover:bg-gray-100 dark:hover:bg-gray-700",
|
|
8848
|
+
"transition-colors",
|
|
8849
|
+
"disabled:opacity-50 disabled:cursor-not-allowed"
|
|
8850
|
+
),
|
|
8851
|
+
disabled: scale <= 0.25,
|
|
8852
|
+
title: "Zoom Out",
|
|
8853
|
+
"aria-label": "Zoom Out",
|
|
8854
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M20 12H4" }) })
|
|
8855
|
+
}
|
|
8856
|
+
),
|
|
8857
|
+
showZoomLevel && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "min-w-[48px] text-center text-sm font-medium text-gray-700 dark:text-gray-300", children: [
|
|
8858
|
+
zoomPercentage,
|
|
8859
|
+
"%"
|
|
8860
|
+
] }),
|
|
8861
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8862
|
+
"button",
|
|
8863
|
+
{
|
|
8864
|
+
onClick: handleZoomIn,
|
|
8865
|
+
className: cn(
|
|
8866
|
+
"w-8 h-8 flex items-center justify-center rounded",
|
|
8867
|
+
"text-gray-700 dark:text-gray-300",
|
|
8868
|
+
"hover:bg-gray-100 dark:hover:bg-gray-700",
|
|
8869
|
+
"transition-colors",
|
|
8870
|
+
"disabled:opacity-50 disabled:cursor-not-allowed"
|
|
8871
|
+
),
|
|
8872
|
+
disabled: scale >= 4,
|
|
8873
|
+
title: "Zoom In",
|
|
8874
|
+
"aria-label": "Zoom In",
|
|
8875
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 4v16m8-8H4" }) })
|
|
8876
|
+
}
|
|
8877
|
+
),
|
|
8878
|
+
(showFitToWidth || showFitToPage) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "w-px h-6 bg-gray-200 dark:bg-gray-700 mx-1" }),
|
|
8879
|
+
showFitToWidth && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8880
|
+
"button",
|
|
8881
|
+
{
|
|
8882
|
+
onClick: handleFitToWidth,
|
|
8883
|
+
className: cn(
|
|
8884
|
+
"w-8 h-8 flex items-center justify-center rounded",
|
|
8885
|
+
"text-gray-700 dark:text-gray-300",
|
|
8886
|
+
"hover:bg-gray-100 dark:hover:bg-gray-700",
|
|
8887
|
+
"transition-colors"
|
|
8888
|
+
),
|
|
8889
|
+
title: "Fit to Width",
|
|
8890
|
+
"aria-label": "Fit to Width",
|
|
8891
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" }) })
|
|
8892
|
+
}
|
|
8893
|
+
),
|
|
8894
|
+
showFitToPage && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8895
|
+
"button",
|
|
8896
|
+
{
|
|
8897
|
+
onClick: handleFitToPage,
|
|
8898
|
+
className: cn(
|
|
8899
|
+
"w-8 h-8 flex items-center justify-center rounded",
|
|
8900
|
+
"text-gray-700 dark:text-gray-300",
|
|
8901
|
+
"hover:bg-gray-100 dark:hover:bg-gray-700",
|
|
8902
|
+
"transition-colors"
|
|
8903
|
+
),
|
|
8904
|
+
title: "Fit to Page",
|
|
8905
|
+
"aria-label": "Fit to Page",
|
|
8906
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) })
|
|
8907
|
+
}
|
|
8908
|
+
)
|
|
8909
|
+
]
|
|
8910
|
+
}
|
|
8911
|
+
);
|
|
8912
|
+
});
|
|
8913
|
+
}
|
|
8914
|
+
});
|
|
8915
|
+
|
|
8916
|
+
// src/components/FloatingZoomControls/index.ts
|
|
8917
|
+
var init_FloatingZoomControls2 = __esm({
|
|
8918
|
+
"src/components/FloatingZoomControls/index.ts"() {
|
|
8919
|
+
"use strict";
|
|
8920
|
+
init_FloatingZoomControls();
|
|
8921
|
+
}
|
|
8922
|
+
});
|
|
8923
|
+
|
|
8775
8924
|
// src/components/PDFViewer/PDFViewerClient.tsx
|
|
8776
8925
|
var PDFViewerClient_exports = {};
|
|
8777
8926
|
__export(PDFViewerClient_exports, {
|
|
8778
8927
|
PDFViewerClient: () => PDFViewerClient
|
|
8779
8928
|
});
|
|
8780
|
-
|
|
8929
|
+
function getSrcIdentifier(src) {
|
|
8930
|
+
if (typeof src === "string") {
|
|
8931
|
+
return src;
|
|
8932
|
+
}
|
|
8933
|
+
const data = src instanceof ArrayBuffer ? new Uint8Array(src) : src;
|
|
8934
|
+
const len = data.byteLength;
|
|
8935
|
+
if (len === 0) return "empty";
|
|
8936
|
+
const first = Array.from(data.slice(0, 4)).map((b) => b.toString(16).padStart(2, "0")).join("");
|
|
8937
|
+
const last = Array.from(data.slice(-4)).map((b) => b.toString(16).padStart(2, "0")).join("");
|
|
8938
|
+
return `binary:${len}:${first}:${last}`;
|
|
8939
|
+
}
|
|
8940
|
+
function mergeRects2(rects) {
|
|
8941
|
+
if (rects.length === 0) return [];
|
|
8942
|
+
const sorted = [...rects].sort((a, b) => a.y - b.y || a.x - b.x);
|
|
8943
|
+
const merged = [];
|
|
8944
|
+
let current = { ...sorted[0] };
|
|
8945
|
+
for (let i = 1; i < sorted.length; i++) {
|
|
8946
|
+
const rect = sorted[i];
|
|
8947
|
+
if (Math.abs(rect.y - current.y) < 2 && rect.x <= current.x + current.width + 2) {
|
|
8948
|
+
const newRight = Math.max(current.x + current.width, rect.x + rect.width);
|
|
8949
|
+
current.width = newRight - current.x;
|
|
8950
|
+
current.height = Math.max(current.height, rect.height);
|
|
8951
|
+
} else {
|
|
8952
|
+
merged.push(current);
|
|
8953
|
+
current = { ...rect };
|
|
8954
|
+
}
|
|
8955
|
+
}
|
|
8956
|
+
merged.push(current);
|
|
8957
|
+
return merged;
|
|
8958
|
+
}
|
|
8959
|
+
var import_react40, import_jsx_runtime26, PDFViewerInner, PDFViewerInnerWithRef, PDFViewerClient;
|
|
8781
8960
|
var init_PDFViewerClient = __esm({
|
|
8782
8961
|
"src/components/PDFViewer/PDFViewerClient.tsx"() {
|
|
8783
8962
|
"use strict";
|
|
8784
|
-
|
|
8963
|
+
import_react40 = require("react");
|
|
8785
8964
|
init_hooks();
|
|
8786
8965
|
init_utils();
|
|
8787
8966
|
init_Toolbar2();
|
|
@@ -8790,109 +8969,323 @@ var init_PDFViewerClient = __esm({
|
|
|
8790
8969
|
init_DocumentContainer();
|
|
8791
8970
|
init_ContinuousScrollContainer();
|
|
8792
8971
|
init_DualPageContainer();
|
|
8972
|
+
init_FloatingZoomControls2();
|
|
8793
8973
|
init_utils();
|
|
8794
|
-
|
|
8795
|
-
PDFViewerInner = (0,
|
|
8974
|
+
import_jsx_runtime26 = require("react/jsx-runtime");
|
|
8975
|
+
PDFViewerInner = (0, import_react40.memo)(function PDFViewerInner2({
|
|
8796
8976
|
src,
|
|
8797
8977
|
initialPage = 1,
|
|
8798
|
-
initialScale =
|
|
8978
|
+
initialScale = "auto",
|
|
8799
8979
|
showToolbar = true,
|
|
8800
8980
|
showSidebar = true,
|
|
8801
8981
|
showAnnotationToolbar = false,
|
|
8982
|
+
showFloatingZoom = true,
|
|
8802
8983
|
viewMode = "single",
|
|
8803
8984
|
onDocumentLoad,
|
|
8804
8985
|
onPageChange,
|
|
8805
8986
|
onScaleChange,
|
|
8806
8987
|
onError,
|
|
8807
8988
|
workerSrc,
|
|
8808
|
-
className
|
|
8989
|
+
className,
|
|
8990
|
+
onReady
|
|
8809
8991
|
}) {
|
|
8810
|
-
const { viewerStore } = usePDFViewerStores();
|
|
8811
|
-
const
|
|
8812
|
-
const
|
|
8813
|
-
const onDocumentLoadRef = (0,
|
|
8814
|
-
const onErrorRef = (0,
|
|
8815
|
-
const onPageChangeRef = (0,
|
|
8816
|
-
const onScaleChangeRef = (0,
|
|
8992
|
+
const { viewerStore, annotationStore, searchStore } = usePDFViewerStores();
|
|
8993
|
+
const mountedRef = (0, import_react40.useRef)(true);
|
|
8994
|
+
const [, setLoadState] = (0, import_react40.useState)("idle");
|
|
8995
|
+
const onDocumentLoadRef = (0, import_react40.useRef)(onDocumentLoad);
|
|
8996
|
+
const onErrorRef = (0, import_react40.useRef)(onError);
|
|
8997
|
+
const onPageChangeRef = (0, import_react40.useRef)(onPageChange);
|
|
8998
|
+
const onScaleChangeRef = (0, import_react40.useRef)(onScaleChange);
|
|
8999
|
+
const onReadyRef = (0, import_react40.useRef)(onReady);
|
|
8817
9000
|
onDocumentLoadRef.current = onDocumentLoad;
|
|
8818
9001
|
onErrorRef.current = onError;
|
|
8819
9002
|
onPageChangeRef.current = onPageChange;
|
|
8820
9003
|
onScaleChangeRef.current = onScaleChange;
|
|
9004
|
+
onReadyRef.current = onReady;
|
|
9005
|
+
const srcIdRef = (0, import_react40.useRef)(null);
|
|
8821
9006
|
const currentPage = useViewerStore((s) => s.currentPage);
|
|
8822
9007
|
const scale = useViewerStore((s) => s.scale);
|
|
8823
9008
|
const theme = useViewerStore((s) => s.theme);
|
|
8824
9009
|
const isLoading = useViewerStore((s) => s.isLoading);
|
|
8825
9010
|
const error = useViewerStore((s) => s.error);
|
|
8826
9011
|
const sidebarOpen = useViewerStore((s) => s.sidebarOpen);
|
|
8827
|
-
const
|
|
8828
|
-
const
|
|
8829
|
-
|
|
8830
|
-
|
|
9012
|
+
const srcId = getSrcIdentifier(src);
|
|
9013
|
+
const handleRef = (0, import_react40.useRef)(null);
|
|
9014
|
+
(0, import_react40.useEffect)(() => {
|
|
9015
|
+
const handle = {
|
|
9016
|
+
// ==================== Text Highlighting ====================
|
|
9017
|
+
highlightText: async (text, options) => {
|
|
9018
|
+
const doc = viewerStore.getState().document;
|
|
9019
|
+
if (!doc) return [];
|
|
9020
|
+
const color = options?.color ?? "yellow";
|
|
9021
|
+
const targetPage = options?.page;
|
|
9022
|
+
const caseSensitive = options?.caseSensitive ?? false;
|
|
9023
|
+
const scrollTo = options?.scrollTo ?? true;
|
|
9024
|
+
const highlightIds = [];
|
|
9025
|
+
const searchText = caseSensitive ? text : text.toLowerCase();
|
|
9026
|
+
const pagesToSearch = targetPage ? [targetPage] : Array.from({ length: doc.numPages }, (_, i) => i + 1);
|
|
9027
|
+
for (const pageNum of pagesToSearch) {
|
|
9028
|
+
try {
|
|
9029
|
+
const page = await doc.getPage(pageNum);
|
|
9030
|
+
const textContent = await page.getTextContent();
|
|
9031
|
+
const viewport = page.getViewport({ scale: 1 });
|
|
9032
|
+
let fullText = "";
|
|
9033
|
+
const charPositions = [];
|
|
9034
|
+
for (const item of textContent.items) {
|
|
9035
|
+
if ("str" in item && item.str) {
|
|
9036
|
+
const tx = item.transform;
|
|
9037
|
+
const x = tx[4];
|
|
9038
|
+
const y = viewport.height - tx[5];
|
|
9039
|
+
const width = item.width ?? 0;
|
|
9040
|
+
const height = item.height ?? 12;
|
|
9041
|
+
const charWidth = item.str.length > 0 ? width / item.str.length : width;
|
|
9042
|
+
for (let i = 0; i < item.str.length; i++) {
|
|
9043
|
+
charPositions.push({
|
|
9044
|
+
char: item.str[i],
|
|
9045
|
+
rect: {
|
|
9046
|
+
x: x + i * charWidth,
|
|
9047
|
+
y: y - height,
|
|
9048
|
+
width: charWidth,
|
|
9049
|
+
height
|
|
9050
|
+
}
|
|
9051
|
+
});
|
|
9052
|
+
}
|
|
9053
|
+
fullText += item.str;
|
|
9054
|
+
}
|
|
9055
|
+
}
|
|
9056
|
+
const textToSearch = caseSensitive ? fullText : fullText.toLowerCase();
|
|
9057
|
+
let startIndex = 0;
|
|
9058
|
+
while (true) {
|
|
9059
|
+
const matchIndex = textToSearch.indexOf(searchText, startIndex);
|
|
9060
|
+
if (matchIndex === -1) break;
|
|
9061
|
+
const matchRects = [];
|
|
9062
|
+
for (let i = matchIndex; i < matchIndex + text.length && i < charPositions.length; i++) {
|
|
9063
|
+
matchRects.push(charPositions[i].rect);
|
|
9064
|
+
}
|
|
9065
|
+
const mergedRects = mergeRects2(matchRects);
|
|
9066
|
+
const highlight = annotationStore.getState().addHighlight({
|
|
9067
|
+
pageNumber: pageNum,
|
|
9068
|
+
rects: mergedRects,
|
|
9069
|
+
color,
|
|
9070
|
+
text: fullText.substring(matchIndex, matchIndex + text.length)
|
|
9071
|
+
});
|
|
9072
|
+
highlightIds.push(highlight.id);
|
|
9073
|
+
startIndex = matchIndex + 1;
|
|
9074
|
+
}
|
|
9075
|
+
} catch {
|
|
9076
|
+
}
|
|
9077
|
+
}
|
|
9078
|
+
if (scrollTo && highlightIds.length > 0) {
|
|
9079
|
+
const firstHighlight = annotationStore.getState().highlights.find((h) => h.id === highlightIds[0]);
|
|
9080
|
+
if (firstHighlight) {
|
|
9081
|
+
viewerStore.getState().goToPage(firstHighlight.pageNumber);
|
|
9082
|
+
}
|
|
9083
|
+
}
|
|
9084
|
+
return highlightIds;
|
|
9085
|
+
},
|
|
9086
|
+
removeHighlight: (id) => {
|
|
9087
|
+
annotationStore.getState().removeHighlight(id);
|
|
9088
|
+
},
|
|
9089
|
+
clearHighlights: () => {
|
|
9090
|
+
const highlights = annotationStore.getState().highlights;
|
|
9091
|
+
for (const h of highlights) {
|
|
9092
|
+
annotationStore.getState().removeHighlight(h.id);
|
|
9093
|
+
}
|
|
9094
|
+
},
|
|
9095
|
+
// ==================== Annotations ====================
|
|
9096
|
+
drawRect: (options) => {
|
|
9097
|
+
const annotation = annotationStore.getState().addAnnotation({
|
|
9098
|
+
type: "shape",
|
|
9099
|
+
shapeType: "rect",
|
|
9100
|
+
pageNumber: options.page,
|
|
9101
|
+
x: options.x,
|
|
9102
|
+
y: options.y,
|
|
9103
|
+
width: options.width,
|
|
9104
|
+
height: options.height,
|
|
9105
|
+
color: options.color ?? "blue",
|
|
9106
|
+
strokeWidth: options.strokeWidth ?? 2
|
|
9107
|
+
});
|
|
9108
|
+
return annotation.id;
|
|
9109
|
+
},
|
|
9110
|
+
drawCircle: (options) => {
|
|
9111
|
+
const annotation = annotationStore.getState().addAnnotation({
|
|
9112
|
+
type: "shape",
|
|
9113
|
+
shapeType: "circle",
|
|
9114
|
+
pageNumber: options.page,
|
|
9115
|
+
x: options.x,
|
|
9116
|
+
y: options.y,
|
|
9117
|
+
width: options.radius * 2,
|
|
9118
|
+
height: options.radius * 2,
|
|
9119
|
+
color: options.color ?? "blue",
|
|
9120
|
+
strokeWidth: options.strokeWidth ?? 2
|
|
9121
|
+
});
|
|
9122
|
+
return annotation.id;
|
|
9123
|
+
},
|
|
9124
|
+
addNote: (options) => {
|
|
9125
|
+
const annotation = annotationStore.getState().addAnnotation({
|
|
9126
|
+
type: "note",
|
|
9127
|
+
pageNumber: options.page,
|
|
9128
|
+
x: options.x,
|
|
9129
|
+
y: options.y,
|
|
9130
|
+
content: options.content,
|
|
9131
|
+
color: options.color ?? "yellow"
|
|
9132
|
+
});
|
|
9133
|
+
return annotation.id;
|
|
9134
|
+
},
|
|
9135
|
+
removeAnnotation: (id) => {
|
|
9136
|
+
annotationStore.getState().removeAnnotation(id);
|
|
9137
|
+
},
|
|
9138
|
+
clearAnnotations: () => {
|
|
9139
|
+
const annotations = annotationStore.getState().annotations;
|
|
9140
|
+
for (const a of annotations) {
|
|
9141
|
+
annotationStore.getState().removeAnnotation(a.id);
|
|
9142
|
+
}
|
|
9143
|
+
},
|
|
9144
|
+
// ==================== Navigation ====================
|
|
9145
|
+
goToPage: (page) => {
|
|
9146
|
+
viewerStore.getState().goToPage(page);
|
|
9147
|
+
},
|
|
9148
|
+
nextPage: () => {
|
|
9149
|
+
viewerStore.getState().nextPage();
|
|
9150
|
+
},
|
|
9151
|
+
previousPage: () => {
|
|
9152
|
+
viewerStore.getState().previousPage();
|
|
9153
|
+
},
|
|
9154
|
+
getCurrentPage: () => {
|
|
9155
|
+
return viewerStore.getState().currentPage;
|
|
9156
|
+
},
|
|
9157
|
+
getNumPages: () => {
|
|
9158
|
+
return viewerStore.getState().numPages;
|
|
9159
|
+
},
|
|
9160
|
+
// ==================== Zoom ====================
|
|
9161
|
+
setZoom: (scale2) => {
|
|
9162
|
+
viewerStore.getState().setScale(scale2);
|
|
9163
|
+
},
|
|
9164
|
+
getZoom: () => {
|
|
9165
|
+
return viewerStore.getState().scale;
|
|
9166
|
+
},
|
|
9167
|
+
zoomIn: () => {
|
|
9168
|
+
viewerStore.getState().zoomIn();
|
|
9169
|
+
},
|
|
9170
|
+
zoomOut: () => {
|
|
9171
|
+
viewerStore.getState().zoomOut();
|
|
9172
|
+
},
|
|
9173
|
+
// ==================== Search ====================
|
|
9174
|
+
search: async (query, options) => {
|
|
9175
|
+
const doc = viewerStore.getState().document;
|
|
9176
|
+
if (!doc) return [];
|
|
9177
|
+
searchStore.getState().setQuery(query);
|
|
9178
|
+
if (options?.caseSensitive !== void 0) {
|
|
9179
|
+
searchStore.getState().setCaseSensitive(options.caseSensitive);
|
|
9180
|
+
}
|
|
9181
|
+
if (options?.wholeWord !== void 0) {
|
|
9182
|
+
searchStore.getState().setWholeWord(options.wholeWord);
|
|
9183
|
+
}
|
|
9184
|
+
await searchStore.getState().search(doc);
|
|
9185
|
+
return searchStore.getState().results;
|
|
9186
|
+
},
|
|
9187
|
+
nextSearchResult: () => {
|
|
9188
|
+
searchStore.getState().nextResult();
|
|
9189
|
+
const results = searchStore.getState().results;
|
|
9190
|
+
const index = searchStore.getState().currentResultIndex;
|
|
9191
|
+
if (results[index]) {
|
|
9192
|
+
viewerStore.getState().goToPage(results[index].pageNumber);
|
|
9193
|
+
}
|
|
9194
|
+
},
|
|
9195
|
+
previousSearchResult: () => {
|
|
9196
|
+
searchStore.getState().previousResult();
|
|
9197
|
+
const results = searchStore.getState().results;
|
|
9198
|
+
const index = searchStore.getState().currentResultIndex;
|
|
9199
|
+
if (results[index]) {
|
|
9200
|
+
viewerStore.getState().goToPage(results[index].pageNumber);
|
|
9201
|
+
}
|
|
9202
|
+
},
|
|
9203
|
+
clearSearch: () => {
|
|
9204
|
+
searchStore.getState().clearSearch();
|
|
9205
|
+
},
|
|
9206
|
+
// ==================== Document ====================
|
|
9207
|
+
getDocument: () => {
|
|
9208
|
+
return viewerStore.getState().document;
|
|
9209
|
+
},
|
|
9210
|
+
isLoaded: () => {
|
|
9211
|
+
return viewerStore.getState().document !== null;
|
|
9212
|
+
}
|
|
9213
|
+
};
|
|
9214
|
+
handleRef.current = handle;
|
|
9215
|
+
onReadyRef.current?.(handle);
|
|
9216
|
+
}, [viewerStore, annotationStore, searchStore]);
|
|
9217
|
+
const handleRetry = (0, import_react40.useCallback)(() => {
|
|
9218
|
+
srcIdRef.current = null;
|
|
8831
9219
|
viewerStore.getState().setError(null);
|
|
8832
|
-
|
|
8833
|
-
}, [viewerStore
|
|
8834
|
-
(0,
|
|
8835
|
-
|
|
8836
|
-
|
|
8837
|
-
|
|
8838
|
-
|
|
9220
|
+
setLoadState("idle");
|
|
9221
|
+
}, [viewerStore]);
|
|
9222
|
+
(0, import_react40.useEffect)(() => {
|
|
9223
|
+
mountedRef.current = true;
|
|
9224
|
+
return () => {
|
|
9225
|
+
mountedRef.current = false;
|
|
9226
|
+
};
|
|
9227
|
+
}, []);
|
|
9228
|
+
(0, import_react40.useEffect)(() => {
|
|
9229
|
+
if (srcIdRef.current === srcId && viewerStore.getState().document) {
|
|
8839
9230
|
return;
|
|
8840
9231
|
}
|
|
8841
|
-
|
|
8842
|
-
|
|
9232
|
+
const loadId = srcId;
|
|
9233
|
+
srcIdRef.current = srcId;
|
|
8843
9234
|
const currentDoc = viewerStore.getState().document;
|
|
8844
9235
|
if (currentDoc) {
|
|
8845
|
-
|
|
9236
|
+
currentDoc.destroy();
|
|
9237
|
+
viewerStore.getState().setDocument(null);
|
|
8846
9238
|
}
|
|
8847
9239
|
const loadDoc = async () => {
|
|
9240
|
+
if (!mountedRef.current) return;
|
|
8848
9241
|
try {
|
|
8849
9242
|
viewerStore.getState().setLoading(true);
|
|
8850
9243
|
viewerStore.getState().setError(null);
|
|
9244
|
+
setLoadState("loading");
|
|
8851
9245
|
const { document: document2, numPages } = await loadDocument({
|
|
8852
9246
|
src,
|
|
8853
9247
|
workerSrc
|
|
8854
9248
|
});
|
|
8855
|
-
if (
|
|
9249
|
+
if (mountedRef.current && srcIdRef.current === loadId) {
|
|
8856
9250
|
viewerStore.getState().setDocument(document2);
|
|
9251
|
+
setLoadState("loaded");
|
|
8857
9252
|
if (initialPage !== 1) {
|
|
8858
9253
|
viewerStore.getState().goToPage(initialPage);
|
|
8859
9254
|
}
|
|
8860
|
-
if (typeof initialScale === "number"
|
|
9255
|
+
if (typeof initialScale === "number") {
|
|
8861
9256
|
viewerStore.getState().setScale(initialScale);
|
|
9257
|
+
} else if (initialScale === "auto" || initialScale === "page-width") {
|
|
9258
|
+
viewerStore.getState().setScale(1);
|
|
9259
|
+
} else if (initialScale === "page-fit") {
|
|
9260
|
+
viewerStore.getState().setScale(0.75);
|
|
8862
9261
|
}
|
|
8863
9262
|
onDocumentLoadRef.current?.({ document: document2, numPages });
|
|
8864
9263
|
} else {
|
|
8865
9264
|
document2.destroy();
|
|
8866
9265
|
}
|
|
8867
9266
|
} catch (err) {
|
|
8868
|
-
if (
|
|
9267
|
+
if (mountedRef.current && srcIdRef.current === loadId) {
|
|
8869
9268
|
const error2 = err instanceof Error ? err : new Error("Failed to load document");
|
|
8870
9269
|
viewerStore.getState().setError(error2);
|
|
9270
|
+
viewerStore.getState().setLoading(false);
|
|
9271
|
+
setLoadState("error");
|
|
8871
9272
|
onErrorRef.current?.(error2);
|
|
8872
9273
|
}
|
|
8873
|
-
} finally {
|
|
8874
|
-
loadingRef.current = false;
|
|
8875
9274
|
}
|
|
8876
9275
|
};
|
|
8877
9276
|
loadDoc();
|
|
8878
9277
|
return () => {
|
|
8879
|
-
srcRef.current = null;
|
|
8880
9278
|
};
|
|
8881
|
-
}, [src, workerSrc, initialPage, initialScale, viewerStore
|
|
8882
|
-
(0,
|
|
8883
|
-
|
|
8884
|
-
viewerStore.getState().reset();
|
|
8885
|
-
};
|
|
8886
|
-
}, [viewerStore]);
|
|
8887
|
-
const prevPageRef = (0, import_react39.useRef)(currentPage);
|
|
8888
|
-
(0, import_react39.useEffect)(() => {
|
|
9279
|
+
}, [srcId, src, workerSrc, initialPage, initialScale, viewerStore]);
|
|
9280
|
+
const prevPageRef = (0, import_react40.useRef)(currentPage);
|
|
9281
|
+
(0, import_react40.useEffect)(() => {
|
|
8889
9282
|
if (prevPageRef.current !== currentPage) {
|
|
8890
9283
|
prevPageRef.current = currentPage;
|
|
8891
9284
|
onPageChangeRef.current?.(currentPage);
|
|
8892
9285
|
}
|
|
8893
9286
|
}, [currentPage]);
|
|
8894
|
-
const prevScaleRef = (0,
|
|
8895
|
-
(0,
|
|
9287
|
+
const prevScaleRef = (0, import_react40.useRef)(scale);
|
|
9288
|
+
(0, import_react40.useEffect)(() => {
|
|
8896
9289
|
if (prevScaleRef.current !== scale) {
|
|
8897
9290
|
prevScaleRef.current = scale;
|
|
8898
9291
|
onScaleChangeRef.current?.(scale);
|
|
@@ -8900,7 +9293,7 @@ var init_PDFViewerClient = __esm({
|
|
|
8900
9293
|
}, [scale]);
|
|
8901
9294
|
const themeClass = theme === "dark" ? "dark" : "";
|
|
8902
9295
|
if (error) {
|
|
8903
|
-
return /* @__PURE__ */ (0,
|
|
9296
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
8904
9297
|
"div",
|
|
8905
9298
|
{
|
|
8906
9299
|
className: cn(
|
|
@@ -8910,10 +9303,10 @@ var init_PDFViewerClient = __esm({
|
|
|
8910
9303
|
themeClass,
|
|
8911
9304
|
className
|
|
8912
9305
|
),
|
|
8913
|
-
children: /* @__PURE__ */ (0,
|
|
8914
|
-
/* @__PURE__ */ (0,
|
|
8915
|
-
/* @__PURE__ */ (0,
|
|
8916
|
-
/* @__PURE__ */ (0,
|
|
9306
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "text-center p-8", children: [
|
|
9307
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "text-red-500 text-lg font-semibold mb-2", children: "Failed to load PDF" }),
|
|
9308
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "text-gray-500 text-sm", children: error.message }),
|
|
9309
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
8917
9310
|
"button",
|
|
8918
9311
|
{
|
|
8919
9312
|
onClick: handleRetry,
|
|
@@ -8928,68 +9321,85 @@ var init_PDFViewerClient = __esm({
|
|
|
8928
9321
|
const renderContainer = () => {
|
|
8929
9322
|
switch (viewMode) {
|
|
8930
9323
|
case "continuous":
|
|
8931
|
-
return /* @__PURE__ */ (0,
|
|
9324
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ContinuousScrollContainer, {});
|
|
8932
9325
|
case "dual":
|
|
8933
|
-
return /* @__PURE__ */ (0,
|
|
9326
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DualPageContainer, {});
|
|
8934
9327
|
case "single":
|
|
8935
9328
|
default:
|
|
8936
|
-
return /* @__PURE__ */ (0,
|
|
9329
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DocumentContainer, {});
|
|
8937
9330
|
}
|
|
8938
9331
|
};
|
|
8939
|
-
return /* @__PURE__ */ (0,
|
|
9332
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
8940
9333
|
"div",
|
|
8941
9334
|
{
|
|
8942
9335
|
className: cn(
|
|
8943
9336
|
"pdf-viewer",
|
|
8944
|
-
"flex flex-col h-full",
|
|
9337
|
+
"flex flex-col h-full relative",
|
|
8945
9338
|
"bg-white dark:bg-gray-900",
|
|
8946
9339
|
"text-gray-900 dark:text-gray-100",
|
|
8947
9340
|
themeClass,
|
|
8948
9341
|
className
|
|
8949
9342
|
),
|
|
8950
9343
|
children: [
|
|
8951
|
-
showToolbar && /* @__PURE__ */ (0,
|
|
8952
|
-
showAnnotationToolbar && /* @__PURE__ */ (0,
|
|
8953
|
-
/* @__PURE__ */ (0,
|
|
8954
|
-
showSidebar && sidebarOpen && /* @__PURE__ */ (0,
|
|
9344
|
+
showToolbar && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Toolbar, {}),
|
|
9345
|
+
showAnnotationToolbar && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(AnnotationToolbar, {}),
|
|
9346
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-1 overflow-hidden", children: [
|
|
9347
|
+
showSidebar && sidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Sidebar, {}),
|
|
8955
9348
|
renderContainer()
|
|
8956
9349
|
] }),
|
|
8957
|
-
|
|
8958
|
-
|
|
8959
|
-
/* @__PURE__ */ (0,
|
|
9350
|
+
showFloatingZoom && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(FloatingZoomControls, { position: "bottom-right" }),
|
|
9351
|
+
isLoading && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-white/80 dark:bg-gray-900/80", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col items-center", children: [
|
|
9352
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "w-8 h-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin" }),
|
|
9353
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "mt-2 text-sm text-gray-500", children: "Loading PDF..." })
|
|
8960
9354
|
] }) })
|
|
8961
9355
|
]
|
|
8962
9356
|
}
|
|
8963
9357
|
);
|
|
8964
9358
|
});
|
|
8965
|
-
|
|
8966
|
-
|
|
8967
|
-
|
|
8968
|
-
{
|
|
8969
|
-
|
|
8970
|
-
|
|
8971
|
-
|
|
8972
|
-
|
|
8973
|
-
|
|
8974
|
-
|
|
9359
|
+
PDFViewerInnerWithRef = (0, import_react40.forwardRef)(
|
|
9360
|
+
function PDFViewerInnerWithRef2(props, ref) {
|
|
9361
|
+
const handleRef = (0, import_react40.useRef)(null);
|
|
9362
|
+
const handleReady = (0, import_react40.useCallback)((handle) => {
|
|
9363
|
+
handleRef.current = handle;
|
|
9364
|
+
if (typeof ref === "function") {
|
|
9365
|
+
ref(handle);
|
|
9366
|
+
} else if (ref) {
|
|
9367
|
+
ref.current = handle;
|
|
9368
|
+
}
|
|
9369
|
+
}, [ref]);
|
|
9370
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PDFViewerInner, { ...props, onReady: handleReady });
|
|
9371
|
+
}
|
|
9372
|
+
);
|
|
9373
|
+
PDFViewerClient = (0, import_react40.memo)(
|
|
9374
|
+
(0, import_react40.forwardRef)(function PDFViewerClient2(props, ref) {
|
|
9375
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
9376
|
+
PDFViewerProvider,
|
|
9377
|
+
{
|
|
9378
|
+
theme: props.theme,
|
|
9379
|
+
defaultSidebarPanel: props.defaultSidebarPanel,
|
|
9380
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PDFViewerInnerWithRef, { ref, ...props })
|
|
9381
|
+
}
|
|
9382
|
+
);
|
|
9383
|
+
})
|
|
9384
|
+
);
|
|
8975
9385
|
}
|
|
8976
9386
|
});
|
|
8977
9387
|
|
|
8978
9388
|
// src/components/PDFViewer/PDFViewer.tsx
|
|
8979
|
-
var
|
|
9389
|
+
var import_react41, import_jsx_runtime27, PDFViewerClient3, PDFViewerLoading, PDFViewer;
|
|
8980
9390
|
var init_PDFViewer = __esm({
|
|
8981
9391
|
"src/components/PDFViewer/PDFViewer.tsx"() {
|
|
8982
9392
|
"use strict";
|
|
8983
|
-
|
|
9393
|
+
import_react41 = require("react");
|
|
8984
9394
|
init_utils();
|
|
8985
|
-
|
|
8986
|
-
PDFViewerClient3 = (0,
|
|
9395
|
+
import_jsx_runtime27 = require("react/jsx-runtime");
|
|
9396
|
+
PDFViewerClient3 = (0, import_react41.lazy)(
|
|
8987
9397
|
() => Promise.resolve().then(() => (init_PDFViewerClient(), PDFViewerClient_exports)).then((mod) => ({ default: mod.PDFViewerClient }))
|
|
8988
9398
|
);
|
|
8989
|
-
PDFViewerLoading = (0,
|
|
9399
|
+
PDFViewerLoading = (0, import_react41.memo)(function PDFViewerLoading2({
|
|
8990
9400
|
className
|
|
8991
9401
|
}) {
|
|
8992
|
-
return /* @__PURE__ */ (0,
|
|
9402
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
8993
9403
|
"div",
|
|
8994
9404
|
{
|
|
8995
9405
|
className: cn(
|
|
@@ -8998,18 +9408,18 @@ var init_PDFViewer = __esm({
|
|
|
8998
9408
|
"bg-white dark:bg-gray-900",
|
|
8999
9409
|
className
|
|
9000
9410
|
),
|
|
9001
|
-
children: /* @__PURE__ */ (0,
|
|
9002
|
-
/* @__PURE__ */ (0,
|
|
9003
|
-
/* @__PURE__ */ (0,
|
|
9411
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex flex-col items-center", children: [
|
|
9412
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "w-8 h-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin" }),
|
|
9413
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "mt-2 text-sm text-gray-500", children: "Loading PDF viewer..." })
|
|
9004
9414
|
] }) })
|
|
9005
9415
|
}
|
|
9006
9416
|
);
|
|
9007
9417
|
});
|
|
9008
|
-
PDFViewer = (0,
|
|
9418
|
+
PDFViewer = (0, import_react41.memo)(function PDFViewer2(props) {
|
|
9009
9419
|
if (typeof window === "undefined") {
|
|
9010
|
-
return /* @__PURE__ */ (0,
|
|
9420
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(PDFViewerLoading, { className: props.className });
|
|
9011
9421
|
}
|
|
9012
|
-
return /* @__PURE__ */ (0,
|
|
9422
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react41.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(PDFViewerLoading, { className: props.className }), children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(PDFViewerClient3, { ...props }) });
|
|
9013
9423
|
});
|
|
9014
9424
|
}
|
|
9015
9425
|
});
|
|
@@ -9040,6 +9450,7 @@ __export(index_exports, {
|
|
|
9040
9450
|
DocumentContainer: () => DocumentContainer,
|
|
9041
9451
|
DrawingCanvas: () => DrawingCanvas,
|
|
9042
9452
|
DualPageContainer: () => DualPageContainer,
|
|
9453
|
+
FloatingZoomControls: () => FloatingZoomControls,
|
|
9043
9454
|
FocusRegionLayer: () => FocusRegionLayer,
|
|
9044
9455
|
HighlightLayer: () => HighlightLayer,
|
|
9045
9456
|
HighlightPopover: () => HighlightPopover,
|
|
@@ -9140,9 +9551,9 @@ init_HighlightPopover2();
|
|
|
9140
9551
|
init_AnnotationToolbar2();
|
|
9141
9552
|
|
|
9142
9553
|
// src/components/Annotations/StickyNote.tsx
|
|
9143
|
-
var
|
|
9554
|
+
var import_react42 = require("react");
|
|
9144
9555
|
init_utils();
|
|
9145
|
-
var
|
|
9556
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
9146
9557
|
var NOTE_COLORS = [
|
|
9147
9558
|
"#fef08a",
|
|
9148
9559
|
// yellow
|
|
@@ -9155,7 +9566,7 @@ var NOTE_COLORS = [
|
|
|
9155
9566
|
"#fed7aa"
|
|
9156
9567
|
// orange
|
|
9157
9568
|
];
|
|
9158
|
-
var StickyNote = (0,
|
|
9569
|
+
var StickyNote = (0, import_react42.memo)(function StickyNote2({
|
|
9159
9570
|
note,
|
|
9160
9571
|
scale,
|
|
9161
9572
|
isSelected,
|
|
@@ -9168,37 +9579,37 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9168
9579
|
onDragStart,
|
|
9169
9580
|
className
|
|
9170
9581
|
}) {
|
|
9171
|
-
const [isExpanded, setIsExpanded] = (0,
|
|
9172
|
-
const [localContent, setLocalContent] = (0,
|
|
9173
|
-
const textareaRef = (0,
|
|
9174
|
-
const noteRef = (0,
|
|
9175
|
-
(0,
|
|
9582
|
+
const [isExpanded, setIsExpanded] = (0, import_react42.useState)(false);
|
|
9583
|
+
const [localContent, setLocalContent] = (0, import_react42.useState)(note.content);
|
|
9584
|
+
const textareaRef = (0, import_react42.useRef)(null);
|
|
9585
|
+
const noteRef = (0, import_react42.useRef)(null);
|
|
9586
|
+
(0, import_react42.useEffect)(() => {
|
|
9176
9587
|
setLocalContent(note.content);
|
|
9177
9588
|
}, [note.content]);
|
|
9178
|
-
(0,
|
|
9589
|
+
(0, import_react42.useEffect)(() => {
|
|
9179
9590
|
if (isEditing && textareaRef.current) {
|
|
9180
9591
|
textareaRef.current.focus();
|
|
9181
9592
|
textareaRef.current.select();
|
|
9182
9593
|
}
|
|
9183
9594
|
}, [isEditing]);
|
|
9184
|
-
const handleClick = (0,
|
|
9595
|
+
const handleClick = (0, import_react42.useCallback)((e) => {
|
|
9185
9596
|
e.stopPropagation();
|
|
9186
9597
|
onSelect?.();
|
|
9187
9598
|
if (!isExpanded) {
|
|
9188
9599
|
setIsExpanded(true);
|
|
9189
9600
|
}
|
|
9190
9601
|
}, [isExpanded, onSelect]);
|
|
9191
|
-
const handleDoubleClick = (0,
|
|
9602
|
+
const handleDoubleClick = (0, import_react42.useCallback)((e) => {
|
|
9192
9603
|
e.stopPropagation();
|
|
9193
9604
|
onStartEdit?.();
|
|
9194
9605
|
}, [onStartEdit]);
|
|
9195
|
-
const handleBlur = (0,
|
|
9606
|
+
const handleBlur = (0, import_react42.useCallback)(() => {
|
|
9196
9607
|
if (isEditing && localContent !== note.content) {
|
|
9197
9608
|
onUpdate?.({ content: localContent });
|
|
9198
9609
|
}
|
|
9199
9610
|
onEndEdit?.();
|
|
9200
9611
|
}, [isEditing, localContent, note.content, onUpdate, onEndEdit]);
|
|
9201
|
-
const handleKeyDown = (0,
|
|
9612
|
+
const handleKeyDown = (0, import_react42.useCallback)((e) => {
|
|
9202
9613
|
if (e.key === "Escape") {
|
|
9203
9614
|
setLocalContent(note.content);
|
|
9204
9615
|
onEndEdit?.();
|
|
@@ -9206,16 +9617,16 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9206
9617
|
handleBlur();
|
|
9207
9618
|
}
|
|
9208
9619
|
}, [note.content, onEndEdit, handleBlur]);
|
|
9209
|
-
const handleColorChange = (0,
|
|
9620
|
+
const handleColorChange = (0, import_react42.useCallback)((color) => {
|
|
9210
9621
|
onUpdate?.({ color });
|
|
9211
9622
|
}, [onUpdate]);
|
|
9212
|
-
const handleCollapse = (0,
|
|
9623
|
+
const handleCollapse = (0, import_react42.useCallback)((e) => {
|
|
9213
9624
|
e.stopPropagation();
|
|
9214
9625
|
setIsExpanded(false);
|
|
9215
9626
|
onEndEdit?.();
|
|
9216
9627
|
}, [onEndEdit]);
|
|
9217
9628
|
if (!isExpanded) {
|
|
9218
|
-
return /* @__PURE__ */ (0,
|
|
9629
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9219
9630
|
"div",
|
|
9220
9631
|
{
|
|
9221
9632
|
ref: noteRef,
|
|
@@ -9236,14 +9647,14 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9236
9647
|
onMouseDown: onDragStart,
|
|
9237
9648
|
onTouchStart: onDragStart,
|
|
9238
9649
|
title: note.content || "Empty note",
|
|
9239
|
-
children: /* @__PURE__ */ (0,
|
|
9650
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9240
9651
|
"svg",
|
|
9241
9652
|
{
|
|
9242
9653
|
className: "w-4 h-4 opacity-70",
|
|
9243
9654
|
fill: "currentColor",
|
|
9244
9655
|
viewBox: "0 0 20 20",
|
|
9245
9656
|
style: { color: "#333" },
|
|
9246
|
-
children: /* @__PURE__ */ (0,
|
|
9657
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9247
9658
|
"path",
|
|
9248
9659
|
{
|
|
9249
9660
|
fillRule: "evenodd",
|
|
@@ -9256,7 +9667,7 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9256
9667
|
}
|
|
9257
9668
|
);
|
|
9258
9669
|
}
|
|
9259
|
-
return /* @__PURE__ */ (0,
|
|
9670
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
9260
9671
|
"div",
|
|
9261
9672
|
{
|
|
9262
9673
|
ref: noteRef,
|
|
@@ -9274,14 +9685,14 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9274
9685
|
},
|
|
9275
9686
|
onClick: handleClick,
|
|
9276
9687
|
children: [
|
|
9277
|
-
/* @__PURE__ */ (0,
|
|
9688
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
9278
9689
|
"div",
|
|
9279
9690
|
{
|
|
9280
9691
|
className: "flex items-center justify-between px-2 py-1 border-b border-black/10 cursor-move",
|
|
9281
9692
|
onMouseDown: onDragStart,
|
|
9282
9693
|
onTouchStart: onDragStart,
|
|
9283
9694
|
children: [
|
|
9284
|
-
/* @__PURE__ */ (0,
|
|
9695
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex gap-1", children: NOTE_COLORS.map((color) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9285
9696
|
"button",
|
|
9286
9697
|
{
|
|
9287
9698
|
className: cn(
|
|
@@ -9298,8 +9709,8 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9298
9709
|
},
|
|
9299
9710
|
color
|
|
9300
9711
|
)) }),
|
|
9301
|
-
/* @__PURE__ */ (0,
|
|
9302
|
-
/* @__PURE__ */ (0,
|
|
9712
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex gap-1", children: [
|
|
9713
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9303
9714
|
"button",
|
|
9304
9715
|
{
|
|
9305
9716
|
className: "p-0.5 hover:bg-black/10 rounded",
|
|
@@ -9308,23 +9719,23 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9308
9719
|
onDelete?.();
|
|
9309
9720
|
},
|
|
9310
9721
|
title: "Delete note",
|
|
9311
|
-
children: /* @__PURE__ */ (0,
|
|
9722
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("svg", { className: "w-3.5 h-3.5 text-gray-600", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" }) })
|
|
9312
9723
|
}
|
|
9313
9724
|
),
|
|
9314
|
-
/* @__PURE__ */ (0,
|
|
9725
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9315
9726
|
"button",
|
|
9316
9727
|
{
|
|
9317
9728
|
className: "p-0.5 hover:bg-black/10 rounded",
|
|
9318
9729
|
onClick: handleCollapse,
|
|
9319
9730
|
title: "Collapse note",
|
|
9320
|
-
children: /* @__PURE__ */ (0,
|
|
9731
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("svg", { className: "w-3.5 h-3.5 text-gray-600", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
9321
9732
|
}
|
|
9322
9733
|
)
|
|
9323
9734
|
] })
|
|
9324
9735
|
]
|
|
9325
9736
|
}
|
|
9326
9737
|
),
|
|
9327
|
-
/* @__PURE__ */ (0,
|
|
9738
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "p-2", children: isEditing ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9328
9739
|
"textarea",
|
|
9329
9740
|
{
|
|
9330
9741
|
ref: textareaRef,
|
|
@@ -9339,7 +9750,7 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9339
9750
|
onKeyDown: handleKeyDown,
|
|
9340
9751
|
placeholder: "Enter note..."
|
|
9341
9752
|
}
|
|
9342
|
-
) : /* @__PURE__ */ (0,
|
|
9753
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
9343
9754
|
"div",
|
|
9344
9755
|
{
|
|
9345
9756
|
className: cn(
|
|
@@ -9350,16 +9761,16 @@ var StickyNote = (0, import_react41.memo)(function StickyNote2({
|
|
|
9350
9761
|
children: note.content || "Double-click to edit..."
|
|
9351
9762
|
}
|
|
9352
9763
|
) }),
|
|
9353
|
-
/* @__PURE__ */ (0,
|
|
9764
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "px-2 pb-1 text-[10px] text-gray-500", children: new Date(note.updatedAt).toLocaleDateString() })
|
|
9354
9765
|
]
|
|
9355
9766
|
}
|
|
9356
9767
|
);
|
|
9357
9768
|
});
|
|
9358
9769
|
|
|
9359
9770
|
// src/components/Annotations/DrawingCanvas.tsx
|
|
9360
|
-
var
|
|
9771
|
+
var import_react43 = require("react");
|
|
9361
9772
|
init_utils();
|
|
9362
|
-
var
|
|
9773
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
9363
9774
|
function pointsToSvgPath(points) {
|
|
9364
9775
|
if (points.length === 0) return "";
|
|
9365
9776
|
if (points.length === 1) {
|
|
@@ -9397,7 +9808,7 @@ function simplifyPath(points, tolerance = 1) {
|
|
|
9397
9808
|
result.push(points[points.length - 1]);
|
|
9398
9809
|
return result;
|
|
9399
9810
|
}
|
|
9400
|
-
var DrawingCanvas = (0,
|
|
9811
|
+
var DrawingCanvas = (0, import_react43.memo)(function DrawingCanvas2({
|
|
9401
9812
|
width,
|
|
9402
9813
|
height,
|
|
9403
9814
|
scale,
|
|
@@ -9407,10 +9818,10 @@ var DrawingCanvas = (0, import_react42.memo)(function DrawingCanvas2({
|
|
|
9407
9818
|
onDrawingComplete,
|
|
9408
9819
|
className
|
|
9409
9820
|
}) {
|
|
9410
|
-
const svgRef = (0,
|
|
9411
|
-
const [isDrawing, setIsDrawing] = (0,
|
|
9412
|
-
const [currentPath, setCurrentPath] = (0,
|
|
9413
|
-
const getPoint = (0,
|
|
9821
|
+
const svgRef = (0, import_react43.useRef)(null);
|
|
9822
|
+
const [isDrawing, setIsDrawing] = (0, import_react43.useState)(false);
|
|
9823
|
+
const [currentPath, setCurrentPath] = (0, import_react43.useState)([]);
|
|
9824
|
+
const getPoint = (0, import_react43.useCallback)((e) => {
|
|
9414
9825
|
if (!svgRef.current) return null;
|
|
9415
9826
|
const svg = svgRef.current;
|
|
9416
9827
|
const rect = svg.getBoundingClientRect();
|
|
@@ -9430,7 +9841,7 @@ var DrawingCanvas = (0, import_react42.memo)(function DrawingCanvas2({
|
|
|
9430
9841
|
y: (clientY - rect.top) / scale
|
|
9431
9842
|
};
|
|
9432
9843
|
}, [scale]);
|
|
9433
|
-
const handleStart = (0,
|
|
9844
|
+
const handleStart = (0, import_react43.useCallback)((e) => {
|
|
9434
9845
|
if (!isActive) return;
|
|
9435
9846
|
const point = getPoint(e);
|
|
9436
9847
|
if (point) {
|
|
@@ -9438,14 +9849,14 @@ var DrawingCanvas = (0, import_react42.memo)(function DrawingCanvas2({
|
|
|
9438
9849
|
setCurrentPath([point]);
|
|
9439
9850
|
}
|
|
9440
9851
|
}, [isActive, getPoint]);
|
|
9441
|
-
const handleMove = (0,
|
|
9852
|
+
const handleMove = (0, import_react43.useCallback)((e) => {
|
|
9442
9853
|
if (!isDrawing || !isActive) return;
|
|
9443
9854
|
const point = getPoint(e);
|
|
9444
9855
|
if (point) {
|
|
9445
9856
|
setCurrentPath((prev) => [...prev, point]);
|
|
9446
9857
|
}
|
|
9447
9858
|
}, [isDrawing, isActive, getPoint]);
|
|
9448
|
-
const handleEnd = (0,
|
|
9859
|
+
const handleEnd = (0, import_react43.useCallback)(() => {
|
|
9449
9860
|
if (!isDrawing) return;
|
|
9450
9861
|
setIsDrawing(false);
|
|
9451
9862
|
if (currentPath.length >= 2) {
|
|
@@ -9454,7 +9865,7 @@ var DrawingCanvas = (0, import_react42.memo)(function DrawingCanvas2({
|
|
|
9454
9865
|
}
|
|
9455
9866
|
setCurrentPath([]);
|
|
9456
9867
|
}, [isDrawing, currentPath, onDrawingComplete]);
|
|
9457
|
-
return /* @__PURE__ */ (0,
|
|
9868
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
9458
9869
|
"svg",
|
|
9459
9870
|
{
|
|
9460
9871
|
ref: svgRef,
|
|
@@ -9474,7 +9885,7 @@ var DrawingCanvas = (0, import_react42.memo)(function DrawingCanvas2({
|
|
|
9474
9885
|
onTouchStart: handleStart,
|
|
9475
9886
|
onTouchMove: handleMove,
|
|
9476
9887
|
onTouchEnd: handleEnd,
|
|
9477
|
-
children: isDrawing && currentPath.length > 0 && /* @__PURE__ */ (0,
|
|
9888
|
+
children: isDrawing && currentPath.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
9478
9889
|
"path",
|
|
9479
9890
|
{
|
|
9480
9891
|
d: pointsToSvgPath(currentPath),
|
|
@@ -9491,10 +9902,10 @@ var DrawingCanvas = (0, import_react42.memo)(function DrawingCanvas2({
|
|
|
9491
9902
|
});
|
|
9492
9903
|
|
|
9493
9904
|
// src/components/Annotations/ShapeRenderer.tsx
|
|
9494
|
-
var
|
|
9905
|
+
var import_react44 = require("react");
|
|
9495
9906
|
init_utils();
|
|
9496
|
-
var
|
|
9497
|
-
var ShapeRenderer = (0,
|
|
9907
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
9908
|
+
var ShapeRenderer = (0, import_react44.memo)(function ShapeRenderer2({
|
|
9498
9909
|
shape,
|
|
9499
9910
|
scale,
|
|
9500
9911
|
isSelected,
|
|
@@ -9504,18 +9915,18 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9504
9915
|
onDelete: _onDelete,
|
|
9505
9916
|
className
|
|
9506
9917
|
}) {
|
|
9507
|
-
const [_isDragging, setIsDragging] = (0,
|
|
9508
|
-
const [_isResizing, setIsResizing] = (0,
|
|
9509
|
-
const [activeHandle, setActiveHandle] = (0,
|
|
9510
|
-
const startPosRef = (0,
|
|
9511
|
-
const startShapeRef = (0,
|
|
9918
|
+
const [_isDragging, setIsDragging] = (0, import_react44.useState)(false);
|
|
9919
|
+
const [_isResizing, setIsResizing] = (0, import_react44.useState)(false);
|
|
9920
|
+
const [activeHandle, setActiveHandle] = (0, import_react44.useState)(null);
|
|
9921
|
+
const startPosRef = (0, import_react44.useRef)({ x: 0, y: 0 });
|
|
9922
|
+
const startShapeRef = (0, import_react44.useRef)({ x: 0, y: 0, width: 0, height: 0 });
|
|
9512
9923
|
const { shapeType, x, y, width, height, color, strokeWidth, id: _id } = shape;
|
|
9513
9924
|
const scaledX = x * scale;
|
|
9514
9925
|
const scaledY = y * scale;
|
|
9515
9926
|
const scaledWidth = width * scale;
|
|
9516
9927
|
const scaledHeight = height * scale;
|
|
9517
9928
|
const scaledStroke = strokeWidth * scale;
|
|
9518
|
-
const getResizeHandles = (0,
|
|
9929
|
+
const getResizeHandles = (0, import_react44.useCallback)(() => {
|
|
9519
9930
|
const handleSize = 8;
|
|
9520
9931
|
const half = handleSize / 2;
|
|
9521
9932
|
return [
|
|
@@ -9529,7 +9940,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9529
9940
|
{ position: "w", cursor: "ew-resize", x: scaledX - half, y: scaledY + scaledHeight / 2 - half }
|
|
9530
9941
|
];
|
|
9531
9942
|
}, [scaledX, scaledY, scaledWidth, scaledHeight]);
|
|
9532
|
-
const handleMouseDown = (0,
|
|
9943
|
+
const handleMouseDown = (0, import_react44.useCallback)((e, handle) => {
|
|
9533
9944
|
e.stopPropagation();
|
|
9534
9945
|
onSelect?.();
|
|
9535
9946
|
if (!isEditing) return;
|
|
@@ -9605,7 +10016,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9605
10016
|
document.addEventListener("mousemove", handleMouseMove);
|
|
9606
10017
|
document.addEventListener("mouseup", handleMouseUp);
|
|
9607
10018
|
}, [isEditing, x, y, width, height, scale, onSelect, onUpdate]);
|
|
9608
|
-
const renderShape2 = (0,
|
|
10019
|
+
const renderShape2 = (0, import_react44.useCallback)(() => {
|
|
9609
10020
|
const commonProps = {
|
|
9610
10021
|
stroke: color,
|
|
9611
10022
|
strokeWidth: scaledStroke,
|
|
@@ -9617,7 +10028,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9617
10028
|
};
|
|
9618
10029
|
switch (shapeType) {
|
|
9619
10030
|
case "rect":
|
|
9620
|
-
return /* @__PURE__ */ (0,
|
|
10031
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9621
10032
|
"rect",
|
|
9622
10033
|
{
|
|
9623
10034
|
x: scaledX,
|
|
@@ -9628,7 +10039,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9628
10039
|
}
|
|
9629
10040
|
);
|
|
9630
10041
|
case "circle":
|
|
9631
|
-
return /* @__PURE__ */ (0,
|
|
10042
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9632
10043
|
"ellipse",
|
|
9633
10044
|
{
|
|
9634
10045
|
cx: scaledX + scaledWidth / 2,
|
|
@@ -9639,7 +10050,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9639
10050
|
}
|
|
9640
10051
|
);
|
|
9641
10052
|
case "line":
|
|
9642
|
-
return /* @__PURE__ */ (0,
|
|
10053
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9643
10054
|
"line",
|
|
9644
10055
|
{
|
|
9645
10056
|
x1: scaledX,
|
|
@@ -9659,22 +10070,22 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9659
10070
|
const arrow1Y = endY - arrowLength * Math.sin(angle - arrowAngle);
|
|
9660
10071
|
const arrow2X = endX - arrowLength * Math.cos(angle + arrowAngle);
|
|
9661
10072
|
const arrow2Y = endY - arrowLength * Math.sin(angle + arrowAngle);
|
|
9662
|
-
return /* @__PURE__ */ (0,
|
|
9663
|
-
/* @__PURE__ */ (0,
|
|
9664
|
-
/* @__PURE__ */ (0,
|
|
9665
|
-
/* @__PURE__ */ (0,
|
|
10073
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("g", { children: [
|
|
10074
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("line", { x1: scaledX, y1: scaledY, x2: endX, y2: endY, ...commonProps }),
|
|
10075
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("line", { x1: endX, y1: endY, x2: arrow1X, y2: arrow1Y, ...commonProps }),
|
|
10076
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("line", { x1: endX, y1: endY, x2: arrow2X, y2: arrow2Y, ...commonProps })
|
|
9666
10077
|
] });
|
|
9667
10078
|
default:
|
|
9668
10079
|
return null;
|
|
9669
10080
|
}
|
|
9670
10081
|
}, [shapeType, scaledX, scaledY, scaledWidth, scaledHeight, color, scaledStroke, isSelected]);
|
|
9671
|
-
return /* @__PURE__ */ (0,
|
|
10082
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
9672
10083
|
"g",
|
|
9673
10084
|
{
|
|
9674
10085
|
className: cn("shape-renderer", className),
|
|
9675
10086
|
onMouseDown: (e) => handleMouseDown(e),
|
|
9676
10087
|
children: [
|
|
9677
|
-
/* @__PURE__ */ (0,
|
|
10088
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9678
10089
|
"rect",
|
|
9679
10090
|
{
|
|
9680
10091
|
x: scaledX - 5,
|
|
@@ -9687,7 +10098,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9687
10098
|
}
|
|
9688
10099
|
),
|
|
9689
10100
|
renderShape2(),
|
|
9690
|
-
isSelected && /* @__PURE__ */ (0,
|
|
10101
|
+
isSelected && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9691
10102
|
"rect",
|
|
9692
10103
|
{
|
|
9693
10104
|
x: scaledX - 2,
|
|
@@ -9700,7 +10111,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9700
10111
|
strokeDasharray: "4 2"
|
|
9701
10112
|
}
|
|
9702
10113
|
),
|
|
9703
|
-
isSelected && isEditing && getResizeHandles().map((handle) => /* @__PURE__ */ (0,
|
|
10114
|
+
isSelected && isEditing && getResizeHandles().map((handle) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9704
10115
|
"rect",
|
|
9705
10116
|
{
|
|
9706
10117
|
x: handle.x,
|
|
@@ -9720,7 +10131,7 @@ var ShapeRenderer = (0, import_react43.memo)(function ShapeRenderer2({
|
|
|
9720
10131
|
}
|
|
9721
10132
|
);
|
|
9722
10133
|
});
|
|
9723
|
-
var ShapePreview = (0,
|
|
10134
|
+
var ShapePreview = (0, import_react44.memo)(function ShapePreview2({
|
|
9724
10135
|
shapeType,
|
|
9725
10136
|
startPoint,
|
|
9726
10137
|
endPoint,
|
|
@@ -9741,9 +10152,9 @@ var ShapePreview = (0, import_react43.memo)(function ShapePreview2({
|
|
|
9741
10152
|
};
|
|
9742
10153
|
switch (shapeType) {
|
|
9743
10154
|
case "rect":
|
|
9744
|
-
return /* @__PURE__ */ (0,
|
|
10155
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("rect", { x, y, width, height, ...commonProps });
|
|
9745
10156
|
case "circle":
|
|
9746
|
-
return /* @__PURE__ */ (0,
|
|
10157
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9747
10158
|
"ellipse",
|
|
9748
10159
|
{
|
|
9749
10160
|
cx: x + width / 2,
|
|
@@ -9754,7 +10165,7 @@ var ShapePreview = (0, import_react43.memo)(function ShapePreview2({
|
|
|
9754
10165
|
}
|
|
9755
10166
|
);
|
|
9756
10167
|
case "line":
|
|
9757
|
-
return /* @__PURE__ */ (0,
|
|
10168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9758
10169
|
"line",
|
|
9759
10170
|
{
|
|
9760
10171
|
x1: startPoint.x * scale,
|
|
@@ -9776,8 +10187,8 @@ var ShapePreview = (0, import_react43.memo)(function ShapePreview2({
|
|
|
9776
10187
|
const arrow1Y = endY - arrowLength * Math.sin(angle - arrowAngle);
|
|
9777
10188
|
const arrow2X = endX - arrowLength * Math.cos(angle + arrowAngle);
|
|
9778
10189
|
const arrow2Y = endY - arrowLength * Math.sin(angle + arrowAngle);
|
|
9779
|
-
return /* @__PURE__ */ (0,
|
|
9780
|
-
/* @__PURE__ */ (0,
|
|
10190
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("g", { children: [
|
|
10191
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
9781
10192
|
"line",
|
|
9782
10193
|
{
|
|
9783
10194
|
x1: startPoint.x * scale,
|
|
@@ -9787,8 +10198,8 @@ var ShapePreview = (0, import_react43.memo)(function ShapePreview2({
|
|
|
9787
10198
|
...commonProps
|
|
9788
10199
|
}
|
|
9789
10200
|
),
|
|
9790
|
-
/* @__PURE__ */ (0,
|
|
9791
|
-
/* @__PURE__ */ (0,
|
|
10201
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("line", { x1: endX, y1: endY, x2: arrow1X, y2: arrow1Y, ...commonProps }),
|
|
10202
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("line", { x1: endX, y1: endY, x2: arrow2X, y2: arrow2Y, ...commonProps })
|
|
9792
10203
|
] });
|
|
9793
10204
|
default:
|
|
9794
10205
|
return null;
|
|
@@ -9796,10 +10207,10 @@ var ShapePreview = (0, import_react43.memo)(function ShapePreview2({
|
|
|
9796
10207
|
});
|
|
9797
10208
|
|
|
9798
10209
|
// src/components/Annotations/QuickNoteButton.tsx
|
|
9799
|
-
var
|
|
10210
|
+
var import_react45 = require("react");
|
|
9800
10211
|
init_utils();
|
|
9801
|
-
var
|
|
9802
|
-
var QuickNoteButton = (0,
|
|
10212
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
10213
|
+
var QuickNoteButton = (0, import_react45.memo)(function QuickNoteButton2({
|
|
9803
10214
|
pageNumber,
|
|
9804
10215
|
scale,
|
|
9805
10216
|
position = "top-right",
|
|
@@ -9807,8 +10218,8 @@ var QuickNoteButton = (0, import_react44.memo)(function QuickNoteButton2({
|
|
|
9807
10218
|
className,
|
|
9808
10219
|
visible = true
|
|
9809
10220
|
}) {
|
|
9810
|
-
const [isHovered, setIsHovered] = (0,
|
|
9811
|
-
const handleClick = (0,
|
|
10221
|
+
const [isHovered, setIsHovered] = (0, import_react45.useState)(false);
|
|
10222
|
+
const handleClick = (0, import_react45.useCallback)(
|
|
9812
10223
|
(e) => {
|
|
9813
10224
|
e.stopPropagation();
|
|
9814
10225
|
const x = position === "top-right" ? 80 : 80;
|
|
@@ -9820,7 +10231,7 @@ var QuickNoteButton = (0, import_react44.memo)(function QuickNoteButton2({
|
|
|
9820
10231
|
if (!visible) {
|
|
9821
10232
|
return null;
|
|
9822
10233
|
}
|
|
9823
|
-
return /* @__PURE__ */ (0,
|
|
10234
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
9824
10235
|
"button",
|
|
9825
10236
|
{
|
|
9826
10237
|
onClick: handleClick,
|
|
@@ -9842,7 +10253,7 @@ var QuickNoteButton = (0, import_react44.memo)(function QuickNoteButton2({
|
|
|
9842
10253
|
),
|
|
9843
10254
|
title: "Add quick note",
|
|
9844
10255
|
"aria-label": "Add quick note",
|
|
9845
|
-
children: /* @__PURE__ */ (0,
|
|
10256
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
9846
10257
|
"svg",
|
|
9847
10258
|
{
|
|
9848
10259
|
className: "w-4 h-4 text-yellow-900",
|
|
@@ -9850,7 +10261,7 @@ var QuickNoteButton = (0, import_react44.memo)(function QuickNoteButton2({
|
|
|
9850
10261
|
viewBox: "0 0 24 24",
|
|
9851
10262
|
stroke: "currentColor",
|
|
9852
10263
|
strokeWidth: 2,
|
|
9853
|
-
children: /* @__PURE__ */ (0,
|
|
10264
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 4v16m8-8H4" })
|
|
9854
10265
|
}
|
|
9855
10266
|
)
|
|
9856
10267
|
}
|
|
@@ -9858,10 +10269,10 @@ var QuickNoteButton = (0, import_react44.memo)(function QuickNoteButton2({
|
|
|
9858
10269
|
});
|
|
9859
10270
|
|
|
9860
10271
|
// src/components/Annotations/QuickNotePopover.tsx
|
|
9861
|
-
var
|
|
10272
|
+
var import_react46 = require("react");
|
|
9862
10273
|
init_utils();
|
|
9863
|
-
var
|
|
9864
|
-
var QuickNotePopover = (0,
|
|
10274
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
10275
|
+
var QuickNotePopover = (0, import_react46.memo)(function QuickNotePopover2({
|
|
9865
10276
|
visible,
|
|
9866
10277
|
position,
|
|
9867
10278
|
initialContent = "",
|
|
@@ -9870,21 +10281,21 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
9870
10281
|
onCancel,
|
|
9871
10282
|
className
|
|
9872
10283
|
}) {
|
|
9873
|
-
const [content, setContent] = (0,
|
|
9874
|
-
const textareaRef = (0,
|
|
9875
|
-
const popoverRef = (0,
|
|
9876
|
-
const [adjustedPosition, setAdjustedPosition] = (0,
|
|
9877
|
-
(0,
|
|
10284
|
+
const [content, setContent] = (0, import_react46.useState)(initialContent);
|
|
10285
|
+
const textareaRef = (0, import_react46.useRef)(null);
|
|
10286
|
+
const popoverRef = (0, import_react46.useRef)(null);
|
|
10287
|
+
const [adjustedPosition, setAdjustedPosition] = (0, import_react46.useState)(position);
|
|
10288
|
+
(0, import_react46.useEffect)(() => {
|
|
9878
10289
|
if (visible && textareaRef.current) {
|
|
9879
10290
|
textareaRef.current.focus();
|
|
9880
10291
|
}
|
|
9881
10292
|
}, [visible]);
|
|
9882
|
-
(0,
|
|
10293
|
+
(0, import_react46.useEffect)(() => {
|
|
9883
10294
|
if (visible) {
|
|
9884
10295
|
setContent(initialContent);
|
|
9885
10296
|
}
|
|
9886
10297
|
}, [visible, initialContent]);
|
|
9887
|
-
(0,
|
|
10298
|
+
(0, import_react46.useEffect)(() => {
|
|
9888
10299
|
if (!visible || !popoverRef.current) return;
|
|
9889
10300
|
const rect = popoverRef.current.getBoundingClientRect();
|
|
9890
10301
|
const padding = 10;
|
|
@@ -9903,14 +10314,14 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
9903
10314
|
}
|
|
9904
10315
|
setAdjustedPosition({ x, y });
|
|
9905
10316
|
}, [position, visible]);
|
|
9906
|
-
const handleSave = (0,
|
|
10317
|
+
const handleSave = (0, import_react46.useCallback)(() => {
|
|
9907
10318
|
if (content.trim()) {
|
|
9908
10319
|
onSave(content.trim());
|
|
9909
10320
|
} else {
|
|
9910
10321
|
onCancel();
|
|
9911
10322
|
}
|
|
9912
10323
|
}, [content, onSave, onCancel]);
|
|
9913
|
-
const handleKeyDown = (0,
|
|
10324
|
+
const handleKeyDown = (0, import_react46.useCallback)(
|
|
9914
10325
|
(e) => {
|
|
9915
10326
|
if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
|
|
9916
10327
|
e.preventDefault();
|
|
@@ -9925,7 +10336,7 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
9925
10336
|
if (!visible) {
|
|
9926
10337
|
return null;
|
|
9927
10338
|
}
|
|
9928
|
-
return /* @__PURE__ */ (0,
|
|
10339
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
9929
10340
|
"div",
|
|
9930
10341
|
{
|
|
9931
10342
|
ref: popoverRef,
|
|
@@ -9944,15 +10355,15 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
9944
10355
|
top: adjustedPosition.y
|
|
9945
10356
|
},
|
|
9946
10357
|
children: [
|
|
9947
|
-
agentLastStatement && /* @__PURE__ */ (0,
|
|
9948
|
-
/* @__PURE__ */ (0,
|
|
9949
|
-
/* @__PURE__ */ (0,
|
|
10358
|
+
agentLastStatement && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "mb-2 p-2 bg-blue-50 dark:bg-blue-900/50 rounded text-xs text-blue-600 dark:text-blue-300 border border-blue-100 dark:border-blue-800", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex items-start gap-1", children: [
|
|
10359
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("svg", { className: "w-3 h-3 mt-0.5 flex-shrink-0", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" }) }),
|
|
10360
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("span", { className: "line-clamp-2", children: [
|
|
9950
10361
|
"AI discussed: \u201C",
|
|
9951
10362
|
agentLastStatement,
|
|
9952
10363
|
"\u201D"
|
|
9953
10364
|
] })
|
|
9954
10365
|
] }) }),
|
|
9955
|
-
/* @__PURE__ */ (0,
|
|
10366
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
9956
10367
|
"textarea",
|
|
9957
10368
|
{
|
|
9958
10369
|
ref: textareaRef,
|
|
@@ -9971,13 +10382,13 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
9971
10382
|
)
|
|
9972
10383
|
}
|
|
9973
10384
|
),
|
|
9974
|
-
/* @__PURE__ */ (0,
|
|
9975
|
-
/* @__PURE__ */ (0,
|
|
10385
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex items-center justify-between mt-2", children: [
|
|
10386
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("span", { className: "text-xs text-gray-500 dark:text-gray-400", children: [
|
|
9976
10387
|
navigator.platform.includes("Mac") ? "\u2318" : "Ctrl",
|
|
9977
10388
|
"+Enter to save"
|
|
9978
10389
|
] }),
|
|
9979
|
-
/* @__PURE__ */ (0,
|
|
9980
|
-
/* @__PURE__ */ (0,
|
|
10390
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex gap-2", children: [
|
|
10391
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
9981
10392
|
"button",
|
|
9982
10393
|
{
|
|
9983
10394
|
onClick: onCancel,
|
|
@@ -9990,7 +10401,7 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
9990
10401
|
children: "Cancel"
|
|
9991
10402
|
}
|
|
9992
10403
|
),
|
|
9993
|
-
/* @__PURE__ */ (0,
|
|
10404
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
9994
10405
|
"button",
|
|
9995
10406
|
{
|
|
9996
10407
|
onClick: handleSave,
|
|
@@ -10013,10 +10424,10 @@ var QuickNotePopover = (0, import_react45.memo)(function QuickNotePopover2({
|
|
|
10013
10424
|
});
|
|
10014
10425
|
|
|
10015
10426
|
// src/components/AskAbout/AskAboutOverlay.tsx
|
|
10016
|
-
var
|
|
10427
|
+
var import_react47 = require("react");
|
|
10017
10428
|
init_utils();
|
|
10018
|
-
var
|
|
10019
|
-
var AskAboutOverlay = (0,
|
|
10429
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
10430
|
+
var AskAboutOverlay = (0, import_react47.memo)(function AskAboutOverlay2({
|
|
10020
10431
|
visible,
|
|
10021
10432
|
progress,
|
|
10022
10433
|
position,
|
|
@@ -10030,7 +10441,7 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10030
10441
|
const radius = (size - strokeWidth) / 2;
|
|
10031
10442
|
const circumference = 2 * Math.PI * radius;
|
|
10032
10443
|
const strokeDashoffset = circumference * (1 - progress);
|
|
10033
|
-
return /* @__PURE__ */ (0,
|
|
10444
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
10034
10445
|
"div",
|
|
10035
10446
|
{
|
|
10036
10447
|
className: cn(
|
|
@@ -10043,7 +10454,7 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10043
10454
|
top: position.y - size / 2
|
|
10044
10455
|
},
|
|
10045
10456
|
children: [
|
|
10046
|
-
/* @__PURE__ */ (0,
|
|
10457
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
10047
10458
|
"svg",
|
|
10048
10459
|
{
|
|
10049
10460
|
width: size,
|
|
@@ -10051,7 +10462,7 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10051
10462
|
viewBox: `0 0 ${size} ${size}`,
|
|
10052
10463
|
className: "transform -rotate-90",
|
|
10053
10464
|
children: [
|
|
10054
|
-
/* @__PURE__ */ (0,
|
|
10465
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
10055
10466
|
"circle",
|
|
10056
10467
|
{
|
|
10057
10468
|
cx: size / 2,
|
|
@@ -10062,7 +10473,7 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10062
10473
|
strokeWidth
|
|
10063
10474
|
}
|
|
10064
10475
|
),
|
|
10065
|
-
/* @__PURE__ */ (0,
|
|
10476
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
10066
10477
|
"circle",
|
|
10067
10478
|
{
|
|
10068
10479
|
cx: size / 2,
|
|
@@ -10080,12 +10491,12 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10080
10491
|
]
|
|
10081
10492
|
}
|
|
10082
10493
|
),
|
|
10083
|
-
/* @__PURE__ */ (0,
|
|
10494
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
10084
10495
|
"div",
|
|
10085
10496
|
{
|
|
10086
10497
|
className: "absolute inset-0 flex items-center justify-center",
|
|
10087
10498
|
style: { color: progress >= 1 ? "#22c55e" : "white" },
|
|
10088
|
-
children: progress >= 1 ? /* @__PURE__ */ (0,
|
|
10499
|
+
children: progress >= 1 ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
10089
10500
|
"svg",
|
|
10090
10501
|
{
|
|
10091
10502
|
width: "24",
|
|
@@ -10096,9 +10507,9 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10096
10507
|
strokeWidth: "2",
|
|
10097
10508
|
strokeLinecap: "round",
|
|
10098
10509
|
strokeLinejoin: "round",
|
|
10099
|
-
children: /* @__PURE__ */ (0,
|
|
10510
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("polyline", { points: "20 6 9 17 4 12" })
|
|
10100
10511
|
}
|
|
10101
|
-
) : /* @__PURE__ */ (0,
|
|
10512
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
10102
10513
|
"svg",
|
|
10103
10514
|
{
|
|
10104
10515
|
width: "20",
|
|
@@ -10110,9 +10521,9 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10110
10521
|
strokeLinecap: "round",
|
|
10111
10522
|
strokeLinejoin: "round",
|
|
10112
10523
|
children: [
|
|
10113
|
-
/* @__PURE__ */ (0,
|
|
10114
|
-
/* @__PURE__ */ (0,
|
|
10115
|
-
/* @__PURE__ */ (0,
|
|
10524
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
|
|
10525
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
|
|
10526
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
|
|
10116
10527
|
]
|
|
10117
10528
|
}
|
|
10118
10529
|
)
|
|
@@ -10124,10 +10535,10 @@ var AskAboutOverlay = (0, import_react46.memo)(function AskAboutOverlay2({
|
|
|
10124
10535
|
});
|
|
10125
10536
|
|
|
10126
10537
|
// src/components/AskAbout/AskAboutTrigger.tsx
|
|
10127
|
-
var
|
|
10538
|
+
var import_react48 = require("react");
|
|
10128
10539
|
init_utils();
|
|
10129
|
-
var
|
|
10130
|
-
var AskAboutTrigger = (0,
|
|
10540
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
10541
|
+
var AskAboutTrigger = (0, import_react48.memo)(function AskAboutTrigger2({
|
|
10131
10542
|
position,
|
|
10132
10543
|
onConfirm,
|
|
10133
10544
|
onCancel,
|
|
@@ -10135,9 +10546,9 @@ var AskAboutTrigger = (0, import_react47.memo)(function AskAboutTrigger2({
|
|
|
10135
10546
|
autoHideDelay = 5e3,
|
|
10136
10547
|
className
|
|
10137
10548
|
}) {
|
|
10138
|
-
const [adjustedPosition, setAdjustedPosition] = (0,
|
|
10139
|
-
const triggerRef = (0,
|
|
10140
|
-
(0,
|
|
10549
|
+
const [adjustedPosition, setAdjustedPosition] = (0, import_react48.useState)(position);
|
|
10550
|
+
const triggerRef = (0, import_react48.useRef)(null);
|
|
10551
|
+
(0, import_react48.useEffect)(() => {
|
|
10141
10552
|
if (!visible || !triggerRef.current) return;
|
|
10142
10553
|
const rect = triggerRef.current.getBoundingClientRect();
|
|
10143
10554
|
const padding = 10;
|
|
@@ -10153,19 +10564,19 @@ var AskAboutTrigger = (0, import_react47.memo)(function AskAboutTrigger2({
|
|
|
10153
10564
|
}
|
|
10154
10565
|
setAdjustedPosition({ x, y });
|
|
10155
10566
|
}, [position, visible]);
|
|
10156
|
-
(0,
|
|
10567
|
+
(0, import_react48.useEffect)(() => {
|
|
10157
10568
|
if (!visible || autoHideDelay === 0) return;
|
|
10158
10569
|
const timer = setTimeout(onCancel, autoHideDelay);
|
|
10159
10570
|
return () => clearTimeout(timer);
|
|
10160
10571
|
}, [visible, autoHideDelay, onCancel]);
|
|
10161
|
-
const handleConfirm = (0,
|
|
10572
|
+
const handleConfirm = (0, import_react48.useCallback)(
|
|
10162
10573
|
(e) => {
|
|
10163
10574
|
e.stopPropagation();
|
|
10164
10575
|
onConfirm();
|
|
10165
10576
|
},
|
|
10166
10577
|
[onConfirm]
|
|
10167
10578
|
);
|
|
10168
|
-
const handleCancel = (0,
|
|
10579
|
+
const handleCancel = (0, import_react48.useCallback)(
|
|
10169
10580
|
(e) => {
|
|
10170
10581
|
e.stopPropagation();
|
|
10171
10582
|
onCancel();
|
|
@@ -10175,7 +10586,7 @@ var AskAboutTrigger = (0, import_react47.memo)(function AskAboutTrigger2({
|
|
|
10175
10586
|
if (!visible) {
|
|
10176
10587
|
return null;
|
|
10177
10588
|
}
|
|
10178
|
-
return /* @__PURE__ */ (0,
|
|
10589
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
10179
10590
|
"div",
|
|
10180
10591
|
{
|
|
10181
10592
|
ref: triggerRef,
|
|
@@ -10194,8 +10605,8 @@ var AskAboutTrigger = (0, import_react47.memo)(function AskAboutTrigger2({
|
|
|
10194
10605
|
transform: "translate(-50%, 0)"
|
|
10195
10606
|
},
|
|
10196
10607
|
children: [
|
|
10197
|
-
/* @__PURE__ */ (0,
|
|
10198
|
-
/* @__PURE__ */ (0,
|
|
10608
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-sm text-gray-600 dark:text-gray-300 px-2", children: "Ask about this?" }),
|
|
10609
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
10199
10610
|
"button",
|
|
10200
10611
|
{
|
|
10201
10612
|
onClick: handleConfirm,
|
|
@@ -10208,7 +10619,7 @@ var AskAboutTrigger = (0, import_react47.memo)(function AskAboutTrigger2({
|
|
|
10208
10619
|
children: "Ask"
|
|
10209
10620
|
}
|
|
10210
10621
|
),
|
|
10211
|
-
/* @__PURE__ */ (0,
|
|
10622
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
10212
10623
|
"button",
|
|
10213
10624
|
{
|
|
10214
10625
|
onClick: handleCancel,
|
|
@@ -10228,11 +10639,11 @@ var AskAboutTrigger = (0, import_react47.memo)(function AskAboutTrigger2({
|
|
|
10228
10639
|
});
|
|
10229
10640
|
|
|
10230
10641
|
// src/components/Minimap/Minimap.tsx
|
|
10231
|
-
var
|
|
10642
|
+
var import_react49 = require("react");
|
|
10232
10643
|
init_hooks();
|
|
10233
10644
|
init_utils();
|
|
10234
|
-
var
|
|
10235
|
-
var PageIndicator = (0,
|
|
10645
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
10646
|
+
var PageIndicator = (0, import_react49.memo)(function PageIndicator2({
|
|
10236
10647
|
pageNumber,
|
|
10237
10648
|
status,
|
|
10238
10649
|
isBookmarked,
|
|
@@ -10246,7 +10657,7 @@ var PageIndicator = (0, import_react48.memo)(function PageIndicator2({
|
|
|
10246
10657
|
if (status === "visited") return "bg-green-400";
|
|
10247
10658
|
return "bg-gray-200 dark:bg-gray-700";
|
|
10248
10659
|
};
|
|
10249
|
-
return /* @__PURE__ */ (0,
|
|
10660
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
10250
10661
|
"button",
|
|
10251
10662
|
{
|
|
10252
10663
|
onClick,
|
|
@@ -10262,13 +10673,13 @@ var PageIndicator = (0, import_react48.memo)(function PageIndicator2({
|
|
|
10262
10673
|
title: `Page ${pageNumber}${isBookmarked ? " (bookmarked)" : ""}`,
|
|
10263
10674
|
"aria-label": `Go to page ${pageNumber}`,
|
|
10264
10675
|
children: [
|
|
10265
|
-
isBookmarked && !compact && /* @__PURE__ */ (0,
|
|
10266
|
-
showNumber && !compact && /* @__PURE__ */ (0,
|
|
10676
|
+
isBookmarked && !compact && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "absolute -top-1 -right-1 w-2 h-2 bg-yellow-500 rounded-full border border-white" }),
|
|
10677
|
+
showNumber && !compact && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "absolute inset-0 flex items-center justify-center text-[8px] font-medium text-white", children: pageNumber })
|
|
10267
10678
|
]
|
|
10268
10679
|
}
|
|
10269
10680
|
);
|
|
10270
10681
|
});
|
|
10271
|
-
var Minimap = (0,
|
|
10682
|
+
var Minimap = (0, import_react49.memo)(function Minimap2({
|
|
10272
10683
|
variant = "sidebar",
|
|
10273
10684
|
floatingPosition = "right",
|
|
10274
10685
|
maxHeight = 300,
|
|
@@ -10281,18 +10692,18 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10281
10692
|
const currentPage = useViewerStore((s) => s.currentPage);
|
|
10282
10693
|
const numPages = useViewerStore((s) => s.numPages);
|
|
10283
10694
|
const goToPage = useViewerStore((s) => s.goToPage);
|
|
10284
|
-
const bookmarkedPages = (0,
|
|
10695
|
+
const bookmarkedPages = (0, import_react49.useMemo)(() => {
|
|
10285
10696
|
return new Set(bookmarks.map((b) => b.pageNumber));
|
|
10286
10697
|
}, [bookmarks]);
|
|
10287
10698
|
const compact = numPages > 50;
|
|
10288
|
-
const handlePageClick = (0,
|
|
10699
|
+
const handlePageClick = (0, import_react49.useCallback)(
|
|
10289
10700
|
(pageNumber) => {
|
|
10290
10701
|
goToPage(pageNumber);
|
|
10291
10702
|
onPageClick?.(pageNumber);
|
|
10292
10703
|
},
|
|
10293
10704
|
[goToPage, onPageClick]
|
|
10294
10705
|
);
|
|
10295
|
-
const getPageStatus = (0,
|
|
10706
|
+
const getPageStatus = (0, import_react49.useCallback)(
|
|
10296
10707
|
(pageNumber) => {
|
|
10297
10708
|
if (pageNumber === currentPage) return "current";
|
|
10298
10709
|
if (bookmarkedPages.has(pageNumber)) return "bookmarked";
|
|
@@ -10301,11 +10712,11 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10301
10712
|
},
|
|
10302
10713
|
[currentPage, visitedPages, bookmarkedPages]
|
|
10303
10714
|
);
|
|
10304
|
-
const pageIndicators = (0,
|
|
10715
|
+
const pageIndicators = (0, import_react49.useMemo)(() => {
|
|
10305
10716
|
const pages = [];
|
|
10306
10717
|
for (let i = 1; i <= numPages; i++) {
|
|
10307
10718
|
pages.push(
|
|
10308
|
-
/* @__PURE__ */ (0,
|
|
10719
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
10309
10720
|
PageIndicator,
|
|
10310
10721
|
{
|
|
10311
10722
|
pageNumber: i,
|
|
@@ -10326,16 +10737,16 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10326
10737
|
if (numPages === 0) {
|
|
10327
10738
|
return null;
|
|
10328
10739
|
}
|
|
10329
|
-
const content = /* @__PURE__ */ (0,
|
|
10330
|
-
/* @__PURE__ */ (0,
|
|
10331
|
-
/* @__PURE__ */ (0,
|
|
10332
|
-
/* @__PURE__ */ (0,
|
|
10333
|
-
/* @__PURE__ */ (0,
|
|
10740
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
|
|
10741
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "mb-3", children: [
|
|
10742
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center justify-between text-xs text-gray-500 dark:text-gray-400 mb-1", children: [
|
|
10743
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { children: "Progress" }),
|
|
10744
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { children: [
|
|
10334
10745
|
progressPercentage,
|
|
10335
10746
|
"%"
|
|
10336
10747
|
] })
|
|
10337
10748
|
] }),
|
|
10338
|
-
/* @__PURE__ */ (0,
|
|
10749
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "h-1.5 bg-gray-200 dark:bg-gray-700 rounded-full overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
10339
10750
|
"div",
|
|
10340
10751
|
{
|
|
10341
10752
|
className: "h-full bg-green-500 rounded-full transition-all duration-300",
|
|
@@ -10343,7 +10754,7 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10343
10754
|
}
|
|
10344
10755
|
) })
|
|
10345
10756
|
] }),
|
|
10346
|
-
/* @__PURE__ */ (0,
|
|
10757
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
10347
10758
|
"div",
|
|
10348
10759
|
{
|
|
10349
10760
|
className: cn(
|
|
@@ -10354,21 +10765,21 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10354
10765
|
children: pageIndicators
|
|
10355
10766
|
}
|
|
10356
10767
|
),
|
|
10357
|
-
/* @__PURE__ */ (0,
|
|
10358
|
-
/* @__PURE__ */ (0,
|
|
10359
|
-
/* @__PURE__ */ (0,
|
|
10360
|
-
/* @__PURE__ */ (0,
|
|
10768
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "mt-3 pt-2 border-t border-gray-200 dark:border-gray-700", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex flex-wrap gap-3 text-xs text-gray-500 dark:text-gray-400", children: [
|
|
10769
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
10770
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-2 h-2 rounded-sm bg-blue-500" }),
|
|
10771
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { children: "Current" })
|
|
10361
10772
|
] }),
|
|
10362
|
-
/* @__PURE__ */ (0,
|
|
10363
|
-
/* @__PURE__ */ (0,
|
|
10364
|
-
/* @__PURE__ */ (0,
|
|
10773
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
10774
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-2 h-2 rounded-sm bg-green-400" }),
|
|
10775
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { children: "Visited" })
|
|
10365
10776
|
] }),
|
|
10366
|
-
/* @__PURE__ */ (0,
|
|
10367
|
-
/* @__PURE__ */ (0,
|
|
10368
|
-
/* @__PURE__ */ (0,
|
|
10777
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
10778
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-2 h-2 rounded-sm bg-yellow-400" }),
|
|
10779
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { children: "Bookmarked" })
|
|
10369
10780
|
] })
|
|
10370
10781
|
] }) }),
|
|
10371
|
-
/* @__PURE__ */ (0,
|
|
10782
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "mt-2 text-xs text-gray-500 dark:text-gray-400", children: [
|
|
10372
10783
|
visitedCount,
|
|
10373
10784
|
" of ",
|
|
10374
10785
|
numPages,
|
|
@@ -10376,7 +10787,7 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10376
10787
|
] })
|
|
10377
10788
|
] });
|
|
10378
10789
|
if (variant === "floating") {
|
|
10379
|
-
return /* @__PURE__ */ (0,
|
|
10790
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
10380
10791
|
"div",
|
|
10381
10792
|
{
|
|
10382
10793
|
className: cn(
|
|
@@ -10392,13 +10803,13 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10392
10803
|
),
|
|
10393
10804
|
style: { maxHeight },
|
|
10394
10805
|
children: [
|
|
10395
|
-
/* @__PURE__ */ (0,
|
|
10806
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("h3", { className: "text-sm font-semibold text-gray-700 dark:text-gray-200 mb-2", children: "Reading Progress" }),
|
|
10396
10807
|
content
|
|
10397
10808
|
]
|
|
10398
10809
|
}
|
|
10399
10810
|
);
|
|
10400
10811
|
}
|
|
10401
|
-
return /* @__PURE__ */ (0,
|
|
10812
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
10402
10813
|
"div",
|
|
10403
10814
|
{
|
|
10404
10815
|
className: cn(
|
|
@@ -10412,11 +10823,14 @@ var Minimap = (0, import_react48.memo)(function Minimap2({
|
|
|
10412
10823
|
);
|
|
10413
10824
|
});
|
|
10414
10825
|
|
|
10826
|
+
// src/components/index.ts
|
|
10827
|
+
init_FloatingZoomControls2();
|
|
10828
|
+
|
|
10415
10829
|
// src/components/ErrorBoundary/PDFErrorBoundary.tsx
|
|
10416
|
-
var
|
|
10830
|
+
var import_react50 = require("react");
|
|
10417
10831
|
init_utils();
|
|
10418
|
-
var
|
|
10419
|
-
var PDFErrorBoundary = class extends
|
|
10832
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
10833
|
+
var PDFErrorBoundary = class extends import_react50.Component {
|
|
10420
10834
|
constructor(props) {
|
|
10421
10835
|
super(props);
|
|
10422
10836
|
this.handleReset = () => {
|
|
@@ -10443,7 +10857,7 @@ var PDFErrorBoundary = class extends import_react49.Component {
|
|
|
10443
10857
|
return fallback;
|
|
10444
10858
|
}
|
|
10445
10859
|
if (showDefaultUI) {
|
|
10446
|
-
return /* @__PURE__ */ (0,
|
|
10860
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
10447
10861
|
DefaultErrorUI,
|
|
10448
10862
|
{
|
|
10449
10863
|
error,
|
|
@@ -10462,7 +10876,7 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10462
10876
|
const isNetworkError = error.message.includes("fetch") || error.message.includes("network") || error.message.includes("Failed to load");
|
|
10463
10877
|
let title = "Something went wrong";
|
|
10464
10878
|
let description = error.message;
|
|
10465
|
-
let icon = /* @__PURE__ */ (0,
|
|
10879
|
+
let icon = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("svg", { className: "w-12 h-12 text-red-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
10466
10880
|
"path",
|
|
10467
10881
|
{
|
|
10468
10882
|
strokeLinecap: "round",
|
|
@@ -10474,7 +10888,7 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10474
10888
|
if (isPDFError) {
|
|
10475
10889
|
title = "Unable to load PDF";
|
|
10476
10890
|
description = "The PDF file could not be loaded. It may be corrupted or in an unsupported format.";
|
|
10477
|
-
icon = /* @__PURE__ */ (0,
|
|
10891
|
+
icon = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("svg", { className: "w-12 h-12 text-red-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
10478
10892
|
"path",
|
|
10479
10893
|
{
|
|
10480
10894
|
strokeLinecap: "round",
|
|
@@ -10486,7 +10900,7 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10486
10900
|
} else if (isNetworkError) {
|
|
10487
10901
|
title = "Network error";
|
|
10488
10902
|
description = "Unable to fetch the PDF file. Please check your internet connection and try again.";
|
|
10489
|
-
icon = /* @__PURE__ */ (0,
|
|
10903
|
+
icon = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("svg", { className: "w-12 h-12 text-red-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
10490
10904
|
"path",
|
|
10491
10905
|
{
|
|
10492
10906
|
strokeLinecap: "round",
|
|
@@ -10496,7 +10910,7 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10496
10910
|
}
|
|
10497
10911
|
) });
|
|
10498
10912
|
}
|
|
10499
|
-
return /* @__PURE__ */ (0,
|
|
10913
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
10500
10914
|
"div",
|
|
10501
10915
|
{
|
|
10502
10916
|
className: cn(
|
|
@@ -10509,14 +10923,14 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10509
10923
|
),
|
|
10510
10924
|
children: [
|
|
10511
10925
|
icon,
|
|
10512
|
-
/* @__PURE__ */ (0,
|
|
10513
|
-
/* @__PURE__ */ (0,
|
|
10514
|
-
/* @__PURE__ */ (0,
|
|
10515
|
-
/* @__PURE__ */ (0,
|
|
10516
|
-
/* @__PURE__ */ (0,
|
|
10926
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h2", { className: "mt-4 text-xl font-semibold text-gray-900 dark:text-gray-100", children: title }),
|
|
10927
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("p", { className: "mt-2 text-sm text-gray-600 dark:text-gray-400 max-w-md", children: description }),
|
|
10928
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("details", { className: "mt-4 text-left max-w-md w-full", children: [
|
|
10929
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("summary", { className: "cursor-pointer text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: "Technical details" }),
|
|
10930
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("pre", { className: "mt-2 p-2 bg-gray-100 dark:bg-gray-800 rounded text-xs overflow-auto", children: error.stack || error.message })
|
|
10517
10931
|
] }),
|
|
10518
|
-
/* @__PURE__ */ (0,
|
|
10519
|
-
/* @__PURE__ */ (0,
|
|
10932
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "mt-6 flex gap-3", children: [
|
|
10933
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
10520
10934
|
"button",
|
|
10521
10935
|
{
|
|
10522
10936
|
onClick: onReset,
|
|
@@ -10530,7 +10944,7 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10530
10944
|
children: "Try again"
|
|
10531
10945
|
}
|
|
10532
10946
|
),
|
|
10533
|
-
/* @__PURE__ */ (0,
|
|
10947
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
10534
10948
|
"button",
|
|
10535
10949
|
{
|
|
10536
10950
|
onClick: () => window.location.reload(),
|
|
@@ -10550,7 +10964,7 @@ function DefaultErrorUI({ error, onReset, className }) {
|
|
|
10550
10964
|
);
|
|
10551
10965
|
}
|
|
10552
10966
|
function withErrorBoundary({ component, ...props }) {
|
|
10553
|
-
return /* @__PURE__ */ (0,
|
|
10967
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(PDFErrorBoundary, { ...props, children: component });
|
|
10554
10968
|
}
|
|
10555
10969
|
|
|
10556
10970
|
// src/index.ts
|
|
@@ -10574,6 +10988,7 @@ init_utils();
|
|
|
10574
10988
|
DocumentContainer,
|
|
10575
10989
|
DrawingCanvas,
|
|
10576
10990
|
DualPageContainer,
|
|
10991
|
+
FloatingZoomControls,
|
|
10577
10992
|
FocusRegionLayer,
|
|
10578
10993
|
HighlightLayer,
|
|
10579
10994
|
HighlightPopover,
|