@deck.gl/widgets 9.1.0-beta.1 → 9.1.0-beta.3
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/dist/compass-widget.d.ts +6 -4
- package/dist/compass-widget.d.ts.map +1 -1
- package/dist/compass-widget.js +35 -14
- package/dist/compass-widget.js.map +1 -0
- package/dist/components.js +1 -0
- package/dist/components.js.map +1 -0
- package/dist/dist.dev.js +103 -65
- package/dist/fullscreen-widget.d.ts +5 -3
- package/dist/fullscreen-widget.d.ts.map +1 -1
- package/dist/fullscreen-widget.js +18 -19
- package/dist/fullscreen-widget.js.map +1 -0
- package/dist/index.cjs +86 -46
- package/dist/index.cjs.map +4 -4
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -0
- package/dist/themes.js +1 -0
- package/dist/themes.js.map +1 -0
- package/dist/zoom-widget.d.ts +6 -4
- package/dist/zoom-widget.d.ts.map +1 -1
- package/dist/zoom-widget.js +40 -16
- package/dist/zoom-widget.js.map +1 -0
- package/dist.min.js +1 -1
- package/package.json +3 -3
- package/src/compass-widget.tsx +48 -17
- package/src/fullscreen-widget.tsx +27 -23
- package/src/index.ts +4 -0
- package/src/zoom-widget.tsx +64 -33
package/dist/index.cjs
CHANGED
|
@@ -56,12 +56,14 @@ var FullscreenWidget = class {
|
|
|
56
56
|
this.id = "fullscreen";
|
|
57
57
|
this.placement = "top-left";
|
|
58
58
|
this.fullscreen = false;
|
|
59
|
-
this.id = props.id
|
|
60
|
-
this.placement = props.placement
|
|
61
|
-
props
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
59
|
+
this.id = props.id ?? this.id;
|
|
60
|
+
this.placement = props.placement ?? this.placement;
|
|
61
|
+
this.props = {
|
|
62
|
+
...props,
|
|
63
|
+
enterLabel: props.enterLabel ?? "Enter Fullscreen",
|
|
64
|
+
exitLabel: props.exitLabel ?? "Exit Fullscreen",
|
|
65
|
+
style: props.style ?? {}
|
|
66
|
+
};
|
|
65
67
|
}
|
|
66
68
|
onAdd({ deck }) {
|
|
67
69
|
const { style, className } = this.props;
|
|
@@ -69,9 +71,7 @@ var FullscreenWidget = class {
|
|
|
69
71
|
el.classList.add("deck-widget", "deck-widget-fullscreen");
|
|
70
72
|
if (className)
|
|
71
73
|
el.classList.add(className);
|
|
72
|
-
|
|
73
|
-
Object.entries(style).map(([key, value]) => el.style.setProperty(key, value));
|
|
74
|
-
}
|
|
74
|
+
(0, import_core._applyStyles)(el, style);
|
|
75
75
|
this.deck = deck;
|
|
76
76
|
this.element = el;
|
|
77
77
|
this.update();
|
|
@@ -85,14 +85,15 @@ var FullscreenWidget = class {
|
|
|
85
85
|
}
|
|
86
86
|
update() {
|
|
87
87
|
const { enterLabel, exitLabel } = this.props;
|
|
88
|
-
const
|
|
89
|
-
if (!
|
|
88
|
+
const element = this.element;
|
|
89
|
+
if (!element) {
|
|
90
90
|
return;
|
|
91
91
|
}
|
|
92
92
|
const ui = (0, import_jsx_runtime2.jsx)(IconButton, { onClick: this.handleClick.bind(this), label: this.fullscreen ? exitLabel : enterLabel, className: this.fullscreen ? "deck-widget-fullscreen-exit" : "deck-widget-fullscreen-enter" });
|
|
93
|
-
(0, import_preact.render)(ui,
|
|
93
|
+
(0, import_preact.render)(ui, element);
|
|
94
94
|
}
|
|
95
95
|
setProps(props) {
|
|
96
|
+
this.placement = props.placement ?? this.placement;
|
|
96
97
|
const oldProps = this.props;
|
|
97
98
|
const el = this.element;
|
|
98
99
|
if (el) {
|
|
@@ -103,15 +104,12 @@ var FullscreenWidget = class {
|
|
|
103
104
|
el.classList.add(props.className);
|
|
104
105
|
}
|
|
105
106
|
if (!(0, import_core._deepEqual)(oldProps.style, props.style, 1)) {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
}
|
|
109
|
-
if (props.style) {
|
|
110
|
-
Object.entries(props.style).map(([key, value]) => el.style.setProperty(key, value));
|
|
111
|
-
}
|
|
107
|
+
(0, import_core._removeStyles)(el, oldProps.style);
|
|
108
|
+
(0, import_core._applyStyles)(el, props.style);
|
|
112
109
|
}
|
|
113
110
|
}
|
|
114
111
|
Object.assign(this.props, props);
|
|
112
|
+
this.update();
|
|
115
113
|
}
|
|
116
114
|
getContainer() {
|
|
117
115
|
var _a, _b;
|
|
@@ -164,20 +162,41 @@ var CompassWidget = class {
|
|
|
164
162
|
this.placement = "top-left";
|
|
165
163
|
this.viewId = null;
|
|
166
164
|
this.viewports = {};
|
|
167
|
-
this.id = props.id
|
|
168
|
-
this.viewId = props.viewId
|
|
169
|
-
this.placement = props.placement
|
|
170
|
-
props
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
165
|
+
this.id = props.id ?? this.id;
|
|
166
|
+
this.viewId = props.viewId ?? this.viewId;
|
|
167
|
+
this.placement = props.placement ?? this.placement;
|
|
168
|
+
this.props = {
|
|
169
|
+
...props,
|
|
170
|
+
transitionDuration: props.transitionDuration ?? 200,
|
|
171
|
+
label: props.label ?? "Reset Compass",
|
|
172
|
+
style: props.style ?? {}
|
|
173
|
+
};
|
|
174
174
|
}
|
|
175
175
|
setProps(props) {
|
|
176
|
+
this.placement = props.placement ?? this.placement;
|
|
177
|
+
this.viewId = props.viewId ?? this.viewId;
|
|
178
|
+
const oldProps = this.props;
|
|
179
|
+
const el = this.element;
|
|
180
|
+
if (el) {
|
|
181
|
+
if (oldProps.className !== props.className) {
|
|
182
|
+
if (oldProps.className)
|
|
183
|
+
el.classList.remove(oldProps.className);
|
|
184
|
+
if (props.className)
|
|
185
|
+
el.classList.add(props.className);
|
|
186
|
+
}
|
|
187
|
+
if (!(0, import_core2._deepEqual)(oldProps.style, props.style, 1)) {
|
|
188
|
+
(0, import_core2._removeStyles)(el, oldProps.style);
|
|
189
|
+
(0, import_core2._applyStyles)(el, props.style);
|
|
190
|
+
}
|
|
191
|
+
}
|
|
176
192
|
Object.assign(this.props, props);
|
|
193
|
+
this.update();
|
|
177
194
|
}
|
|
178
195
|
onViewportChange(viewport) {
|
|
179
|
-
this.viewports[viewport.id]
|
|
180
|
-
|
|
196
|
+
if (!viewport.equals(this.viewports[viewport.id])) {
|
|
197
|
+
this.viewports[viewport.id] = viewport;
|
|
198
|
+
this.update();
|
|
199
|
+
}
|
|
181
200
|
}
|
|
182
201
|
onAdd({ deck }) {
|
|
183
202
|
const { style, className } = this.props;
|
|
@@ -185,9 +204,7 @@ var CompassWidget = class {
|
|
|
185
204
|
element.classList.add("deck-widget", "deck-widget-compass");
|
|
186
205
|
if (className)
|
|
187
206
|
element.classList.add(className);
|
|
188
|
-
|
|
189
|
-
Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));
|
|
190
|
-
}
|
|
207
|
+
(0, import_core2._applyStyles)(element, style);
|
|
191
208
|
this.deck = deck;
|
|
192
209
|
this.element = element;
|
|
193
210
|
this.update();
|
|
@@ -214,7 +231,7 @@ var CompassWidget = class {
|
|
|
214
231
|
for (const viewport2 of Object.values(this.viewports)) {
|
|
215
232
|
this.handleCompassReset(viewport2);
|
|
216
233
|
}
|
|
217
|
-
},
|
|
234
|
+
}, title: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: (0, import_jsx_runtime3.jsx)("svg", { fill: "none", width: "100%", height: "100%", viewBox: "0 0 26 26", children: (0, import_jsx_runtime3.jsxs)("g", { transform: `rotate(${rz},13,13)`, children: [(0, import_jsx_runtime3.jsx)("path", { d: "M10 13.0001L12.9999 5L15.9997 13.0001H10Z", fill: "var(--icon-compass-north-color, #F05C44)" }), (0, import_jsx_runtime3.jsx)("path", { d: "M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z", fill: "var(--icon-compass-south-color, #C2C2CC)" })] }) }) }) });
|
|
218
235
|
(0, import_preact2.render)(ui, element);
|
|
219
236
|
}
|
|
220
237
|
onRemove() {
|
|
@@ -244,18 +261,19 @@ var ZoomWidget = class {
|
|
|
244
261
|
constructor(props) {
|
|
245
262
|
this.id = "zoom";
|
|
246
263
|
this.placement = "top-left";
|
|
247
|
-
this.orientation = "vertical";
|
|
248
264
|
this.viewId = null;
|
|
249
265
|
this.viewports = {};
|
|
250
|
-
this.id = props.id
|
|
251
|
-
this.viewId = props.viewId
|
|
252
|
-
this.placement = props.placement
|
|
253
|
-
this.
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
266
|
+
this.id = props.id ?? this.id;
|
|
267
|
+
this.viewId = props.viewId ?? this.viewId;
|
|
268
|
+
this.placement = props.placement ?? this.placement;
|
|
269
|
+
this.props = {
|
|
270
|
+
...props,
|
|
271
|
+
orientation: props.orientation ?? "vertical",
|
|
272
|
+
transitionDuration: props.transitionDuration ?? 200,
|
|
273
|
+
zoomInLabel: props.zoomInLabel ?? "Zoom In",
|
|
274
|
+
zoomOutLabel: props.zoomOutLabel ?? "Zoom Out",
|
|
275
|
+
style: props.style ?? {}
|
|
276
|
+
};
|
|
259
277
|
}
|
|
260
278
|
onAdd({ deck }) {
|
|
261
279
|
const { style, className } = this.props;
|
|
@@ -263,13 +281,10 @@ var ZoomWidget = class {
|
|
|
263
281
|
element.classList.add("deck-widget", "deck-widget-zoom");
|
|
264
282
|
if (className)
|
|
265
283
|
element.classList.add(className);
|
|
266
|
-
|
|
267
|
-
Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));
|
|
268
|
-
}
|
|
269
|
-
const ui = (0, import_jsx_runtime4.jsxs)(ButtonGroup, { orientation: this.orientation, children: [(0, import_jsx_runtime4.jsx)(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: "deck-widget-zoom-in" }), (0, import_jsx_runtime4.jsx)(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: "deck-widget-zoom-out" })] });
|
|
270
|
-
(0, import_preact3.render)(ui, element);
|
|
284
|
+
(0, import_core3._applyStyles)(element, style);
|
|
271
285
|
this.deck = deck;
|
|
272
286
|
this.element = element;
|
|
287
|
+
this.update();
|
|
273
288
|
return element;
|
|
274
289
|
}
|
|
275
290
|
onRemove() {
|
|
@@ -277,7 +292,24 @@ var ZoomWidget = class {
|
|
|
277
292
|
this.element = void 0;
|
|
278
293
|
}
|
|
279
294
|
setProps(props) {
|
|
295
|
+
this.placement = props.placement ?? this.placement;
|
|
296
|
+
this.viewId = props.viewId ?? this.viewId;
|
|
297
|
+
const oldProps = this.props;
|
|
298
|
+
const el = this.element;
|
|
299
|
+
if (el) {
|
|
300
|
+
if (oldProps.className !== props.className) {
|
|
301
|
+
if (oldProps.className)
|
|
302
|
+
el.classList.remove(oldProps.className);
|
|
303
|
+
if (props.className)
|
|
304
|
+
el.classList.add(props.className);
|
|
305
|
+
}
|
|
306
|
+
if (!(0, import_core3._deepEqual)(oldProps.style, props.style, 1)) {
|
|
307
|
+
(0, import_core3._removeStyles)(el, oldProps.style);
|
|
308
|
+
(0, import_core3._applyStyles)(el, props.style);
|
|
309
|
+
}
|
|
310
|
+
}
|
|
280
311
|
Object.assign(this.props, props);
|
|
312
|
+
this.update();
|
|
281
313
|
}
|
|
282
314
|
onViewportChange(viewport) {
|
|
283
315
|
this.viewports[viewport.id] = viewport;
|
|
@@ -302,6 +334,14 @@ var ZoomWidget = class {
|
|
|
302
334
|
this.handleZoom(viewport, viewport.zoom - 1);
|
|
303
335
|
}
|
|
304
336
|
}
|
|
337
|
+
update() {
|
|
338
|
+
const element = this.element;
|
|
339
|
+
if (!element) {
|
|
340
|
+
return;
|
|
341
|
+
}
|
|
342
|
+
const ui = (0, import_jsx_runtime4.jsxs)(ButtonGroup, { orientation: this.props.orientation, children: [(0, import_jsx_runtime4.jsx)(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: "deck-widget-zoom-in" }), (0, import_jsx_runtime4.jsx)(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: "deck-widget-zoom-out" })] });
|
|
343
|
+
(0, import_preact3.render)(ui, element);
|
|
344
|
+
}
|
|
305
345
|
};
|
|
306
346
|
|
|
307
347
|
// dist/themes.js
|
package/dist/index.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["index.
|
|
4
|
-
"sourcesContent": ["// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nexport { FullscreenWidget } from \"./fullscreen-widget.js\";\nexport { CompassWidget } from \"./compass-widget.js\";\nexport { ZoomWidget } from \"./zoom-widget.js\";\nexport * from \"./themes.js\";\n", "import { jsx as _jsx } from \"preact/jsx-runtime\";\n// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n/* global document */\nimport { _deepEqual as deepEqual } from '@deck.gl/core';\nimport { render } from 'preact';\nimport { IconButton } from \"./components.js\";\nexport class FullscreenWidget {\n constructor(props) {\n this.id = 'fullscreen';\n this.placement = 'top-left';\n this.fullscreen = false;\n this.id = props.id || 'fullscreen';\n this.placement = props.placement || 'top-left';\n props.enterLabel = props.enterLabel || 'Enter Fullscreen';\n props.exitLabel = props.exitLabel || 'Exit Fullscreen';\n props.style = props.style || {};\n this.props = props;\n }\n onAdd({ deck }) {\n const { style, className } = this.props;\n const el = document.createElement('div');\n el.classList.add('deck-widget', 'deck-widget-fullscreen');\n if (className)\n el.classList.add(className);\n if (style) {\n Object.entries(style).map(([key, value]) => el.style.setProperty(key, value));\n }\n this.deck = deck;\n this.element = el;\n this.update();\n document.addEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n return el;\n }\n onRemove() {\n this.deck = undefined;\n this.element = undefined;\n document.removeEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n }\n update() {\n const { enterLabel, exitLabel } = this.props;\n const el = this.element;\n if (!el) {\n return;\n }\n const ui = (_jsx(IconButton, { onClick: this.handleClick.bind(this), label: this.fullscreen ? exitLabel : enterLabel, className: this.fullscreen ? 'deck-widget-fullscreen-exit' : 'deck-widget-fullscreen-enter' }));\n render(ui, el);\n }\n setProps(props) {\n const oldProps = this.props;\n const el = this.element;\n if (el) {\n if (oldProps.className !== props.className) {\n if (oldProps.className)\n el.classList.remove(oldProps.className);\n if (props.className)\n el.classList.add(props.className);\n }\n if (!deepEqual(oldProps.style, props.style, 1)) {\n if (oldProps.style) {\n Object.entries(oldProps.style).map(([key]) => el.style.removeProperty(key));\n }\n if (props.style) {\n Object.entries(props.style).map(([key, value]) => el.style.setProperty(key, value));\n }\n }\n }\n Object.assign(this.props, props);\n }\n getContainer() {\n return this.props.container || this.deck?.getCanvas()?.parentElement;\n }\n onFullscreenChange() {\n const prevFullscreen = this.fullscreen;\n const fullscreen = document.fullscreenElement === this.getContainer();\n if (prevFullscreen !== fullscreen) {\n this.fullscreen = !this.fullscreen;\n }\n this.update();\n }\n async handleClick() {\n if (this.fullscreen) {\n await this.exitFullscreen();\n }\n else {\n await this.requestFullscreen();\n }\n this.update();\n }\n async requestFullscreen() {\n const container = this.getContainer();\n if (container?.requestFullscreen) {\n await container.requestFullscreen({ navigationUI: 'hide' });\n }\n else {\n this.togglePseudoFullscreen();\n }\n }\n async exitFullscreen() {\n if (document.exitFullscreen) {\n await document.exitFullscreen();\n }\n else {\n this.togglePseudoFullscreen();\n }\n }\n togglePseudoFullscreen() {\n this.getContainer()?.classList.toggle('deck-pseudo-fullscreen');\n }\n}\n", "import { jsx as _jsx } from \"preact/jsx-runtime\";\n// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nexport const IconButton = props => {\n const { className, label, onClick } = props;\n return (_jsx(\"div\", { className: \"deck-widget-button\", children: _jsx(\"button\", { className: `deck-widget-icon-button ${className}`, type: \"button\", onClick: onClick, title: label, children: _jsx(\"div\", { className: \"deck-widget-icon\" }) }) }));\n};\nexport const ButtonGroup = props => {\n const { children, orientation } = props;\n return _jsx(\"div\", { className: `deck-widget-button-group ${orientation}`, children: children });\n};\nexport const GroupedIconButton = props => {\n const { className, label, onClick } = props;\n return (_jsx(\"button\", { className: `deck-widget-icon-button ${className}`, type: \"button\", onClick: onClick, title: label, children: _jsx(\"div\", { className: \"deck-widget-icon\" }) }));\n};\n", "import { jsx as _jsx, jsxs as _jsxs } from \"preact/jsx-runtime\";\n// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n/* global document */\nimport { FlyToInterpolator, WebMercatorViewport, _GlobeViewport } from '@deck.gl/core';\nimport { render } from 'preact';\nexport class CompassWidget {\n constructor(props) {\n this.id = 'compass';\n this.placement = 'top-left';\n this.viewId = null;\n this.viewports = {};\n this.id = props.id || 'compass';\n this.viewId = props.viewId || null;\n this.placement = props.placement || 'top-left';\n props.transitionDuration = props.transitionDuration || 200;\n props.label = props.label || 'Compass';\n props.style = props.style || {};\n this.props = props;\n }\n setProps(props) {\n Object.assign(this.props, props);\n }\n onViewportChange(viewport) {\n this.viewports[viewport.id] = viewport;\n this.update();\n }\n onAdd({ deck }) {\n const { style, className } = this.props;\n const element = document.createElement('div');\n element.classList.add('deck-widget', 'deck-widget-compass');\n if (className)\n element.classList.add(className);\n if (style) {\n Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));\n }\n this.deck = deck;\n this.element = element;\n this.update();\n return element;\n }\n getRotation(viewport) {\n if (viewport instanceof WebMercatorViewport) {\n return [-viewport.bearing, viewport.pitch];\n }\n else if (viewport instanceof _GlobeViewport) {\n return [0, Math.max(-80, Math.min(80, viewport.latitude))];\n }\n return [0, 0];\n }\n update() {\n const viewId = this.viewId || Object.values(this.viewports)[0]?.id || 'default-view';\n const viewport = this.viewports[viewId];\n const [rz, rx] = this.getRotation(viewport);\n const element = this.element;\n if (!element) {\n return;\n }\n const ui = (_jsx(\"div\", { className: \"deck-widget-button\", style: { perspective: 100 }, children: _jsx(\"button\", { type: \"button\", onClick: () => {\n for (const viewport of Object.values(this.viewports)) {\n this.handleCompassReset(viewport);\n }\n }, label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: _jsx(\"svg\", { fill: \"none\", width: \"100%\", height: \"100%\", viewBox: \"0 0 26 26\", children: _jsxs(\"g\", { transform: `rotate(${rz},13,13)`, children: [_jsx(\"path\", { d: \"M10 13.0001L12.9999 5L15.9997 13.0001H10Z\", fill: \"var(--icon-compass-north-color, #F05C44)\" }), _jsx(\"path\", { d: \"M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z\", fill: \"var(--icon-compass-south-color, #C2C2CC)\" })] }) }) }) }));\n render(ui, element);\n }\n onRemove() {\n this.deck = undefined;\n this.element = undefined;\n }\n handleCompassReset(viewport) {\n const viewId = this.viewId || viewport.id || 'default-view';\n if (viewport instanceof WebMercatorViewport) {\n const nextViewState = {\n ...viewport,\n bearing: 0,\n ...(this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {}),\n transitionDuration: this.props.transitionDuration,\n transitionInterpolator: new FlyToInterpolator()\n };\n // @ts-ignore Using private method temporary until there's a public one\n this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });\n }\n }\n}\n", "import { jsx as _jsx, jsxs as _jsxs } from \"preact/jsx-runtime\";\n// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n/* global document */\nimport { FlyToInterpolator } from '@deck.gl/core';\nimport { render } from 'preact';\nimport { ButtonGroup, GroupedIconButton } from \"./components.js\";\nexport class ZoomWidget {\n constructor(props) {\n this.id = 'zoom';\n this.placement = 'top-left';\n this.orientation = 'vertical';\n this.viewId = null;\n this.viewports = {};\n this.id = props.id || 'zoom';\n this.viewId = props.viewId || null;\n this.placement = props.placement || 'top-left';\n this.orientation = props.orientation || 'vertical';\n props.transitionDuration = props.transitionDuration || 200;\n props.zoomInLabel = props.zoomInLabel || 'Zoom In';\n props.zoomOutLabel = props.zoomOutLabel || 'Zoom Out';\n props.style = props.style || {};\n this.props = props;\n }\n onAdd({ deck }) {\n const { style, className } = this.props;\n const element = document.createElement('div');\n element.classList.add('deck-widget', 'deck-widget-zoom');\n if (className)\n element.classList.add(className);\n if (style) {\n Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));\n }\n const ui = (_jsxs(ButtonGroup, { orientation: this.orientation, children: [_jsx(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: \"deck-widget-zoom-in\" }), _jsx(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: \"deck-widget-zoom-out\" })] }));\n render(ui, element);\n this.deck = deck;\n this.element = element;\n return element;\n }\n onRemove() {\n this.deck = undefined;\n this.element = undefined;\n }\n setProps(props) {\n Object.assign(this.props, props);\n }\n onViewportChange(viewport) {\n this.viewports[viewport.id] = viewport;\n }\n handleZoom(viewport, nextZoom) {\n const viewId = this.viewId || viewport?.id || 'default-view';\n const nextViewState = {\n ...viewport,\n zoom: nextZoom,\n transitionDuration: this.props.transitionDuration,\n transitionInterpolator: new FlyToInterpolator()\n };\n // @ts-ignore Using private method temporary until there's a public one\n this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });\n }\n handleZoomIn() {\n for (const viewport of Object.values(this.viewports)) {\n this.handleZoom(viewport, viewport.zoom + 1);\n }\n }\n handleZoomOut() {\n for (const viewport of Object.values(this.viewports)) {\n this.handleZoom(viewport, viewport.zoom - 1);\n }\n }\n}\n", "// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nexport const LightTheme = {\n '--button-background': '#fff',\n '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n '--button-inner-stroke': 'unset',\n '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n '--button-backdrop-filter': 'unset',\n '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\nexport const DarkTheme = {\n '--button-background': 'rgba(18, 18, 20, 1)',\n '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n '--button-inner-stroke': 'unset',\n '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n '--button-backdrop-filter': 'unset',\n '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\nexport const LightGlassTheme = {\n '--button-background': 'rgba(255, 255, 255, 0.6)',\n '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n '--button-inner-stroke': '1px solid rgba(255, 255, 255, 0.6)',\n '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n '--button-backdrop-filter': 'blur(4px)',\n '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\nexport const DarkGlassTheme = {\n '--button-background': 'rgba(18, 18, 20, 0.75)',\n '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n '--button-inner-stroke': '1px solid rgba(18, 18, 20, 0.75)',\n '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n '--button-backdrop-filter': 'blur(4px)',\n '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA
|
|
6
|
-
"names": ["
|
|
3
|
+
"sources": ["../src/index.ts", "../src/fullscreen-widget.tsx", "../src/components.tsx", "../src/compass-widget.tsx", "../src/zoom-widget.tsx", "../src/themes.ts"],
|
|
4
|
+
"sourcesContent": ["// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nexport {FullscreenWidget} from './fullscreen-widget';\nexport {CompassWidget} from './compass-widget';\nexport {ZoomWidget} from './zoom-widget';\n\nexport type {FullscreenWidgetProps} from './fullscreen-widget';\nexport type {CompassWidgetProps} from './compass-widget';\nexport type {ZoomWidgetProps} from './zoom-widget';\n\nexport * from './themes';\n", "// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n/* global document */\nimport {\n _deepEqual as deepEqual,\n _applyStyles as applyStyles,\n _removeStyles as removeStyles\n} from '@deck.gl/core';\nimport type {Deck, Widget, WidgetPlacement} from '@deck.gl/core';\nimport {render} from 'preact';\nimport {IconButton} from './components';\n\nexport type FullscreenWidgetProps = {\n id?: string;\n /**\n * Widget positioning within the view. Default 'top-left'.\n */\n placement?: WidgetPlacement;\n /**\n * A [compatible DOM element](https://developer.mozilla.org/en-US/docs/Web/API/Element/requestFullScreen#Compatible_elements) which should be made full screen.\n * By default, the map container element will be made full screen.\n */\n /* eslint-enable max-len */\n container?: HTMLElement;\n /**\n * Tooltip message when out of fullscreen.\n */\n enterLabel?: string;\n /**\n * Tooltip message when fullscreen.\n */\n exitLabel?: string;\n /**\n * CSS inline style overrides.\n */\n style?: Partial<CSSStyleDeclaration>;\n /**\n * Additional CSS class.\n */\n className?: string;\n};\n\nexport class FullscreenWidget implements Widget<FullscreenWidgetProps> {\n id = 'fullscreen';\n props: FullscreenWidgetProps;\n placement: WidgetPlacement = 'top-left';\n\n deck?: Deck<any>;\n element?: HTMLDivElement;\n\n fullscreen: boolean = false;\n\n constructor(props: FullscreenWidgetProps) {\n this.id = props.id ?? this.id;\n this.placement = props.placement ?? this.placement;\n\n this.props = {\n ...props,\n enterLabel: props.enterLabel ?? 'Enter Fullscreen',\n exitLabel: props.exitLabel ?? 'Exit Fullscreen',\n style: props.style ?? {}\n };\n }\n\n onAdd({deck}: {deck: Deck<any>}): HTMLDivElement {\n const {style, className} = this.props;\n const el = document.createElement('div');\n el.classList.add('deck-widget', 'deck-widget-fullscreen');\n if (className) el.classList.add(className);\n applyStyles(el, style);\n this.deck = deck;\n this.element = el;\n this.update();\n document.addEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n return el;\n }\n\n onRemove() {\n this.deck = undefined;\n this.element = undefined;\n document.removeEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n }\n\n private update() {\n const {enterLabel, exitLabel} = this.props;\n const element = this.element;\n if (!element) {\n return;\n }\n\n const ui = (\n <IconButton\n onClick={this.handleClick.bind(this)}\n label={this.fullscreen ? exitLabel : enterLabel}\n className={this.fullscreen ? 'deck-widget-fullscreen-exit' : 'deck-widget-fullscreen-enter'}\n />\n );\n render(ui, element);\n }\n\n setProps(props: Partial<FullscreenWidgetProps>) {\n this.placement = props.placement ?? this.placement;\n const oldProps = this.props;\n const el = this.element;\n if (el) {\n if (oldProps.className !== props.className) {\n if (oldProps.className) el.classList.remove(oldProps.className);\n if (props.className) el.classList.add(props.className);\n }\n\n if (!deepEqual(oldProps.style, props.style, 1)) {\n removeStyles(el, oldProps.style);\n applyStyles(el, props.style);\n }\n }\n\n Object.assign(this.props, props);\n this.update();\n }\n\n getContainer() {\n return this.props.container || this.deck?.getCanvas()?.parentElement;\n }\n\n onFullscreenChange() {\n const prevFullscreen = this.fullscreen;\n const fullscreen = document.fullscreenElement === this.getContainer();\n if (prevFullscreen !== fullscreen) {\n this.fullscreen = !this.fullscreen;\n }\n this.update();\n }\n\n async handleClick() {\n if (this.fullscreen) {\n await this.exitFullscreen();\n } else {\n await this.requestFullscreen();\n }\n this.update();\n }\n\n async requestFullscreen() {\n const container = this.getContainer();\n if (container?.requestFullscreen) {\n await container.requestFullscreen({navigationUI: 'hide'});\n } else {\n this.togglePseudoFullscreen();\n }\n }\n\n async exitFullscreen() {\n if (document.exitFullscreen) {\n await document.exitFullscreen();\n } else {\n this.togglePseudoFullscreen();\n }\n }\n\n togglePseudoFullscreen() {\n this.getContainer()?.classList.toggle('deck-pseudo-fullscreen');\n }\n}\n", "// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nexport const IconButton = props => {\n const {className, label, onClick} = props;\n return (\n <div className=\"deck-widget-button\">\n <button\n className={`deck-widget-icon-button ${className}`}\n type=\"button\"\n onClick={onClick}\n title={label}\n >\n <div className=\"deck-widget-icon\" />\n </button>\n </div>\n );\n};\n\nexport const ButtonGroup = props => {\n const {children, orientation} = props;\n return <div className={`deck-widget-button-group ${orientation}`}>{children}</div>;\n};\n\nexport const GroupedIconButton = props => {\n const {className, label, onClick} = props;\n return (\n <button\n className={`deck-widget-icon-button ${className}`}\n type=\"button\"\n onClick={onClick}\n title={label}\n >\n <div className=\"deck-widget-icon\" />\n </button>\n );\n};\n", "// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n/* global document */\nimport {\n FlyToInterpolator,\n WebMercatorViewport,\n _GlobeViewport,\n _deepEqual as deepEqual,\n _applyStyles as applyStyles,\n _removeStyles as removeStyles\n} from '@deck.gl/core';\nimport type {Deck, Viewport, Widget, WidgetPlacement} from '@deck.gl/core';\nimport {render} from 'preact';\n\nexport type CompassWidgetProps = {\n id?: string;\n /**\n * Widget positioning within the view. Default 'top-left'.\n */\n placement?: WidgetPlacement;\n /**\n * View to attach to and interact with. Required when using multiple views.\n */\n viewId?: string | null;\n /**\n * Tooltip message.\n */\n label?: string;\n /**\n * Bearing and pitch reset transition duration in ms.\n */\n transitionDuration?: number;\n /**\n * CSS inline style overrides.\n */\n style?: Partial<CSSStyleDeclaration>;\n /**\n * Additional CSS class.\n */\n className?: string;\n};\n\nexport class CompassWidget implements Widget<CompassWidgetProps> {\n id = 'compass';\n props: CompassWidgetProps;\n placement: WidgetPlacement = 'top-left';\n viewId?: string | null = null;\n viewports: {[id: string]: Viewport} = {};\n deck?: Deck<any>;\n element?: HTMLDivElement;\n\n constructor(props: CompassWidgetProps) {\n this.id = props.id ?? this.id;\n this.viewId = props.viewId ?? this.viewId;\n this.placement = props.placement ?? this.placement;\n\n this.props = {\n ...props,\n transitionDuration: props.transitionDuration ?? 200,\n label: props.label ?? 'Reset Compass',\n style: props.style ?? {}\n };\n }\n\n setProps(props: Partial<CompassWidgetProps>) {\n this.placement = props.placement ?? this.placement;\n this.viewId = props.viewId ?? this.viewId;\n const oldProps = this.props;\n const el = this.element;\n if (el) {\n if (oldProps.className !== props.className) {\n if (oldProps.className) el.classList.remove(oldProps.className);\n if (props.className) el.classList.add(props.className);\n }\n\n if (!deepEqual(oldProps.style, props.style, 1)) {\n removeStyles(el, oldProps.style);\n applyStyles(el, props.style);\n }\n }\n\n Object.assign(this.props, props);\n this.update();\n }\n\n onViewportChange(viewport: Viewport) {\n // no need to update if viewport is the same\n if (!viewport.equals(this.viewports[viewport.id])) {\n this.viewports[viewport.id] = viewport;\n this.update();\n }\n }\n\n onAdd({deck}: {deck: Deck<any>}): HTMLDivElement {\n const {style, className} = this.props;\n const element = document.createElement('div');\n element.classList.add('deck-widget', 'deck-widget-compass');\n if (className) element.classList.add(className);\n applyStyles(element, style);\n this.deck = deck;\n this.element = element;\n this.update();\n return element;\n }\n\n getRotation(viewport?: Viewport) {\n if (viewport instanceof WebMercatorViewport) {\n return [-viewport.bearing, viewport.pitch];\n } else if (viewport instanceof _GlobeViewport) {\n return [0, Math.max(-80, Math.min(80, viewport.latitude))];\n }\n return [0, 0];\n }\n\n private update() {\n const viewId = this.viewId || Object.values(this.viewports)[0]?.id || 'default-view';\n const viewport = this.viewports[viewId];\n const [rz, rx] = this.getRotation(viewport);\n const element = this.element;\n if (!element) {\n return;\n }\n const ui = (\n <div className=\"deck-widget-button\" style={{perspective: 100}}>\n <button\n type=\"button\"\n onClick={() => {\n for (const viewport of Object.values(this.viewports)) {\n this.handleCompassReset(viewport);\n }\n }}\n title={this.props.label}\n style={{transform: `rotateX(${rx}deg)`}}\n >\n <svg fill=\"none\" width=\"100%\" height=\"100%\" viewBox=\"0 0 26 26\">\n <g transform={`rotate(${rz},13,13)`}>\n <path\n d=\"M10 13.0001L12.9999 5L15.9997 13.0001H10Z\"\n fill=\"var(--icon-compass-north-color, #F05C44)\"\n />\n <path\n d=\"M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z\"\n fill=\"var(--icon-compass-south-color, #C2C2CC)\"\n />\n </g>\n </svg>\n </button>\n </div>\n );\n render(ui, element);\n }\n\n onRemove() {\n this.deck = undefined;\n this.element = undefined;\n }\n\n handleCompassReset(viewport: Viewport) {\n const viewId = this.viewId || viewport.id || 'default-view';\n if (viewport instanceof WebMercatorViewport) {\n const nextViewState = {\n ...viewport,\n bearing: 0,\n ...(this.getRotation(viewport)[0] === 0 ? {pitch: 0} : {}),\n transitionDuration: this.props.transitionDuration,\n transitionInterpolator: new FlyToInterpolator()\n };\n // @ts-ignore Using private method temporary until there's a public one\n this.deck._onViewStateChange({viewId, viewState: nextViewState, interactionState: {}});\n }\n }\n}\n", "// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n/* global document */\nimport {\n FlyToInterpolator,\n _deepEqual as deepEqual,\n _applyStyles as applyStyles,\n _removeStyles as removeStyles\n} from '@deck.gl/core';\nimport type {Deck, Viewport, Widget, WidgetPlacement} from '@deck.gl/core';\nimport {render} from 'preact';\nimport {ButtonGroup, GroupedIconButton} from './components';\n\nexport type ZoomWidgetProps = {\n id?: string;\n /**\n * Widget positioning within the view. Default 'top-left'.\n */\n placement?: WidgetPlacement;\n /**\n * View to attach to and interact with. Required when using multiple views.\n */\n viewId?: string | null;\n /**\n * Button orientation.\n */\n orientation?: 'vertical' | 'horizontal';\n /**\n * Tooltip message on zoom in button.\n */\n zoomInLabel?: string;\n /**\n * Tooltip message on zoom out button.\n */\n zoomOutLabel?: string;\n /**\n * Zoom transition duration in ms.\n */\n transitionDuration?: number;\n /**\n * CSS inline style overrides.\n */\n style?: Partial<CSSStyleDeclaration>;\n /**\n * Additional CSS class.\n */\n className?: string;\n};\n\nexport class ZoomWidget implements Widget<ZoomWidgetProps> {\n id = 'zoom';\n props: ZoomWidgetProps;\n placement: WidgetPlacement = 'top-left';\n viewId?: string | null = null;\n viewports: {[id: string]: Viewport} = {};\n deck?: Deck<any>;\n element?: HTMLDivElement;\n\n constructor(props: ZoomWidgetProps) {\n this.id = props.id ?? this.id;\n this.viewId = props.viewId ?? this.viewId;\n this.placement = props.placement ?? this.placement;\n\n this.props = {\n ...props,\n orientation: props.orientation ?? 'vertical',\n transitionDuration: props.transitionDuration ?? 200,\n zoomInLabel: props.zoomInLabel ?? 'Zoom In',\n zoomOutLabel: props.zoomOutLabel ?? 'Zoom Out',\n style: props.style ?? {}\n };\n }\n\n onAdd({deck}: {deck: Deck<any>}): HTMLDivElement {\n const {style, className} = this.props;\n const element = document.createElement('div');\n element.classList.add('deck-widget', 'deck-widget-zoom');\n if (className) element.classList.add(className);\n applyStyles(element, style);\n this.deck = deck;\n this.element = element;\n this.update();\n return element;\n }\n\n onRemove() {\n this.deck = undefined;\n this.element = undefined;\n }\n\n setProps(props: Partial<ZoomWidgetProps>) {\n this.placement = props.placement ?? this.placement;\n this.viewId = props.viewId ?? this.viewId;\n const oldProps = this.props;\n const el = this.element;\n if (el) {\n if (oldProps.className !== props.className) {\n if (oldProps.className) el.classList.remove(oldProps.className);\n if (props.className) el.classList.add(props.className);\n }\n\n if (!deepEqual(oldProps.style, props.style, 1)) {\n removeStyles(el, oldProps.style);\n applyStyles(el, props.style);\n }\n }\n\n Object.assign(this.props, props);\n this.update();\n }\n\n onViewportChange(viewport: Viewport) {\n this.viewports[viewport.id] = viewport;\n }\n\n handleZoom(viewport: Viewport, nextZoom: number) {\n const viewId = this.viewId || viewport?.id || 'default-view';\n const nextViewState = {\n ...viewport,\n zoom: nextZoom,\n transitionDuration: this.props.transitionDuration,\n transitionInterpolator: new FlyToInterpolator()\n };\n // @ts-ignore Using private method temporary until there's a public one\n this.deck._onViewStateChange({viewId, viewState: nextViewState, interactionState: {}});\n }\n\n handleZoomIn() {\n for (const viewport of Object.values(this.viewports)) {\n this.handleZoom(viewport, viewport.zoom + 1);\n }\n }\n\n handleZoomOut() {\n for (const viewport of Object.values(this.viewports)) {\n this.handleZoom(viewport, viewport.zoom - 1);\n }\n }\n\n private update() {\n const element = this.element;\n if (!element) {\n return;\n }\n const ui = (\n <ButtonGroup orientation={this.props.orientation}>\n <GroupedIconButton\n onClick={() => this.handleZoomIn()}\n label={this.props.zoomInLabel}\n className=\"deck-widget-zoom-in\"\n />\n <GroupedIconButton\n onClick={() => this.handleZoomOut()}\n label={this.props.zoomOutLabel}\n className=\"deck-widget-zoom-out\"\n />\n </ButtonGroup>\n );\n render(ui, element);\n }\n}\n", "// deck.gl\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nexport const LightTheme = {\n '--button-background': '#fff',\n '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n '--button-inner-stroke': 'unset',\n '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n '--button-backdrop-filter': 'unset',\n '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\n\nexport const DarkTheme = {\n '--button-background': 'rgba(18, 18, 20, 1)',\n '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n '--button-inner-stroke': 'unset',\n '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n '--button-backdrop-filter': 'unset',\n '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\n\nexport const LightGlassTheme = {\n '--button-background': 'rgba(255, 255, 255, 0.6)',\n '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n '--button-inner-stroke': '1px solid rgba(255, 255, 255, 0.6)',\n '--button-shadow':\n '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n '--button-backdrop-filter': 'blur(4px)',\n '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\n\nexport const DarkGlassTheme = {\n '--button-background': 'rgba(18, 18, 20, 0.75)',\n '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n '--button-inner-stroke': '1px solid rgba(18, 18, 20, 0.75)',\n '--button-shadow':\n '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n '--button-backdrop-filter': 'blur(4px)',\n '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n '--icon-compass-north-color': '#F05C44',\n '--icon-compass-south-color': '#C2C2CC'\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["_jsx", "applyStyles", "_jsx", "deepEqual", "removeStyles", "import_core", "import_preact", "deepEqual", "removeStyles", "applyStyles", "_jsx", "viewport", "_jsxs", "import_core", "import_preact", "applyStyles", "deepEqual", "removeStyles", "_jsxs", "_jsx"]
|
|
7
7
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
export { FullscreenWidget } from "./fullscreen-widget.js";
|
|
2
2
|
export { CompassWidget } from "./compass-widget.js";
|
|
3
3
|
export { ZoomWidget } from "./zoom-widget.js";
|
|
4
|
+
export type { FullscreenWidgetProps } from "./fullscreen-widget.js";
|
|
5
|
+
export type { CompassWidgetProps } from "./compass-widget.js";
|
|
6
|
+
export type { ZoomWidgetProps } from "./zoom-widget.js";
|
|
4
7
|
export * from "./themes.js";
|
|
5
8
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,gBAAgB,EAAC,+BAA4B;AACrD,OAAO,EAAC,aAAa,EAAC,4BAAyB;AAC/C,OAAO,EAAC,UAAU,EAAC,yBAAsB;AAEzC,4BAAyB"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,gBAAgB,EAAC,+BAA4B;AACrD,OAAO,EAAC,aAAa,EAAC,4BAAyB;AAC/C,OAAO,EAAC,UAAU,EAAC,yBAAsB;AAEzC,YAAY,EAAC,qBAAqB,EAAC,+BAA4B;AAC/D,YAAY,EAAC,kBAAkB,EAAC,4BAAyB;AACzD,YAAY,EAAC,eAAe,EAAC,yBAAsB;AAEnD,4BAAyB"}
|
package/dist/index.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,UAAU;AACV,+BAA+B;AAC/B,oCAAoC;AAEpC,OAAO,EAAC,gBAAgB,EAAC,+BAA4B;AACrD,OAAO,EAAC,aAAa,EAAC,4BAAyB;AAC/C,OAAO,EAAC,UAAU,EAAC,yBAAsB;AAMzC,4BAAyB"}
|
package/dist/themes.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"themes.js","sourceRoot":"","sources":["../src/themes.ts"],"names":[],"mappings":"AAAA,UAAU;AACV,+BAA+B;AAC/B,oCAAoC;AAEpC,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,qBAAqB,EAAE,MAAM;IAC7B,iBAAiB,EAAE,0BAA0B;IAC7C,uBAAuB,EAAE,OAAO;IAChC,iBAAiB,EAAE,qCAAqC;IACxD,0BAA0B,EAAE,OAAO;IACnC,oBAAoB,EAAE,sBAAsB;IAC5C,qBAAqB,EAAE,qBAAqB;IAC5C,4BAA4B,EAAE,SAAS;IACvC,4BAA4B,EAAE,SAAS;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,qBAAqB,EAAE,qBAAqB;IAC5C,iBAAiB,EAAE,wBAAwB;IAC3C,uBAAuB,EAAE,OAAO;IAChC,iBAAiB,EAAE,qCAAqC;IACxD,0BAA0B,EAAE,OAAO;IACnC,oBAAoB,EAAE,wBAAwB;IAC9C,qBAAqB,EAAE,wBAAwB;IAC/C,4BAA4B,EAAE,SAAS;IACvC,4BAA4B,EAAE,SAAS;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,qBAAqB,EAAE,0BAA0B;IACjD,iBAAiB,EAAE,0BAA0B;IAC7C,uBAAuB,EAAE,oCAAoC;IAC7D,iBAAiB,EACf,+EAA+E;IACjF,0BAA0B,EAAE,WAAW;IACvC,oBAAoB,EAAE,sBAAsB;IAC5C,qBAAqB,EAAE,qBAAqB;IAC5C,4BAA4B,EAAE,SAAS;IACvC,4BAA4B,EAAE,SAAS;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,qBAAqB,EAAE,wBAAwB;IAC/C,iBAAiB,EAAE,wBAAwB;IAC3C,uBAAuB,EAAE,kCAAkC;IAC3D,iBAAiB,EACf,+EAA+E;IACjF,0BAA0B,EAAE,WAAW;IACvC,oBAAoB,EAAE,wBAAwB;IAC9C,qBAAqB,EAAE,wBAAwB;IAC/C,4BAA4B,EAAE,SAAS;IACvC,4BAA4B,EAAE,SAAS;CACxC,CAAC"}
|
package/dist/zoom-widget.d.ts
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import type { Deck, Viewport, Widget, WidgetPlacement } from '@deck.gl/core';
|
|
2
|
-
|
|
2
|
+
export type ZoomWidgetProps = {
|
|
3
3
|
id?: string;
|
|
4
|
+
/**
|
|
5
|
+
* Widget positioning within the view. Default 'top-left'.
|
|
6
|
+
*/
|
|
4
7
|
placement?: WidgetPlacement;
|
|
5
8
|
/**
|
|
6
9
|
* View to attach to and interact with. Required when using multiple views.
|
|
@@ -30,12 +33,11 @@ interface ZoomWidgetProps {
|
|
|
30
33
|
* Additional CSS class.
|
|
31
34
|
*/
|
|
32
35
|
className?: string;
|
|
33
|
-
}
|
|
36
|
+
};
|
|
34
37
|
export declare class ZoomWidget implements Widget<ZoomWidgetProps> {
|
|
35
38
|
id: string;
|
|
36
39
|
props: ZoomWidgetProps;
|
|
37
40
|
placement: WidgetPlacement;
|
|
38
|
-
orientation: 'vertical' | 'horizontal';
|
|
39
41
|
viewId?: string | null;
|
|
40
42
|
viewports: {
|
|
41
43
|
[id: string]: Viewport;
|
|
@@ -52,6 +54,6 @@ export declare class ZoomWidget implements Widget<ZoomWidgetProps> {
|
|
|
52
54
|
handleZoom(viewport: Viewport, nextZoom: number): void;
|
|
53
55
|
handleZoomIn(): void;
|
|
54
56
|
handleZoomOut(): void;
|
|
57
|
+
private update;
|
|
55
58
|
}
|
|
56
|
-
export {};
|
|
57
59
|
//# sourceMappingURL=zoom-widget.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"zoom-widget.d.ts","sourceRoot":"","sources":["../src/zoom-widget.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"zoom-widget.d.ts","sourceRoot":"","sources":["../src/zoom-widget.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAI3E,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,qBAAa,UAAW,YAAW,MAAM,CAAC,eAAe,CAAC;IACxD,EAAE,SAAU;IACZ,KAAK,EAAE,eAAe,CAAC;IACvB,SAAS,EAAE,eAAe,CAAc;IACxC,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC9B,SAAS,EAAE;QAAC,CAAC,EAAE,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAC,CAAM;IACzC,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;gBAEb,KAAK,EAAE,eAAe;IAelC,KAAK,CAAC,EAAC,IAAI,EAAC,EAAE;QAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAA;KAAC,GAAG,cAAc;IAYhD,QAAQ;IAKR,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC;IAqBxC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ;IAInC,UAAU,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM;IAY/C,YAAY;IAMZ,aAAa;IAMb,OAAO,CAAC,MAAM;CAqBf"}
|
package/dist/zoom-widget.js
CHANGED
|
@@ -3,25 +3,26 @@ import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
|
|
|
3
3
|
// SPDX-License-Identifier: MIT
|
|
4
4
|
// Copyright (c) vis.gl contributors
|
|
5
5
|
/* global document */
|
|
6
|
-
import { FlyToInterpolator } from '@deck.gl/core';
|
|
6
|
+
import { FlyToInterpolator, _deepEqual as deepEqual, _applyStyles as applyStyles, _removeStyles as removeStyles } from '@deck.gl/core';
|
|
7
7
|
import { render } from 'preact';
|
|
8
8
|
import { ButtonGroup, GroupedIconButton } from "./components.js";
|
|
9
9
|
export class ZoomWidget {
|
|
10
10
|
constructor(props) {
|
|
11
11
|
this.id = 'zoom';
|
|
12
12
|
this.placement = 'top-left';
|
|
13
|
-
this.orientation = 'vertical';
|
|
14
13
|
this.viewId = null;
|
|
15
14
|
this.viewports = {};
|
|
16
|
-
this.id = props.id
|
|
17
|
-
this.viewId = props.viewId
|
|
18
|
-
this.placement = props.placement
|
|
19
|
-
this.
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
15
|
+
this.id = props.id ?? this.id;
|
|
16
|
+
this.viewId = props.viewId ?? this.viewId;
|
|
17
|
+
this.placement = props.placement ?? this.placement;
|
|
18
|
+
this.props = {
|
|
19
|
+
...props,
|
|
20
|
+
orientation: props.orientation ?? 'vertical',
|
|
21
|
+
transitionDuration: props.transitionDuration ?? 200,
|
|
22
|
+
zoomInLabel: props.zoomInLabel ?? 'Zoom In',
|
|
23
|
+
zoomOutLabel: props.zoomOutLabel ?? 'Zoom Out',
|
|
24
|
+
style: props.style ?? {}
|
|
25
|
+
};
|
|
25
26
|
}
|
|
26
27
|
onAdd({ deck }) {
|
|
27
28
|
const { style, className } = this.props;
|
|
@@ -29,13 +30,10 @@ export class ZoomWidget {
|
|
|
29
30
|
element.classList.add('deck-widget', 'deck-widget-zoom');
|
|
30
31
|
if (className)
|
|
31
32
|
element.classList.add(className);
|
|
32
|
-
|
|
33
|
-
Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));
|
|
34
|
-
}
|
|
35
|
-
const ui = (_jsxs(ButtonGroup, { orientation: this.orientation, children: [_jsx(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: "deck-widget-zoom-in" }), _jsx(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: "deck-widget-zoom-out" })] }));
|
|
36
|
-
render(ui, element);
|
|
33
|
+
applyStyles(element, style);
|
|
37
34
|
this.deck = deck;
|
|
38
35
|
this.element = element;
|
|
36
|
+
this.update();
|
|
39
37
|
return element;
|
|
40
38
|
}
|
|
41
39
|
onRemove() {
|
|
@@ -43,7 +41,24 @@ export class ZoomWidget {
|
|
|
43
41
|
this.element = undefined;
|
|
44
42
|
}
|
|
45
43
|
setProps(props) {
|
|
44
|
+
this.placement = props.placement ?? this.placement;
|
|
45
|
+
this.viewId = props.viewId ?? this.viewId;
|
|
46
|
+
const oldProps = this.props;
|
|
47
|
+
const el = this.element;
|
|
48
|
+
if (el) {
|
|
49
|
+
if (oldProps.className !== props.className) {
|
|
50
|
+
if (oldProps.className)
|
|
51
|
+
el.classList.remove(oldProps.className);
|
|
52
|
+
if (props.className)
|
|
53
|
+
el.classList.add(props.className);
|
|
54
|
+
}
|
|
55
|
+
if (!deepEqual(oldProps.style, props.style, 1)) {
|
|
56
|
+
removeStyles(el, oldProps.style);
|
|
57
|
+
applyStyles(el, props.style);
|
|
58
|
+
}
|
|
59
|
+
}
|
|
46
60
|
Object.assign(this.props, props);
|
|
61
|
+
this.update();
|
|
47
62
|
}
|
|
48
63
|
onViewportChange(viewport) {
|
|
49
64
|
this.viewports[viewport.id] = viewport;
|
|
@@ -69,4 +84,13 @@ export class ZoomWidget {
|
|
|
69
84
|
this.handleZoom(viewport, viewport.zoom - 1);
|
|
70
85
|
}
|
|
71
86
|
}
|
|
87
|
+
update() {
|
|
88
|
+
const element = this.element;
|
|
89
|
+
if (!element) {
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
const ui = (_jsxs(ButtonGroup, { orientation: this.props.orientation, children: [_jsx(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: "deck-widget-zoom-in" }), _jsx(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: "deck-widget-zoom-out" })] }));
|
|
93
|
+
render(ui, element);
|
|
94
|
+
}
|
|
72
95
|
}
|
|
96
|
+
//# sourceMappingURL=zoom-widget.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"zoom-widget.js","sourceRoot":"","sources":["../src/zoom-widget.tsx"],"names":[],"mappings":"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"}
|