@operato/mini-map 8.0.0 → 9.0.0-beta.10

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/CHANGELOG.md CHANGED
@@ -3,7 +3,34 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [8.0.0](https://github.com/hatiolab/operato/compare/v7.1.33...v8.0.0) (2025-01-14)
6
+ ## [9.0.0-beta.10](https://github.com/hatiolab/operato/compare/v9.0.0-beta.9...v9.0.0-beta.10) (2025-01-25)
7
+
8
+
9
+ ### :bug: Bug Fix
10
+
11
+ * tweak tsconfig.json ([3c424b1](https://github.com/hatiolab/operato/commit/3c424b18d046f95d5619076d113d49a4b4dc9bbb))
12
+
13
+
14
+
15
+ ## [9.0.0-beta.5](https://github.com/hatiolab/operato/compare/v9.0.0-beta.4...v9.0.0-beta.5) (2025-01-20)
16
+
17
+
18
+ ### :bug: Bug Fix
19
+
20
+ * esm module ([1319b00](https://github.com/hatiolab/operato/commit/1319b00d6955a514f63b3469fb514a28f84168a2))
21
+
22
+
23
+
24
+ ## [9.0.0-beta.4](https://github.com/hatiolab/operato/compare/v9.0.0-beta.3...v9.0.0-beta.4) (2025-01-20)
25
+
26
+
27
+ ### :bug: Bug Fix
28
+
29
+ * esm module ([0402232](https://github.com/hatiolab/operato/commit/04022327fa47eac64eaf3c56eeec55b9ace13e0e))
30
+
31
+
32
+
33
+ ## [9.0.0-beta.0](https://github.com/hatiolab/operato/compare/v8.0.0-beta.11...v9.0.0-beta.0) (2025-01-13)
7
34
 
8
35
  **Note:** Version bump only for package @operato/mini-map
9
36
 
@@ -11,22 +38,72 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
11
38
 
12
39
 
13
40
 
14
- ### [7.1.32](https://github.com/hatiolab/operato/compare/v7.1.31...v7.1.32) (2025-01-11)
41
+ ## [8.0.0-beta.2](https://github.com/hatiolab/operato/compare/v8.0.0-beta.1...v8.0.0-beta.2) (2025-01-08)
15
42
 
16
43
 
17
44
  ### :bug: Bug Fix
18
45
 
19
- * missing .npmignore ([03db207](https://github.com/hatiolab/operato/commit/03db207498088b294ccfb9645f6839c2f11645d5))
20
- * typo .npmignore ([df91cae](https://github.com/hatiolab/operato/commit/df91caea0f5938a3febd9307184e5b036a65e2bd))
46
+ * typo .npmignore ([d9c0c8c](https://github.com/hatiolab/operato/commit/d9c0c8c79abc688c3c2cfb6c37fcb689483a5977))
21
47
 
22
48
 
23
49
 
24
- ### [7.1.16](https://github.com/hatiolab/operato/compare/v7.1.15...v7.1.16) (2024-10-13)
50
+ ## [8.0.0-beta.1](https://github.com/hatiolab/operato/compare/v8.0.0-beta.0...v8.0.0-beta.1) (2025-01-08)
25
51
 
26
52
 
27
53
  ### :bug: Bug Fix
28
54
 
29
- * missing datasets and annotations change event notification ([3739661](https://github.com/hatiolab/operato/commit/373966134854834146aa5f892136ad9ddd538a5c))
55
+ * missing .npmignore ([be05985](https://github.com/hatiolab/operato/commit/be05985abfae4af53501f718dd52932099f7fbcb))
56
+
57
+
58
+
59
+ ## [8.0.0-beta.0](https://github.com/hatiolab/operato/compare/v8.0.0-alpha.56...v8.0.0-beta.0) (2025-01-07)
60
+
61
+ **Note:** Version bump only for package @operato/mini-map
62
+
63
+
64
+
65
+
66
+
67
+ ## [8.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v8.0.0-alpha.36...v8.0.0-alpha.37) (2024-10-20)
68
+
69
+
70
+ ### :bug: Bug Fix
71
+
72
+ * update dev-dependencies version ([d6fe342](https://github.com/hatiolab/operato/commit/d6fe342de738c6bad3528550a862b5a1d2573161))
73
+
74
+
75
+
76
+ ## [8.0.0-alpha.33](https://github.com/hatiolab/operato/compare/v8.0.0-alpha.32...v8.0.0-alpha.33) (2024-10-14)
77
+
78
+ **Note:** Version bump only for package @operato/mini-map
79
+
80
+
81
+
82
+
83
+
84
+ ## [8.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v8.0.0-alpha.30...v8.0.0-alpha.31) (2024-10-13)
85
+
86
+
87
+ ### :bug: Bug Fix
88
+
89
+ * missing datasets and annotations change event notification ([073b10d](https://github.com/hatiolab/operato/commit/073b10de469cd82f61cfdfb217f36eb939398288))
90
+
91
+
92
+
93
+ ## [8.0.0-alpha.29](https://github.com/hatiolab/operato/compare/v8.0.0-alpha.28...v8.0.0-alpha.29) (2024-10-10)
94
+
95
+
96
+ ### :bug: Bug Fix
97
+
98
+ * apply pointer-event ([ecc73a1](https://github.com/hatiolab/operato/commit/ecc73a1d2df0d8ce7ba462965062a91461c504c3))
99
+
100
+
101
+
102
+ ## [8.0.0-alpha.0](https://github.com/hatiolab/operato/compare/v7.1.1...v8.0.0-alpha.0) (2024-09-01)
103
+
104
+ **Note:** Version bump only for package @operato/mini-map
105
+
106
+
30
107
 
31
108
 
32
109
 
@@ -4,19 +4,54 @@ import { customElement, property } from 'lit/decorators.js';
4
4
  let OxMiniMapComponent = class OxMiniMapComponent extends LitElement {
5
5
  constructor() {
6
6
  super(...arguments);
7
- this.target = null;
8
- this.isDragging = false;
9
- this.startX = 0;
10
- this.startY = 0;
11
- this.initialScrollLeft = 0;
12
- this.initialScrollTop = 0;
13
- this.observer = null;
7
+ Object.defineProperty(this, "target", {
8
+ enumerable: true,
9
+ configurable: true,
10
+ writable: true,
11
+ value: null
12
+ });
13
+ Object.defineProperty(this, "isDragging", {
14
+ enumerable: true,
15
+ configurable: true,
16
+ writable: true,
17
+ value: false
18
+ });
19
+ Object.defineProperty(this, "startX", {
20
+ enumerable: true,
21
+ configurable: true,
22
+ writable: true,
23
+ value: 0
24
+ });
25
+ Object.defineProperty(this, "startY", {
26
+ enumerable: true,
27
+ configurable: true,
28
+ writable: true,
29
+ value: 0
30
+ });
31
+ Object.defineProperty(this, "initialScrollLeft", {
32
+ enumerable: true,
33
+ configurable: true,
34
+ writable: true,
35
+ value: 0
36
+ });
37
+ Object.defineProperty(this, "initialScrollTop", {
38
+ enumerable: true,
39
+ configurable: true,
40
+ writable: true,
41
+ value: 0
42
+ });
43
+ Object.defineProperty(this, "observer", {
44
+ enumerable: true,
45
+ configurable: true,
46
+ writable: true,
47
+ value: null
48
+ });
14
49
  }
15
50
  connectedCallback() {
16
51
  super.connectedCallback();
17
52
  window.addEventListener('resize', this.handleResize.bind(this));
18
- this.addEventListener('mousemove', this.handleMouseMove.bind(this));
19
- this.addEventListener('mouseup', this.handleMouseUp.bind(this));
53
+ this.addEventListener('pointermove', this.handlePointerMove.bind(this));
54
+ this.addEventListener('pointerup', this.handlePointerUp.bind(this));
20
55
  if (this.target) {
21
56
  this.observeTarget(this.target);
22
57
  }
@@ -24,8 +59,8 @@ let OxMiniMapComponent = class OxMiniMapComponent extends LitElement {
24
59
  disconnectedCallback() {
25
60
  super.disconnectedCallback();
26
61
  window.removeEventListener('resize', this.handleResize.bind(this));
27
- window.removeEventListener('mousemove', this.handleMouseMove.bind(this));
28
- window.removeEventListener('mouseup', this.handleMouseUp.bind(this));
62
+ window.removeEventListener('pointermove', this.handlePointerMove.bind(this));
63
+ window.removeEventListener('pointerup', this.handlePointerUp.bind(this));
29
64
  if (this.observer) {
30
65
  this.observer.disconnect();
31
66
  this.observer = null;
@@ -102,7 +137,7 @@ let OxMiniMapComponent = class OxMiniMapComponent extends LitElement {
102
137
  const viewport = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById('viewport');
103
138
  viewport.style.transform = `scale(${scale}) translate(${left * scaleMinimap}px, ${top * scaleMinimap}px)`;
104
139
  }
105
- handleMouseDown(event) {
140
+ handlePointerDown(event) {
106
141
  this.isDragging = true;
107
142
  this.startX = event.clientX;
108
143
  this.startY = event.clientY;
@@ -111,11 +146,11 @@ let OxMiniMapComponent = class OxMiniMapComponent extends LitElement {
111
146
  this.initialScrollLeft = target.scrollLeft;
112
147
  this.initialScrollTop = target.scrollTop;
113
148
  }
114
- window.addEventListener('mousemove', this.handleMouseMove.bind(this));
115
- window.addEventListener('mouseup', this.handleMouseUp.bind(this));
149
+ window.addEventListener('pointermove', this.handlePointerMove.bind(this));
150
+ window.addEventListener('pointerup', this.handlePointerUp.bind(this));
116
151
  event.preventDefault();
117
152
  }
118
- handleMouseMove(event) {
153
+ handlePointerMove(event) {
119
154
  if (!this.isDragging)
120
155
  return;
121
156
  const deltaX = event.clientX - this.startX;
@@ -133,21 +168,25 @@ let OxMiniMapComponent = class OxMiniMapComponent extends LitElement {
133
168
  this.updateViewportPosition(1, target.scrollLeft, target.scrollTop); // Assuming no additional transform during drag
134
169
  event.preventDefault();
135
170
  }
136
- handleMouseUp(event) {
171
+ handlePointerUp(event) {
137
172
  this.isDragging = false;
138
- window.removeEventListener('mousemove', this.handleMouseMove.bind(this));
139
- window.removeEventListener('mouseup', this.handleMouseUp.bind(this));
173
+ window.removeEventListener('pointermove', this.handlePointerMove.bind(this));
174
+ window.removeEventListener('pointerup', this.handlePointerUp.bind(this));
140
175
  event.preventDefault();
141
176
  }
142
177
  render() {
143
178
  return html `
144
179
  <div id="minimap">
145
- <div id="viewport" @mousedown=${this.handleMouseDown}></div>
180
+ <div id="viewport" @pointerdown=${this.handlePointerDown}></div>
146
181
  </div>
147
182
  `;
148
183
  }
149
184
  };
150
- OxMiniMapComponent.styles = css `
185
+ Object.defineProperty(OxMiniMapComponent, "styles", {
186
+ enumerable: true,
187
+ configurable: true,
188
+ writable: true,
189
+ value: css `
151
190
  :host {
152
191
  display: flex;
153
192
  position: relative;
@@ -175,7 +214,8 @@ OxMiniMapComponent.styles = css `
175
214
  cursor: move;
176
215
  background-color: rgba(255, 255, 255, 0.5);
177
216
  }
178
- `;
217
+ `
218
+ });
179
219
  __decorate([
180
220
  property({ type: Object })
181
221
  ], OxMiniMapComponent.prototype, "target", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"ox-mini-map.js","sourceRoot":"","sources":["../../src/ox-mini-map.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement, PropertyValueMap } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('ox-mini-map')\nclass OxMiniMapComponent extends LitElement {\n static styles = css`\n :host {\n display: flex;\n position: relative;\n background-color: gray;\n width: 200px; /* 기본 너비 */\n height: 150px; /* 기본 높이 */\n }\n\n #minimap {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n background-color: var(--md-sys-color-surface);\n overflow: hidden;\n }\n\n #viewport {\n position: absolute;\n border: 1px dashed blue;\n box-sizing: border-box;\n cursor: move;\n background-color: rgba(255, 255, 255, 0.5);\n }\n `\n\n @property({ type: Object }) target: HTMLElement | null = null\n private isDragging = false\n private startX = 0\n private startY = 0\n private initialScrollLeft = 0\n private initialScrollTop = 0\n private observer: MutationObserver | null = null\n\n connectedCallback() {\n super.connectedCallback()\n window.addEventListener('resize', this.handleResize.bind(this))\n this.addEventListener('mousemove', this.handleMouseMove.bind(this))\n this.addEventListener('mouseup', this.handleMouseUp.bind(this))\n if (this.target) {\n this.observeTarget(this.target)\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n window.removeEventListener('resize', this.handleResize.bind(this))\n window.removeEventListener('mousemove', this.handleMouseMove.bind(this))\n window.removeEventListener('mouseup', this.handleMouseUp.bind(this))\n if (this.observer) {\n this.observer.disconnect()\n this.observer = null\n }\n }\n\n firstUpdated(changes: PropertyValueMap<any> | Map<PropertyKey, unknown>) {\n super.firstUpdated(changes)\n this.updateTarget()\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('target')) {\n this.updateTarget()\n if (this.target) {\n this.observeTarget(this.target)\n }\n }\n }\n\n handleResize() {\n this.updateTarget()\n }\n\n observeTarget(target: HTMLElement) {\n if (this.observer) {\n this.observer.disconnect()\n }\n this.observer = new MutationObserver(() => {\n this.updateTarget()\n })\n this.observer.observe(target, { attributes: true, attributeFilter: ['style'] })\n }\n\n updateTarget() {\n const target = this.target || this.parentElement\n if (!target) {\n return\n }\n\n const targetStyle = window.getComputedStyle(target)\n const transform = targetStyle.transform\n const scaleMatch = /scale\\(([^,]+),?([^)]+)?\\)/.exec(transform)\n const leftMatch = /translate\\(([^,]+)px, ?([^)]+)?px\\)/.exec(transform)\n\n let scale = 1\n let left = 0\n let top = 0\n\n if (scaleMatch) {\n scale = parseFloat(scaleMatch[1])\n }\n\n if (leftMatch) {\n left = parseFloat(leftMatch[1])\n top = parseFloat(leftMatch[2] || '0')\n }\n\n const targetRatio = target.scrollHeight / target.scrollWidth\n const thisRatio = this.offsetHeight / this.offsetWidth\n\n const scaleMinimap =\n targetRatio > thisRatio ? this.offsetHeight / target.scrollHeight : this.offsetWidth / target.scrollWidth\n\n const minimapHeight = target.scrollHeight * scaleMinimap\n const minimapWidth = target.scrollWidth * scaleMinimap\n\n const viewportHeight = target.clientHeight * scaleMinimap\n const viewportWidth = target.clientWidth * scaleMinimap\n\n const minimap = this.shadowRoot?.getElementById('minimap') as HTMLElement\n const viewport = this.shadowRoot?.getElementById('viewport') as HTMLElement\n\n minimap.style.width = `${minimapWidth}px`\n minimap.style.height = `${minimapHeight}px`\n\n viewport.style.width = `${viewportWidth}px`\n viewport.style.height = `${viewportHeight}px`\n\n this.updateViewportPosition(scale, left, top)\n }\n\n updateViewportPosition(scale: number, left: number, top: number) {\n const target = this.target || this.parentElement\n if (!target) {\n return\n }\n\n const targetRatio = target.scrollHeight / target.scrollWidth\n const thisRatio = this.offsetHeight / this.offsetWidth\n\n const scaleMinimap =\n targetRatio > thisRatio ? this.offsetHeight / target.scrollHeight : this.offsetWidth / target.scrollWidth\n\n const viewport = this.shadowRoot?.getElementById('viewport') as HTMLElement\n viewport.style.transform = `scale(${scale}) translate(${left * scaleMinimap}px, ${top * scaleMinimap}px)`\n }\n\n handleMouseDown(event: MouseEvent) {\n this.isDragging = true\n this.startX = event.clientX\n this.startY = event.clientY\n\n const target = this.target || this.parentElement\n if (target) {\n this.initialScrollLeft = target.scrollLeft\n this.initialScrollTop = target.scrollTop\n }\n\n window.addEventListener('mousemove', this.handleMouseMove.bind(this))\n window.addEventListener('mouseup', this.handleMouseUp.bind(this))\n\n event.preventDefault()\n }\n\n handleMouseMove(event: MouseEvent) {\n if (!this.isDragging) return\n\n const deltaX = event.clientX - this.startX\n const deltaY = event.clientY - this.startY\n\n const target = this.target || this.parentElement\n if (!target) return\n\n const targetRatio = target.scrollHeight / target.scrollWidth\n const thisRatio = this.offsetHeight / this.offsetWidth\n\n const scale =\n targetRatio > thisRatio ? this.offsetHeight / target.scrollHeight : this.offsetWidth / target.scrollWidth\n\n const scrollX = deltaX / scale\n const scrollY = deltaY / scale\n\n target.scrollLeft = this.initialScrollLeft + scrollX\n target.scrollTop = this.initialScrollTop + scrollY\n\n this.updateViewportPosition(1, target.scrollLeft, target.scrollTop) // Assuming no additional transform during drag\n\n event.preventDefault()\n }\n\n handleMouseUp(event: MouseEvent) {\n this.isDragging = false\n window.removeEventListener('mousemove', this.handleMouseMove.bind(this))\n window.removeEventListener('mouseup', this.handleMouseUp.bind(this))\n event.preventDefault()\n }\n\n render() {\n return html`\n <div id=\"minimap\">\n <div id=\"viewport\" @mousedown=${this.handleMouseDown}></div>\n </div>\n `\n }\n}\n"]}
1
+ {"version":3,"file":"ox-mini-map.js","sourceRoot":"","sources":["../../src/ox-mini-map.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement, PropertyValueMap } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('ox-mini-map')\nclass OxMiniMapComponent extends LitElement {\n static styles = css`\n :host {\n display: flex;\n position: relative;\n background-color: gray;\n width: 200px; /* 기본 너비 */\n height: 150px; /* 기본 높이 */\n }\n\n #minimap {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n background-color: var(--md-sys-color-surface);\n overflow: hidden;\n }\n\n #viewport {\n position: absolute;\n border: 1px dashed blue;\n box-sizing: border-box;\n cursor: move;\n background-color: rgba(255, 255, 255, 0.5);\n }\n `\n\n @property({ type: Object }) target: HTMLElement | null = null\n private isDragging = false\n private startX = 0\n private startY = 0\n private initialScrollLeft = 0\n private initialScrollTop = 0\n private observer: MutationObserver | null = null\n\n connectedCallback() {\n super.connectedCallback()\n window.addEventListener('resize', this.handleResize.bind(this))\n this.addEventListener('pointermove', this.handlePointerMove.bind(this))\n this.addEventListener('pointerup', this.handlePointerUp.bind(this))\n if (this.target) {\n this.observeTarget(this.target)\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n window.removeEventListener('resize', this.handleResize.bind(this))\n window.removeEventListener('pointermove', this.handlePointerMove.bind(this))\n window.removeEventListener('pointerup', this.handlePointerUp.bind(this))\n if (this.observer) {\n this.observer.disconnect()\n this.observer = null\n }\n }\n\n firstUpdated(changes: PropertyValueMap<any> | Map<PropertyKey, unknown>) {\n super.firstUpdated(changes)\n this.updateTarget()\n }\n\n updated(changedProperties: Map<string, any>) {\n if (changedProperties.has('target')) {\n this.updateTarget()\n if (this.target) {\n this.observeTarget(this.target)\n }\n }\n }\n\n handleResize() {\n this.updateTarget()\n }\n\n observeTarget(target: HTMLElement) {\n if (this.observer) {\n this.observer.disconnect()\n }\n this.observer = new MutationObserver(() => {\n this.updateTarget()\n })\n this.observer.observe(target, { attributes: true, attributeFilter: ['style'] })\n }\n\n updateTarget() {\n const target = this.target || this.parentElement\n if (!target) {\n return\n }\n\n const targetStyle = window.getComputedStyle(target)\n const transform = targetStyle.transform\n const scaleMatch = /scale\\(([^,]+),?([^)]+)?\\)/.exec(transform)\n const leftMatch = /translate\\(([^,]+)px, ?([^)]+)?px\\)/.exec(transform)\n\n let scale = 1\n let left = 0\n let top = 0\n\n if (scaleMatch) {\n scale = parseFloat(scaleMatch[1])\n }\n\n if (leftMatch) {\n left = parseFloat(leftMatch[1])\n top = parseFloat(leftMatch[2] || '0')\n }\n\n const targetRatio = target.scrollHeight / target.scrollWidth\n const thisRatio = this.offsetHeight / this.offsetWidth\n\n const scaleMinimap =\n targetRatio > thisRatio ? this.offsetHeight / target.scrollHeight : this.offsetWidth / target.scrollWidth\n\n const minimapHeight = target.scrollHeight * scaleMinimap\n const minimapWidth = target.scrollWidth * scaleMinimap\n\n const viewportHeight = target.clientHeight * scaleMinimap\n const viewportWidth = target.clientWidth * scaleMinimap\n\n const minimap = this.shadowRoot?.getElementById('minimap') as HTMLElement\n const viewport = this.shadowRoot?.getElementById('viewport') as HTMLElement\n\n minimap.style.width = `${minimapWidth}px`\n minimap.style.height = `${minimapHeight}px`\n\n viewport.style.width = `${viewportWidth}px`\n viewport.style.height = `${viewportHeight}px`\n\n this.updateViewportPosition(scale, left, top)\n }\n\n updateViewportPosition(scale: number, left: number, top: number) {\n const target = this.target || this.parentElement\n if (!target) {\n return\n }\n\n const targetRatio = target.scrollHeight / target.scrollWidth\n const thisRatio = this.offsetHeight / this.offsetWidth\n\n const scaleMinimap =\n targetRatio > thisRatio ? this.offsetHeight / target.scrollHeight : this.offsetWidth / target.scrollWidth\n\n const viewport = this.shadowRoot?.getElementById('viewport') as HTMLElement\n viewport.style.transform = `scale(${scale}) translate(${left * scaleMinimap}px, ${top * scaleMinimap}px)`\n }\n\n handlePointerDown(event: MouseEvent) {\n this.isDragging = true\n this.startX = event.clientX\n this.startY = event.clientY\n\n const target = this.target || this.parentElement\n if (target) {\n this.initialScrollLeft = target.scrollLeft\n this.initialScrollTop = target.scrollTop\n }\n\n window.addEventListener('pointermove', this.handlePointerMove.bind(this))\n window.addEventListener('pointerup', this.handlePointerUp.bind(this))\n\n event.preventDefault()\n }\n\n handlePointerMove(event: MouseEvent) {\n if (!this.isDragging) return\n\n const deltaX = event.clientX - this.startX\n const deltaY = event.clientY - this.startY\n\n const target = this.target || this.parentElement\n if (!target) return\n\n const targetRatio = target.scrollHeight / target.scrollWidth\n const thisRatio = this.offsetHeight / this.offsetWidth\n\n const scale =\n targetRatio > thisRatio ? this.offsetHeight / target.scrollHeight : this.offsetWidth / target.scrollWidth\n\n const scrollX = deltaX / scale\n const scrollY = deltaY / scale\n\n target.scrollLeft = this.initialScrollLeft + scrollX\n target.scrollTop = this.initialScrollTop + scrollY\n\n this.updateViewportPosition(1, target.scrollLeft, target.scrollTop) // Assuming no additional transform during drag\n\n event.preventDefault()\n }\n\n handlePointerUp(event: MouseEvent) {\n this.isDragging = false\n window.removeEventListener('pointermove', this.handlePointerMove.bind(this))\n window.removeEventListener('pointerup', this.handlePointerUp.bind(this))\n event.preventDefault()\n }\n\n render() {\n return html`\n <div id=\"minimap\">\n <div id=\"viewport\" @pointerdown=${this.handlePointerDown}></div>\n </div>\n `\n }\n}\n"]}