@libresign/pdf-elements 0.2.2 → 0.2.4

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 +1 @@
1
- canvas[data-v-2c9e224a]{display:block}.draggable-wrapper[data-v-55db89ce]{position:relative}.actions-toolbar[data-v-55db89ce]{position:absolute;display:flex;gap:4px;background:#1f2937;border-radius:6px;padding:6px 8px;box-shadow:0 4px 12px -2px #00000026,0 2px 6px -2px #0000001a;z-index:100;white-space:nowrap}.action-btn[data-v-55db89ce]{border:none;background:#0000;color:#fff;padding:4px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s ease}.action-btn[data-v-55db89ce]:hover{background:#ffffff1a}.draggable-element[data-v-55db89ce]{position:absolute;cursor:move;user-select:none;border-radius:6px;overflow:visible}.draggable-element.selected[data-v-55db89ce]{box-shadow:inset 0 0 0 2px #2563eb}.resize-handle[data-v-55db89ce]{position:absolute;width:10px;height:10px;background:#2563eb;border:1px solid #fff;border-radius:2px;padding:0;margin:0;cursor:pointer;z-index:200}.handle-top-left[data-v-55db89ce]{top:-6px;left:-6px;cursor:nwse-resize}.handle-top-right[data-v-55db89ce]{top:-6px;right:-6px;cursor:nesw-resize}.handle-bottom-left[data-v-55db89ce]{bottom:-6px;left:-6px;cursor:nesw-resize}.handle-bottom-right[data-v-55db89ce]{bottom:-6px;right:-6px;cursor:nwse-resize}.pdf-elements-root[data-v-ddd8aa14]{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;box-sizing:border-box}.pages-container[data-v-ddd8aa14]{width:100%;padding:20px 0 0 0;text-align:center;background:#f7fafc;overflow:hidden}.page-slot[data-v-ddd8aa14]{margin:0 auto}.page-wrapper[data-v-ddd8aa14]{display:inline-block;margin-bottom:0}.page-canvas[data-v-ddd8aa14]{position:relative;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.shadow-outline[data-v-ddd8aa14]{box-shadow:0 0 0 3px #4299e180}.preview-element[data-v-ddd8aa14]{position:absolute;opacity:.7;pointer-events:none}.drag-ghost[data-v-ddd8aa14]{position:fixed;opacity:.9;pointer-events:none;z-index:10000;transform-origin:top left;transition:none;box-shadow:0 8px 16px #0000004d}.overlay[data-v-ddd8aa14]{position:absolute;top:0;left:0;transform-origin:top left;width:100%;height:100%}.page-footer[data-v-ddd8aa14]{display:flex;justify-content:space-between;align-items:center;padding:12px 20px 20px 20px;color:#4b5563;font-size:14px}
1
+ canvas[data-v-2c9e224a]{display:block}.draggable-wrapper[data-v-17037ade]{position:relative}.actions-toolbar[data-v-17037ade]{position:absolute;display:flex;gap:4px;background:#1f2937;border-radius:6px;padding:6px 8px;box-shadow:0 4px 12px -2px #00000026,0 2px 6px -2px #0000001a;z-index:100;white-space:nowrap}.action-btn[data-v-17037ade]{border:none;background:#0000;color:#fff;padding:4px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s ease}.action-btn[data-v-17037ade]:hover{background:#ffffff1a}.draggable-element[data-v-17037ade]{position:absolute;cursor:move;user-select:none;border-radius:6px;overflow:visible}.draggable-element.selected[data-v-17037ade]{box-shadow:inset 0 0 0 2px #2563eb}.resize-handle[data-v-17037ade]{all:unset;position:absolute;width:12px;height:12px;min-width:0;min-height:0;background:#2563eb;border:1px solid #fff;border-radius:3px;padding:0;margin:0;line-height:0;font-size:0;box-sizing:border-box;display:block;appearance:none;cursor:pointer;z-index:200}.handle-top-left[data-v-17037ade]{top:-7px;left:-7px;cursor:nwse-resize}.handle-top-right[data-v-17037ade]{top:-7px;right:-7px;cursor:nesw-resize}.handle-bottom-left[data-v-17037ade]{bottom:-7px;left:-7px;cursor:nesw-resize}.handle-bottom-right[data-v-17037ade]{bottom:-7px;right:-7px;cursor:nwse-resize}.pdf-elements-root[data-v-1815c763]{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;box-sizing:border-box}.pages-container[data-v-1815c763]{width:100%;padding:20px 0 0 0;text-align:center;background:#f7fafc;overflow:hidden}.page-slot[data-v-1815c763]{margin:0 auto}.page-wrapper[data-v-1815c763]{display:inline-block;margin-bottom:0}.page-canvas[data-v-1815c763]{position:relative;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.shadow-outline[data-v-1815c763]{box-shadow:0 0 0 3px #4299e180}.preview-element[data-v-1815c763]{position:absolute;opacity:.7;pointer-events:none}.drag-ghost[data-v-1815c763]{position:fixed;opacity:.9;pointer-events:none;z-index:10000;transform-origin:top left;transition:none;box-shadow:0 8px 16px #0000004d}.overlay[data-v-1815c763]{position:absolute;top:0;left:0;transform-origin:top left;width:100%;height:100%}.page-footer[data-v-1815c763]{display:flex;justify-content:space-between;align-items:center;padding:12px 20px 20px 20px;color:#4b5563;font-size:14px}
@@ -29176,7 +29176,7 @@ globalThis.pdfjsLib = {
29176
29176
  //# sourceMappingURL=pdf.mjs.map
29177
29177
  ;// ./node_modules/pdfjs-dist/build/pdf.worker.min.mjs
29178
29178
  const pdf_worker_min_namespaceObject = __webpack_require__.p + "pdf.worker.min.mjs";
29179
- ;// ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/PDFElements.vue?vue&type=template&id=ddd8aa14&scoped=true
29179
+ ;// ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/PDFElements.vue?vue&type=template&id=1815c763&scoped=true
29180
29180
  var render = function render() {
29181
29181
  var _vm = this,
29182
29182
  _c = _vm._self._c;
@@ -29187,11 +29187,7 @@ var render = function render() {
29187
29187
  height: _vm.height
29188
29188
  }
29189
29189
  }, [_vm.pdfDocuments.length ? _c('div', {
29190
- staticClass: "pages-container",
29191
- style: {
29192
- transform: `scale(${_vm.visualScale / _vm.scale})`,
29193
- transformOrigin: 'top center'
29194
- }
29190
+ staticClass: "pages-container"
29195
29191
  }, _vm._l(_vm.pdfDocuments, function (pdfDoc, docIndex) {
29196
29192
  return _c('div', {
29197
29193
  key: docIndex
@@ -29227,7 +29223,11 @@ var render = function render() {
29227
29223
  }
29228
29224
  }
29229
29225
  }), _c('div', {
29230
- staticClass: "overlay"
29226
+ staticClass: "overlay",
29227
+ on: {
29228
+ "mousemove": _vm.handleMouseMove,
29229
+ "touchmove": _vm.handleMouseMove
29230
+ }
29231
29231
  }, [_vm.isAddingMode && _vm.previewPageDocIndex === docIndex && _vm.previewPageIndex === pIndex && _vm.previewElement && _vm.previewVisible ? _c('div', {
29232
29232
  staticClass: "preview-element",
29233
29233
  style: {
@@ -29236,7 +29236,12 @@ var render = function render() {
29236
29236
  width: `${_vm.previewElement.width * _vm.previewScale.x}px`,
29237
29237
  height: `${_vm.previewElement.height * _vm.previewScale.y}px`
29238
29238
  }
29239
- }, [_vm._t("custom", null, {
29239
+ }, [_vm._t(_vm.previewElement.type ? `element-${_vm.previewElement.type}` : 'custom', function () {
29240
+ return [_vm._t("custom", null, {
29241
+ "object": _vm.previewElement,
29242
+ "isSelected": false
29243
+ })];
29244
+ }, {
29240
29245
  "object": _vm.previewElement,
29241
29246
  "isSelected": false
29242
29247
  })], 2) : _vm._e(), _vm._l(pdfDoc.allObjects[pIndex], function (object) {
@@ -29246,9 +29251,10 @@ var render = function render() {
29246
29251
  refInFor: true,
29247
29252
  attrs: {
29248
29253
  "object": object,
29249
- "pages-scale": _vm.getRenderPageScale(docIndex, pIndex),
29254
+ "pages-scale": _vm.getDisplayedPageScale(docIndex, pIndex),
29250
29255
  "page-width": _vm.getPageWidth(docIndex, pIndex),
29251
29256
  "page-height": _vm.getPageHeight(docIndex, pIndex),
29257
+ "read-only": _vm.readOnly,
29252
29258
  "on-update": payload => _vm.updateObject(docIndex, object.id, payload),
29253
29259
  "on-delete": () => _vm.deleteObject(docIndex, object.id),
29254
29260
  "on-drag-start": (mouseX, mouseY, pointerOffset, dragShift) => _vm.startDraggingElement(docIndex, pIndex, object, mouseX, mouseY, pointerOffset, dragShift),
@@ -29328,112 +29334,6 @@ var es_iterator_flat_map = __webpack_require__(531);
29328
29334
  var es_iterator_for_each = __webpack_require__(7588);
29329
29335
  // EXTERNAL MODULE: ./node_modules/core-js/modules/es.iterator.map.js
29330
29336
  var es_iterator_map = __webpack_require__(1701);
29331
- ;// ./node_modules/debounce/index.js
29332
- function debounce(function_, wait = 100, options = {}) {
29333
- if (typeof function_ !== 'function') {
29334
- throw new TypeError(`Expected the first parameter to be a function, got \`${typeof function_}\`.`);
29335
- }
29336
-
29337
- if (wait < 0) {
29338
- throw new RangeError('`wait` must not be negative.');
29339
- }
29340
-
29341
- if (typeof options === 'boolean') {
29342
- throw new TypeError('The `options` parameter must be an object, not a boolean. Use `{immediate: true}` instead.');
29343
- }
29344
-
29345
- const {immediate} = options;
29346
-
29347
- let storedContext;
29348
- let storedArguments;
29349
- let timeoutId;
29350
- let timestamp;
29351
- let result;
29352
-
29353
- function run() {
29354
- const callContext = storedContext;
29355
- const callArguments = storedArguments;
29356
- storedContext = undefined;
29357
- storedArguments = undefined;
29358
- result = function_.apply(callContext, callArguments);
29359
- return result;
29360
- }
29361
-
29362
- function later() {
29363
- const last = Date.now() - timestamp;
29364
-
29365
- if (last < wait && last >= 0) {
29366
- timeoutId = setTimeout(later, wait - last);
29367
- } else {
29368
- timeoutId = undefined;
29369
-
29370
- if (!immediate) {
29371
- result = run();
29372
- }
29373
- }
29374
- }
29375
-
29376
- const debounced = function (...arguments_) {
29377
- if (
29378
- storedContext
29379
- && this !== storedContext
29380
- && Object.getPrototypeOf(this) === Object.getPrototypeOf(storedContext)
29381
- ) {
29382
- throw new Error('Debounced method called with different contexts of the same prototype.');
29383
- }
29384
-
29385
- storedContext = this; // eslint-disable-line unicorn/no-this-assignment
29386
- storedArguments = arguments_;
29387
- timestamp = Date.now();
29388
-
29389
- const callNow = immediate && !timeoutId;
29390
-
29391
- if (!timeoutId) {
29392
- timeoutId = setTimeout(later, wait);
29393
- }
29394
-
29395
- if (callNow) {
29396
- result = run();
29397
- return result;
29398
- }
29399
-
29400
- return undefined;
29401
- };
29402
-
29403
- Object.defineProperty(debounced, 'isPending', {
29404
- get() {
29405
- return timeoutId !== undefined;
29406
- },
29407
- });
29408
-
29409
- debounced.clear = () => {
29410
- if (!timeoutId) {
29411
- return;
29412
- }
29413
-
29414
- clearTimeout(timeoutId);
29415
- timeoutId = undefined;
29416
- storedContext = undefined;
29417
- storedArguments = undefined;
29418
- };
29419
-
29420
- debounced.flush = () => {
29421
- if (!timeoutId) {
29422
- return;
29423
- }
29424
-
29425
- debounced.trigger();
29426
- };
29427
-
29428
- debounced.trigger = () => {
29429
- result = run();
29430
-
29431
- debounced.clear();
29432
- };
29433
-
29434
- return debounced;
29435
- }
29436
-
29437
29337
  ;// ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/PDFPage.vue?vue&type=template&id=2c9e224a&scoped=true
29438
29338
  var PDFPagevue_type_template_id_2c9e224a_scoped_true_render = function render() {
29439
29339
  var _vm = this,
@@ -29641,8 +29541,8 @@ var component = normalizeComponent(
29641
29541
  )
29642
29542
 
29643
29543
  /* harmony default export */ const PDFPage = (component.exports);
29644
- ;// ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/DraggableElement.vue?vue&type=template&id=55db89ce&scoped=true
29645
- var DraggableElementvue_type_template_id_55db89ce_scoped_true_render = function render() {
29544
+ ;// ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/DraggableElement.vue?vue&type=template&id=17037ade&scoped=true
29545
+ var DraggableElementvue_type_template_id_17037ade_scoped_true_render = function render() {
29646
29546
  var _vm = this,
29647
29547
  _c = _vm._self._c;
29648
29548
  return _c('div', {
@@ -29722,7 +29622,7 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_render = function
29722
29622
  });
29723
29623
  }) : _vm._e()], 2)]);
29724
29624
  };
29725
- var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns = [];
29625
+ var DraggableElementvue_type_template_id_17037ade_scoped_true_staticRenderFns = [];
29726
29626
 
29727
29627
  ;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/DraggableElement.vue?vue&type=script&lang=js
29728
29628
  /* harmony default export */ const DraggableElementvue_type_script_lang_js = ({
@@ -29798,6 +29698,10 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
29798
29698
  showDefaultActions: {
29799
29699
  type: Boolean,
29800
29700
  default: true
29701
+ },
29702
+ readOnly: {
29703
+ type: Boolean,
29704
+ default: false
29801
29705
  }
29802
29706
  },
29803
29707
  data() {
@@ -29834,25 +29738,41 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
29834
29738
  },
29835
29739
  elementStyle() {
29836
29740
  const scale = this.pagesScale || 1;
29837
- const currentX = this.object.x + this.offsetX + this.resizeOffsetX;
29838
- const currentY = this.object.y + this.offsetY + this.resizeOffsetY;
29839
- const currentWidth = this.object.width + this.resizeOffsetW;
29840
- const currentHeight = this.object.height + this.resizeOffsetH;
29741
+ const isDragging = this.mode === 'drag';
29742
+ const isResizing = this.mode === 'resize';
29743
+ const offsetX = isDragging ? this.offsetX : 0;
29744
+ const offsetY = isDragging ? this.offsetY : 0;
29745
+ const resizeOffsetX = isResizing ? this.resizeOffsetX : 0;
29746
+ const resizeOffsetY = isResizing ? this.resizeOffsetY : 0;
29747
+ const resizeOffsetW = isResizing ? this.resizeOffsetW : 0;
29748
+ const resizeOffsetH = isResizing ? this.resizeOffsetH : 0;
29749
+ const currentX = this.object.x + offsetX + resizeOffsetX;
29750
+ const currentY = this.object.y + offsetY + resizeOffsetY;
29751
+ const currentWidth = this.object.width + resizeOffsetW;
29752
+ const currentHeight = this.object.height + resizeOffsetH;
29841
29753
  return {
29842
29754
  left: `${currentX * scale}px`,
29843
29755
  top: `${currentY * scale}px`,
29844
29756
  width: `${currentWidth * scale}px`,
29845
- height: `${currentHeight * scale}px`
29757
+ height: `${currentHeight * scale}px`,
29758
+ pointerEvents: this.readOnly ? 'none' : 'auto'
29846
29759
  };
29847
29760
  },
29848
29761
  toolbarStyle() {
29849
29762
  const scale = this.pagesScale || 1;
29850
- const x = this.object.x + this.offsetX + this.resizeOffsetX;
29851
- const y = this.object.y + this.offsetY + this.resizeOffsetY;
29852
- const width = this.object.width + this.resizeOffsetW;
29763
+ const isDragging = this.mode === 'drag';
29764
+ const isResizing = this.mode === 'resize';
29765
+ const offsetX = isDragging ? this.offsetX : 0;
29766
+ const offsetY = isDragging ? this.offsetY : 0;
29767
+ const resizeOffsetX = isResizing ? this.resizeOffsetX : 0;
29768
+ const resizeOffsetY = isResizing ? this.resizeOffsetY : 0;
29769
+ const resizeOffsetW = isResizing ? this.resizeOffsetW : 0;
29770
+ const x = this.object.x + offsetX + resizeOffsetX;
29771
+ const y = this.object.y + offsetY + resizeOffsetY;
29772
+ const width = this.object.width + resizeOffsetW;
29853
29773
  return {
29854
29774
  left: `${(x + width / 2) * scale}px`,
29855
- top: `${(y - 48) * scale}px`,
29775
+ top: `${(y - 60) * scale}px`,
29856
29776
  transform: 'translateX(-50%)'
29857
29777
  };
29858
29778
  },
@@ -29884,6 +29804,9 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
29884
29804
  },
29885
29805
  methods: {
29886
29806
  handleElementClick(event) {
29807
+ if (this.readOnly) {
29808
+ return;
29809
+ }
29887
29810
  if (event.target.closest('.delete-handle') || event.target.closest('[data-stop-drag]') || event.target.closest('.actions-toolbar')) {
29888
29811
  return;
29889
29812
  }
@@ -29901,6 +29824,7 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
29901
29824
  this.startResize(direction, event);
29902
29825
  },
29903
29826
  startDrag(event) {
29827
+ if (this.readOnly) return;
29904
29828
  if (event.target.classList.contains('delete')) return;
29905
29829
  if (event.target.classList.contains('resize-handle')) return;
29906
29830
  this.mode = 'drag';
@@ -29937,6 +29861,7 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
29937
29861
  window.addEventListener('touchend', this.boundStopInteraction);
29938
29862
  },
29939
29863
  startResize(direction, event) {
29864
+ if (this.readOnly) return;
29940
29865
  this.mode = 'resize';
29941
29866
  this.direction = direction;
29942
29867
  this.startX = event.type.includes('touch') ? event.touches[0].clientX : event.clientX;
@@ -29990,7 +29915,7 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
29990
29915
  this.rafId = null;
29991
29916
  return;
29992
29917
  }
29993
- const minSize = 16;
29918
+ const minSize = 16 / (this.pagesScale || 1);
29994
29919
  let newWidth = this.startWidth;
29995
29920
  let newHeight = this.startHeight;
29996
29921
  let newLeft = this.startLeft;
@@ -30104,10 +30029,10 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
30104
30029
  });
30105
30030
  ;// ./src/components/DraggableElement.vue?vue&type=script&lang=js
30106
30031
  /* harmony default export */ const components_DraggableElementvue_type_script_lang_js = (DraggableElementvue_type_script_lang_js);
30107
- ;// ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-55.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-55.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[2]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/DraggableElement.vue?vue&type=style&index=0&id=55db89ce&prod&scoped=true&lang=css
30032
+ ;// ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-55.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-55.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[2]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/DraggableElement.vue?vue&type=style&index=0&id=17037ade&prod&scoped=true&lang=css
30108
30033
  // extracted by mini-css-extract-plugin
30109
30034
 
30110
- ;// ./src/components/DraggableElement.vue?vue&type=style&index=0&id=55db89ce&prod&scoped=true&lang=css
30035
+ ;// ./src/components/DraggableElement.vue?vue&type=style&index=0&id=17037ade&prod&scoped=true&lang=css
30111
30036
 
30112
30037
  ;// ./src/components/DraggableElement.vue
30113
30038
 
@@ -30120,11 +30045,11 @@ var DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns =
30120
30045
 
30121
30046
  var DraggableElement_component = normalizeComponent(
30122
30047
  components_DraggableElementvue_type_script_lang_js,
30123
- DraggableElementvue_type_template_id_55db89ce_scoped_true_render,
30124
- DraggableElementvue_type_template_id_55db89ce_scoped_true_staticRenderFns,
30048
+ DraggableElementvue_type_template_id_17037ade_scoped_true_render,
30049
+ DraggableElementvue_type_template_id_17037ade_scoped_true_staticRenderFns,
30125
30050
  false,
30126
30051
  null,
30127
- "55db89ce",
30052
+ "17037ade",
30128
30053
  null
30129
30054
 
30130
30055
  )
@@ -30162,7 +30087,6 @@ function readAsPDF(file) {
30162
30087
 
30163
30088
 
30164
30089
 
30165
-
30166
30090
  /* harmony default export */ const PDFElementsvue_type_script_lang_js = ({
30167
30091
  name: 'PDFElements',
30168
30092
  components: {
@@ -30206,6 +30130,10 @@ function readAsPDF(file) {
30206
30130
  type: Boolean,
30207
30131
  default: true
30208
30132
  },
30133
+ readOnly: {
30134
+ type: Boolean,
30135
+ default: false
30136
+ },
30209
30137
  pageCountFormat: {
30210
30138
  type: String,
30211
30139
  default: '{currentPage} of {totalPages}'
@@ -30259,15 +30187,15 @@ function readAsPDF(file) {
30259
30187
  viewportRafId: 0,
30260
30188
  objectIndexCache: {},
30261
30189
  zoomRafId: null,
30190
+ wheelZoomRafId: null,
30262
30191
  boundHandleWheel: null,
30263
- debouncedApplyZoom: null,
30264
30192
  visualScale: this.initialScale,
30265
- resizeObserver: null
30193
+ autoFitApplied: false,
30194
+ lastContainerWidth: 0
30266
30195
  };
30267
30196
  },
30268
30197
  mounted() {
30269
30198
  this.boundHandleWheel = this.handleWheel.bind(this);
30270
- this.debouncedApplyZoom = debounce(this.commitZoom, 150);
30271
30199
  this.init();
30272
30200
  document.addEventListener('mousemove', this.handleMouseMove);
30273
30201
  document.addEventListener('touchmove', this.handleMouseMove, {
@@ -30286,23 +30214,15 @@ function readAsPDF(file) {
30286
30214
  this.$el?.addEventListener('wheel', this.boundHandleWheel, {
30287
30215
  passive: false
30288
30216
  });
30289
- if (this.autoFitZoom) {
30290
- window.addEventListener('resize', this.adjustZoomToFit);
30291
- if (typeof ResizeObserver !== 'undefined') {
30292
- this.resizeObserver = new ResizeObserver(() => {
30293
- this.scheduleAutoFitZoom();
30294
- });
30295
- if (this.$el) {
30296
- this.resizeObserver.observe(this.$el);
30297
- }
30298
- }
30299
- }
30300
30217
  },
30301
30218
  beforeUnmount() {
30302
30219
  if (this.zoomRafId) {
30303
30220
  cancelAnimationFrame(this.zoomRafId);
30304
30221
  }
30305
- this.debouncedApplyZoom?.clear?.();
30222
+ if (this.wheelZoomRafId) {
30223
+ cancelAnimationFrame(this.wheelZoomRafId);
30224
+ this.wheelZoomRafId = null;
30225
+ }
30306
30226
  if (this.boundHandleWheel) {
30307
30227
  this.$el?.removeEventListener('wheel', this.boundHandleWheel);
30308
30228
  }
@@ -30314,13 +30234,6 @@ function readAsPDF(file) {
30314
30234
  window.removeEventListener('scroll', this.onViewportScroll);
30315
30235
  window.removeEventListener('resize', this.onViewportScroll);
30316
30236
  this.$el?.removeEventListener('scroll', this.onViewportScroll);
30317
- if (this.autoFitZoom) {
30318
- window.removeEventListener('resize', this.adjustZoomToFit);
30319
- if (this.resizeObserver) {
30320
- this.resizeObserver.disconnect();
30321
- this.resizeObserver = null;
30322
- }
30323
- }
30324
30237
  if (this.viewportRafId) {
30325
30238
  window.cancelAnimationFrame(this.viewportRafId);
30326
30239
  this.viewportRafId = 0;
@@ -30330,6 +30243,7 @@ function readAsPDF(file) {
30330
30243
  async init() {
30331
30244
  if (!this.initFiles || this.initFiles.length === 0) return;
30332
30245
  const docs = [];
30246
+ this.autoFitApplied = false;
30333
30247
  for (let i = 0; i < this.initFiles.length; i++) {
30334
30248
  const file = this.initFiles[i];
30335
30249
  const name = this.initFileNames[i] || `document-${i + 1}.pdf`;
@@ -30467,23 +30381,34 @@ function readAsPDF(file) {
30467
30381
  this.cachePageBounds();
30468
30382
  },
30469
30383
  cachePageBounds() {
30470
- this.pagesBoundingRects = {};
30384
+ const nextRects = {};
30471
30385
  for (let docIdx = 0; docIdx < this.pdfDocuments.length; docIdx++) {
30472
30386
  for (let pageIdx = 0; pageIdx < this.pdfDocuments[docIdx].pages.length; pageIdx++) {
30473
30387
  const canvas = this.getPageCanvasElement(docIdx, pageIdx);
30474
30388
  if (!canvas) continue;
30475
30389
  const rect = canvas.getBoundingClientRect();
30476
- this.pagesBoundingRects[`${docIdx}-${pageIdx}`] = {
30390
+ nextRects[`${docIdx}-${pageIdx}`] = {
30477
30391
  docIndex: docIdx,
30478
30392
  pageIndex: pageIdx,
30479
30393
  rect
30480
30394
  };
30481
30395
  }
30482
30396
  }
30397
+ this.pagesBoundingRects = nextRects;
30483
30398
  },
30484
30399
  getDisplayedPageScale(docIndex, pageIndex) {
30485
30400
  const doc = this.pdfDocuments[docIndex];
30486
30401
  if (!doc) return 1;
30402
+ const baseWidth = doc.pageWidths?.[pageIndex] || 0;
30403
+ const rectWidth = this.pagesBoundingRects[`${docIndex}-${pageIndex}`]?.rect?.width || 0;
30404
+ if (rectWidth && baseWidth) {
30405
+ return rectWidth / baseWidth;
30406
+ }
30407
+ const canvas = this.getPageCanvasElement(docIndex, pageIndex);
30408
+ const fallbackRectWidth = canvas?.getBoundingClientRect?.().width || 0;
30409
+ if (fallbackRectWidth && baseWidth) {
30410
+ return fallbackRectWidth / baseWidth;
30411
+ }
30487
30412
  const base = doc.pagesScale[pageIndex] || 1;
30488
30413
  const factor = this.visualScale && this.scale ? this.visualScale / this.scale : 1;
30489
30414
  return base * factor;
@@ -30507,6 +30432,14 @@ function readAsPDF(file) {
30507
30432
  if (this.isAddingMode || this.isDraggingElement) {
30508
30433
  this.cachePageBounds();
30509
30434
  }
30435
+ if (this.autoFitZoom && !this.isAddingMode && !this.isDraggingElement) {
30436
+ const containerWidth = this.$el?.clientWidth || 0;
30437
+ if (containerWidth && containerWidth !== this.lastContainerWidth) {
30438
+ this.lastContainerWidth = containerWidth;
30439
+ this.autoFitApplied = false;
30440
+ this.scheduleAutoFitZoom();
30441
+ }
30442
+ }
30510
30443
  this.viewportRafId = 0;
30511
30444
  });
30512
30445
  },
@@ -30527,16 +30460,16 @@ function readAsPDF(file) {
30527
30460
  foundPage = true;
30528
30461
  const canvasEl = this.getPageCanvasElement(docIndex, pageIndex);
30529
30462
  const pagesScale = this.pdfDocuments[docIndex]?.pagesScale?.[pageIndex] || 1;
30530
- const layoutWidth = canvasEl?.offsetWidth || rect.width;
30531
- const layoutHeight = canvasEl?.offsetHeight || rect.height;
30532
- const layoutScaleX = layoutWidth ? rect.width / layoutWidth : 1;
30533
- const layoutScaleY = layoutHeight ? rect.height / layoutHeight : 1;
30463
+ const renderWidth = canvasEl?.width || rect.width;
30464
+ const renderHeight = canvasEl?.height || rect.height;
30465
+ const layoutScaleX = renderWidth ? rect.width / renderWidth : 1;
30466
+ const layoutScaleY = renderHeight ? rect.height / renderHeight : 1;
30534
30467
  const relX = (clientX - rect.left) / layoutScaleX / pagesScale;
30535
30468
  const relY = (clientY - rect.top) / layoutScaleY / pagesScale;
30536
- const pageWidth = layoutWidth / pagesScale;
30537
- const pageHeight = layoutHeight / pagesScale;
30538
- this.previewScale.x = pagesScale * layoutScaleX;
30539
- this.previewScale.y = pagesScale * layoutScaleY;
30469
+ const pageWidth = renderWidth / pagesScale;
30470
+ const pageHeight = renderHeight / pagesScale;
30471
+ this.previewScale.x = pagesScale;
30472
+ this.previewScale.y = pagesScale;
30540
30473
  let x = relX - this.previewElement.width / 2;
30541
30474
  let y = relY - this.previewElement.height / 2;
30542
30475
  x = Math.max(0, Math.min(x, pageWidth - this.previewElement.width));
@@ -30566,7 +30499,11 @@ function readAsPDF(file) {
30566
30499
  const factor = 1 - event.deltaY * 0.002;
30567
30500
  const nextVisual = Math.max(0.5, Math.min(3.0, this.visualScale * factor));
30568
30501
  this.visualScale = nextVisual;
30569
- this.debouncedApplyZoom();
30502
+ if (this.wheelZoomRafId) return;
30503
+ this.wheelZoomRafId = window.requestAnimationFrame(() => {
30504
+ this.wheelZoomRafId = null;
30505
+ this.commitZoom();
30506
+ });
30570
30507
  },
30571
30508
  commitZoom() {
30572
30509
  const newScale = this.visualScale;
@@ -30627,23 +30564,25 @@ function readAsPDF(file) {
30627
30564
  getAllObjects(docIndex = this.selectedDocIndex) {
30628
30565
  if (docIndex < 0 || docIndex >= this.pdfDocuments.length) return [];
30629
30566
  const doc = this.pdfDocuments[docIndex];
30630
- const scale = this.scale || 1;
30631
30567
  const result = [];
30632
30568
  doc.allObjects.forEach((pageObjects, pageIndex) => {
30633
30569
  const pageRef = this.getPageComponent(docIndex, pageIndex);
30634
30570
  if (!pageRef) return;
30635
30571
  const measurement = pageRef.getCanvasMeasurement();
30636
- const normalizedCanvasHeight = measurement.canvasHeight / scale;
30572
+ const pagesScale = doc.pagesScale[pageIndex] || 1;
30573
+ const normalizedCanvasHeight = measurement.canvasHeight / pagesScale;
30637
30574
  pageObjects.forEach(object => {
30638
30575
  result.push({
30639
30576
  ...object,
30640
30577
  pageIndex,
30641
30578
  pageNumber: pageIndex + 1,
30642
- scale,
30579
+ scale: pagesScale,
30643
30580
  normalizedCoordinates: {
30644
30581
  llx: parseInt(object.x, 10),
30645
30582
  lly: parseInt(normalizedCanvasHeight - object.y, 10),
30646
- ury: parseInt(normalizedCanvasHeight - object.y - object.height, 10)
30583
+ ury: parseInt(normalizedCanvasHeight - object.y - object.height, 10),
30584
+ width: parseInt(object.width, 10),
30585
+ height: parseInt(object.height, 10)
30647
30586
  }
30648
30587
  });
30649
30588
  });
@@ -30737,8 +30676,24 @@ function readAsPDF(file) {
30737
30676
  deleteObject(docIndex, objectId) {
30738
30677
  if (docIndex < 0 || docIndex >= this.pdfDocuments.length) return;
30739
30678
  const doc = this.pdfDocuments[docIndex];
30740
- doc.allObjects = doc.allObjects.map(objects => objects.filter(object => object.id !== objectId));
30679
+ let deletedObject = null;
30680
+ let deletedPageIndex = -1;
30681
+ doc.allObjects = doc.allObjects.map((objects, pageIndex) => objects.filter(object => {
30682
+ if (object.id === objectId) {
30683
+ deletedObject = object;
30684
+ deletedPageIndex = pageIndex;
30685
+ return false;
30686
+ }
30687
+ return true;
30688
+ }));
30741
30689
  delete this.objectIndexCache[`${docIndex}-${objectId}`];
30690
+ if (deletedObject) {
30691
+ this.$emit('pdf-elements:delete-object', {
30692
+ object: deletedObject,
30693
+ docIndex,
30694
+ pageIndex: deletedPageIndex
30695
+ });
30696
+ }
30742
30697
  },
30743
30698
  checkAndMoveObjectPage(docIndex, objectId, mouseX, mouseY) {
30744
30699
  if (docIndex < 0 || docIndex >= this.pdfDocuments.length) return undefined;
@@ -30826,6 +30781,7 @@ function readAsPDF(file) {
30826
30781
  return Math.max(0.1, Math.min(2, availableWidth / maxPageWidth));
30827
30782
  },
30828
30783
  scheduleAutoFitZoom() {
30784
+ if (this.autoFitApplied) return;
30829
30785
  if (this.zoomRafId) return;
30830
30786
  this.zoomRafId = window.requestAnimationFrame(() => {
30831
30787
  this.zoomRafId = 0;
@@ -30833,7 +30789,7 @@ function readAsPDF(file) {
30833
30789
  });
30834
30790
  },
30835
30791
  adjustZoomToFit() {
30836
- if (!this.autoFitZoom || !this.pdfDocuments.length) return;
30792
+ if (!this.autoFitZoom || this.autoFitApplied || !this.pdfDocuments.length) return;
30837
30793
  const widths = this.pdfDocuments.flatMap(doc => doc.pageWidths || []).filter(width => width > 0);
30838
30794
  let maxCanvasWidth = 0;
30839
30795
  if (widths.length) {
@@ -30848,6 +30804,7 @@ function readAsPDF(file) {
30848
30804
  maxCanvasWidth = Math.max(...Array.from(canvases).map(canvas => canvas.width / (this.scale || 1)));
30849
30805
  }
30850
30806
  const optimalScale = this.calculateOptimalScale(maxCanvasWidth);
30807
+ this.autoFitApplied = true;
30851
30808
  if (Math.abs(optimalScale - this.scale) > 0.01) {
30852
30809
  this.scale = optimalScale;
30853
30810
  this.visualScale = optimalScale;
@@ -30861,10 +30818,10 @@ function readAsPDF(file) {
30861
30818
  });
30862
30819
  ;// ./src/components/PDFElements.vue?vue&type=script&lang=js
30863
30820
  /* harmony default export */ const components_PDFElementsvue_type_script_lang_js = (PDFElementsvue_type_script_lang_js);
30864
- ;// ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-55.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-55.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[2]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/PDFElements.vue?vue&type=style&index=0&id=ddd8aa14&prod&scoped=true&lang=css
30821
+ ;// ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-55.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-55.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-55.use[2]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/PDFElements.vue?vue&type=style&index=0&id=1815c763&prod&scoped=true&lang=css
30865
30822
  // extracted by mini-css-extract-plugin
30866
30823
 
30867
- ;// ./src/components/PDFElements.vue?vue&type=style&index=0&id=ddd8aa14&prod&scoped=true&lang=css
30824
+ ;// ./src/components/PDFElements.vue?vue&type=style&index=0&id=1815c763&prod&scoped=true&lang=css
30868
30825
 
30869
30826
  ;// ./src/components/PDFElements.vue
30870
30827
 
@@ -30881,7 +30838,7 @@ var PDFElements_component = normalizeComponent(
30881
30838
  staticRenderFns,
30882
30839
  false,
30883
30840
  null,
30884
- "ddd8aa14",
30841
+ "1815c763",
30885
30842
  null
30886
30843
 
30887
30844
  )