@pdf-viewer/react 1.5.0-beta.1 → 1.5.0-beta.11
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/Popover-b7402893.js +1445 -0
- package/dist/RPDefaultLayout-e1e07d65.js +2960 -0
- package/dist/assets/Checkbox.css +1 -1
- package/dist/assets/Container.css +1 -1
- package/dist/assets/Input.css +1 -1
- package/dist/assets/RPDefaultLayout.css +1 -1
- package/dist/component-1da194e8.js +337 -0
- package/dist/components/RPController.js +21 -28
- package/dist/components/RPPages.js +2 -2
- package/dist/components/RPProvider.js +18 -16
- package/dist/components/layout/Container.js +18 -6
- package/dist/components/layout/LayoutContainer.js +33 -0
- package/dist/components/layout/RPDefaultLayout.js +3 -4
- package/dist/components/layout/sidebar/RPSidebar.js +1 -1
- package/dist/components/layout/sidebar/Thumbnail.js +1 -1
- package/dist/components/layout/sidebar/Thumbnails.js +1 -1
- package/dist/components/layout/toolbar/DocumentDialog.js +2 -3
- package/dist/components/layout/toolbar/FileDownloadTool.js +1 -1
- package/dist/components/layout/toolbar/MenuItem.js +1 -1
- package/dist/components/layout/toolbar/MenuSeparator.js +1 -1
- package/dist/components/layout/toolbar/MostPageTool.js +4 -5
- package/dist/components/layout/toolbar/OtherTool.js +2 -2
- package/dist/components/layout/toolbar/Paginate.js +2 -2
- package/dist/components/layout/toolbar/PrintTool.js +2 -2
- package/dist/components/layout/toolbar/RPToolbar.js +1 -1
- package/dist/components/layout/toolbar/RPToolbarEnd.js +1 -1
- package/dist/components/layout/toolbar/RotateTool.js +1 -1
- package/dist/components/layout/toolbar/ScrollModeTool.js +1 -1
- package/dist/components/layout/toolbar/SearchTool.js +3 -4
- package/dist/components/layout/toolbar/SelectionModeTool.js +1 -1
- package/dist/components/layout/toolbar/ViewModeTool.js +1 -1
- package/dist/components/layout/toolbar/ZoomTool.js +3 -4
- package/dist/components/page/AnnotationLayer.js +2 -3
- package/dist/components/page/CanvasLayer.js +2 -3
- package/dist/components/page/DualPage.js +2 -3
- package/dist/components/page/RPPage.js +2 -3
- package/dist/components/page/SinglePage.js +2 -3
- package/dist/components/page/TextHighlightLayer.js +2 -3
- package/dist/components/page/TextLayer.js +2 -3
- package/dist/components/ui/Checkbox.js +30 -29
- package/dist/components/ui/DropDown.js +1 -1
- package/dist/components/ui/Input.js +12 -12
- package/dist/components/ui/LoadingIndicator.js +1 -1
- package/dist/components/ui/Popover.js +1 -1
- package/dist/components/ui/RPTooltip.js +687 -328
- package/dist/contexts/PaginationContext.js +1 -1
- package/dist/contexts/PrintContext.js +1 -1
- package/dist/contexts/SearchContext.js +1 -1
- package/dist/contexts/ThumbnailsContext.js +1 -1
- package/dist/floating-ui.react-dom-15b9b819.js +1310 -0
- package/dist/index-2e540713.js +23 -0
- package/dist/index-353ec0a6.js +172 -0
- package/dist/index-5ff5dbd0.js +1675 -0
- package/dist/index-71898eb9.js +139 -0
- package/dist/main.js +1 -1
- package/dist/types/components/layout/Container.d.ts +0 -1
- package/dist/types/components/layout/LayoutContainer.d.ts +9 -0
- package/dist/types/components/page/RPPage.d.ts +0 -1
- package/dist/types/utils/calculatePage.d.ts +5 -0
- package/dist/types/utils/hooks/useDebounce.d.ts +1 -1
- package/dist/types/utils/hooks/usePresentPage.d.ts +1 -0
- package/dist/types/utils/hooks/useScrollToPage.d.ts +1 -1
- package/dist/types/utils/hooks/useWatermark.d.ts +1 -1
- package/dist/types/utils/types.d.ts +1 -0
- package/dist/utils/calculatePage.js +8 -0
- package/dist/utils/hooks/useDebounce.js +14 -10
- package/dist/utils/hooks/useFileDownload.js +3 -4
- package/dist/utils/hooks/useLicense.js +1 -1
- package/dist/utils/hooks/useLoadPdf.js +28 -26
- package/dist/utils/hooks/useLoadWorker.js +1 -1
- package/dist/utils/hooks/usePaginate.js +2 -3
- package/dist/utils/hooks/usePresentPage.js +34 -0
- package/dist/utils/hooks/usePrint.js +2 -3
- package/dist/utils/hooks/useScrollToPage.js +2 -3
- package/dist/utils/hooks/useSearch.js +2 -3
- package/dist/utils/hooks/useThumbnail.js +2 -3
- package/dist/utils/hooks/useVirtualReactWindow.js +2 -3
- package/dist/utils/hooks/useWatermark.js +39 -39
- package/dist/utils/types.js +1 -1
- package/package.json +1 -1
- package/dist/Container-82a82a01.js +0 -39
- package/dist/Popover-d11ec15c.js +0 -3061
- package/dist/RPDefaultLayout-13f82fd9.js +0 -2914
- package/dist/contexts/ScrollStateContext.js +0 -13
- package/dist/floating-ui.react-dom-88a86594.js +0 -1447
- package/dist/index-48ca3f30.js +0 -307
- package/dist/index-4ba3ab9a.js +0 -1877
- package/dist/types/contexts/ScrollStateContext.d.ts +0 -8
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
import * as i from "react";
|
|
2
|
+
import { jsx as C } from "react/jsx-runtime";
|
|
3
|
+
function m(e, n) {
|
|
4
|
+
const t = i.createContext(n), r = (s) => {
|
|
5
|
+
const { children: o, ...c } = s, a = i.useMemo(() => c, Object.values(c));
|
|
6
|
+
return /* @__PURE__ */ C(t.Provider, { value: a, children: o });
|
|
7
|
+
};
|
|
8
|
+
r.displayName = e + "Provider";
|
|
9
|
+
function u(s) {
|
|
10
|
+
const o = i.useContext(t);
|
|
11
|
+
if (o)
|
|
12
|
+
return o;
|
|
13
|
+
if (n !== void 0)
|
|
14
|
+
return n;
|
|
15
|
+
throw new Error(`\`${s}\` must be used within \`${e}\``);
|
|
16
|
+
}
|
|
17
|
+
return [r, u];
|
|
18
|
+
}
|
|
19
|
+
function E(e, n = []) {
|
|
20
|
+
let t = [];
|
|
21
|
+
function r(s, o) {
|
|
22
|
+
const c = i.createContext(o), a = t.length;
|
|
23
|
+
t = [...t, o];
|
|
24
|
+
const f = (d) => {
|
|
25
|
+
var b;
|
|
26
|
+
const { scope: l, children: S, ...v } = d, h = ((b = l == null ? void 0 : l[e]) == null ? void 0 : b[a]) || c, z = i.useMemo(() => v, Object.values(v));
|
|
27
|
+
return /* @__PURE__ */ C(h.Provider, { value: z, children: S });
|
|
28
|
+
};
|
|
29
|
+
f.displayName = s + "Provider";
|
|
30
|
+
function x(d, l) {
|
|
31
|
+
var h;
|
|
32
|
+
const S = ((h = l == null ? void 0 : l[e]) == null ? void 0 : h[a]) || c, v = i.useContext(S);
|
|
33
|
+
if (v)
|
|
34
|
+
return v;
|
|
35
|
+
if (o !== void 0)
|
|
36
|
+
return o;
|
|
37
|
+
throw new Error(`\`${d}\` must be used within \`${s}\``);
|
|
38
|
+
}
|
|
39
|
+
return [f, x];
|
|
40
|
+
}
|
|
41
|
+
const u = () => {
|
|
42
|
+
const s = t.map((o) => i.createContext(o));
|
|
43
|
+
return function(c) {
|
|
44
|
+
const a = (c == null ? void 0 : c[e]) || s;
|
|
45
|
+
return i.useMemo(
|
|
46
|
+
() => ({ [`__scope${e}`]: { ...c, [e]: a } }),
|
|
47
|
+
[c, a]
|
|
48
|
+
);
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
return u.scopeName = e, [r, P(u, ...n)];
|
|
52
|
+
}
|
|
53
|
+
function P(...e) {
|
|
54
|
+
const n = e[0];
|
|
55
|
+
if (e.length === 1)
|
|
56
|
+
return n;
|
|
57
|
+
const t = () => {
|
|
58
|
+
const r = e.map((u) => ({
|
|
59
|
+
useScope: u(),
|
|
60
|
+
scopeName: u.scopeName
|
|
61
|
+
}));
|
|
62
|
+
return function(s) {
|
|
63
|
+
const o = r.reduce((c, { useScope: a, scopeName: f }) => {
|
|
64
|
+
const d = a(s)[`__scope${f}`];
|
|
65
|
+
return { ...c, ...d };
|
|
66
|
+
}, {});
|
|
67
|
+
return i.useMemo(() => ({ [`__scope${n.scopeName}`]: o }), [o]);
|
|
68
|
+
};
|
|
69
|
+
};
|
|
70
|
+
return t.scopeName = n.scopeName, t;
|
|
71
|
+
}
|
|
72
|
+
function y(e) {
|
|
73
|
+
const n = i.useRef(e);
|
|
74
|
+
return i.useEffect(() => {
|
|
75
|
+
n.current = e;
|
|
76
|
+
}), i.useMemo(() => (...t) => {
|
|
77
|
+
var r;
|
|
78
|
+
return (r = n.current) == null ? void 0 : r.call(n, ...t);
|
|
79
|
+
}, []);
|
|
80
|
+
}
|
|
81
|
+
var g = globalThis != null && globalThis.document ? i.useLayoutEffect : () => {
|
|
82
|
+
};
|
|
83
|
+
function $(e) {
|
|
84
|
+
const [n, t] = i.useState(void 0);
|
|
85
|
+
return g(() => {
|
|
86
|
+
if (e) {
|
|
87
|
+
t({ width: e.offsetWidth, height: e.offsetHeight });
|
|
88
|
+
const r = new ResizeObserver((u) => {
|
|
89
|
+
if (!Array.isArray(u) || !u.length)
|
|
90
|
+
return;
|
|
91
|
+
const s = u[0];
|
|
92
|
+
let o, c;
|
|
93
|
+
if ("borderBoxSize" in s) {
|
|
94
|
+
const a = s.borderBoxSize, f = Array.isArray(a) ? a[0] : a;
|
|
95
|
+
o = f.inlineSize, c = f.blockSize;
|
|
96
|
+
} else
|
|
97
|
+
o = e.offsetWidth, c = e.offsetHeight;
|
|
98
|
+
t({ width: o, height: c });
|
|
99
|
+
});
|
|
100
|
+
return r.observe(e, { box: "border-box" }), () => r.unobserve(e);
|
|
101
|
+
} else
|
|
102
|
+
t(void 0);
|
|
103
|
+
}, [e]), n;
|
|
104
|
+
}
|
|
105
|
+
function _({
|
|
106
|
+
prop: e,
|
|
107
|
+
defaultProp: n,
|
|
108
|
+
onChange: t = () => {
|
|
109
|
+
}
|
|
110
|
+
}) {
|
|
111
|
+
const [r, u] = p({ defaultProp: n, onChange: t }), s = e !== void 0, o = s ? e : r, c = y(t), a = i.useCallback(
|
|
112
|
+
(f) => {
|
|
113
|
+
if (s) {
|
|
114
|
+
const d = typeof f == "function" ? f(e) : f;
|
|
115
|
+
d !== e && c(d);
|
|
116
|
+
} else
|
|
117
|
+
u(f);
|
|
118
|
+
},
|
|
119
|
+
[s, e, u, c]
|
|
120
|
+
);
|
|
121
|
+
return [o, a];
|
|
122
|
+
}
|
|
123
|
+
function p({
|
|
124
|
+
defaultProp: e,
|
|
125
|
+
onChange: n
|
|
126
|
+
}) {
|
|
127
|
+
const t = i.useState(e), [r] = t, u = i.useRef(r), s = y(n);
|
|
128
|
+
return i.useEffect(() => {
|
|
129
|
+
u.current !== r && (s(r), u.current = r);
|
|
130
|
+
}, [r, u, s]), t;
|
|
131
|
+
}
|
|
132
|
+
export {
|
|
133
|
+
g as a,
|
|
134
|
+
_ as b,
|
|
135
|
+
E as c,
|
|
136
|
+
$ as d,
|
|
137
|
+
m as e,
|
|
138
|
+
y as u
|
|
139
|
+
};
|
package/dist/main.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { RPProvider as t } from "./components/RPProvider.js";
|
|
2
|
-
import { b as x, R as n, c as s, u as m, d as p, e as f } from "./RPDefaultLayout-
|
|
2
|
+
import { b as x, R as n, c as s, u as m, d as p, e as f } from "./RPDefaultLayout-e1e07d65.js";
|
|
3
3
|
import { RPConfig as a } from "./components/RPConfig.js";
|
|
4
4
|
import { RPController as l } from "./components/RPController.js";
|
|
5
5
|
import { RPTheme as P } from "./components/RPTheme.js";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
interface Props {
|
|
2
|
+
toolbarRef: HTMLDivElement | null;
|
|
3
|
+
className?: string;
|
|
4
|
+
style?: React.CSSProperties;
|
|
5
|
+
}
|
|
6
|
+
export declare const LayoutContainer: import('react').ForwardRefExoticComponent<Props & {
|
|
7
|
+
children?: import('react').ReactNode | undefined;
|
|
8
|
+
} & import('react').RefAttributes<HTMLDivElement>>;
|
|
9
|
+
export {};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
interface Props extends React.HTMLAttributes<HTMLDivElement> {
|
|
2
2
|
pageNumber: number;
|
|
3
|
-
onIntersectRatioChange: (page: number, ratio: number) => void;
|
|
4
3
|
}
|
|
5
4
|
export declare const RPPage: import('react').ForwardRefExoticComponent<Props & import('react').RefAttributes<HTMLDivElement>>;
|
|
6
5
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare function useDebounce<T = string>(value: T, delay: number): T;
|
|
1
|
+
export declare function useDebounce<T = string>(value: T, delay: number, maxWait?: number): T;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const usePresentPage: (totalColumns: number, totalRows: number, element?: HTMLElement) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const useWatermark: () => void;
|
|
1
|
+
export declare const useWatermark: (sourceId?: string | number) => void;
|
|
@@ -441,6 +441,7 @@ export declare enum ThemeVariables {
|
|
|
441
441
|
DROP_ZONE_BACKGROUND_COLOR = "--rp-drop-zone-background-color",
|
|
442
442
|
CHECKBOX_BORDER_RADIUS = "--rp-checkbox-border-radius",
|
|
443
443
|
CHECKBOX_BORDER_COLOR = "--rp-checkbox-border-color",
|
|
444
|
+
CHECKBOX_INDICATOR_COLOR = "--rp-checkbox-indicator-color",
|
|
444
445
|
HIGHLIGHT_BACKGROUND_COLOR = "--rp-highlight-background-color",
|
|
445
446
|
TEXT_LAYER_HIGHLIGHT_BORDER_RADIUS = "--rp-text-layer-highlight-border-radius",
|
|
446
447
|
CURRENT_HIGHLIGHT_BACKGROUND_COLOR = "--rp-current-highlight-background-color",
|
|
@@ -1,15 +1,19 @@
|
|
|
1
|
-
import { useState as
|
|
2
|
-
function
|
|
3
|
-
const [
|
|
4
|
-
return
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { useState as i, useRef as l, useEffect as f } from "react";
|
|
2
|
+
function T(t, u, r) {
|
|
3
|
+
const [c, n] = i(t), e = l(null);
|
|
4
|
+
return f(() => {
|
|
5
|
+
const o = t;
|
|
6
|
+
r && !e.current && (e.current = setTimeout(() => {
|
|
7
|
+
n(o), e.current = null;
|
|
8
|
+
}, r));
|
|
9
|
+
const s = setTimeout(() => {
|
|
10
|
+
e.current && (clearTimeout(e.current), e.current = null), n(t);
|
|
11
|
+
}, u);
|
|
8
12
|
return () => {
|
|
9
|
-
clearTimeout(
|
|
13
|
+
clearTimeout(s);
|
|
10
14
|
};
|
|
11
|
-
}, [
|
|
15
|
+
}, [t, u, r]), c;
|
|
12
16
|
}
|
|
13
17
|
export {
|
|
14
|
-
|
|
18
|
+
T as useDebounce
|
|
15
19
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "react/jsx-runtime";
|
|
2
|
-
import "../../contexts/RPDocumentContext.js";
|
|
3
2
|
import "react";
|
|
4
|
-
import
|
|
3
|
+
import "../../contexts/RPDocumentContext.js";
|
|
4
|
+
import { c as C } from "../../RPDefaultLayout-e1e07d65.js";
|
|
5
5
|
import "../../contexts/DarkModeContext.js";
|
|
6
6
|
import "../../contexts/RotationContext.js";
|
|
7
7
|
import "../../contexts/LayerContext.js";
|
|
@@ -10,7 +10,6 @@ import "../../contexts/ViewModeContext.js";
|
|
|
10
10
|
import "../../contexts/ScrollModeContext.js";
|
|
11
11
|
import "../../contexts/VirtualScrollContext.js";
|
|
12
12
|
import "../../contexts/VirtualGridContext.js";
|
|
13
|
-
import "../../contexts/ScrollStateContext.js";
|
|
14
13
|
import "../../contexts/SelectionModeContext.js";
|
|
15
14
|
import "../../contexts/InitialStateContext.js";
|
|
16
15
|
import "../../contexts/FullScreenContext.js";
|
|
@@ -29,5 +28,5 @@ import "../../contexts/ThemeContext.js";
|
|
|
29
28
|
import "../../components/RPDropFileZone.js";
|
|
30
29
|
import "../../contexts/ToolbarComponentContext.js";
|
|
31
30
|
export {
|
|
32
|
-
|
|
31
|
+
C as useFileDownload
|
|
33
32
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useState as E, useCallback as h, useEffect as A } from "react";
|
|
2
2
|
import { appConsole as c } from "../appConsole.js";
|
|
3
|
-
const b = /* @__PURE__ */ new Date("2025-
|
|
3
|
+
const b = /* @__PURE__ */ new Date("2025-05-06T03:28:01.043Z"), l = "Please visit https://www.react-pdf.dev/manage-license/ to generate a new license key.", o = {
|
|
4
4
|
invalidLicense: `You are currently using without a valid license. ${l}`,
|
|
5
5
|
mismatchedDomain: `Your license key is not valid for the current domain / IP. ${l}`,
|
|
6
6
|
expired: `Your license key has expired. ${l}`,
|
|
@@ -1,36 +1,38 @@
|
|
|
1
|
-
import { useState as
|
|
2
|
-
import * as
|
|
3
|
-
import { getThumbnailViewport as
|
|
4
|
-
import { useConfigContext as
|
|
5
|
-
const
|
|
6
|
-
const [r,
|
|
7
|
-
return
|
|
8
|
-
if (!
|
|
1
|
+
import { useState as u, useRef as x, useEffect as L } from "react";
|
|
2
|
+
import * as p from "pdfjs-dist";
|
|
3
|
+
import { getThumbnailViewport as E } from "../getThumbnailViewport.js";
|
|
4
|
+
import { useConfigContext as I } from "../../contexts/ConfigContext.js";
|
|
5
|
+
const V = (d, e, y = {}) => {
|
|
6
|
+
const [r, C] = u(), { workerUrlAdded: w } = I(), [T, b] = u(/* @__PURE__ */ new Map()), i = x(), [j, f] = u(0), [g, k] = u(!1), { onLoadError: m, onLoaded: a } = y;
|
|
7
|
+
return L(() => {
|
|
8
|
+
if (!w || !d)
|
|
9
9
|
return;
|
|
10
10
|
i.current = Date.now();
|
|
11
11
|
const t = i.current, P = {
|
|
12
12
|
url: d,
|
|
13
13
|
cMapPacked: (e == null ? void 0 : e.isCompressed) ?? !0,
|
|
14
14
|
...(e == null ? void 0 : e.url) && { cMapUrl: e.url }
|
|
15
|
-
}
|
|
15
|
+
};
|
|
16
|
+
console.log("currently pdfjs version", p.version, p);
|
|
17
|
+
const n = p.getDocument(P);
|
|
16
18
|
n.onProgress = (o) => {
|
|
17
19
|
if (t === i.current) {
|
|
18
|
-
const { loaded: c, total:
|
|
19
|
-
|
|
20
|
+
const { loaded: c, total: l } = o, v = l ? Math.min(100, Math.round(c / l * 100)) : 0;
|
|
21
|
+
f(v);
|
|
20
22
|
}
|
|
21
|
-
},
|
|
22
|
-
const s = n.promise.then((o) => (t === i.current && (
|
|
23
|
-
|
|
24
|
-
}).finally(() =>
|
|
23
|
+
}, k(!0), f(0);
|
|
24
|
+
const s = n.promise.then((o) => (t === i.current && (C(o), f(100)), a && a(o), o)).catch((o) => {
|
|
25
|
+
m && m(o);
|
|
26
|
+
}).finally(() => k(!1));
|
|
25
27
|
return () => {
|
|
26
28
|
s.finally(() => {
|
|
27
29
|
n.destroy();
|
|
28
30
|
});
|
|
29
31
|
};
|
|
30
|
-
}, [d,
|
|
32
|
+
}, [d, w, m, a]), L(() => {
|
|
31
33
|
const t = /* @__PURE__ */ new Map();
|
|
32
|
-
if (!r ||
|
|
33
|
-
|
|
34
|
+
if (!r || g) {
|
|
35
|
+
b(t);
|
|
34
36
|
return;
|
|
35
37
|
}
|
|
36
38
|
const P = r.numPages, n = [];
|
|
@@ -40,17 +42,17 @@ const A = (d, e, L = {}) => {
|
|
|
40
42
|
}
|
|
41
43
|
Promise.all(n).then((s) => {
|
|
42
44
|
s.map((o) => {
|
|
43
|
-
const { thumbnailViewport: c, scale:
|
|
44
|
-
t.set(o.pageNumber, { page: o, thumbnailViewport: c, thumbnailScale:
|
|
45
|
-
}),
|
|
45
|
+
const { thumbnailViewport: c, scale: l } = E(o);
|
|
46
|
+
t.set(o.pageNumber, { page: o, thumbnailViewport: c, thumbnailScale: l });
|
|
47
|
+
}), b(t);
|
|
46
48
|
});
|
|
47
|
-
}, [r,
|
|
49
|
+
}, [r, g]), {
|
|
48
50
|
pdf: r,
|
|
49
|
-
pages:
|
|
50
|
-
loading:
|
|
51
|
-
loadingProgress:
|
|
51
|
+
pages: T,
|
|
52
|
+
loading: g,
|
|
53
|
+
loadingProgress: j
|
|
52
54
|
};
|
|
53
55
|
};
|
|
54
56
|
export {
|
|
55
|
-
|
|
57
|
+
V as useLoadPdf
|
|
56
58
|
};
|