@kne/react-pdf-sign 1.0.6 → 1.1.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.
@@ -1,5 +1,5 @@
1
1
  import { pdfjs, Document, Page } from 'react-pdf';
2
- import { useMemo, useState, useRef, useEffect, forwardRef, useCallback, useImperativeHandle } from 'react';
2
+ import { useMemo, useState, useRef, useEffect, createElement, forwardRef, useCallback, useImperativeHandle } from 'react';
3
3
  import { usePreset } from '@kne/global-context';
4
4
  import useResize from '@kne/use-resize';
5
5
  import classnames from 'classnames';
@@ -8,7 +8,7 @@ import { LeftOutlined, RightOutlined } from '@ant-design/icons';
8
8
  import 'react-pdf/dist/Page/TextLayer.css';
9
9
  import 'react-pdf/dist/Page/AnnotationLayer.css';
10
10
  import { jsxs, jsx } from 'react/jsx-runtime';
11
- import { Stage, Layer, Group, Image as Image$1, Rect, Text, Transformer } from 'react-konva';
11
+ import { Layer, Group, Image as Image$1, Rect, Text, Transformer, Circle, Line, Stage } from 'react-konva';
12
12
  import useControlValue from '@kne/use-control-value';
13
13
  import useRefCallback from '@kne/use-ref-callback';
14
14
  import useImage from 'use-image';
@@ -38,7 +38,7 @@ function _objectWithoutPropertiesLoose(r, e) {
38
38
 
39
39
  var style = {"pdf-view-container":"_RgZXN","pdf-view":"_PAju1","pdf-view-children":"_N11Pj","pdf-view-page-control-left":"_IbVpf","pdf-view-page-control-right":"_IIgqj","pdf-view-page-control-current":"_JW3CT","signature-container":"_6TDb-","signature-canvas":"_2CGF4","signature-modal":"_kWe3k","signature-mask":"_FSvLv"};
40
40
 
41
- const _excluded$3 = ["numPages"];
41
+ const _excluded$4 = ["numPages"];
42
42
  const PDFViewer = ({
43
43
  className,
44
44
  defaultPage,
@@ -91,7 +91,7 @@ const PDFViewer = ({
91
91
  let {
92
92
  numPages
93
93
  } = _ref;
94
- _objectWithoutPropertiesLoose(_ref, _excluded$3);
94
+ _objectWithoutPropertiesLoose(_ref, _excluded$4);
95
95
  setPageSize(numPages);
96
96
  if (!Number.isInteger(defaultPage)) {
97
97
  setCurrentPage(numPages);
@@ -146,7 +146,8 @@ const locale$1 = {
146
146
  signatureCancelText: '取消',
147
147
  signatureCleanText: '清空',
148
148
  signatureEmptyError: '签名内容不能为空',
149
- signatureSuccess: '签名成功'
149
+ signatureSuccess: '签名成功',
150
+ signatureAdd: '请添加签名'
150
151
  };
151
152
 
152
153
  const locale = {
@@ -157,7 +158,8 @@ const locale = {
157
158
  signatureCancelText: 'Cancel',
158
159
  signatureCleanText: 'Clean',
159
160
  signatureEmptyError: 'Signature content cannot be empty',
160
- signatureSuccess: 'Signature Success'
161
+ signatureSuccess: 'Signature Success',
162
+ signatureAdd: 'Please add signature'
161
163
  };
162
164
 
163
165
  const withLocale = createWithIntlProvider({
@@ -169,8 +171,30 @@ const withLocale = createWithIntlProvider({
169
171
  namespace: 'react-pdf-sign'
170
172
  });
171
173
 
172
- const _excluded$2 = ["width", "height", "padding", "stageWidth", "stageHeight", "placeholder", "signature"];
173
- const LocationLayer = withLocale(p => {
174
+ const getInitLocation = ({
175
+ stageWidth,
176
+ stageHeight,
177
+ width,
178
+ height
179
+ }) => {
180
+ return {
181
+ scaleX: 1,
182
+ scaleY: 1,
183
+ x: Math.round((stageWidth - width) / 2),
184
+ y: Math.round((stageHeight - height) / 2),
185
+ size: {
186
+ width,
187
+ height,
188
+ x: Math.round((stageWidth - width) / 2),
189
+ y: Math.round((stageHeight - height) / 2)
190
+ }
191
+ };
192
+ };
193
+
194
+ const _excluded$3 = ["width", "height", "padding", "stageWidth", "stageHeight", "placeholder", "signature", "active", "onClose", "onClick"],
195
+ _excluded2 = ["stageWidth", "stageHeight"],
196
+ _excluded3 = ["stageWidth", "stageHeight", "isEdit", "onClick", "currentPage"];
197
+ const LocationLayerInner = withLocale(p => {
174
198
  const {
175
199
  formatMessage
176
200
  } = useIntl();
@@ -183,9 +207,12 @@ const LocationLayer = withLocale(p => {
183
207
  placeholder = formatMessage({
184
208
  id: 'locationLayerPlaceholder'
185
209
  }),
186
- signature
210
+ signature,
211
+ active,
212
+ onClose,
213
+ onClick
187
214
  } = p,
188
- props = _objectWithoutPropertiesLoose(p, _excluded$2);
215
+ props = _objectWithoutPropertiesLoose(p, _excluded$3);
189
216
  const [value, setValue] = useControlValue(props);
190
217
  const [isInit, setIsInit] = useState(false);
191
218
  const [signatureImage] = useImage(signature);
@@ -195,7 +222,7 @@ const LocationLayer = withLocale(p => {
195
222
  const computedSignLocation = () => {
196
223
  const absolutePosition = signRef.current.absolutePosition();
197
224
  const size = signRef.current.getClientRect();
198
- setValue({
225
+ setValue(value => Object.assign({}, value, {
199
226
  size: {
200
227
  width: Math.round(size.width),
201
228
  height: Math.round(size.height),
@@ -206,22 +233,16 @@ const LocationLayer = withLocale(p => {
206
233
  scaleY: Number(groupRef.current.attrs.scaleY.toFixed(2)),
207
234
  x: Math.round(groupRef.current.attrs.x),
208
235
  y: Math.round(groupRef.current.attrs.y)
209
- });
236
+ }));
210
237
  };
211
238
  const initValue = useRefCallback(() => {
212
239
  if (['scaleX', 'scaleY', 'x', 'y', 'size'].some(name => !Object.assign({}, value).hasOwnProperty(name))) {
213
- setValue({
214
- scaleX: 1,
215
- scaleY: 1,
216
- x: Math.round((stageWidth - width) / 2),
217
- y: Math.round((stageHeight - height) / 2),
218
- size: {
219
- width,
220
- height,
221
- x: Math.round((stageWidth - width) / 2),
222
- y: Math.round((stageHeight - height) / 2)
223
- }
224
- });
240
+ setValue(value => Object.assign({}, value, getInitLocation({
241
+ stageWidth,
242
+ stageHeight,
243
+ width,
244
+ height
245
+ })));
225
246
  }
226
247
  setIsInit(true);
227
248
  });
@@ -244,607 +265,186 @@ const LocationLayer = withLocale(p => {
244
265
  if (!(isInit && value)) {
245
266
  return null;
246
267
  }
268
+ return /*#__PURE__*/jsxs(Layer, {
269
+ children: [/*#__PURE__*/jsx(Group, {
270
+ x: value.x,
271
+ y: value.y,
272
+ draggable: active !== false,
273
+ ref: groupRef,
274
+ onDragMove: computedSignLocation,
275
+ onDragEnd: computedSignLocation,
276
+ scaleX: value.scaleX,
277
+ scaleY: value.scaleY,
278
+ onTransform: computedSignLocation,
279
+ onTransformEnd: computedSignLocation,
280
+ onTap: onClick,
281
+ onClick: onClick,
282
+ children: signatureImage ? /*#__PURE__*/jsx(Image$1, {
283
+ width: width,
284
+ height: height,
285
+ image: signatureImage,
286
+ cornerRadius: 8,
287
+ ref: signRef
288
+ }) : /*#__PURE__*/jsx(Rect, {
289
+ width: width,
290
+ height: height,
291
+ fill: "#f0f0f0",
292
+ cornerRadius: 8,
293
+ ref: signRef
294
+ })
295
+ }), /*#__PURE__*/jsx(Text, {
296
+ listening: false,
297
+ x: value.x,
298
+ y: value.y,
299
+ text: signatureImage ? '' : placeholder,
300
+ fontSize: 16,
301
+ fill: "#666666",
302
+ fontFamily: "Arial",
303
+ align: "center",
304
+ verticalAlign: "middle",
305
+ width: width * value.scaleX,
306
+ height: height * value.scaleY
307
+ }), /*#__PURE__*/jsx(Transformer, {
308
+ ref: transformerRef,
309
+ visible: active !== false,
310
+ keepRatio: true,
311
+ flipEnabled: false,
312
+ rotateEnabled: false,
313
+ borderStroke: themeColor,
314
+ rotateAnchorStroke: themeColor,
315
+ anchorStroke: themeColor,
316
+ padding: padding
317
+ }), active === true && /*#__PURE__*/jsxs(Group, {
318
+ x: value.x + width * value.scaleX - 4,
319
+ y: value.y + 4,
320
+ onClick: () => {
321
+ onClose && onClose();
322
+ },
323
+ children: [/*#__PURE__*/jsx(Circle, {
324
+ radius: 6,
325
+ stroke: themeColor,
326
+ strokeWidth: 1,
327
+ fill: "white"
328
+ }), /*#__PURE__*/jsx(Line, {
329
+ points: [-2, -2, 2, 2],
330
+ stroke: themeColor,
331
+ strokeWidth: 1,
332
+ lineCap: "round"
333
+ }), /*#__PURE__*/jsx(Line, {
334
+ points: [-2, 2, 2, -2],
335
+ stroke: themeColor,
336
+ strokeWidth: 1,
337
+ lineCap: "round"
338
+ })]
339
+ })]
340
+ });
341
+ });
342
+ const LocationLayer = _ref => {
343
+ let {
344
+ stageWidth,
345
+ stageHeight
346
+ } = _ref,
347
+ props = _objectWithoutPropertiesLoose(_ref, _excluded2);
247
348
  return /*#__PURE__*/jsx(Stage, {
248
349
  width: stageWidth,
249
350
  height: stageHeight,
250
- children: /*#__PURE__*/jsxs(Layer, {
251
- children: [/*#__PURE__*/jsxs(Group, {
252
- x: value.x,
253
- y: value.y,
254
- draggable: true,
255
- ref: groupRef,
256
- onDragEnd: computedSignLocation,
257
- scaleX: value.scaleX,
258
- scaleY: value.scaleY,
259
- onTransformEnd: computedSignLocation,
260
- children: [signatureImage ? /*#__PURE__*/jsx(Image$1, {
261
- width: width,
262
- height: height,
263
- image: signatureImage,
264
- cornerRadius: 8,
265
- ref: signRef
266
- }) : /*#__PURE__*/jsx(Rect, {
267
- width: width,
268
- height: height,
269
- fill: "#f0f0f0",
270
- cornerRadius: 8,
271
- ref: signRef
272
- }), /*#__PURE__*/jsx(Text, {
273
- text: signatureImage ? '' : placeholder,
274
- fontSize: 16,
275
- fill: "#666666",
276
- fontFamily: "Arial",
277
- align: "center",
278
- verticalAlign: "middle",
279
- width: width,
280
- height: height
281
- })]
282
- }), /*#__PURE__*/jsx(Transformer, {
283
- ref: transformerRef,
284
- keepRatio: true,
285
- flipEnabled: false,
286
- rotateEnabled: false,
287
- borderStroke: themeColor,
288
- rotateAnchorStroke: themeColor,
289
- anchorStroke: themeColor,
290
- padding: padding
291
- })]
351
+ children: /*#__PURE__*/jsx(LocationLayerInner, _extends({}, props, {
352
+ stageWidth: stageWidth,
353
+ stageHeight: stageHeight
354
+ }))
355
+ });
356
+ };
357
+ const LocationGroup = _ref2 => {
358
+ let {
359
+ stageWidth,
360
+ stageHeight,
361
+ isEdit = true,
362
+ onClick,
363
+ currentPage
364
+ } = _ref2,
365
+ props = _objectWithoutPropertiesLoose(_ref2, _excluded3);
366
+ const [value, onChange] = useControlValue(Object.assign({}, {
367
+ defaultValue: []
368
+ }, props));
369
+ const [active, setActive] = useState(0);
370
+ return /*#__PURE__*/jsx(Stage, {
371
+ width: stageWidth,
372
+ height: stageHeight,
373
+ children: value.map((item, index) => {
374
+ if (item.page && item.page !== currentPage) {
375
+ return null;
376
+ }
377
+ return /*#__PURE__*/createElement(LocationLayerInner, _extends({}, props, {
378
+ key: index,
379
+ stageWidth: stageWidth,
380
+ stageHeight: stageHeight,
381
+ value: item,
382
+ signature: item.signature,
383
+ active: isEdit && active === index,
384
+ onClick: () => {
385
+ if (isEdit) {
386
+ if (active !== index) {
387
+ setActive(index);
388
+ }
389
+ } else {
390
+ onClick && onClick({
391
+ value: value[index],
392
+ index,
393
+ allValue: value
394
+ });
395
+ }
396
+ },
397
+ onClose: () => {
398
+ onChange(value => {
399
+ const newValue = value.slice(0);
400
+ newValue.splice(index, 1);
401
+ return newValue;
402
+ });
403
+ },
404
+ onChange: item => {
405
+ onChange(value => {
406
+ const newValue = value.slice(0);
407
+ newValue[index] = item;
408
+ return newValue;
409
+ });
410
+ }
411
+ }));
292
412
  })
293
413
  });
294
- });
295
-
296
- var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
297
-
298
- function createCommonjsModule(fn) {
299
- var module = { exports: {} };
300
- return fn(module, module.exports), module.exports;
301
- }
302
-
303
- /** Detect free variable `global` from Node.js. */
304
-
305
- var freeGlobal = typeof commonjsGlobal == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
306
-
307
- var _freeGlobal = freeGlobal;
308
-
309
- /** Detect free variable `self`. */
310
- var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
311
-
312
- /** Used as a reference to the global object. */
313
- var root = _freeGlobal || freeSelf || Function('return this')();
314
-
315
- var _root = root;
316
-
317
- /** Built-in value references. */
318
- var Symbol = _root.Symbol;
319
-
320
- var _Symbol = Symbol;
321
-
322
- /** Used for built-in method references. */
323
- var objectProto$3 = Object.prototype;
324
-
325
- /** Used to check objects for own properties. */
326
- var hasOwnProperty$2 = objectProto$3.hasOwnProperty;
327
-
328
- /**
329
- * Used to resolve the
330
- * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
331
- * of values.
332
- */
333
- var nativeObjectToString$1 = objectProto$3.toString;
334
-
335
- /** Built-in value references. */
336
- var symToStringTag$1 = _Symbol ? _Symbol.toStringTag : undefined;
337
-
338
- /**
339
- * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
340
- *
341
- * @private
342
- * @param {*} value The value to query.
343
- * @returns {string} Returns the raw `toStringTag`.
344
- */
345
- function getRawTag(value) {
346
- var isOwn = hasOwnProperty$2.call(value, symToStringTag$1),
347
- tag = value[symToStringTag$1];
348
-
349
- try {
350
- value[symToStringTag$1] = undefined;
351
- var unmasked = true;
352
- } catch (e) {}
353
-
354
- var result = nativeObjectToString$1.call(value);
355
- if (unmasked) {
356
- if (isOwn) {
357
- value[symToStringTag$1] = tag;
358
- } else {
359
- delete value[symToStringTag$1];
360
- }
361
- }
362
- return result;
363
- }
364
-
365
- var _getRawTag = getRawTag;
366
-
367
- /** Used for built-in method references. */
368
- var objectProto$2 = Object.prototype;
369
-
370
- /**
371
- * Used to resolve the
372
- * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
373
- * of values.
374
- */
375
- var nativeObjectToString = objectProto$2.toString;
376
-
377
- /**
378
- * Converts `value` to a string using `Object.prototype.toString`.
379
- *
380
- * @private
381
- * @param {*} value The value to convert.
382
- * @returns {string} Returns the converted string.
383
- */
384
- function objectToString(value) {
385
- return nativeObjectToString.call(value);
386
- }
387
-
388
- var _objectToString = objectToString;
389
-
390
- /** `Object#toString` result references. */
391
- var nullTag = '[object Null]',
392
- undefinedTag = '[object Undefined]';
393
-
394
- /** Built-in value references. */
395
- var symToStringTag = _Symbol ? _Symbol.toStringTag : undefined;
396
-
397
- /**
398
- * The base implementation of `getTag` without fallbacks for buggy environments.
399
- *
400
- * @private
401
- * @param {*} value The value to query.
402
- * @returns {string} Returns the `toStringTag`.
403
- */
404
- function baseGetTag(value) {
405
- if (value == null) {
406
- return value === undefined ? undefinedTag : nullTag;
407
- }
408
- return (symToStringTag && symToStringTag in Object(value))
409
- ? _getRawTag(value)
410
- : _objectToString(value);
411
- }
412
-
413
- var _baseGetTag = baseGetTag;
414
-
415
- /**
416
- * Checks if `value` is the
417
- * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
418
- * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
419
- *
420
- * @static
421
- * @memberOf _
422
- * @since 0.1.0
423
- * @category Lang
424
- * @param {*} value The value to check.
425
- * @returns {boolean} Returns `true` if `value` is an object, else `false`.
426
- * @example
427
- *
428
- * _.isObject({});
429
- * // => true
430
- *
431
- * _.isObject([1, 2, 3]);
432
- * // => true
433
- *
434
- * _.isObject(_.noop);
435
- * // => true
436
- *
437
- * _.isObject(null);
438
- * // => false
439
- */
440
- function isObject(value) {
441
- var type = typeof value;
442
- return value != null && (type == 'object' || type == 'function');
443
- }
444
-
445
- var isObject_1 = isObject;
446
-
447
- /** `Object#toString` result references. */
448
- var asyncTag = '[object AsyncFunction]',
449
- funcTag = '[object Function]',
450
- genTag = '[object GeneratorFunction]',
451
- proxyTag = '[object Proxy]';
452
-
453
- /**
454
- * Checks if `value` is classified as a `Function` object.
455
- *
456
- * @static
457
- * @memberOf _
458
- * @since 0.1.0
459
- * @category Lang
460
- * @param {*} value The value to check.
461
- * @returns {boolean} Returns `true` if `value` is a function, else `false`.
462
- * @example
463
- *
464
- * _.isFunction(_);
465
- * // => true
466
- *
467
- * _.isFunction(/abc/);
468
- * // => false
469
- */
470
- function isFunction(value) {
471
- if (!isObject_1(value)) {
472
- return false;
473
- }
474
- // The use of `Object#toString` avoids issues with the `typeof` operator
475
- // in Safari 9 which returns 'object' for typed arrays and other constructors.
476
- var tag = _baseGetTag(value);
477
- return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;
478
- }
479
-
480
- var isFunction_1 = isFunction;
481
-
482
- /** Used to detect overreaching core-js shims. */
483
- var coreJsData = _root['__core-js_shared__'];
484
-
485
- var _coreJsData = coreJsData;
486
-
487
- /** Used to detect methods masquerading as native. */
488
- var maskSrcKey = (function() {
489
- var uid = /[^.]+$/.exec(_coreJsData && _coreJsData.keys && _coreJsData.keys.IE_PROTO || '');
490
- return uid ? ('Symbol(src)_1.' + uid) : '';
491
- }());
492
-
493
- /**
494
- * Checks if `func` has its source masked.
495
- *
496
- * @private
497
- * @param {Function} func The function to check.
498
- * @returns {boolean} Returns `true` if `func` is masked, else `false`.
499
- */
500
- function isMasked(func) {
501
- return !!maskSrcKey && (maskSrcKey in func);
502
- }
503
-
504
- var _isMasked = isMasked;
505
-
506
- /** Used for built-in method references. */
507
- var funcProto$1 = Function.prototype;
508
-
509
- /** Used to resolve the decompiled source of functions. */
510
- var funcToString$1 = funcProto$1.toString;
511
-
512
- /**
513
- * Converts `func` to its source code.
514
- *
515
- * @private
516
- * @param {Function} func The function to convert.
517
- * @returns {string} Returns the source code.
518
- */
519
- function toSource(func) {
520
- if (func != null) {
521
- try {
522
- return funcToString$1.call(func);
523
- } catch (e) {}
524
- try {
525
- return (func + '');
526
- } catch (e) {}
527
- }
528
- return '';
529
- }
530
-
531
- var _toSource = toSource;
532
-
533
- /**
534
- * Used to match `RegExp`
535
- * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
536
- */
537
- var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
538
-
539
- /** Used to detect host constructors (Safari). */
540
- var reIsHostCtor = /^\[object .+?Constructor\]$/;
541
-
542
- /** Used for built-in method references. */
543
- var funcProto = Function.prototype,
544
- objectProto$1 = Object.prototype;
545
-
546
- /** Used to resolve the decompiled source of functions. */
547
- var funcToString = funcProto.toString;
548
-
549
- /** Used to check objects for own properties. */
550
- var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
551
-
552
- /** Used to detect if a method is native. */
553
- var reIsNative = RegExp('^' +
554
- funcToString.call(hasOwnProperty$1).replace(reRegExpChar, '\\$&')
555
- .replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, '$1.*?') + '$'
556
- );
414
+ };
557
415
 
558
- /**
559
- * The base implementation of `_.isNative` without bad shim checks.
560
- *
561
- * @private
562
- * @param {*} value The value to check.
563
- * @returns {boolean} Returns `true` if `value` is a native function,
564
- * else `false`.
565
- */
566
- function baseIsNative(value) {
567
- if (!isObject_1(value) || _isMasked(value)) {
568
- return false;
416
+ const signMultiPdfFile = async ({
417
+ filename,
418
+ url,
419
+ signatureList
420
+ }) => {
421
+ const response = await window.fetch(url);
422
+ const pdfBytes = await response.arrayBuffer();
423
+ const pdfDoc = await PDFDocument.load(pdfBytes);
424
+ for (let item of signatureList) {
425
+ const {
426
+ x,
427
+ y,
428
+ page,
429
+ signature,
430
+ width,
431
+ height
432
+ } = item;
433
+ const pdfPage = pdfDoc.getPage(page - 1);
434
+ const signatureBytes = await window.fetch(signature).then(res => res.arrayBuffer());
435
+ const signatureImageEmbed = await pdfDoc.embedPng(signatureBytes);
436
+ pdfPage.drawImage(signatureImageEmbed, {
437
+ x,
438
+ y,
439
+ width,
440
+ height
441
+ });
569
442
  }
570
- var pattern = isFunction_1(value) ? reIsNative : reIsHostCtor;
571
- return pattern.test(_toSource(value));
572
- }
573
-
574
- var _baseIsNative = baseIsNative;
575
-
576
- /**
577
- * Gets the value at `key` of `object`.
578
- *
579
- * @private
580
- * @param {Object} [object] The object to query.
581
- * @param {string} key The key of the property to get.
582
- * @returns {*} Returns the property value.
583
- */
584
- function getValue(object, key) {
585
- return object == null ? undefined : object[key];
586
- }
587
-
588
- var _getValue = getValue;
589
-
590
- /**
591
- * Gets the native function at `key` of `object`.
592
- *
593
- * @private
594
- * @param {Object} object The object to query.
595
- * @param {string} key The key of the method to get.
596
- * @returns {*} Returns the function if it's native, else `undefined`.
597
- */
598
- function getNative(object, key) {
599
- var value = _getValue(object, key);
600
- return _baseIsNative(value) ? value : undefined;
601
- }
602
-
603
- var _getNative = getNative;
604
-
605
- /* Built-in method references that are verified to be native. */
606
- var Map = _getNative(_root, 'Map');
607
-
608
- var _Map = Map;
609
-
610
- /* Built-in method references that are verified to be native. */
611
- _getNative(Object, 'create');
612
-
613
- /**
614
- * Checks if `value` is object-like. A value is object-like if it's not `null`
615
- * and has a `typeof` result of "object".
616
- *
617
- * @static
618
- * @memberOf _
619
- * @since 4.0.0
620
- * @category Lang
621
- * @param {*} value The value to check.
622
- * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
623
- * @example
624
- *
625
- * _.isObjectLike({});
626
- * // => true
627
- *
628
- * _.isObjectLike([1, 2, 3]);
629
- * // => true
630
- *
631
- * _.isObjectLike(_.noop);
632
- * // => false
633
- *
634
- * _.isObjectLike(null);
635
- * // => false
636
- */
637
- function isObjectLike(value) {
638
- return value != null && typeof value == 'object';
639
- }
640
-
641
- var isObjectLike_1 = isObjectLike;
642
-
643
- /** `Object#toString` result references. */
644
- var argsTag = '[object Arguments]';
645
-
646
- /**
647
- * The base implementation of `_.isArguments`.
648
- *
649
- * @private
650
- * @param {*} value The value to check.
651
- * @returns {boolean} Returns `true` if `value` is an `arguments` object,
652
- */
653
- function baseIsArguments(value) {
654
- return isObjectLike_1(value) && _baseGetTag(value) == argsTag;
655
- }
656
-
657
- var _baseIsArguments = baseIsArguments;
658
-
659
- /** Used for built-in method references. */
660
- var objectProto = Object.prototype;
661
-
662
- /** Used to check objects for own properties. */
663
- var hasOwnProperty = objectProto.hasOwnProperty;
664
-
665
- /** Built-in value references. */
666
- var propertyIsEnumerable = objectProto.propertyIsEnumerable;
667
-
668
- /**
669
- * Checks if `value` is likely an `arguments` object.
670
- *
671
- * @static
672
- * @memberOf _
673
- * @since 0.1.0
674
- * @category Lang
675
- * @param {*} value The value to check.
676
- * @returns {boolean} Returns `true` if `value` is an `arguments` object,
677
- * else `false`.
678
- * @example
679
- *
680
- * _.isArguments(function() { return arguments; }());
681
- * // => true
682
- *
683
- * _.isArguments([1, 2, 3]);
684
- * // => false
685
- */
686
- _baseIsArguments(function() { return arguments; }()) ? _baseIsArguments : function(value) {
687
- return isObjectLike_1(value) && hasOwnProperty.call(value, 'callee') &&
688
- !propertyIsEnumerable.call(value, 'callee');
443
+ const modifiedPdfBytes = await pdfDoc.save();
444
+ return new window.File([modifiedPdfBytes], filename, {
445
+ type: 'application/pdf'
446
+ });
689
447
  };
690
-
691
- /**
692
- * This method returns `false`.
693
- *
694
- * @static
695
- * @memberOf _
696
- * @since 4.13.0
697
- * @category Util
698
- * @returns {boolean} Returns `false`.
699
- * @example
700
- *
701
- * _.times(2, _.stubFalse);
702
- * // => [false, false]
703
- */
704
- function stubFalse() {
705
- return false;
706
- }
707
-
708
- var stubFalse_1 = stubFalse;
709
-
710
- createCommonjsModule(function (module, exports) {
711
- /** Detect free variable `exports`. */
712
- var freeExports = exports && !exports.nodeType && exports;
713
-
714
- /** Detect free variable `module`. */
715
- var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module;
716
-
717
- /** Detect the popular CommonJS extension `module.exports`. */
718
- var moduleExports = freeModule && freeModule.exports === freeExports;
719
-
720
- /** Built-in value references. */
721
- var Buffer = moduleExports ? _root.Buffer : undefined;
722
-
723
- /* Built-in method references for those with the same name as other `lodash` methods. */
724
- var nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined;
725
-
726
- /**
727
- * Checks if `value` is a buffer.
728
- *
729
- * @static
730
- * @memberOf _
731
- * @since 4.3.0
732
- * @category Lang
733
- * @param {*} value The value to check.
734
- * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.
735
- * @example
736
- *
737
- * _.isBuffer(new Buffer(2));
738
- * // => true
739
- *
740
- * _.isBuffer(new Uint8Array(2));
741
- * // => false
742
- */
743
- var isBuffer = nativeIsBuffer || stubFalse_1;
744
-
745
- module.exports = isBuffer;
746
- });
747
-
748
- createCommonjsModule(function (module, exports) {
749
- /** Detect free variable `exports`. */
750
- var freeExports = exports && !exports.nodeType && exports;
751
-
752
- /** Detect free variable `module`. */
753
- var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module;
754
-
755
- /** Detect the popular CommonJS extension `module.exports`. */
756
- var moduleExports = freeModule && freeModule.exports === freeExports;
757
-
758
- /** Detect free variable `process` from Node.js. */
759
- var freeProcess = moduleExports && _freeGlobal.process;
760
-
761
- /** Used to access faster Node.js helpers. */
762
- var nodeUtil = (function() {
763
- try {
764
- // Use `util.types` for Node.js 10+.
765
- var types = freeModule && freeModule.require && freeModule.require('util').types;
766
-
767
- if (types) {
768
- return types;
769
- }
770
-
771
- // Legacy `process.binding('util')` for Node.js < 10.
772
- return freeProcess && freeProcess.binding && freeProcess.binding('util');
773
- } catch (e) {}
774
- }());
775
-
776
- module.exports = nodeUtil;
777
- });
778
-
779
- /* Built-in method references that are verified to be native. */
780
- var DataView = _getNative(_root, 'DataView');
781
-
782
- var _DataView = DataView;
783
-
784
- /* Built-in method references that are verified to be native. */
785
- var Promise$1 = _getNative(_root, 'Promise');
786
-
787
- var _Promise = Promise$1;
788
-
789
- /* Built-in method references that are verified to be native. */
790
- var Set = _getNative(_root, 'Set');
791
-
792
- var _Set = Set;
793
-
794
- /* Built-in method references that are verified to be native. */
795
- var WeakMap = _getNative(_root, 'WeakMap');
796
-
797
- var _WeakMap = WeakMap;
798
-
799
- /** `Object#toString` result references. */
800
- var mapTag = '[object Map]',
801
- objectTag = '[object Object]',
802
- promiseTag = '[object Promise]',
803
- setTag = '[object Set]',
804
- weakMapTag = '[object WeakMap]';
805
-
806
- var dataViewTag = '[object DataView]';
807
-
808
- /** Used to detect maps, sets, and weakmaps. */
809
- var dataViewCtorString = _toSource(_DataView),
810
- mapCtorString = _toSource(_Map),
811
- promiseCtorString = _toSource(_Promise),
812
- setCtorString = _toSource(_Set),
813
- weakMapCtorString = _toSource(_WeakMap);
814
-
815
- /**
816
- * Gets the `toStringTag` of `value`.
817
- *
818
- * @private
819
- * @param {*} value The value to query.
820
- * @returns {string} Returns the `toStringTag`.
821
- */
822
- var getTag = _baseGetTag;
823
-
824
- // Fallback for data views, maps, sets, and weak maps in IE 11 and promises in Node.js < 6.
825
- if ((_DataView && getTag(new _DataView(new ArrayBuffer(1))) != dataViewTag) ||
826
- (_Map && getTag(new _Map) != mapTag) ||
827
- (_Promise && getTag(_Promise.resolve()) != promiseTag) ||
828
- (_Set && getTag(new _Set) != setTag) ||
829
- (_WeakMap && getTag(new _WeakMap) != weakMapTag)) {
830
- getTag = function(value) {
831
- var result = _baseGetTag(value),
832
- Ctor = result == objectTag ? value.constructor : undefined,
833
- ctorString = Ctor ? _toSource(Ctor) : '';
834
-
835
- if (ctorString) {
836
- switch (ctorString) {
837
- case dataViewCtorString: return dataViewTag;
838
- case mapCtorString: return mapTag;
839
- case promiseCtorString: return promiseTag;
840
- case setCtorString: return setTag;
841
- case weakMapCtorString: return weakMapTag;
842
- }
843
- }
844
- return result;
845
- };
846
- }
847
-
848
448
  const signPdfFile = async pdfSignature => {
849
449
  const {
850
450
  x,
@@ -856,25 +456,43 @@ const signPdfFile = async pdfSignature => {
856
456
  url,
857
457
  filename
858
458
  } = pdfSignature;
859
- const response = await window.fetch(url);
860
- const pdfBytes = await response.arrayBuffer();
861
- const pdfDoc = await PDFDocument.load(pdfBytes);
862
- const pdfPage = pdfDoc.getPage(page - 1);
863
- const signatureBytes = await window.fetch(signature).then(res => res.arrayBuffer());
864
- const signatureImageEmbed = await pdfDoc.embedPng(signatureBytes);
865
- pdfPage.drawImage(signatureImageEmbed, {
866
- x,
867
- y,
868
- width,
869
- height
870
- });
871
- const modifiedPdfBytes = await pdfDoc.save();
872
- return new window.File([modifiedPdfBytes], filename, {
873
- type: 'application/pdf'
459
+ return signMultiPdfFile({
460
+ filename,
461
+ url,
462
+ signatureList: [{
463
+ x,
464
+ y,
465
+ page,
466
+ signature,
467
+ width,
468
+ height
469
+ }]
874
470
  });
875
471
  };
876
472
 
877
- const _excluded$1 = ["placeholder", "signature", "url", "width", "height", "padding", "filename", "defaultLocation", "onChange"];
473
+ const computedPDFSignLocation = ({
474
+ size,
475
+ location
476
+ }) => {
477
+ const scaleX = size.width / size.originalWidth;
478
+ const scaleY = size.height / size.originalHeight;
479
+ const pdfX = Math.round(location.size.x / scaleX);
480
+ const pdfY = Math.round(size.originalHeight - location.size.y / scaleY);
481
+ const signWidth = Math.round(location.size.width / scaleX);
482
+ const signHeight = Math.round(location.size.height / scaleY);
483
+ return {
484
+ scaleX,
485
+ scaleY,
486
+ pdfX,
487
+ pdfY,
488
+ width: signWidth,
489
+ height: signHeight,
490
+ x: pdfX,
491
+ y: pdfY - signHeight
492
+ };
493
+ };
494
+
495
+ const _excluded$2 = ["placeholder", "signature", "url", "width", "height", "padding", "filename", "defaultLocation", "onChange"];
878
496
  const PDFSignInner = /*#__PURE__*/forwardRef(({
879
497
  size,
880
498
  currentPage,
@@ -889,42 +507,29 @@ const PDFSignInner = /*#__PURE__*/forwardRef(({
889
507
  onChange
890
508
  }, ref) => {
891
509
  const initLocation = useMemo(() => {
892
- return {
893
- scaleX: 1,
894
- scaleY: 1,
895
- x: Math.round((size.width - _width) / 2),
896
- y: Math.round((size.height - _height) / 2),
897
- size: {
898
- width: _width,
899
- height: _height,
900
- x: Math.round((size.width - _width) / 2),
901
- y: Math.round((size.height - _height) / 2)
902
- }
903
- };
510
+ return getInitLocation({
511
+ stageWidth: size.width,
512
+ stageHeight: size.height,
513
+ width: _width,
514
+ height: _height
515
+ });
904
516
  }, [size, _width, _height]);
905
517
  const [location, setLocationOrigin] = useState(Object.assign({}, initLocation, defaultLocation));
906
518
  const setLocation = useRefCallback(value => {
907
519
  setLocationOrigin(Object.assign({}, initLocation, value));
908
520
  });
909
521
  const pdfSignature = useMemo(() => {
910
- const scaleX = size.width / size.originalWidth;
911
- const scaleY = size.height / size.originalHeight;
912
- const pdfX = Math.round(location.size.x / scaleX);
913
- const pdfY = Math.round(size.originalHeight - location.size.y / scaleY);
914
- const signWidth = Math.round(location.size.width / scaleX);
915
- const signHeight = Math.round(location.size.height / scaleY);
916
- return {
917
- x: pdfX,
918
- y: pdfY - signHeight,
919
- page: currentPage,
920
- pageWidth: Math.round(size.originalWidth),
921
- pageHeight: Math.round(size.originalHeight),
922
- width: signWidth,
923
- height: signHeight,
522
+ return Object.assign({}, computedPDFSignLocation({
523
+ location,
524
+ size
525
+ }), {
924
526
  signature,
925
527
  url,
926
- filename: _filename
927
- };
528
+ filename: _filename,
529
+ page: currentPage,
530
+ pageWidth: Math.round(size.originalWidth),
531
+ pageHeight: Math.round(size.originalHeight)
532
+ });
928
533
  }, [location, signature, url, _filename, size, currentPage]);
929
534
  const signPdf = useCallback(async () => {
930
535
  return await signPdfFile(pdfSignature);
@@ -966,7 +571,7 @@ const PDFSign = withLocale(/*#__PURE__*/forwardRef((_ref, ref) => {
966
571
  defaultLocation,
967
572
  onChange
968
573
  } = _ref,
969
- props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
574
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
970
575
  return /*#__PURE__*/jsx(PDFViewer, _extends({}, props, {
971
576
  url: url,
972
577
  children: ({
@@ -991,6 +596,131 @@ const PDFSign = withLocale(/*#__PURE__*/forwardRef((_ref, ref) => {
991
596
  }));
992
597
  }));
993
598
 
599
+ const _excluded$1 = ["placeholder", "url", "width", "height", "padding", "filename", "defaultSignatureList", "onSign", "onChange", "isEdit"];
600
+ const PDFSignMultiInner = /*#__PURE__*/forwardRef(({
601
+ size,
602
+ currentPage,
603
+ placeholder,
604
+ url,
605
+ width: _width = 200,
606
+ height: _height = 80,
607
+ padding,
608
+ filename: _filename = 'signed-document.pdf',
609
+ defaultSignatureList,
610
+ isEdit,
611
+ onSign,
612
+ onChange
613
+ }, ref) => {
614
+ const [signatureList, setSignatureList] = useState(defaultSignatureList || []);
615
+ const {
616
+ formatMessage
617
+ } = useIntl();
618
+ const pdfSignatureList = useMemo(() => {
619
+ return signatureList.filter(location => location.signature).map(location => {
620
+ return Object.assign({}, computedPDFSignLocation({
621
+ location,
622
+ size
623
+ }), {
624
+ page: location.page,
625
+ signature: location.signature
626
+ });
627
+ });
628
+ }, [signatureList, size]);
629
+ useImperativeHandle(ref, () => ({
630
+ getSignatureList: () => signatureList,
631
+ setSignatureList: value => setSignatureList(value),
632
+ getPdfSignatureList: () => {
633
+ return pdfSignatureList;
634
+ },
635
+ sign: () => {
636
+ if (!pdfSignatureList.length) {
637
+ return Promise.reject(new Error(formatMessage({
638
+ id: 'signatureAdd'
639
+ })));
640
+ }
641
+ return signMultiPdfFile({
642
+ url,
643
+ filename: _filename,
644
+ signatureList: pdfSignatureList
645
+ });
646
+ },
647
+ addSignLocation: () => {
648
+ setSignatureList(signatureList => {
649
+ return [...signatureList, {
650
+ page: currentPage
651
+ }];
652
+ });
653
+ }
654
+ }));
655
+ return /*#__PURE__*/jsx(LocationGroup, {
656
+ isEdit: isEdit,
657
+ currentPage: currentPage,
658
+ stageWidth: size.width,
659
+ stageHeight: size.height,
660
+ width: _width,
661
+ height: _height,
662
+ padding: padding,
663
+ placeholder: placeholder,
664
+ value: signatureList,
665
+ onChange: setSignatureList,
666
+ onClick: ({
667
+ index,
668
+ value
669
+ }) => {
670
+ onSign && onSign({
671
+ size: value.size,
672
+ callback: signature => {
673
+ setSignatureList(value => {
674
+ const newValue = value.slice(0);
675
+ newValue[index] = Object.assign({}, newValue[index], {
676
+ signature
677
+ });
678
+ return newValue;
679
+ });
680
+ }
681
+ });
682
+ }
683
+ });
684
+ });
685
+ const PDFSignMulti = withLocale(/*#__PURE__*/forwardRef((_ref, ref) => {
686
+ let {
687
+ placeholder,
688
+ url,
689
+ width,
690
+ height,
691
+ padding,
692
+ filename = 'signed-document.pdf',
693
+ defaultSignatureList,
694
+ onSign,
695
+ onChange,
696
+ isEdit
697
+ } = _ref,
698
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
699
+ return /*#__PURE__*/jsx(PDFViewer, _extends({}, props, {
700
+ url: url,
701
+ children: ({
702
+ size,
703
+ currentPage
704
+ }) => {
705
+ return /*#__PURE__*/jsx(PDFSignMultiInner, {
706
+ ref: ref,
707
+ size: size,
708
+ currentPage: currentPage,
709
+ url: url,
710
+ filename: filename,
711
+ defaultSignatureList: defaultSignatureList,
712
+ width: width,
713
+ height: height,
714
+ padding: padding,
715
+ placeholder: placeholder,
716
+ onChange: onChange,
717
+ onSign: onSign,
718
+ isEdit: isEdit
719
+ });
720
+ }
721
+ }));
722
+ }));
723
+
994
724
  const _excluded = ["filename", "onSuccess", "width", "height", "mask"];
995
725
  const dataURLtoBlob = dataURL => {
996
726
  let arr = dataURL.split(',');
@@ -1155,5 +885,5 @@ const useSignature = () => {
1155
885
  };
1156
886
  };
1157
887
 
1158
- export { LocationLayer, PDFSign, PDFViewer, PDFSign as default, signPdfFile, useSignature };
888
+ export { LocationGroup, LocationLayer, PDFSign, PDFSignMulti, PDFViewer, PDFSign as default, signPdfFile, useSignature };
1159
889
  //# sourceMappingURL=index.modern.js.map