@vertexvis/doc-viewer 1.0.2-canary.7 → 1.0.2-canary.8

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.
@@ -625,10 +625,22 @@ function apiSupportsLayers(api) {
625
625
  class DocumentLayersController {
626
626
  constructor(api) {
627
627
  this.apiSupportsLayers = false;
628
+ if (api != null) {
629
+ this.setApi(api);
630
+ }
631
+ }
632
+ setApi(api) {
628
633
  if (apiSupportsLayers(api)) {
629
634
  this.apiSupportsLayers = true;
630
635
  this.api = api;
631
636
  }
637
+ else {
638
+ this.clear();
639
+ }
640
+ }
641
+ clear() {
642
+ this.apiSupportsLayers = false;
643
+ this.api = undefined;
632
644
  }
633
645
  /**
634
646
  * Returns a boolean indicating whether the document supports layers.
@@ -34663,6 +34675,7 @@ const VertexDocumentViewer = class {
34663
34675
  this.handleDocumentApiStateChanged = this.handleDocumentApiStateChanged.bind(this);
34664
34676
  this.handlePageLoaded = this.handlePageLoaded.bind(this);
34665
34677
  this.handlePageDrawn = this.handlePageDrawn.bind(this);
34678
+ this.layers = new DocumentLayersController();
34666
34679
  this.resizeObserver = new ResizeObserver(this.handleElementResize);
34667
34680
  this.registerSlotChangeListeners();
34668
34681
  }
@@ -34675,7 +34688,7 @@ const VertexDocumentViewer = class {
34675
34688
  var _a;
34676
34689
  (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.hostEl);
34677
34690
  this.updateComponentDimensions();
34678
- this.handleSrcChange();
34691
+ this.loadInitialSrc();
34679
34692
  this.injectViewerApi();
34680
34693
  }
34681
34694
  disconnectedCallback() {
@@ -34742,12 +34755,13 @@ const VertexDocumentViewer = class {
34742
34755
  await documentApi.loadPage(pageNumber);
34743
34756
  }
34744
34757
  async handleSrcChange() {
34758
+ var _a;
34745
34759
  if (this.src != null && this.canvasEl != null) {
34746
34760
  this.clearCurrentDocument();
34747
34761
  const { api, renderer } = this.provider.create(this.canvasEl, this.config);
34748
34762
  this.documentApi = api;
34749
34763
  this.documentRenderer = renderer;
34750
- this.layers = new DocumentLayersController(api);
34764
+ (_a = this.layers) === null || _a === void 0 ? void 0 : _a.setApi(api);
34751
34765
  this.updateInteractionHandler();
34752
34766
  this.updateDocumentApiListeners();
34753
34767
  await this.documentApi.updateViewport(this.dimensions);
@@ -34764,9 +34778,9 @@ const VertexDocumentViewer = class {
34764
34778
  this.updateInteractionHandler();
34765
34779
  }
34766
34780
  render() {
34767
- return (index.h(index.Host, { key: 'f1ddf0b4e321bc244a5d757e48f6d71c23caca3c' }, index.h("div", { key: '174c64c537f4b0f1c45fc6543e5b7f54515e4063', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, index.h("div", { key: '4c47dadba03b32bde017252a9a8ea7f6e6d323f3', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
34781
+ return (index.h(index.Host, { key: 'a990831d5f2328f2cf21be0b82d4018b05decd51' }, index.h("div", { key: '349abae36254da570e640417fab459680c576465', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, index.h("div", { key: '6fca3f1d5a2c31bdcc0c8dbbd468e306db981740', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
34768
34782
  'enable-pointer-events ': window.PointerEvent != null,
34769
- }) }, index.h("canvas", { key: 'ae645889dd5cb93084f820f9f3d14a56de0213f7', id: "document-viewer-canvas", role: "presentation", ref: el => (this.canvasEl = el) })), index.h("slot", { key: '7762c493306bf5d21cd16218f1abd3c6d0300ace' }))));
34783
+ }) }, index.h("canvas", { key: 'deb1c58d8d20000053cd829401163bf1e68ca88e', id: "document-viewer-canvas", role: "presentation", ref: el => (this.canvasEl = el) })), index.h("slot", { key: '6b87846ef17b330b0fae5d03103765bad6fdafa6' }))));
34770
34784
  }
34771
34785
  getDocumentApi() {
34772
34786
  if (this.documentApi == null) {
@@ -34774,15 +34788,25 @@ const VertexDocumentViewer = class {
34774
34788
  }
34775
34789
  return this.documentApi;
34776
34790
  }
34791
+ async loadInitialSrc() {
34792
+ await Promise.resolve();
34793
+ await this.handleSrcChange();
34794
+ }
34777
34795
  clearCurrentDocument() {
34778
- var _a, _b, _c, _d, _e, _f;
34796
+ var _a, _b, _c, _d, _e, _f, _g;
34779
34797
  (_a = this.documentRenderer) === null || _a === void 0 ? void 0 : _a.dispose();
34780
34798
  (_b = this.documentApi) === null || _b === void 0 ? void 0 : _b.dispose();
34781
34799
  (_c = this.panInteractionHandler) === null || _c === void 0 ? void 0 : _c.dispose();
34782
34800
  (_d = this.documentApiStateChangedDisposable) === null || _d === void 0 ? void 0 : _d.dispose();
34783
34801
  (_e = this.pageLoadedDisposable) === null || _e === void 0 ? void 0 : _e.dispose();
34784
34802
  (_f = this.pageDrawnDisposable) === null || _f === void 0 ? void 0 : _f.dispose();
34785
- this.layers = undefined;
34803
+ this.documentRenderer = undefined;
34804
+ this.documentApi = undefined;
34805
+ this.panInteractionHandler = undefined;
34806
+ this.documentApiStateChangedDisposable = undefined;
34807
+ this.pageLoadedDisposable = undefined;
34808
+ this.pageDrawnDisposable = undefined;
34809
+ (_g = this.layers) === null || _g === void 0 ? void 0 : _g.clear();
34786
34810
  }
34787
34811
  handleDocumentApiStateChanged(state) {
34788
34812
  this.documentState = state;
@@ -34,6 +34,7 @@ export class VertexDocumentViewer {
34
34
  this.handleDocumentApiStateChanged = this.handleDocumentApiStateChanged.bind(this);
35
35
  this.handlePageLoaded = this.handlePageLoaded.bind(this);
36
36
  this.handlePageDrawn = this.handlePageDrawn.bind(this);
37
+ this.layers = new DocumentLayersController();
37
38
  this.resizeObserver = new ResizeObserver(this.handleElementResize);
38
39
  this.registerSlotChangeListeners();
39
40
  }
@@ -46,7 +47,7 @@ export class VertexDocumentViewer {
46
47
  var _a;
47
48
  (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.hostEl);
48
49
  this.updateComponentDimensions();
49
- this.handleSrcChange();
50
+ this.loadInitialSrc();
50
51
  this.injectViewerApi();
51
52
  }
52
53
  disconnectedCallback() {
@@ -113,12 +114,13 @@ export class VertexDocumentViewer {
113
114
  await documentApi.loadPage(pageNumber);
114
115
  }
115
116
  async handleSrcChange() {
117
+ var _a;
116
118
  if (this.src != null && this.canvasEl != null) {
117
119
  this.clearCurrentDocument();
118
120
  const { api, renderer } = this.provider.create(this.canvasEl, this.config);
119
121
  this.documentApi = api;
120
122
  this.documentRenderer = renderer;
121
- this.layers = new DocumentLayersController(api);
123
+ (_a = this.layers) === null || _a === void 0 ? void 0 : _a.setApi(api);
122
124
  this.updateInteractionHandler();
123
125
  this.updateDocumentApiListeners();
124
126
  await this.documentApi.updateViewport(this.dimensions);
@@ -135,9 +137,9 @@ export class VertexDocumentViewer {
135
137
  this.updateInteractionHandler();
136
138
  }
137
139
  render() {
138
- return (h(Host, { key: 'f1ddf0b4e321bc244a5d757e48f6d71c23caca3c' }, h("div", { key: '174c64c537f4b0f1c45fc6543e5b7f54515e4063', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, h("div", { key: '4c47dadba03b32bde017252a9a8ea7f6e6d323f3', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
140
+ return (h(Host, { key: 'a990831d5f2328f2cf21be0b82d4018b05decd51' }, h("div", { key: '349abae36254da570e640417fab459680c576465', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, h("div", { key: '6fca3f1d5a2c31bdcc0c8dbbd468e306db981740', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
139
141
  'enable-pointer-events ': window.PointerEvent != null,
140
- }) }, h("canvas", { key: 'ae645889dd5cb93084f820f9f3d14a56de0213f7', id: "document-viewer-canvas", role: "presentation", ref: el => (this.canvasEl = el) })), h("slot", { key: '7762c493306bf5d21cd16218f1abd3c6d0300ace' }))));
142
+ }) }, h("canvas", { key: 'deb1c58d8d20000053cd829401163bf1e68ca88e', id: "document-viewer-canvas", role: "presentation", ref: el => (this.canvasEl = el) })), h("slot", { key: '6b87846ef17b330b0fae5d03103765bad6fdafa6' }))));
141
143
  }
142
144
  getDocumentApi() {
143
145
  if (this.documentApi == null) {
@@ -145,15 +147,25 @@ export class VertexDocumentViewer {
145
147
  }
146
148
  return this.documentApi;
147
149
  }
150
+ async loadInitialSrc() {
151
+ await Promise.resolve();
152
+ await this.handleSrcChange();
153
+ }
148
154
  clearCurrentDocument() {
149
- var _a, _b, _c, _d, _e, _f;
155
+ var _a, _b, _c, _d, _e, _f, _g;
150
156
  (_a = this.documentRenderer) === null || _a === void 0 ? void 0 : _a.dispose();
151
157
  (_b = this.documentApi) === null || _b === void 0 ? void 0 : _b.dispose();
152
158
  (_c = this.panInteractionHandler) === null || _c === void 0 ? void 0 : _c.dispose();
153
159
  (_d = this.documentApiStateChangedDisposable) === null || _d === void 0 ? void 0 : _d.dispose();
154
160
  (_e = this.pageLoadedDisposable) === null || _e === void 0 ? void 0 : _e.dispose();
155
161
  (_f = this.pageDrawnDisposable) === null || _f === void 0 ? void 0 : _f.dispose();
156
- this.layers = undefined;
162
+ this.documentRenderer = undefined;
163
+ this.documentApi = undefined;
164
+ this.panInteractionHandler = undefined;
165
+ this.documentApiStateChangedDisposable = undefined;
166
+ this.pageLoadedDisposable = undefined;
167
+ this.pageDrawnDisposable = undefined;
168
+ (_g = this.layers) === null || _g === void 0 ? void 0 : _g.clear();
157
169
  }
158
170
  handleDocumentApiStateChanged(state) {
159
171
  this.documentState = state;
@@ -5,10 +5,22 @@ import { apiSupportsLayers } from "./types";
5
5
  export class DocumentLayersController {
6
6
  constructor(api) {
7
7
  this.apiSupportsLayers = false;
8
+ if (api != null) {
9
+ this.setApi(api);
10
+ }
11
+ }
12
+ setApi(api) {
8
13
  if (apiSupportsLayers(api)) {
9
14
  this.apiSupportsLayers = true;
10
15
  this.api = api;
11
16
  }
17
+ else {
18
+ this.clear();
19
+ }
20
+ }
21
+ clear() {
22
+ this.apiSupportsLayers = false;
23
+ this.api = undefined;
12
24
  }
13
25
  /**
14
26
  * Returns a boolean indicating whether the document supports layers.