iglooform 3.5.0 → 3.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/media/preview.d.ts +13 -0
- package/es/media/preview.js +75 -34
- package/lib/media/preview.d.ts +13 -0
- package/lib/media/preview.js +74 -33
- package/package.json +1 -1
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { FC, CSSProperties } from 'react';
|
|
2
|
+
interface MediaProps {
|
|
3
|
+
src: string;
|
|
4
|
+
type: string;
|
|
5
|
+
scale?: number;
|
|
6
|
+
isCurrent?: boolean;
|
|
7
|
+
className?: any;
|
|
8
|
+
style?: CSSProperties;
|
|
9
|
+
showAllPages?: boolean;
|
|
10
|
+
autoWidth?: boolean;
|
|
11
|
+
}
|
|
12
|
+
declare const Media: FC<MediaProps>;
|
|
13
|
+
export default Media;
|
package/es/media/preview.js
CHANGED
|
@@ -10,7 +10,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
10
10
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
11
11
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
12
12
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
-
import React, { useState, useRef, useContext, useReducer } from 'react';
|
|
13
|
+
import React, { useState, useRef, useContext, useReducer, useEffect } from 'react';
|
|
14
14
|
import { Document, Page } from 'react-pdf/dist/esm/entry.webpack';
|
|
15
15
|
import classnames from 'classnames';
|
|
16
16
|
import { ArrowLeftOutlined, ArrowRightOutlined } from 'iglooicon';
|
|
@@ -29,6 +29,31 @@ var PasswordResponses = {
|
|
|
29
29
|
NEED_PASSWORD: 1,
|
|
30
30
|
INCORRECT_PASSWORD: 2
|
|
31
31
|
};
|
|
32
|
+
var useContainerWidth = function useContainerWidth() {
|
|
33
|
+
var enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
34
|
+
var containerRef = useRef(null);
|
|
35
|
+
var _useState = useState(undefined),
|
|
36
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
37
|
+
containerWidth = _useState2[0],
|
|
38
|
+
setContainerWidth = _useState2[1];
|
|
39
|
+
useEffect(function () {
|
|
40
|
+
if (!enabled) return;
|
|
41
|
+
var updateWidth = function updateWidth() {
|
|
42
|
+
if (containerRef.current) {
|
|
43
|
+
setContainerWidth(containerRef.current.offsetWidth);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
updateWidth();
|
|
47
|
+
var resizeObserver = new ResizeObserver(updateWidth);
|
|
48
|
+
if (containerRef.current) {
|
|
49
|
+
resizeObserver.observe(containerRef.current);
|
|
50
|
+
}
|
|
51
|
+
return function () {
|
|
52
|
+
resizeObserver.disconnect();
|
|
53
|
+
};
|
|
54
|
+
}, [enabled]);
|
|
55
|
+
return [containerRef, containerWidth];
|
|
56
|
+
};
|
|
32
57
|
var PdfViewer = function PdfViewer(_ref) {
|
|
33
58
|
var src = _ref.src,
|
|
34
59
|
left = _ref.left,
|
|
@@ -36,22 +61,24 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
36
61
|
scale = _ref.scale,
|
|
37
62
|
isCurrent = _ref.isCurrent,
|
|
38
63
|
_ref$showAllPages = _ref.showAllPages,
|
|
39
|
-
showAllPages = _ref$showAllPages === void 0 ? true : _ref$showAllPages
|
|
64
|
+
showAllPages = _ref$showAllPages === void 0 ? true : _ref$showAllPages,
|
|
65
|
+
_ref$autoWidth = _ref.autoWidth,
|
|
66
|
+
autoWidth = _ref$autoWidth === void 0 ? false : _ref$autoWidth;
|
|
40
67
|
var _useContext = useContext(LocaleContext),
|
|
41
68
|
formatMessage = _useContext.formatMessage;
|
|
42
|
-
var _useState = useState(1),
|
|
43
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
44
|
-
pageSize = _useState2[0],
|
|
45
|
-
setPageSize = _useState2[1];
|
|
46
69
|
var _useState3 = useState(1),
|
|
47
70
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
var
|
|
51
|
-
var _useState5 = useState(false),
|
|
71
|
+
pageSize = _useState4[0],
|
|
72
|
+
setPageSize = _useState4[1];
|
|
73
|
+
var _useState5 = useState(1),
|
|
52
74
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
53
|
-
|
|
54
|
-
|
|
75
|
+
page = _useState6[0],
|
|
76
|
+
setPage = _useState6[1];
|
|
77
|
+
var documentRef = useRef(null);
|
|
78
|
+
var _useState7 = useState(false),
|
|
79
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
80
|
+
needPassword = _useState8[0],
|
|
81
|
+
setNeedPassword = _useState8[1];
|
|
55
82
|
var _useBreakpoint = useBreakpoint(),
|
|
56
83
|
md = _useBreakpoint.md;
|
|
57
84
|
var _useReducer = useReducer(function (a) {
|
|
@@ -64,6 +91,10 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
64
91
|
_Modal$useModal2 = _slicedToArray(_Modal$useModal, 2),
|
|
65
92
|
modal = _Modal$useModal2[0],
|
|
66
93
|
modalHolder = _Modal$useModal2[1];
|
|
94
|
+
var _useContainerWidth = useContainerWidth(autoWidth),
|
|
95
|
+
_useContainerWidth2 = _slicedToArray(_useContainerWidth, 2),
|
|
96
|
+
containerRef = _useContainerWidth2[0],
|
|
97
|
+
containerWidth = _useContainerWidth2[1];
|
|
67
98
|
var handlePageInit = function handlePageInit(document) {
|
|
68
99
|
var _ref2 = document || {},
|
|
69
100
|
numPages = _ref2.numPages;
|
|
@@ -133,10 +164,12 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
133
164
|
}
|
|
134
165
|
if (showAllPages) {
|
|
135
166
|
return /*#__PURE__*/_jsx("div", {
|
|
167
|
+
ref: autoWidth ? containerRef : undefined,
|
|
136
168
|
style: {
|
|
137
169
|
display: 'flex',
|
|
138
170
|
flexDirection: 'column',
|
|
139
171
|
maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
|
|
172
|
+
width: autoWidth ? '100%' : undefined,
|
|
140
173
|
maxHeight: '100%',
|
|
141
174
|
transform: "translate(".concat(left, "px, ").concat(top, "px)"),
|
|
142
175
|
position: 'absolute',
|
|
@@ -152,7 +185,8 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
152
185
|
}).map(function (_, index) {
|
|
153
186
|
return /*#__PURE__*/_jsx(Page, {
|
|
154
187
|
pageNumber: index + 1,
|
|
155
|
-
|
|
188
|
+
width: autoWidth ? containerWidth : undefined,
|
|
189
|
+
scale: !autoWidth ? scale : undefined
|
|
156
190
|
}, index);
|
|
157
191
|
})
|
|
158
192
|
})
|
|
@@ -160,6 +194,7 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
160
194
|
}
|
|
161
195
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
162
196
|
children: [modalHolder, /*#__PURE__*/_jsx("div", {
|
|
197
|
+
ref: autoWidth ? containerRef : undefined,
|
|
163
198
|
style: {
|
|
164
199
|
maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
|
|
165
200
|
maxHeight: '100%',
|
|
@@ -174,7 +209,8 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
174
209
|
onPassword: onPassword,
|
|
175
210
|
children: /*#__PURE__*/_jsx(Page, {
|
|
176
211
|
pageNumber: page,
|
|
177
|
-
scale:
|
|
212
|
+
width: autoWidth && containerWidth ? containerWidth * scale : undefined,
|
|
213
|
+
scale: !autoWidth ? scale : undefined
|
|
178
214
|
})
|
|
179
215
|
})
|
|
180
216
|
}, index), isCurrent && Boolean(pageSize > 1) && /*#__PURE__*/_jsxs("div", {
|
|
@@ -213,7 +249,8 @@ var MediaItem = function MediaItem(_ref3) {
|
|
|
213
249
|
scale = _ref3.scale,
|
|
214
250
|
offset = _ref3.offset,
|
|
215
251
|
isCurrent = _ref3.isCurrent,
|
|
216
|
-
showAllPages = _ref3.showAllPages
|
|
252
|
+
showAllPages = _ref3.showAllPages,
|
|
253
|
+
autoWidth = _ref3.autoWidth;
|
|
217
254
|
var top = offset.top,
|
|
218
255
|
left = offset.left;
|
|
219
256
|
var _useContext2 = useContext(LocaleContext),
|
|
@@ -235,7 +272,8 @@ var MediaItem = function MediaItem(_ref3) {
|
|
|
235
272
|
left: left,
|
|
236
273
|
scale: scale,
|
|
237
274
|
isCurrent: isCurrent,
|
|
238
|
-
showAllPages: showAllPages
|
|
275
|
+
showAllPages: showAllPages,
|
|
276
|
+
autoWidth: autoWidth
|
|
239
277
|
});
|
|
240
278
|
case 'image':
|
|
241
279
|
return /*#__PURE__*/_jsx("img", {
|
|
@@ -272,32 +310,34 @@ var Media = function Media(_ref4) {
|
|
|
272
310
|
_ref4$isCurrent = _ref4.isCurrent,
|
|
273
311
|
isCurrent = _ref4$isCurrent === void 0 ? false : _ref4$isCurrent,
|
|
274
312
|
_ref4$showAllPages = _ref4.showAllPages,
|
|
275
|
-
showAllPages = _ref4$showAllPages === void 0 ? true : _ref4$showAllPages
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
setIsDrag = _useState8[1];
|
|
280
|
-
var _useState9 = useState({
|
|
281
|
-
startX: 0,
|
|
282
|
-
startY: 0
|
|
283
|
-
}),
|
|
313
|
+
showAllPages = _ref4$showAllPages === void 0 ? true : _ref4$showAllPages,
|
|
314
|
+
_ref4$autoWidth = _ref4.autoWidth,
|
|
315
|
+
autoWidth = _ref4$autoWidth === void 0 ? false : _ref4$autoWidth;
|
|
316
|
+
var _useState9 = useState(false),
|
|
284
317
|
_useState10 = _slicedToArray(_useState9, 2),
|
|
285
|
-
|
|
286
|
-
|
|
318
|
+
isDrag = _useState10[0],
|
|
319
|
+
setIsDrag = _useState10[1];
|
|
287
320
|
var _useState11 = useState({
|
|
288
|
-
|
|
289
|
-
|
|
321
|
+
startX: 0,
|
|
322
|
+
startY: 0
|
|
290
323
|
}),
|
|
291
324
|
_useState12 = _slicedToArray(_useState11, 2),
|
|
292
|
-
|
|
293
|
-
|
|
325
|
+
startPos = _useState12[0],
|
|
326
|
+
setStartPos = _useState12[1];
|
|
294
327
|
var _useState13 = useState({
|
|
295
328
|
top: 0,
|
|
296
329
|
left: 0
|
|
297
330
|
}),
|
|
298
331
|
_useState14 = _slicedToArray(_useState13, 2),
|
|
299
|
-
|
|
300
|
-
|
|
332
|
+
offset = _useState14[0],
|
|
333
|
+
setOffset = _useState14[1];
|
|
334
|
+
var _useState15 = useState({
|
|
335
|
+
top: 0,
|
|
336
|
+
left: 0
|
|
337
|
+
}),
|
|
338
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
339
|
+
lastOffset = _useState16[0],
|
|
340
|
+
setLastOffset = _useState16[1];
|
|
301
341
|
var handleMouseUp = function handleMouseUp(e) {
|
|
302
342
|
e.preventDefault();
|
|
303
343
|
var button = e.button;
|
|
@@ -358,7 +398,8 @@ var Media = function Media(_ref4) {
|
|
|
358
398
|
scale: scale,
|
|
359
399
|
offset: offset,
|
|
360
400
|
isCurrent: isCurrent,
|
|
361
|
-
showAllPages: showAllPages
|
|
401
|
+
showAllPages: showAllPages,
|
|
402
|
+
autoWidth: autoWidth
|
|
362
403
|
})
|
|
363
404
|
});
|
|
364
405
|
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { FC, CSSProperties } from 'react';
|
|
2
|
+
interface MediaProps {
|
|
3
|
+
src: string;
|
|
4
|
+
type: string;
|
|
5
|
+
scale?: number;
|
|
6
|
+
isCurrent?: boolean;
|
|
7
|
+
className?: any;
|
|
8
|
+
style?: CSSProperties;
|
|
9
|
+
showAllPages?: boolean;
|
|
10
|
+
autoWidth?: boolean;
|
|
11
|
+
}
|
|
12
|
+
declare const Media: FC<MediaProps>;
|
|
13
|
+
export default Media;
|
package/lib/media/preview.js
CHANGED
|
@@ -35,6 +35,31 @@ var PasswordResponses = {
|
|
|
35
35
|
NEED_PASSWORD: 1,
|
|
36
36
|
INCORRECT_PASSWORD: 2
|
|
37
37
|
};
|
|
38
|
+
var useContainerWidth = function useContainerWidth() {
|
|
39
|
+
var enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
40
|
+
var containerRef = (0, _react.useRef)(null);
|
|
41
|
+
var _useState = (0, _react.useState)(undefined),
|
|
42
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
43
|
+
containerWidth = _useState2[0],
|
|
44
|
+
setContainerWidth = _useState2[1];
|
|
45
|
+
(0, _react.useEffect)(function () {
|
|
46
|
+
if (!enabled) return;
|
|
47
|
+
var updateWidth = function updateWidth() {
|
|
48
|
+
if (containerRef.current) {
|
|
49
|
+
setContainerWidth(containerRef.current.offsetWidth);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
updateWidth();
|
|
53
|
+
var resizeObserver = new ResizeObserver(updateWidth);
|
|
54
|
+
if (containerRef.current) {
|
|
55
|
+
resizeObserver.observe(containerRef.current);
|
|
56
|
+
}
|
|
57
|
+
return function () {
|
|
58
|
+
resizeObserver.disconnect();
|
|
59
|
+
};
|
|
60
|
+
}, [enabled]);
|
|
61
|
+
return [containerRef, containerWidth];
|
|
62
|
+
};
|
|
38
63
|
var PdfViewer = function PdfViewer(_ref) {
|
|
39
64
|
var src = _ref.src,
|
|
40
65
|
left = _ref.left,
|
|
@@ -42,22 +67,24 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
42
67
|
scale = _ref.scale,
|
|
43
68
|
isCurrent = _ref.isCurrent,
|
|
44
69
|
_ref$showAllPages = _ref.showAllPages,
|
|
45
|
-
showAllPages = _ref$showAllPages === void 0 ? true : _ref$showAllPages
|
|
70
|
+
showAllPages = _ref$showAllPages === void 0 ? true : _ref$showAllPages,
|
|
71
|
+
_ref$autoWidth = _ref.autoWidth,
|
|
72
|
+
autoWidth = _ref$autoWidth === void 0 ? false : _ref$autoWidth;
|
|
46
73
|
var _useContext = (0, _react.useContext)(_locale.LocaleContext),
|
|
47
74
|
formatMessage = _useContext.formatMessage;
|
|
48
|
-
var _useState = (0, _react.useState)(1),
|
|
49
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
50
|
-
pageSize = _useState2[0],
|
|
51
|
-
setPageSize = _useState2[1];
|
|
52
75
|
var _useState3 = (0, _react.useState)(1),
|
|
53
76
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
var
|
|
57
|
-
var _useState5 = (0, _react.useState)(false),
|
|
77
|
+
pageSize = _useState4[0],
|
|
78
|
+
setPageSize = _useState4[1];
|
|
79
|
+
var _useState5 = (0, _react.useState)(1),
|
|
58
80
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
59
|
-
|
|
60
|
-
|
|
81
|
+
page = _useState6[0],
|
|
82
|
+
setPage = _useState6[1];
|
|
83
|
+
var documentRef = (0, _react.useRef)(null);
|
|
84
|
+
var _useState7 = (0, _react.useState)(false),
|
|
85
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
86
|
+
needPassword = _useState8[0],
|
|
87
|
+
setNeedPassword = _useState8[1];
|
|
61
88
|
var _useBreakpoint = useBreakpoint(),
|
|
62
89
|
md = _useBreakpoint.md;
|
|
63
90
|
var _useReducer = (0, _react.useReducer)(function (a) {
|
|
@@ -70,6 +97,10 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
70
97
|
_Modal$useModal2 = _slicedToArray(_Modal$useModal, 2),
|
|
71
98
|
modal = _Modal$useModal2[0],
|
|
72
99
|
modalHolder = _Modal$useModal2[1];
|
|
100
|
+
var _useContainerWidth = useContainerWidth(autoWidth),
|
|
101
|
+
_useContainerWidth2 = _slicedToArray(_useContainerWidth, 2),
|
|
102
|
+
containerRef = _useContainerWidth2[0],
|
|
103
|
+
containerWidth = _useContainerWidth2[1];
|
|
73
104
|
var handlePageInit = function handlePageInit(document) {
|
|
74
105
|
var _ref2 = document || {},
|
|
75
106
|
numPages = _ref2.numPages;
|
|
@@ -139,10 +170,12 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
139
170
|
}
|
|
140
171
|
if (showAllPages) {
|
|
141
172
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
173
|
+
ref: autoWidth ? containerRef : undefined,
|
|
142
174
|
style: {
|
|
143
175
|
display: 'flex',
|
|
144
176
|
flexDirection: 'column',
|
|
145
177
|
maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
|
|
178
|
+
width: autoWidth ? '100%' : undefined,
|
|
146
179
|
maxHeight: '100%',
|
|
147
180
|
transform: "translate(".concat(left, "px, ").concat(top, "px)"),
|
|
148
181
|
position: 'absolute',
|
|
@@ -158,7 +191,8 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
158
191
|
}).map(function (_, index) {
|
|
159
192
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_entry.Page, {
|
|
160
193
|
pageNumber: index + 1,
|
|
161
|
-
|
|
194
|
+
width: autoWidth ? containerWidth : undefined,
|
|
195
|
+
scale: !autoWidth ? scale : undefined
|
|
162
196
|
}, index);
|
|
163
197
|
})
|
|
164
198
|
})
|
|
@@ -166,6 +200,7 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
166
200
|
}
|
|
167
201
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
168
202
|
children: [modalHolder, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
203
|
+
ref: autoWidth ? containerRef : undefined,
|
|
169
204
|
style: {
|
|
170
205
|
maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
|
|
171
206
|
maxHeight: '100%',
|
|
@@ -180,7 +215,8 @@ var PdfViewer = function PdfViewer(_ref) {
|
|
|
180
215
|
onPassword: onPassword,
|
|
181
216
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_entry.Page, {
|
|
182
217
|
pageNumber: page,
|
|
183
|
-
scale:
|
|
218
|
+
width: autoWidth && containerWidth ? containerWidth * scale : undefined,
|
|
219
|
+
scale: !autoWidth ? scale : undefined
|
|
184
220
|
})
|
|
185
221
|
})
|
|
186
222
|
}, index), isCurrent && Boolean(pageSize > 1) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
@@ -219,7 +255,8 @@ var MediaItem = function MediaItem(_ref3) {
|
|
|
219
255
|
scale = _ref3.scale,
|
|
220
256
|
offset = _ref3.offset,
|
|
221
257
|
isCurrent = _ref3.isCurrent,
|
|
222
|
-
showAllPages = _ref3.showAllPages
|
|
258
|
+
showAllPages = _ref3.showAllPages,
|
|
259
|
+
autoWidth = _ref3.autoWidth;
|
|
223
260
|
var top = offset.top,
|
|
224
261
|
left = offset.left;
|
|
225
262
|
var _useContext2 = (0, _react.useContext)(_locale.LocaleContext),
|
|
@@ -241,7 +278,8 @@ var MediaItem = function MediaItem(_ref3) {
|
|
|
241
278
|
left: left,
|
|
242
279
|
scale: scale,
|
|
243
280
|
isCurrent: isCurrent,
|
|
244
|
-
showAllPages: showAllPages
|
|
281
|
+
showAllPages: showAllPages,
|
|
282
|
+
autoWidth: autoWidth
|
|
245
283
|
});
|
|
246
284
|
case 'image':
|
|
247
285
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
@@ -278,32 +316,34 @@ var Media = function Media(_ref4) {
|
|
|
278
316
|
_ref4$isCurrent = _ref4.isCurrent,
|
|
279
317
|
isCurrent = _ref4$isCurrent === void 0 ? false : _ref4$isCurrent,
|
|
280
318
|
_ref4$showAllPages = _ref4.showAllPages,
|
|
281
|
-
showAllPages = _ref4$showAllPages === void 0 ? true : _ref4$showAllPages
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
setIsDrag = _useState8[1];
|
|
286
|
-
var _useState9 = (0, _react.useState)({
|
|
287
|
-
startX: 0,
|
|
288
|
-
startY: 0
|
|
289
|
-
}),
|
|
319
|
+
showAllPages = _ref4$showAllPages === void 0 ? true : _ref4$showAllPages,
|
|
320
|
+
_ref4$autoWidth = _ref4.autoWidth,
|
|
321
|
+
autoWidth = _ref4$autoWidth === void 0 ? false : _ref4$autoWidth;
|
|
322
|
+
var _useState9 = (0, _react.useState)(false),
|
|
290
323
|
_useState10 = _slicedToArray(_useState9, 2),
|
|
291
|
-
|
|
292
|
-
|
|
324
|
+
isDrag = _useState10[0],
|
|
325
|
+
setIsDrag = _useState10[1];
|
|
293
326
|
var _useState11 = (0, _react.useState)({
|
|
294
|
-
|
|
295
|
-
|
|
327
|
+
startX: 0,
|
|
328
|
+
startY: 0
|
|
296
329
|
}),
|
|
297
330
|
_useState12 = _slicedToArray(_useState11, 2),
|
|
298
|
-
|
|
299
|
-
|
|
331
|
+
startPos = _useState12[0],
|
|
332
|
+
setStartPos = _useState12[1];
|
|
300
333
|
var _useState13 = (0, _react.useState)({
|
|
301
334
|
top: 0,
|
|
302
335
|
left: 0
|
|
303
336
|
}),
|
|
304
337
|
_useState14 = _slicedToArray(_useState13, 2),
|
|
305
|
-
|
|
306
|
-
|
|
338
|
+
offset = _useState14[0],
|
|
339
|
+
setOffset = _useState14[1];
|
|
340
|
+
var _useState15 = (0, _react.useState)({
|
|
341
|
+
top: 0,
|
|
342
|
+
left: 0
|
|
343
|
+
}),
|
|
344
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
345
|
+
lastOffset = _useState16[0],
|
|
346
|
+
setLastOffset = _useState16[1];
|
|
307
347
|
var handleMouseUp = function handleMouseUp(e) {
|
|
308
348
|
e.preventDefault();
|
|
309
349
|
var button = e.button;
|
|
@@ -364,7 +404,8 @@ var Media = function Media(_ref4) {
|
|
|
364
404
|
scale: scale,
|
|
365
405
|
offset: offset,
|
|
366
406
|
isCurrent: isCurrent,
|
|
367
|
-
showAllPages: showAllPages
|
|
407
|
+
showAllPages: showAllPages,
|
|
408
|
+
autoWidth: autoWidth
|
|
368
409
|
})
|
|
369
410
|
});
|
|
370
411
|
};
|