@nypl/web-reader 4.3.1 → 4.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -15
- package/dist/index.css +244 -58
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +3716 -4554
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3731 -4561
- package/dist/index.mjs.map +1 -1
- package/package.json +70 -69
package/README.md
CHANGED
|
@@ -51,7 +51,6 @@ const ReaderPage = ({ manifestUrl }) => {
|
|
|
51
51
|
```
|
|
52
52
|
|
|
53
53
|
- [More React examples](/example/index.tsx) - Includes examples that render EPUB2 & EPUB3 based webpubs, remote hosted webpubs, and PDFs
|
|
54
|
-
- [Encrypted example](/example/axisnow-encrypted.tsx) - How to pass an content decryptor to the web-reader to render encrypted content
|
|
55
54
|
- [usePDFReader hook example](/example/use-pdf-reader.tsx) - Useful for instances when you know you're only going to be using the web-reader to open PDFs
|
|
56
55
|
- [useHTMLReader hook example](/example/use-html-reader.tsx) - Useful for cases when you know you're only going to be using the web-reader to read EPUBs
|
|
57
56
|
- [Real-world example: Open eBooks Web](https://github.com/NYPL/ereading-clients/blob/staging/apps/oew/src/components/theme-ui/WebReader.tsx) - NYPL application for children to read books on the web. This demonstrates how encrypted AxisNow content is passed to the web-reader.
|
|
@@ -255,16 +254,6 @@ The web reader does support DRM via two possible routes:
|
|
|
255
254
|
1. The default Readium suggested method is to have a server-side "streamer" between the content server and the application. This server would fetch the encrypted DRM content, decrypt it, and then serve the decrypted assets individually to the client alongside a webpub manifest pointing to these decrypted assets. One example of such a streamer is [readium/r2-streamer-js](https://github.com/readium/r2-streamer-js).
|
|
256
255
|
1. If decryption cannot be performed in a streamer, the web-reader can support client-side decryption of licensed content. This is done by passing a `getContent` function to either the `<WebReader>` component or the `useWebReader` hook. It has the type signature `(resourceUrl: string) => Promise<string>`, and can thus be used to fetch and decrypt (or otherwise manipulate) content before it is passed to the iframe for rendering.
|
|
257
256
|
|
|
258
|
-
The `AxisNow Encrypted EPUB` example shows how this is done using the private NYPL AxisNow decryptor. The AxisNow scheme is a specific DRM technique not publicly available and the repo and code for the decryptor cannot be shared. Thus this example will not work for the public, but you can read the example code to see how we use the private `Decryptor` package to:
|
|
259
|
-
|
|
260
|
-
- Create a Web Worker using [Comlink](https://github.com/GoogleChromeLabs/comlink) that will perform the fetching and decryption. This should help keep the main thread free while those heavy tasks are performed.
|
|
261
|
-
- Fetch content from the network
|
|
262
|
-
- Decrypt the HTML content
|
|
263
|
-
- Search for embedded CSS and image assets
|
|
264
|
-
- Fetch those assets and decrypt them
|
|
265
|
-
- Re-embed the decrypted CSS and image assets as Object URLs into the decrypted HTML document
|
|
266
|
-
- Return the HTML string with fully decrypted reources for the web-reader to render in the iframe
|
|
267
|
-
|
|
268
257
|
## Getting Started
|
|
269
258
|
|
|
270
259
|
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See [Publishing to NPM](#publishing-to-npm) for notes on how to publish a new version to NPM.
|
|
@@ -273,8 +262,6 @@ These instructions will get you a copy of the project up and running on your loc
|
|
|
273
262
|
|
|
274
263
|
1. Before getting started, be sure to run `npm install`.
|
|
275
264
|
|
|
276
|
-
If you are internal to NYPL you can be added to the private `@nypl-simplified-packages/axisnow-access-control-web` package, which is required in order to open the AxisNow Encrypted EPUB example. If you decide to install this package, you'll also need to generate a Personal Access Token in GitHub with `read` permissions and run `GH_PACKAGE_AUTH_TOKEN=<your-token-here> npm install`.
|
|
277
|
-
|
|
278
265
|
2. In order to open any of the PDF examples in the Example App, you'll need to allow urls in a `WebpubManifest` to be proxied. This is done by passing a `proxyUrl` to the `<WebReader>` component. In order to do that, you must have a proxy running somewhere.
|
|
279
266
|
|
|
280
267
|
We have set up a small express-based CORS proxy that can be run for local development.
|
|
@@ -283,8 +270,6 @@ We have set up a small express-based CORS proxy that can be run for local develo
|
|
|
283
270
|
- Pass the proxy url to the example app by setting the following env var in a `.env` file at the root of the project: `CORS_PROXY_URL="http://localhost:3001/?requestUrl="`.
|
|
284
271
|
- In a separate terminal session, start the example app: `npm run example`.
|
|
285
272
|
|
|
286
|
-
3. In order to open the AxisNow Encrypted EPUB example (`/html/axisnow-encrypted`), you will need to have `process.env.VAULT_UUID` and `process.env.ISBN` set in your `.env` file. Read [example/README.txt](/example/README.txt) for more info.
|
|
287
|
-
|
|
288
273
|
### Running the Example App
|
|
289
274
|
|
|
290
275
|
To run the example app for local development:
|
package/dist/index.css
CHANGED
|
@@ -1,9 +1,65 @@
|
|
|
1
1
|
/* node_modules/react-pdf/dist/esm/Page/AnnotationLayer.css */
|
|
2
|
+
:root {
|
|
3
|
+
--react-pdf-annotation-layer: 1;
|
|
4
|
+
--annotation-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
|
|
5
|
+
--input-focus-border-color: Highlight;
|
|
6
|
+
--input-focus-outline: 1px solid Canvas;
|
|
7
|
+
--input-unfocused-border-color: transparent;
|
|
8
|
+
--input-disabled-border-color: transparent;
|
|
9
|
+
--input-hover-border-color: black;
|
|
10
|
+
--link-outline: none;
|
|
11
|
+
}
|
|
12
|
+
@media screen and (forced-colors: active) {
|
|
13
|
+
:root {
|
|
14
|
+
--input-focus-border-color: CanvasText;
|
|
15
|
+
--input-unfocused-border-color: ActiveText;
|
|
16
|
+
--input-disabled-border-color: GrayText;
|
|
17
|
+
--input-hover-border-color: Highlight;
|
|
18
|
+
--link-outline: 1.5px solid LinkText;
|
|
19
|
+
}
|
|
20
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea):required,
|
|
21
|
+
.annotationLayer .choiceWidgetAnnotation select:required,
|
|
22
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required {
|
|
23
|
+
outline: 1.5px solid selectedItem;
|
|
24
|
+
}
|
|
25
|
+
.annotationLayer .linkAnnotation:hover {
|
|
26
|
+
backdrop-filter: invert(100%);
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
.annotationLayer {
|
|
30
|
+
position: absolute;
|
|
31
|
+
top: 0;
|
|
32
|
+
left: 0;
|
|
33
|
+
pointer-events: none;
|
|
34
|
+
transform-origin: 0 0;
|
|
35
|
+
z-index: 3;
|
|
36
|
+
}
|
|
37
|
+
.annotationLayer[data-main-rotation="90"] .norotate {
|
|
38
|
+
transform: rotate(270deg) translateX(-100%);
|
|
39
|
+
}
|
|
40
|
+
.annotationLayer[data-main-rotation="180"] .norotate {
|
|
41
|
+
transform: rotate(180deg) translate(-100%, -100%);
|
|
42
|
+
}
|
|
43
|
+
.annotationLayer[data-main-rotation="270"] .norotate {
|
|
44
|
+
transform: rotate(90deg) translateY(-100%);
|
|
45
|
+
}
|
|
46
|
+
.annotationLayer canvas {
|
|
47
|
+
position: absolute;
|
|
48
|
+
width: 100%;
|
|
49
|
+
height: 100%;
|
|
50
|
+
}
|
|
2
51
|
.annotationLayer section {
|
|
3
52
|
position: absolute;
|
|
53
|
+
text-align: initial;
|
|
54
|
+
pointer-events: auto;
|
|
55
|
+
box-sizing: border-box;
|
|
56
|
+
margin: 0;
|
|
57
|
+
transform-origin: 0 0;
|
|
4
58
|
}
|
|
5
|
-
.annotationLayer .linkAnnotation
|
|
6
|
-
|
|
59
|
+
.annotationLayer .linkAnnotation {
|
|
60
|
+
outline: var(--link-outline);
|
|
61
|
+
}
|
|
62
|
+
.annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton) > a {
|
|
7
63
|
position: absolute;
|
|
8
64
|
font-size: 1em;
|
|
9
65
|
top: 0;
|
|
@@ -11,31 +67,36 @@
|
|
|
11
67
|
width: 100%;
|
|
12
68
|
height: 100%;
|
|
13
69
|
}
|
|
14
|
-
.annotationLayer .linkAnnotation > a:hover
|
|
15
|
-
.annotationLayer .buttonWidgetAnnotation.pushButton > a:hover {
|
|
70
|
+
.annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton) > a:hover {
|
|
16
71
|
opacity: 0.2;
|
|
17
|
-
background:
|
|
18
|
-
box-shadow:
|
|
72
|
+
background: rgba(255, 255, 0, 1);
|
|
73
|
+
box-shadow: 0 2px 10px rgba(255, 255, 0, 1);
|
|
19
74
|
}
|
|
20
75
|
.annotationLayer .textAnnotation img {
|
|
21
76
|
position: absolute;
|
|
22
77
|
cursor: pointer;
|
|
78
|
+
width: 100%;
|
|
79
|
+
height: 100%;
|
|
80
|
+
top: 0;
|
|
81
|
+
left: 0;
|
|
23
82
|
}
|
|
24
|
-
.annotationLayer .textWidgetAnnotation input,
|
|
25
|
-
.annotationLayer .textWidgetAnnotation textarea,
|
|
83
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea),
|
|
26
84
|
.annotationLayer .choiceWidgetAnnotation select,
|
|
27
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
border: 1px solid transparent;
|
|
85
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input {
|
|
86
|
+
background-image: var(--annotation-unfocused-field-background);
|
|
87
|
+
border: 2px solid var(--input-unfocused-border-color);
|
|
31
88
|
box-sizing: border-box;
|
|
32
|
-
font
|
|
89
|
+
font: calc(9px * var(--scale-factor)) sans-serif;
|
|
33
90
|
height: 100%;
|
|
34
91
|
margin: 0;
|
|
35
|
-
padding: 0 3px;
|
|
36
92
|
vertical-align: top;
|
|
37
93
|
width: 100%;
|
|
38
94
|
}
|
|
95
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea):required,
|
|
96
|
+
.annotationLayer .choiceWidgetAnnotation select:required,
|
|
97
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required {
|
|
98
|
+
outline: 1.5px solid red;
|
|
99
|
+
}
|
|
39
100
|
.annotationLayer .choiceWidgetAnnotation select option {
|
|
40
101
|
padding: 0;
|
|
41
102
|
}
|
|
@@ -43,53 +104,66 @@
|
|
|
43
104
|
border-radius: 50%;
|
|
44
105
|
}
|
|
45
106
|
.annotationLayer .textWidgetAnnotation textarea {
|
|
46
|
-
font: message-box;
|
|
47
|
-
font-size: 9px;
|
|
48
107
|
resize: none;
|
|
49
108
|
}
|
|
50
|
-
.annotationLayer .textWidgetAnnotation input[disabled],
|
|
51
|
-
.annotationLayer .textWidgetAnnotation textarea[disabled],
|
|
109
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea)[disabled],
|
|
52
110
|
.annotationLayer .choiceWidgetAnnotation select[disabled],
|
|
53
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled]
|
|
54
|
-
.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] {
|
|
111
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input[disabled] {
|
|
55
112
|
background: none;
|
|
56
|
-
border:
|
|
113
|
+
border: 2px solid var(--input-disabled-border-color);
|
|
57
114
|
cursor: not-allowed;
|
|
58
115
|
}
|
|
59
|
-
.annotationLayer .textWidgetAnnotation input:hover,
|
|
60
|
-
.annotationLayer .
|
|
116
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea):hover,
|
|
117
|
+
.annotationLayer .choiceWidgetAnnotation select:hover,
|
|
118
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:hover {
|
|
119
|
+
border: 2px solid var(--input-hover-border-color);
|
|
120
|
+
}
|
|
121
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea):hover,
|
|
61
122
|
.annotationLayer .choiceWidgetAnnotation select:hover,
|
|
62
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input:hover
|
|
63
|
-
|
|
64
|
-
border: 1px solid #000;
|
|
123
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:hover {
|
|
124
|
+
border-radius: 2px;
|
|
65
125
|
}
|
|
66
|
-
.annotationLayer .textWidgetAnnotation input:focus,
|
|
67
|
-
.annotationLayer .textWidgetAnnotation textarea:focus,
|
|
126
|
+
.annotationLayer .textWidgetAnnotation :is(input, textarea):focus,
|
|
68
127
|
.annotationLayer .choiceWidgetAnnotation select:focus {
|
|
69
128
|
background: none;
|
|
70
|
-
border:
|
|
129
|
+
border: 2px solid var(--input-focus-border-color);
|
|
130
|
+
border-radius: 2px;
|
|
131
|
+
outline: var(--input-focus-outline);
|
|
132
|
+
}
|
|
133
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) :focus {
|
|
134
|
+
background-image: none;
|
|
135
|
+
background-color: transparent;
|
|
136
|
+
}
|
|
137
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox :focus {
|
|
138
|
+
border: 2px solid var(--input-focus-border-color);
|
|
139
|
+
border-radius: 2px;
|
|
140
|
+
outline: var(--input-focus-outline);
|
|
71
141
|
}
|
|
72
|
-
.annotationLayer .buttonWidgetAnnotation.
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
142
|
+
.annotationLayer .buttonWidgetAnnotation.radioButton :focus {
|
|
143
|
+
border: 2px solid var(--input-focus-border-color);
|
|
144
|
+
outline: var(--input-focus-outline);
|
|
145
|
+
}
|
|
146
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,
|
|
147
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after,
|
|
148
|
+
.annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {
|
|
149
|
+
background-color: CanvasText;
|
|
76
150
|
content: "";
|
|
77
151
|
display: block;
|
|
78
152
|
position: absolute;
|
|
79
153
|
}
|
|
80
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked
|
|
81
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked
|
|
154
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,
|
|
155
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {
|
|
82
156
|
height: 80%;
|
|
83
157
|
left: 45%;
|
|
84
158
|
width: 1px;
|
|
85
159
|
}
|
|
86
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked
|
|
160
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before {
|
|
87
161
|
transform: rotate(45deg);
|
|
88
162
|
}
|
|
89
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked
|
|
163
|
+
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {
|
|
90
164
|
transform: rotate(-45deg);
|
|
91
165
|
}
|
|
92
|
-
.annotationLayer .buttonWidgetAnnotation.radioButton input:checked
|
|
166
|
+
.annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {
|
|
93
167
|
border-radius: 50%;
|
|
94
168
|
height: 50%;
|
|
95
169
|
left: 30%;
|
|
@@ -102,45 +176,57 @@
|
|
|
102
176
|
padding-right: 0;
|
|
103
177
|
}
|
|
104
178
|
.annotationLayer .textWidgetAnnotation input.comb:focus {
|
|
105
|
-
width:
|
|
179
|
+
width: 103%;
|
|
106
180
|
}
|
|
107
|
-
.annotationLayer .buttonWidgetAnnotation.checkBox input
|
|
108
|
-
.annotationLayer .buttonWidgetAnnotation.radioButton input {
|
|
181
|
+
.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input {
|
|
109
182
|
appearance: none;
|
|
110
|
-
|
|
183
|
+
}
|
|
184
|
+
.annotationLayer .popupTriggerArea {
|
|
185
|
+
height: 100%;
|
|
186
|
+
width: 100%;
|
|
187
|
+
}
|
|
188
|
+
.annotationLayer .fileAttachmentAnnotation .popupTriggerArea {
|
|
189
|
+
position: absolute;
|
|
111
190
|
}
|
|
112
191
|
.annotationLayer .popupWrapper {
|
|
113
192
|
position: absolute;
|
|
114
|
-
|
|
193
|
+
font-size: calc(9px * var(--scale-factor));
|
|
194
|
+
width: 100%;
|
|
195
|
+
min-width: calc(180px * var(--scale-factor));
|
|
196
|
+
pointer-events: none;
|
|
115
197
|
}
|
|
116
198
|
.annotationLayer .popup {
|
|
117
199
|
position: absolute;
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
margin-left: 5px;
|
|
200
|
+
max-width: calc(180px * var(--scale-factor));
|
|
201
|
+
background-color: rgba(255, 255, 153, 1);
|
|
202
|
+
box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor)) rgba(136, 136, 136, 1);
|
|
203
|
+
border-radius: calc(2px * var(--scale-factor));
|
|
204
|
+
padding: calc(6px * var(--scale-factor));
|
|
205
|
+
margin-left: calc(5px * var(--scale-factor));
|
|
125
206
|
cursor: pointer;
|
|
126
207
|
font: message-box;
|
|
127
|
-
|
|
208
|
+
white-space: normal;
|
|
128
209
|
word-wrap: break-word;
|
|
210
|
+
pointer-events: auto;
|
|
129
211
|
}
|
|
130
212
|
.annotationLayer .popup > * {
|
|
131
|
-
font-size: 9px;
|
|
213
|
+
font-size: calc(9px * var(--scale-factor));
|
|
132
214
|
}
|
|
133
215
|
.annotationLayer .popup h1 {
|
|
134
216
|
display: inline-block;
|
|
135
217
|
}
|
|
136
|
-
.annotationLayer .
|
|
218
|
+
.annotationLayer .popupDate {
|
|
137
219
|
display: inline-block;
|
|
138
|
-
margin-left: 5px;
|
|
220
|
+
margin-left: calc(5px * var(--scale-factor));
|
|
139
221
|
}
|
|
140
|
-
.annotationLayer .
|
|
141
|
-
border-top: 1px solid
|
|
142
|
-
margin-top: 2px;
|
|
143
|
-
padding-top: 2px;
|
|
222
|
+
.annotationLayer .popupContent {
|
|
223
|
+
border-top: 1px solid rgba(51, 51, 51, 1);
|
|
224
|
+
margin-top: calc(2px * var(--scale-factor));
|
|
225
|
+
padding-top: calc(2px * var(--scale-factor));
|
|
226
|
+
}
|
|
227
|
+
.annotationLayer .richText > * {
|
|
228
|
+
white-space: pre-wrap;
|
|
229
|
+
font-size: calc(9px * var(--scale-factor));
|
|
144
230
|
}
|
|
145
231
|
.annotationLayer .highlightAnnotation,
|
|
146
232
|
.annotationLayer .underlineAnnotation,
|
|
@@ -158,6 +244,106 @@
|
|
|
158
244
|
.annotationLayer .fileAttachmentAnnotation {
|
|
159
245
|
cursor: pointer;
|
|
160
246
|
}
|
|
247
|
+
.annotationLayer section svg {
|
|
248
|
+
position: absolute;
|
|
249
|
+
width: 100%;
|
|
250
|
+
height: 100%;
|
|
251
|
+
top: 0;
|
|
252
|
+
left: 0;
|
|
253
|
+
}
|
|
254
|
+
.annotationLayer .annotationTextContent {
|
|
255
|
+
position: absolute;
|
|
256
|
+
width: 100%;
|
|
257
|
+
height: 100%;
|
|
258
|
+
opacity: 0;
|
|
259
|
+
color: transparent;
|
|
260
|
+
user-select: none;
|
|
261
|
+
pointer-events: none;
|
|
262
|
+
}
|
|
263
|
+
.annotationLayer .annotationTextContent span {
|
|
264
|
+
width: 100%;
|
|
265
|
+
display: inline-block;
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
/* node_modules/react-pdf/dist/esm/Page/TextLayer.css */
|
|
269
|
+
:root {
|
|
270
|
+
--react-pdf-text-layer: 1;
|
|
271
|
+
--highlight-bg-color: rgba(180, 0, 170, 1);
|
|
272
|
+
--highlight-selected-bg-color: rgba(0, 100, 0, 1);
|
|
273
|
+
}
|
|
274
|
+
@media screen and (forced-colors: active) {
|
|
275
|
+
:root {
|
|
276
|
+
--highlight-bg-color: Highlight;
|
|
277
|
+
--highlight-selected-bg-color: ButtonText;
|
|
278
|
+
}
|
|
279
|
+
}
|
|
280
|
+
[data-main-rotation="90"] {
|
|
281
|
+
transform: rotate(90deg) translateY(-100%);
|
|
282
|
+
}
|
|
283
|
+
[data-main-rotation="180"] {
|
|
284
|
+
transform: rotate(180deg) translate(-100%, -100%);
|
|
285
|
+
}
|
|
286
|
+
[data-main-rotation="270"] {
|
|
287
|
+
transform: rotate(270deg) translateX(-100%);
|
|
288
|
+
}
|
|
289
|
+
.textLayer {
|
|
290
|
+
position: absolute;
|
|
291
|
+
text-align: initial;
|
|
292
|
+
inset: 0;
|
|
293
|
+
overflow: hidden;
|
|
294
|
+
line-height: 1;
|
|
295
|
+
text-size-adjust: none;
|
|
296
|
+
forced-color-adjust: none;
|
|
297
|
+
transform-origin: 0 0;
|
|
298
|
+
z-index: 2;
|
|
299
|
+
}
|
|
300
|
+
.textLayer :is(span, br) {
|
|
301
|
+
color: transparent;
|
|
302
|
+
position: absolute;
|
|
303
|
+
white-space: pre;
|
|
304
|
+
cursor: text;
|
|
305
|
+
margin: 0;
|
|
306
|
+
transform-origin: 0 0;
|
|
307
|
+
}
|
|
308
|
+
.textLayer span.markedContent {
|
|
309
|
+
top: 0;
|
|
310
|
+
height: 0;
|
|
311
|
+
}
|
|
312
|
+
.textLayer .highlight {
|
|
313
|
+
margin: -1px;
|
|
314
|
+
padding: 1px;
|
|
315
|
+
background-color: var(--highlight-bg-color);
|
|
316
|
+
border-radius: 4px;
|
|
317
|
+
}
|
|
318
|
+
.textLayer .highlight.appended {
|
|
319
|
+
position: initial;
|
|
320
|
+
}
|
|
321
|
+
.textLayer .highlight.begin {
|
|
322
|
+
border-radius: 4px 0 0 4px;
|
|
323
|
+
}
|
|
324
|
+
.textLayer .highlight.end {
|
|
325
|
+
border-radius: 0 4px 4px 0;
|
|
326
|
+
}
|
|
327
|
+
.textLayer .highlight.middle {
|
|
328
|
+
border-radius: 0;
|
|
329
|
+
}
|
|
330
|
+
.textLayer .highlight.selected {
|
|
331
|
+
background-color: var(--highlight-selected-bg-color);
|
|
332
|
+
}
|
|
333
|
+
.textLayer br::selection {
|
|
334
|
+
background: transparent;
|
|
335
|
+
}
|
|
336
|
+
.textLayer .endOfContent {
|
|
337
|
+
display: block;
|
|
338
|
+
position: absolute;
|
|
339
|
+
inset: 100% 0 0;
|
|
340
|
+
z-index: -1;
|
|
341
|
+
cursor: default;
|
|
342
|
+
user-select: none;
|
|
343
|
+
}
|
|
344
|
+
.textLayer .endOfContent.active {
|
|
345
|
+
top: 0;
|
|
346
|
+
}
|
|
161
347
|
|
|
162
348
|
/* src/PdfReader/pdf.css */
|
|
163
349
|
/*# sourceMappingURL=index.css.map */
|
package/dist/index.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../node_modules/react-pdf/dist/esm/Page/AnnotationLayer.css"],"sourcesContent":["/* Copyright 2014 Mozilla Foundation\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n.annotationLayer section {\n position: absolute;\n}\n\n.annotationLayer .linkAnnotation > a,\n.annotationLayer .buttonWidgetAnnotation.pushButton > a {\n position: absolute;\n font-size: 1em;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n\n.annotationLayer .linkAnnotation > a:hover,\n.annotationLayer .buttonWidgetAnnotation.pushButton > a:hover {\n opacity: 0.2;\n background: #ff0;\n box-shadow: 0px 2px 10px #ff0;\n}\n\n.annotationLayer .textAnnotation img {\n position: absolute;\n cursor: pointer;\n}\n\n.annotationLayer .textWidgetAnnotation input,\n.annotationLayer .textWidgetAnnotation textarea,\n.annotationLayer .choiceWidgetAnnotation select,\n.annotationLayer .buttonWidgetAnnotation.checkBox input,\n.annotationLayer .buttonWidgetAnnotation.radioButton input {\n background-color: rgba(0, 54, 255, 0.13);\n border: 1px solid transparent;\n box-sizing: border-box;\n font-size: 9px;\n height: 100%;\n margin: 0;\n padding: 0 3px;\n vertical-align: top;\n width: 100%;\n}\n\n.annotationLayer .choiceWidgetAnnotation select option {\n padding: 0;\n}\n\n.annotationLayer .buttonWidgetAnnotation.radioButton input {\n border-radius: 50%;\n}\n\n.annotationLayer .textWidgetAnnotation textarea {\n font: message-box;\n font-size: 9px;\n resize: none;\n}\n\n.annotationLayer .textWidgetAnnotation input[disabled],\n.annotationLayer .textWidgetAnnotation textarea[disabled],\n.annotationLayer .choiceWidgetAnnotation select[disabled],\n.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled],\n.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] {\n background: none;\n border: 1px solid transparent;\n cursor: not-allowed;\n}\n\n.annotationLayer .textWidgetAnnotation input:hover,\n.annotationLayer .textWidgetAnnotation textarea:hover,\n.annotationLayer .choiceWidgetAnnotation select:hover,\n.annotationLayer .buttonWidgetAnnotation.checkBox input:hover,\n.annotationLayer .buttonWidgetAnnotation.radioButton input:hover {\n border: 1px solid #000;\n}\n\n.annotationLayer .textWidgetAnnotation input:focus,\n.annotationLayer .textWidgetAnnotation textarea:focus,\n.annotationLayer .choiceWidgetAnnotation select:focus {\n background: none;\n border: 1px solid transparent;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after,\n.annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {\n background-color: #000;\n content: '';\n display: block;\n position: absolute;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {\n height: 80%;\n left: 45%;\n width: 1px;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before {\n transform: rotate(45deg);\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {\n transform: rotate(-45deg);\n}\n\n.annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {\n border-radius: 50%;\n height: 50%;\n left: 30%;\n top: 20%;\n width: 50%;\n}\n\n.annotationLayer .textWidgetAnnotation input.comb {\n font-family: monospace;\n padding-left: 2px;\n padding-right: 0;\n}\n\n.annotationLayer .textWidgetAnnotation input.comb:focus {\n /*\n * Letter spacing is placed on the right side of each character. Hence, the\n * letter spacing of the last character may be placed outside the visible\n * area, causing horizontal scrolling. We avoid this by extending the width\n * when the element has focus and revert this when it loses focus.\n */\n width: 115%;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input,\n.annotationLayer .buttonWidgetAnnotation.radioButton input {\n appearance: none;\n padding: 0;\n}\n\n.annotationLayer .popupWrapper {\n position: absolute;\n width: 20em;\n}\n\n.annotationLayer .popup {\n position: absolute;\n z-index: 200;\n max-width: 20em;\n background-color: #FFFF99;\n box-shadow: 0px 2px 5px #888;\n border-radius: 2px;\n padding: 6px;\n margin-left: 5px;\n cursor: pointer;\n font: message-box;\n font-size: 9px;\n word-wrap: break-word;\n}\n\n.annotationLayer .popup > * {\n font-size: 9px;\n}\n\n.annotationLayer .popup h1 {\n display: inline-block;\n}\n\n.annotationLayer .popup span {\n display: inline-block;\n margin-left: 5px;\n}\n\n.annotationLayer .popup p {\n border-top: 1px solid #333;\n margin-top: 2px;\n padding-top: 2px;\n}\n\n.annotationLayer .highlightAnnotation,\n.annotationLayer .underlineAnnotation,\n.annotationLayer .squigglyAnnotation,\n.annotationLayer .strikeoutAnnotation,\n.annotationLayer .freeTextAnnotation,\n.annotationLayer .lineAnnotation svg line,\n.annotationLayer .squareAnnotation svg rect,\n.annotationLayer .circleAnnotation svg ellipse,\n.annotationLayer .polylineAnnotation svg polyline,\n.annotationLayer .polygonAnnotation svg polygon,\n.annotationLayer .caretAnnotation,\n.annotationLayer .inkAnnotation svg polyline,\n.annotationLayer .stampAnnotation,\n.annotationLayer .fileAttachmentAnnotation {\n cursor: pointer;\n}\n"],"mappings":";AAeA;AACE;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAKE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAKE;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAAA;AAAA;AAGE;AACA;AAAA;AAGF;AAAA;AAAA;AAGE;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAOE;AAAA;AAGF;AAAA;AAEE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcE;AAAA;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../node_modules/react-pdf/dist/esm/Page/AnnotationLayer.css","../node_modules/react-pdf/dist/esm/Page/TextLayer.css"],"sourcesContent":["/* Copyright 2014 Mozilla Foundation\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n:root {\n --react-pdf-annotation-layer: 1;\n --annotation-unfocused-field-background: url(\"data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>\");\n --input-focus-border-color: Highlight;\n --input-focus-outline: 1px solid Canvas;\n --input-unfocused-border-color: transparent;\n --input-disabled-border-color: transparent;\n --input-hover-border-color: black;\n --link-outline: none;\n}\n\n@media screen and (forced-colors: active) {\n :root {\n --input-focus-border-color: CanvasText;\n --input-unfocused-border-color: ActiveText;\n --input-disabled-border-color: GrayText;\n --input-hover-border-color: Highlight;\n --link-outline: 1.5px solid LinkText;\n }\n .annotationLayer .textWidgetAnnotation :is(input, textarea):required,\n .annotationLayer .choiceWidgetAnnotation select:required,\n .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required {\n outline: 1.5px solid selectedItem;\n }\n\n .annotationLayer .linkAnnotation:hover {\n backdrop-filter: invert(100%);\n }\n}\n\n.annotationLayer {\n position: absolute;\n top: 0;\n left: 0;\n pointer-events: none;\n transform-origin: 0 0;\n z-index: 3;\n}\n\n.annotationLayer[data-main-rotation='90'] .norotate {\n transform: rotate(270deg) translateX(-100%);\n}\n.annotationLayer[data-main-rotation='180'] .norotate {\n transform: rotate(180deg) translate(-100%, -100%);\n}\n.annotationLayer[data-main-rotation='270'] .norotate {\n transform: rotate(90deg) translateY(-100%);\n}\n\n.annotationLayer canvas {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n\n.annotationLayer section {\n position: absolute;\n text-align: initial;\n pointer-events: auto;\n box-sizing: border-box;\n margin: 0;\n transform-origin: 0 0;\n}\n\n.annotationLayer .linkAnnotation {\n outline: var(--link-outline);\n}\n\n.annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton) > a {\n position: absolute;\n font-size: 1em;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n\n.annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton) > a:hover {\n opacity: 0.2;\n background: rgba(255, 255, 0, 1);\n box-shadow: 0 2px 10px rgba(255, 255, 0, 1);\n}\n\n.annotationLayer .textAnnotation img {\n position: absolute;\n cursor: pointer;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n}\n\n.annotationLayer .textWidgetAnnotation :is(input, textarea),\n.annotationLayer .choiceWidgetAnnotation select,\n.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input {\n background-image: var(--annotation-unfocused-field-background);\n border: 2px solid var(--input-unfocused-border-color);\n box-sizing: border-box;\n font: calc(9px * var(--scale-factor)) sans-serif;\n height: 100%;\n margin: 0;\n vertical-align: top;\n width: 100%;\n}\n\n.annotationLayer .textWidgetAnnotation :is(input, textarea):required,\n.annotationLayer .choiceWidgetAnnotation select:required,\n.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required {\n outline: 1.5px solid red;\n}\n\n.annotationLayer .choiceWidgetAnnotation select option {\n padding: 0;\n}\n\n.annotationLayer .buttonWidgetAnnotation.radioButton input {\n border-radius: 50%;\n}\n\n.annotationLayer .textWidgetAnnotation textarea {\n resize: none;\n}\n\n.annotationLayer .textWidgetAnnotation :is(input, textarea)[disabled],\n.annotationLayer .choiceWidgetAnnotation select[disabled],\n.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input[disabled] {\n background: none;\n border: 2px solid var(--input-disabled-border-color);\n cursor: not-allowed;\n}\n\n.annotationLayer .textWidgetAnnotation :is(input, textarea):hover,\n.annotationLayer .choiceWidgetAnnotation select:hover,\n.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:hover {\n border: 2px solid var(--input-hover-border-color);\n}\n.annotationLayer .textWidgetAnnotation :is(input, textarea):hover,\n.annotationLayer .choiceWidgetAnnotation select:hover,\n.annotationLayer .buttonWidgetAnnotation.checkBox input:hover {\n border-radius: 2px;\n}\n\n.annotationLayer .textWidgetAnnotation :is(input, textarea):focus,\n.annotationLayer .choiceWidgetAnnotation select:focus {\n background: none;\n border: 2px solid var(--input-focus-border-color);\n border-radius: 2px;\n outline: var(--input-focus-outline);\n}\n\n.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) :focus {\n background-image: none;\n background-color: transparent;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox :focus {\n border: 2px solid var(--input-focus-border-color);\n border-radius: 2px;\n outline: var(--input-focus-outline);\n}\n\n.annotationLayer .buttonWidgetAnnotation.radioButton :focus {\n border: 2px solid var(--input-focus-border-color);\n outline: var(--input-focus-outline);\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after,\n.annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {\n background-color: CanvasText;\n content: '';\n display: block;\n position: absolute;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {\n height: 80%;\n left: 45%;\n width: 1px;\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before {\n transform: rotate(45deg);\n}\n\n.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {\n transform: rotate(-45deg);\n}\n\n.annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {\n border-radius: 50%;\n height: 50%;\n left: 30%;\n top: 20%;\n width: 50%;\n}\n\n.annotationLayer .textWidgetAnnotation input.comb {\n font-family: monospace;\n padding-left: 2px;\n padding-right: 0;\n}\n\n.annotationLayer .textWidgetAnnotation input.comb:focus {\n /*\n * Letter spacing is placed on the right side of each character. Hence, the\n * letter spacing of the last character may be placed outside the visible\n * area, causing horizontal scrolling. We avoid this by extending the width\n * when the element has focus and revert this when it loses focus.\n */\n width: 103%;\n}\n\n.annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input {\n appearance: none;\n}\n\n.annotationLayer .popupTriggerArea {\n height: 100%;\n width: 100%;\n}\n\n.annotationLayer .fileAttachmentAnnotation .popupTriggerArea {\n position: absolute;\n}\n\n.annotationLayer .popupWrapper {\n position: absolute;\n font-size: calc(9px * var(--scale-factor));\n width: 100%;\n min-width: calc(180px * var(--scale-factor));\n pointer-events: none;\n}\n\n.annotationLayer .popup {\n position: absolute;\n max-width: calc(180px * var(--scale-factor));\n background-color: rgba(255, 255, 153, 1);\n box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor))\n rgba(136, 136, 136, 1);\n border-radius: calc(2px * var(--scale-factor));\n padding: calc(6px * var(--scale-factor));\n margin-left: calc(5px * var(--scale-factor));\n cursor: pointer;\n font: message-box;\n white-space: normal;\n word-wrap: break-word;\n pointer-events: auto;\n}\n\n.annotationLayer .popup > * {\n font-size: calc(9px * var(--scale-factor));\n}\n\n.annotationLayer .popup h1 {\n display: inline-block;\n}\n\n.annotationLayer .popupDate {\n display: inline-block;\n margin-left: calc(5px * var(--scale-factor));\n}\n\n.annotationLayer .popupContent {\n border-top: 1px solid rgba(51, 51, 51, 1);\n margin-top: calc(2px * var(--scale-factor));\n padding-top: calc(2px * var(--scale-factor));\n}\n\n.annotationLayer .richText > * {\n white-space: pre-wrap;\n font-size: calc(9px * var(--scale-factor));\n}\n\n.annotationLayer .highlightAnnotation,\n.annotationLayer .underlineAnnotation,\n.annotationLayer .squigglyAnnotation,\n.annotationLayer .strikeoutAnnotation,\n.annotationLayer .freeTextAnnotation,\n.annotationLayer .lineAnnotation svg line,\n.annotationLayer .squareAnnotation svg rect,\n.annotationLayer .circleAnnotation svg ellipse,\n.annotationLayer .polylineAnnotation svg polyline,\n.annotationLayer .polygonAnnotation svg polygon,\n.annotationLayer .caretAnnotation,\n.annotationLayer .inkAnnotation svg polyline,\n.annotationLayer .stampAnnotation,\n.annotationLayer .fileAttachmentAnnotation {\n cursor: pointer;\n}\n\n.annotationLayer section svg {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n}\n\n.annotationLayer .annotationTextContent {\n position: absolute;\n width: 100%;\n height: 100%;\n opacity: 0;\n color: transparent;\n user-select: none;\n pointer-events: none;\n}\n\n.annotationLayer .annotationTextContent span {\n width: 100%;\n display: inline-block;\n}\n","/* Copyright 2014 Mozilla Foundation\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n:root {\n --react-pdf-text-layer: 1;\n --highlight-bg-color: rgba(180, 0, 170, 1);\n --highlight-selected-bg-color: rgba(0, 100, 0, 1);\n}\n\n@media screen and (forced-colors: active) {\n :root {\n --highlight-bg-color: Highlight;\n --highlight-selected-bg-color: ButtonText;\n }\n}\n\n[data-main-rotation='90'] {\n transform: rotate(90deg) translateY(-100%);\n}\n[data-main-rotation='180'] {\n transform: rotate(180deg) translate(-100%, -100%);\n}\n[data-main-rotation='270'] {\n transform: rotate(270deg) translateX(-100%);\n}\n\n.textLayer {\n position: absolute;\n text-align: initial;\n inset: 0;\n overflow: hidden;\n line-height: 1;\n text-size-adjust: none;\n forced-color-adjust: none;\n transform-origin: 0 0;\n z-index: 2;\n}\n\n.textLayer :is(span, br) {\n color: transparent;\n position: absolute;\n white-space: pre;\n cursor: text;\n margin: 0;\n transform-origin: 0 0;\n}\n\n/* Only necessary in Google Chrome, see issue 14205, and most unfortunately\n * the problem doesn't show up in \"text\" reference tests. */\n.textLayer span.markedContent {\n top: 0;\n height: 0;\n}\n\n.textLayer .highlight {\n margin: -1px;\n padding: 1px;\n background-color: var(--highlight-bg-color);\n border-radius: 4px;\n}\n\n.textLayer .highlight.appended {\n position: initial;\n}\n\n.textLayer .highlight.begin {\n border-radius: 4px 0 0 4px;\n}\n\n.textLayer .highlight.end {\n border-radius: 0 4px 4px 0;\n}\n\n.textLayer .highlight.middle {\n border-radius: 0;\n}\n\n.textLayer .highlight.selected {\n background-color: var(--highlight-selected-bg-color);\n}\n\n/* Avoids https://github.com/mozilla/pdf.js/issues/13840 in Chrome */\n.textLayer br::selection {\n background: transparent;\n}\n\n.textLayer .endOfContent {\n display: block;\n position: absolute;\n inset: 100% 0 0;\n z-index: -1;\n cursor: default;\n user-select: none;\n}\n\n.textLayer .endOfContent.active {\n top: 0;\n}\n"],"mappings":";AAeA;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACE;AACA;AACA;AACA;AACA;AAAA;AAEF;AAAA;AAAA;AAGE;AAAA;AAGF;AACE;AAAA;AAAA;AAIJ;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAGE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAGE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AAAA;AAAA;AAGE;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAGE;AAAA;AAEF;AAAA;AAAA;AAGE;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAGE;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAOE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;;;ACxTF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACE;AACA;AAAA;AAAA;AAIJ;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAKF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAIF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;","names":[]}
|
package/dist/index.d.ts
CHANGED
|
@@ -69,6 +69,7 @@ declare const FONT_DETAILS: {
|
|
|
69
69
|
};
|
|
70
70
|
declare const LOCAL_STORAGE_SETTINGS_KEY = "web-reader-settings";
|
|
71
71
|
declare const LOCAL_STORAGE_LOCATIONS_KEY = "web-reader-locations";
|
|
72
|
+
declare const MAIN_CONTENT_ID = "mainContent";
|
|
72
73
|
|
|
73
74
|
declare const WebpubPdfConformsTo = "http://librarysimplified.org/terms/profiles/pdf";
|
|
74
75
|
declare const EpubConformsTo = "https://readium.org/webpub-manifest/profiles/epub";
|
|
@@ -529,4 +530,4 @@ declare type WebReaderProps = UseWebReaderArguments & ReaderManagerArguments;
|
|
|
529
530
|
declare const WebReaderWithoutBoundary: FC<WebReaderProps>;
|
|
530
531
|
declare const WebReader: FC<WebReaderProps>;
|
|
531
532
|
|
|
532
|
-
export { CHROME_HEIGHT, DEFAULT_HEIGHT, DEFAULT_SETTINGS, DEFAULT_SHOULD_GROW_WHEN_SCROLLING, FONT_DETAILS, FOOTER_HEIGHT, HEADER_HEIGHT, IS_DEV, LOCAL_STORAGE_LOCATIONS_KEY, LOCAL_STORAGE_SETTINGS_KEY, ReadiumWebpubContext, WebReaderProps, WebReaderWithoutBoundary, addTocToManifest, clearWebReaderLocalStorage, WebReader as default, getTheme, useColorModeValue, useHtmlReader, usePdfReader, useWebReader };
|
|
533
|
+
export { CHROME_HEIGHT, DEFAULT_HEIGHT, DEFAULT_SETTINGS, DEFAULT_SHOULD_GROW_WHEN_SCROLLING, FONT_DETAILS, FOOTER_HEIGHT, HEADER_HEIGHT, IS_DEV, LOCAL_STORAGE_LOCATIONS_KEY, LOCAL_STORAGE_SETTINGS_KEY, MAIN_CONTENT_ID, ReadiumWebpubContext, WebReaderProps, WebReaderWithoutBoundary, addTocToManifest, clearWebReaderLocalStorage, WebReader as default, getTheme, useColorModeValue, useHtmlReader, usePdfReader, useWebReader };
|