@deck.gl-community/react 9.1.1 → 9.2.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.
@@ -1 +1 @@
1
- {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../src/components/modal.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,eAAO,MAAM,MAAM,qNAUlB,CAAC;AA6CF,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,GAAG,CAAC;IACX,OAAO,EAAE,GAAG,CAAC;IACb,OAAO,EAAE,MAAM,OAAO,CAAC;CACxB,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,qBAwB5C"}
1
+ {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../src/components/modal.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,eAAO,MAAM,MAAM,qNAUlB,CAAC;AA6CF,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,GAAG,CAAC;IACX,OAAO,EAAE,GAAG,CAAC;IACb,OAAO,EAAE,MAAM,OAAO,CAAC;CACxB,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,qBAwB5C"}
@@ -1,10 +1,11 @@
1
1
  // deck.gl-community
2
2
  // SPDX-License-Identifier: MIT
3
3
  // Copyright (c) vis.gl contributors
4
+ // @ts-nocheck This modal file should be phased out.
4
5
  /* eslint-env browser */
5
6
  import * as React from 'react';
6
7
  import Modal, { ModalProvider } from 'styled-react-modal';
7
- import { styled } from 'styled-components';
8
+ import styled from 'styled-components';
8
9
  export const Button = styled.button `
9
10
  display: inline-block;
10
11
  color: #fff;
@@ -1 +1 @@
1
- {"version":3,"file":"modal.js","sourceRoot":"","sources":["../../src/components/modal.tsx"],"names":[],"mappings":"AAAA,oBAAoB;AACpB,+BAA+B;AAC/B,oCAAoC;AAEpC,wBAAwB;AAExB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,EAAC,aAAa,EAAC,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAC,MAAM,EAAC,MAAM,mBAAmB,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAA;;;;;;;;;;CAUlC,CAAC;AAEF,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAA;;;;;;;;;;;;;;CAc/B,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;CAWzB,CAAC;AAEF,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAM3B,CAAC;AAEF,MAAM,MAAM,GAAG,MAAM,CAAC,EAAE,CAAA;;;;CAIvB,CAAC;AAQF,MAAM,UAAU,WAAW,CAAC,KAAiB;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,SAAS,WAAW;QAClB,IAAI,MAAM,EAAE,CAAC;YACX,KAAK,CAAC,OAAO,EAAE,CAAC;QAClB,CAAC;QACD,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;IACrB,CAAC;IAED,OAAO,CACL;QACE,oBAAC,aAAa;YACZ,oBAAC,WAAW,IAAC,MAAM,EAAE,MAAM,EAAE,iBAAiB,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW;gBACvF,oBAAC,OAAO;oBACN,oBAAC,SAAS;wBACR,oBAAC,MAAM,QAAE,KAAK,CAAC,KAAK,CAAU,CACpB;oBACX,KAAK,CAAC,OAAO,CACN,CACE,CACA,CACf,CACJ,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"modal.js","sourceRoot":"","sources":["../../src/components/modal.tsx"],"names":[],"mappings":"AAAA,oBAAoB;AACpB,+BAA+B;AAC/B,oCAAoC;AAEpC,oDAAoD;AAEpD,wBAAwB;AAExB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,EAAC,aAAa,EAAC,MAAM,oBAAoB,CAAC;AACxD,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAA;;;;;;;;;;CAUlC,CAAC;AAEF,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAA;;;;;;;;;;;;;;CAc/B,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;CAWzB,CAAC;AAEF,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAM3B,CAAC;AAEF,MAAM,MAAM,GAAG,MAAM,CAAC,EAAE,CAAA;;;;CAIvB,CAAC;AAQF,MAAM,UAAU,WAAW,CAAC,KAAiB;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,SAAS,WAAW;QAClB,IAAI,MAAM,EAAE,CAAC;YACX,KAAK,CAAC,OAAO,EAAE,CAAC;QAClB,CAAC;QACD,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;IACrB,CAAC;IAED,OAAO,CACL;QACE,oBAAC,aAAa;YACZ,oBAAC,WAAW,IAAC,MAAM,EAAE,MAAM,EAAE,iBAAiB,EAAE,WAAW,EAAE,eAAe,EAAE,WAAW;gBACvF,oBAAC,OAAO;oBACN,oBAAC,SAAS;wBACR,oBAAC,MAAM,QAAE,KAAK,CAAC,KAAK,CAAU,CACpB;oBACX,KAAK,CAAC,OAAO,CACN,CACE,CACA,CACf,CACJ,CAAC;AACJ,CAAC"}
package/dist/index.cjs CHANGED
@@ -41,9 +41,7 @@ __export(dist_exports, {
41
41
  HtmlTooltipOverlay: () => HtmlTooltipOverlay,
42
42
  Icon: () => Icon,
43
43
  LongPressButton: () => LongPressButton,
44
- Modal: () => EditorModal,
45
- PositionedViewControl: () => PositionedViewControl,
46
- ViewControl: () => ViewControl
44
+ Modal: () => EditorModal
47
45
  });
48
46
  module.exports = __toCommonJS(dist_exports);
49
47
 
@@ -80,178 +78,11 @@ __publicField(LongPressButton, "propTypes", {
80
78
  children: import_prop_types.default.any.isRequired
81
79
  });
82
80
 
83
- // dist/components/view-control.js
84
- var import_react2 = __toESM(require("react"), 1);
85
- var import_prop_types2 = __toESM(require("prop-types"), 1);
86
- var import_styled_components = require("styled-components");
87
- var ViewControlWrapper = import_styled_components.styled.div`
88
- align-items: center;
89
- display: flex;
90
- flex-direction: column;
91
- position: absolute;
92
- z-index: 99;
93
- user-select: none;
94
- `;
95
- var NavigationButtonContainer = import_styled_components.styled.div`
96
- background: #f7f7f7;
97
- border-radius: 23px;
98
- border: 0.5px solid #eaeaea;
99
- box-shadow: inset 11px 11px 5px -7px rgba(230, 230, 230, 0.49);
100
- height: 46px;
101
- width: 46px;
102
- `;
103
- var NavigationButton = import_styled_components.styled.div`
104
- color: #848484;
105
- cursor: pointer;
106
- left: ${(props) => props.$left};
107
- position: absolute;
108
- top: ${(props) => props.$top};
109
- transform: rotate(${(props) => props.rotate || 0}deg);
110
-
111
- &:hover,
112
- &:active {
113
- color: #00ade6;
114
- }
115
- `;
116
- var ZoomControlWrapper = import_styled_components.styled.div`
117
- align-items: center;
118
- background: #f7f7f7;
119
- border: 0.5px solid #eaeaea;
120
- display: flex;
121
- flex-direction: column;
122
- margin-top: 6px;
123
- padding: 2px 0;
124
- width: 18px;
125
- `;
126
- var VerticalSlider = import_styled_components.styled.div`
127
- display: inline-block;
128
- height: 100px;
129
- padding: 0;
130
- width: 10px;
131
-
132
- > input[type='range'][orient='vertical'] {
133
- writing-mode: vertical-lr;
134
- height: 100px;
135
- padding: 0;
136
- margin: 0;
137
- width: 10px;
138
- }
139
- `;
140
- var ZoomControlButton = import_styled_components.styled.div`
141
- cursor: pointer;
142
- font-size: 14px;
143
- font-weight: 500;
144
- margin: -4px;
145
-
146
- &:hover,
147
- &:active {
148
- color: #00ade6;
149
- }
150
- `;
151
- var ViewControl = class extends import_react2.PureComponent {
152
- // pan actions
153
- panUp = () => this.props.panBy(0, this.props.deltaPan);
154
- panDown = () => this.props.panBy(0, -1 * this.props.deltaPan);
155
- panLeft = () => this.props.panBy(this.props.deltaPan, 0);
156
- panRight = () => this.props.panBy(-1 * this.props.deltaPan, 0);
157
- // zoom actions
158
- zoomIn = () => this.props.zoomBy(this.props.deltaZoom);
159
- zoomOut = () => this.props.zoomBy(-1 * this.props.deltaZoom);
160
- onChangeZoomLevel = (evt) => {
161
- const delta = evt.target.value - this.props.zoomLevel;
162
- this.props.zoomBy(delta);
163
- };
164
- render() {
165
- const buttons = [
166
- { top: -2, left: 14, rotate: 0, onClick: this.panUp, content: "\u25B2", key: "up" },
167
- { top: 12, left: 0, rotate: -90, onClick: this.panLeft, content: "\u25C0", key: "left" },
168
- { top: 12, left: 28, rotate: 90, onClick: this.panRight, content: "\u25B6", key: "right" },
169
- { top: 25, left: 14, rotate: 180, onClick: this.panDown, content: "\u25BC", key: "down" }
170
- ];
171
- return import_react2.default.createElement(
172
- ViewControlWrapper,
173
- null,
174
- import_react2.default.createElement(
175
- NavigationButtonContainer,
176
- null,
177
- buttons.map((b) => import_react2.default.createElement(
178
- NavigationButton,
179
- { key: b.key, "$top": `${b.top}px`, "$left": `${b.left}px`, rotate: b.rotate },
180
- import_react2.default.createElement(LongPressButton, { onClick: b.onClick }, b.content)
181
- )),
182
- import_react2.default.createElement(NavigationButton, { "$top": "12px", "$left": "16px", onClick: this.props.fitBounds }, "\xA4")
183
- ),
184
- import_react2.default.createElement(
185
- ZoomControlWrapper,
186
- null,
187
- import_react2.default.createElement(
188
- ZoomControlButton,
189
- null,
190
- import_react2.default.createElement(LongPressButton, { onClick: this.zoomIn }, "+")
191
- ),
192
- import_react2.default.createElement(
193
- VerticalSlider,
194
- null,
195
- import_react2.default.createElement("input", {
196
- type: "range",
197
- value: this.props.zoomLevel,
198
- min: this.props.minZoom,
199
- max: this.props.maxZoom,
200
- step: this.props.deltaZoom,
201
- onChange: this.onChangeZoomLevel,
202
- /* @ts-expect-error TODO */
203
- orient: "vertical"
204
- })
205
- ),
206
- import_react2.default.createElement(
207
- ZoomControlButton,
208
- null,
209
- import_react2.default.createElement(LongPressButton, { onClick: this.zoomOut }, "-")
210
- )
211
- )
212
- );
213
- }
214
- };
215
- __publicField(ViewControl, "displayName", "ViewControl");
216
- __publicField(ViewControl, "propTypes", {
217
- // functions
218
- fitBounds: import_prop_types2.default.func,
219
- panBy: import_prop_types2.default.func,
220
- zoomBy: import_prop_types2.default.func,
221
- // current zoom level
222
- zoomLevel: import_prop_types2.default.number,
223
- // configuration
224
- minZoom: import_prop_types2.default.number,
225
- maxZoom: import_prop_types2.default.number,
226
- deltaPan: import_prop_types2.default.number,
227
- deltaZoom: import_prop_types2.default.number
228
- });
229
- __publicField(ViewControl, "defaultProps", {
230
- fitBounds: () => {
231
- },
232
- panBy: () => {
233
- },
234
- zoomBy: () => {
235
- },
236
- deltaPan: 10,
237
- deltaZoom: 0.1,
238
- minZoom: 0.1,
239
- maxZoom: 1
240
- });
241
-
242
- // dist/components/positioned-view-control.js
243
- var import_react3 = __toESM(require("react"), 1);
244
- var PositionedViewControl = ({ fitBounds, panBy, zoomBy, zoomLevel, maxZoom = 20, minZoom = -20 }) => import_react3.default.createElement(
245
- "div",
246
- { style: { position: "relative", top: "20px", left: "20px" } },
247
- import_react3.default.createElement(ViewControl, { fitBounds, panBy, zoomBy, zoomLevel, maxZoom, minZoom })
248
- );
249
-
250
81
  // dist/components/modal.js
251
- var React4 = __toESM(require("react"), 1);
82
+ var React2 = __toESM(require("react"), 1);
252
83
  var import_styled_react_modal = __toESM(require("styled-react-modal"), 1);
253
- var import_styled_components2 = require("styled-components");
254
- var Button = import_styled_components2.styled.button`
84
+ var import_styled_components = __toESM(require("styled-components"), 1);
85
+ var Button = import_styled_components.default.button`
255
86
  display: inline-block;
256
87
  color: #fff;
257
88
  background-color: rgb(90, 98, 94);
@@ -277,7 +108,7 @@ var StyledModal = import_styled_react_modal.default.styled`
277
108
  line-height: 1.5;
278
109
  text-align: left;
279
110
  `;
280
- var Content = import_styled_components2.styled.div`
111
+ var Content = import_styled_components.default.div`
281
112
  position: relative;
282
113
  display: flex;
283
114
  flex-direction: column;
@@ -289,42 +120,42 @@ var Content = import_styled_components2.styled.div`
289
120
  border-radius: 0.3rem;
290
121
  outline: 0;
291
122
  `;
292
- var HeaderRow = import_styled_components2.styled.div`
123
+ var HeaderRow = import_styled_components.default.div`
293
124
  display: flex;
294
125
  align-items: flex-start;
295
126
  justify-content: space-between;
296
127
  padding: 0.75rem 0.75rem;
297
128
  border-bottom: 1px solid rgb(222, 226, 230);
298
129
  `;
299
- var Header = import_styled_components2.styled.h5`
130
+ var Header = import_styled_components.default.h5`
300
131
  font-size: 1.25rem;
301
132
  font-weight: 500;
302
133
  margin: 0;
303
134
  `;
304
135
  function EditorModal(props) {
305
- const [isOpen, setIsOpen] = React4.useState(true);
136
+ const [isOpen, setIsOpen] = React2.useState(true);
306
137
  function toggleModal() {
307
138
  if (isOpen) {
308
139
  props.onClose();
309
140
  }
310
141
  setIsOpen(!isOpen);
311
142
  }
312
- return React4.createElement(
313
- React4.Fragment,
143
+ return React2.createElement(
144
+ React2.Fragment,
314
145
  null,
315
- React4.createElement(
146
+ React2.createElement(
316
147
  import_styled_react_modal.ModalProvider,
317
148
  null,
318
- React4.createElement(
149
+ React2.createElement(
319
150
  StyledModal,
320
151
  { isOpen, onBackgroundClick: toggleModal, onEscapeKeydown: toggleModal },
321
- React4.createElement(
152
+ React2.createElement(
322
153
  Content,
323
154
  null,
324
- React4.createElement(
155
+ React2.createElement(
325
156
  HeaderRow,
326
157
  null,
327
- React4.createElement(Header, null, props.title)
158
+ React2.createElement(Header, null, props.title)
328
159
  ),
329
160
  props.content
330
161
  )
@@ -334,14 +165,14 @@ function EditorModal(props) {
334
165
  }
335
166
 
336
167
  // dist/components/icon.js
337
- var React5 = __toESM(require("react"), 1);
168
+ var React3 = __toESM(require("react"), 1);
338
169
  var import_boxicons = require("boxicons");
339
170
  function Icon(props) {
340
- return React5.createElement("box-icon", { color: "currentColor", ...props });
171
+ return React3.createElement("box-icon", { color: "currentColor", ...props });
341
172
  }
342
173
 
343
174
  // dist/overlays/html-overlay.js
344
- var React6 = __toESM(require("react"), 1);
175
+ var React4 = __toESM(require("react"), 1);
345
176
  var styles = {
346
177
  mainContainer: {
347
178
  width: "100%",
@@ -351,7 +182,7 @@ var styles = {
351
182
  overflow: "hidden"
352
183
  }
353
184
  };
354
- var HtmlOverlay = class extends React6.Component {
185
+ var HtmlOverlay = class extends React4.Component {
355
186
  // Override this to provide your items
356
187
  getItems() {
357
188
  const { children } = this.props;
@@ -393,18 +224,18 @@ var HtmlOverlay = class extends React6.Component {
393
224
  const [x, y] = this.getCoords(item.props.coordinates);
394
225
  if (this.inView([x, y])) {
395
226
  const key = item.key === null || item.key === void 0 ? index : item.key;
396
- renderItems.push(React6.cloneElement(item, { x, y, key }));
227
+ renderItems.push(React4.cloneElement(item, { x, y, key }));
397
228
  }
398
229
  });
399
- return React6.createElement("div", { style }, renderItems);
230
+ return React4.createElement("div", { style }, renderItems);
400
231
  }
401
232
  };
402
233
  // This is needed for Deck.gl 8.0+
403
234
  __publicField(HtmlOverlay, "deckGLViewProps", true);
404
235
 
405
236
  // dist/overlays/html-overlay-item.js
406
- var React7 = __toESM(require("react"), 1);
407
- var HtmlOverlayItem = class extends React7.Component {
237
+ var React5 = __toESM(require("react"), 1);
238
+ var HtmlOverlayItem = class extends React5.Component {
408
239
  render() {
409
240
  const {
410
241
  x,
@@ -419,10 +250,10 @@ var HtmlOverlayItem = class extends React7.Component {
419
250
  // Using transform translate to position overlay items will result in a smooth zooming
420
251
  // effect, whereas using the top/left css properties will cause overlay items to
421
252
  // jiggle when zooming
422
- React7.createElement(
253
+ React5.createElement(
423
254
  "div",
424
255
  { style: { transform: `translate(${x}px, ${y}px)`, position: "absolute", zIndex } },
425
- React7.createElement("div", { style: { userSelect: "none", ...remainingStyle }, ...props }, children)
256
+ React5.createElement("div", { style: { userSelect: "none", ...remainingStyle }, ...props }, children)
426
257
  )
427
258
  );
428
259
  }
@@ -475,7 +306,7 @@ var HtmlClusterOverlay = class extends HtmlOverlay {
475
306
  };
476
307
 
477
308
  // dist/overlays/html-tooltip-overlay.js
478
- var React8 = __toESM(require("react"), 1);
309
+ var React6 = __toESM(require("react"), 1);
479
310
  var styles2 = {
480
311
  tooltip: {
481
312
  transform: "translate(-50%,-100%)",
@@ -514,7 +345,7 @@ var HtmlTooltipOverlay = class extends HtmlOverlay {
514
345
  _makeOverlay() {
515
346
  const { pickingInfo } = this.state;
516
347
  if (pickingInfo) {
517
- return React8.createElement(HtmlOverlayItem, { key: 0, coordinates: pickingInfo.lngLat, style: styles2.tooltip }, this._getTooltip(pickingInfo));
348
+ return React6.createElement(HtmlOverlayItem, { key: 0, coordinates: pickingInfo.lngLat, style: styles2.tooltip }, this._getTooltip(pickingInfo));
518
349
  }
519
350
  return null;
520
351
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../src/index.ts", "../src/components/long-press-button.tsx", "../src/components/view-control.tsx", "../src/components/positioned-view-control.tsx", "../src/components/modal.tsx", "../src/components/icon.tsx", "../src/overlays/html-overlay.tsx", "../src/overlays/html-overlay-item.tsx", "../src/overlays/html-cluster-overlay.ts", "../src/overlays/html-tooltip-overlay.tsx"],
4
- "sourcesContent": ["// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n// Components (originally from @deck.gl-community/graph-layers)\n\nexport {LongPressButton} from './components/long-press-button';\nexport {ViewControl} from './components/view-control';\nexport {PositionedViewControl} from './components/positioned-view-control';\n\n// Components (originally from @nebula.gl/editor)\n\nexport {EditorModal as Modal} from './components/modal';\nexport {Button} from './components/modal';\nexport {Icon} from './components/icon';\n\n// Overlays (originally from @nebula.gl/overlays)\n\nexport {HtmlOverlay} from './overlays/html-overlay';\nexport {HtmlOverlayItem} from './overlays/html-overlay-item';\nexport {HtmlClusterOverlay} from './overlays/html-cluster-overlay';\n\nexport {HtmlTooltipOverlay} from './overlays/html-tooltip-overlay';\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport React, {PureComponent} from 'react';\nimport PropTypes from 'prop-types';\n\nexport class LongPressButton extends PureComponent {\n static propTypes = {\n onClick: PropTypes.func.isRequired,\n // eslint-disable-next-line react/forbid-prop-types\n children: PropTypes.any.isRequired\n };\n\n buttonPressTimer: ReturnType<typeof setTimeout> | null = null;\n\n _repeat = () => {\n if (this.buttonPressTimer) {\n (this.props as any).onClick();\n this.buttonPressTimer = setTimeout(this._repeat, 100);\n }\n };\n\n _handleButtonPress = () => {\n this.buttonPressTimer = setTimeout(this._repeat, 100);\n };\n\n _handleButtonRelease = () => {\n if (this.buttonPressTimer) {\n clearTimeout(this.buttonPressTimer);\n }\n this.buttonPressTimer = null;\n };\n\n render() {\n return (\n <div\n onMouseDown={(event) => {\n this._handleButtonPress();\n document.addEventListener('mouseup', this._handleButtonRelease, {once: true});\n }}\n >\n {(this.props as any).children}\n </div>\n );\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n// @ts-nocheck TODO\n\nimport React, {PureComponent} from 'react';\nimport PropTypes from 'prop-types';\nimport {styled} from 'styled-components';\nimport {LongPressButton} from './long-press-button';\n\nexport const ViewControlWrapper = styled.div`\n align-items: center;\n display: flex;\n flex-direction: column;\n position: absolute;\n z-index: 99;\n user-select: none;\n`;\n\nexport const NavigationButtonContainer = styled.div`\n background: #f7f7f7;\n border-radius: 23px;\n border: 0.5px solid #eaeaea;\n box-shadow: inset 11px 11px 5px -7px rgba(230, 230, 230, 0.49);\n height: 46px;\n width: 46px;\n`;\n\nexport const NavigationButton = styled.div`\n color: #848484;\n cursor: pointer;\n left: ${(props: any) => props.$left};\n position: absolute;\n top: ${(props: any) => props.$top};\n transform: rotate(${(props: any) => props.rotate || 0}deg);\n\n &:hover,\n &:active {\n color: #00ade6;\n }\n`;\n\nexport const ZoomControlWrapper = styled.div`\n align-items: center;\n background: #f7f7f7;\n border: 0.5px solid #eaeaea;\n display: flex;\n flex-direction: column;\n margin-top: 6px;\n padding: 2px 0;\n width: 18px;\n`;\n\nexport const VerticalSlider = styled.div`\n display: inline-block;\n height: 100px;\n padding: 0;\n width: 10px;\n\n > input[type='range'][orient='vertical'] {\n writing-mode: vertical-lr;\n height: 100px;\n padding: 0;\n margin: 0;\n width: 10px;\n }\n`;\n\nexport const ZoomControlButton = styled.div`\n cursor: pointer;\n font-size: 14px;\n font-weight: 500;\n margin: -4px;\n\n &:hover,\n &:active {\n color: #00ade6;\n }\n`;\n\nexport class ViewControl extends PureComponent {\n static displayName = 'ViewControl';\n\n static propTypes = {\n // functions\n fitBounds: PropTypes.func,\n panBy: PropTypes.func,\n zoomBy: PropTypes.func,\n // current zoom level\n zoomLevel: PropTypes.number,\n // configuration\n minZoom: PropTypes.number,\n maxZoom: PropTypes.number,\n deltaPan: PropTypes.number,\n deltaZoom: PropTypes.number\n };\n\n static defaultProps = {\n fitBounds: () => {},\n panBy: () => {},\n zoomBy: () => {},\n deltaPan: 10,\n deltaZoom: 0.1,\n minZoom: 0.1,\n maxZoom: 1\n };\n\n // pan actions\n panUp = () => (this.props as any).panBy(0, (this.props as any).deltaPan);\n panDown = () => (this.props as any).panBy(0, -1 * (this.props as any).deltaPan);\n panLeft = () => (this.props as any).panBy((this.props as any).deltaPan, 0);\n panRight = () => (this.props as any).panBy(-1 * (this.props as any).deltaPan, 0);\n\n // zoom actions\n zoomIn = () => (this.props as any).zoomBy((this.props as any).deltaZoom);\n zoomOut = () => (this.props as any).zoomBy(-1 * (this.props as any).deltaZoom);\n onChangeZoomLevel = (evt) => {\n const delta = evt.target.value - (this.props as any).zoomLevel;\n (this.props as any).zoomBy(delta);\n };\n\n render() {\n const buttons = [\n {top: -2, left: 14, rotate: 0, onClick: this.panUp, content: '\u25B2', key: 'up'},\n {top: 12, left: 0, rotate: -90, onClick: this.panLeft, content: '\u25C0', key: 'left'},\n {top: 12, left: 28, rotate: 90, onClick: this.panRight, content: '\u25B6', key: 'right'},\n {top: 25, left: 14, rotate: 180, onClick: this.panDown, content: '\u25BC', key: 'down'}\n ];\n\n return (\n <ViewControlWrapper>\n <NavigationButtonContainer>\n {buttons.map((b: any) => (\n <NavigationButton\n key={b.key}\n $top={`${b.top}px`}\n $left={`${b.left}px`}\n rotate={b.rotate}\n >\n <LongPressButton onClick={b.onClick}>{b.content}</LongPressButton>\n </NavigationButton>\n ))}\n {/* @ts-expect-error TODO */}\n <NavigationButton $top={'12px'} $left={'16px'} onClick={this.props.fitBounds}>\n {'\u00A4'}\n </NavigationButton>\n </NavigationButtonContainer>\n <ZoomControlWrapper>\n <ZoomControlButton>\n <LongPressButton onClick={this.zoomIn}>{'+'}</LongPressButton>\n </ZoomControlButton>\n <VerticalSlider>\n <input\n type=\"range\"\n value={(this.props as any).zoomLevel}\n min={(this.props as any).minZoom}\n max={(this.props as any).maxZoom}\n step={(this.props as any).deltaZoom}\n onChange={this.onChangeZoomLevel}\n /* @ts-expect-error TODO */\n orient=\"vertical\"\n />\n </VerticalSlider>\n <ZoomControlButton>\n <LongPressButton onClick={this.zoomOut}>{'-'}</LongPressButton>\n </ZoomControlButton>\n </ZoomControlWrapper>\n </ViewControlWrapper>\n );\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport {ViewControl} from './view-control';\nimport React from 'react';\n\n// A wrapper for positioning the ViewControl component\nexport const PositionedViewControl = ({\n fitBounds,\n panBy,\n zoomBy,\n zoomLevel,\n maxZoom = 20,\n minZoom = -20\n}) => (\n <div style={{position: 'relative', top: '20px', left: '20px'}}>\n <ViewControl\n fitBounds={fitBounds}\n panBy={panBy}\n zoomBy={zoomBy}\n zoomLevel={zoomLevel}\n maxZoom={maxZoom}\n minZoom={minZoom}\n />\n </div>\n);\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n/* eslint-env browser */\n\nimport * as React from 'react';\nimport Modal, {ModalProvider} from 'styled-react-modal';\nimport {styled} from 'styled-components';\n\nexport const Button = styled.button`\n display: inline-block;\n color: #fff;\n background-color: rgb(90, 98, 94);\n font-size: 1em;\n margin: 0.25em;\n padding: 0.375em 0.75em;\n border: 1px solid transparent;\n border-radius: 0.25em;\n display: block;\n`;\n\nconst StyledModal = Modal.styled`\n position: relative;\n display: block;\n width: 50rem;\n height: auto;\n max-width: 500px;\n margin: 1.75rem auto;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 1rem;\n font-weight: 400;\n color: rgb(21, 25, 29);\n line-height: 1.5;\n text-align: left;\n`;\n\nconst Content = styled.div`\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%;\n pointer-events: auto;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 0.3rem;\n outline: 0;\n`;\n\nconst HeaderRow = styled.div`\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n padding: 0.75rem 0.75rem;\n border-bottom: 1px solid rgb(222, 226, 230);\n`;\n\nconst Header = styled.h5`\n font-size: 1.25rem;\n font-weight: 500;\n margin: 0;\n`;\n\nexport type ModalProps = {\n title: any;\n content: any;\n onClose: () => unknown;\n};\n\nexport function EditorModal(props: ModalProps) {\n const [isOpen, setIsOpen] = React.useState(true);\n\n function toggleModal() {\n if (isOpen) {\n props.onClose();\n }\n setIsOpen(!isOpen);\n }\n\n return (\n <>\n <ModalProvider>\n <StyledModal isOpen={isOpen} onBackgroundClick={toggleModal} onEscapeKeydown={toggleModal}>\n <Content>\n <HeaderRow>\n <Header>{props.title}</Header>\n </HeaderRow>\n {props.content}\n </Content>\n </StyledModal>\n </ModalProvider>\n </>\n );\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\nimport 'boxicons';\n\nexport function Icon(props) {\n // @ts-expect-error TODO\n return <box-icon color=\"currentColor\" {...props} />;\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\n\nconst styles = {\n mainContainer: {\n width: '100%',\n height: '100%',\n position: 'absolute',\n pointerEvents: 'none',\n overflow: 'hidden'\n }\n};\n\ninterface Props {\n viewport?: Record<string, any>;\n zIndex?: number;\n children?: React.ReactNode;\n // Overlay items abruptly disappear when their anchor point passes the edge of the map, which is\n // visible to the user. The overflowMargin prop is used to effectively create a hidden buffer\n // zone that extends from all sides of the map while leaving the visible edge of the map\n // unchanged. With this, overlay items can move into the buffer zone and disappear only when\n // their anchor passes the edge of the buffer zone. This produces a perceived effect of overlay\n // items being rendered as part of the map, instead of separate entities tacked on to the map.\n overflowMargin?: number;\n}\n\nexport class HtmlOverlay extends React.Component<Props> {\n // This is needed for Deck.gl 8.0+\n static deckGLViewProps = true;\n\n // Override this to provide your items\n getItems(): Array<any> {\n const {children} = this.props;\n if (children) {\n return Array.isArray(children) ? children : [children];\n }\n return [];\n }\n\n getCoords(coordinates: number[]): [number, number] {\n const pos = this.props.viewport.project(coordinates);\n if (!pos) return [-1, -1];\n return pos;\n }\n\n inView([x, y]: number[]): boolean {\n const {viewport, overflowMargin = 0} = this.props;\n const {width, height} = viewport;\n return !(\n x < -overflowMargin ||\n y < -overflowMargin ||\n x > width + overflowMargin ||\n y > height + overflowMargin\n );\n }\n\n scaleWithZoom(n: number) {\n const {zoom} = this.props.viewport;\n return n / Math.pow(2, 20 - zoom);\n }\n\n breakpointWithZoom(threshold: number, a: any, b: any): any {\n const {zoom} = this.props.viewport;\n return zoom > threshold ? a : b;\n }\n\n getViewport() {\n return this.props.viewport;\n }\n\n getZoom() {\n return this.props.viewport.zoom;\n }\n\n render() {\n const {zIndex = 1} = this.props;\n const style = Object.assign({zIndex} as any, styles.mainContainer);\n\n const renderItems = [];\n this.getItems()\n .filter(Boolean)\n .forEach((item, index) => {\n const [x, y] = this.getCoords(item.props.coordinates);\n if (this.inView([x, y])) {\n const key = item.key === null || item.key === undefined ? index : item.key;\n renderItems.push(React.cloneElement(item, {x, y, key}));\n }\n });\n\n return <div style={style}>{renderItems}</div>;\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\n\ntype Props = {\n // Injected by HtmlOverlay\n x?: number;\n y?: number;\n\n // User provided\n coordinates: number[];\n children: any;\n style?: Record<string, any>;\n};\n\nexport class HtmlOverlayItem extends React.Component<Props> {\n render() {\n const {x, y, children, style, /* coordinates, */ ...props} = this.props;\n const {zIndex = 'auto', ...remainingStyle} = style || {};\n\n return (\n // Using transform translate to position overlay items will result in a smooth zooming\n // effect, whereas using the top/left css properties will cause overlay items to\n // jiggle when zooming\n <div style={{transform: `translate(${x}px, ${y}px)`, position: 'absolute', zIndex}}>\n <div style={{userSelect: 'none', ...remainingStyle}} {...props}>\n {children}\n </div>\n </div>\n );\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport {point} from '@turf/helpers';\nimport Supercluster from 'supercluster';\nimport {HtmlOverlay} from './html-overlay';\n\nexport class HtmlClusterOverlay<ObjType> extends HtmlOverlay {\n _superCluster: Supercluster;\n _lastObjects: ObjType[] | null | undefined = null;\n\n getItems(): Record<string, any>[] {\n // supercluster().load() is expensive and we want to run it only\n // when necessary and not for every frame.\n\n // TODO: Warn if this is running many times / sec\n\n const newObjects = this.getAllObjects();\n if (newObjects !== this._lastObjects) {\n this._superCluster = new Supercluster(this.getClusterOptions());\n this._superCluster.load(\n newObjects.map((object) => point(this.getObjectCoordinates(object), {object}))\n );\n this._lastObjects = newObjects;\n // console.log('new Supercluster() run');\n }\n\n const clusters = this._superCluster.getClusters(\n [-180, -90, 180, 90],\n Math.round(this.getZoom())\n );\n\n return clusters.map(\n ({\n geometry: {coordinates},\n properties: {cluster, point_count: pointCount, cluster_id: clusterId, object}\n }) =>\n cluster\n ? this.renderCluster(coordinates, clusterId, pointCount)\n : this.renderObject(coordinates, object)\n );\n }\n\n getClusterObjects(clusterId: number): ObjType[] {\n return this._superCluster\n .getLeaves(clusterId, Infinity)\n .map((object) => object.properties.object);\n }\n\n // Override to provide items that need clustering.\n // If the items have not changed please provide the same array to avoid\n // regeneration of the cluster which causes performance issues.\n getAllObjects(): ObjType[] {\n return [];\n }\n\n // override to provide coordinates for each object of getAllObjects()\n getObjectCoordinates(obj: ObjType): [number, number] {\n return [0, 0];\n }\n\n // Get options object used when instantiating supercluster\n getClusterOptions(): Record<string, any> | null | undefined {\n return {\n maxZoom: 20\n };\n }\n\n // override to return an HtmlOverlayItem\n renderObject(coordinates: number[], obj: ObjType): Record<string, any> | null | undefined {\n return null;\n }\n\n // override to return an HtmlOverlayItem\n // use getClusterObjects() to get cluster contents\n renderCluster(\n coordinates: number[],\n clusterId: number,\n pointCount: number\n ): Record<string, any> | null | undefined {\n return null;\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\n\nimport {HtmlOverlay} from './html-overlay';\nimport {HtmlOverlayItem} from './html-overlay-item';\n\ntype State = {\n visible: boolean;\n pickingInfo: Record<string, any> | null | undefined;\n};\n\nconst styles = {\n tooltip: {\n transform: 'translate(-50%,-100%)',\n backgroundColor: 'rgba(0, 0, 0, 0.3)',\n padding: '4px 8px',\n borderRadius: 8,\n color: 'white'\n }\n};\n\nconst SHOW_TOOLTIP_TIMEOUT = 250;\n\nexport class HtmlTooltipOverlay extends HtmlOverlay {\n constructor(props: any) {\n super(props);\n this.state = {visible: false, pickingInfo: null};\n }\n\n componentWillMount() {\n (this.context as any).nebula.queryObjectEvents.on('pick', ({event, pickingInfo}) => {\n if (this.timeoutID !== null) {\n window.clearTimeout(this.timeoutID);\n }\n this.timeoutID = null;\n\n if (pickingInfo && this._getTooltip(pickingInfo)) {\n this.timeoutID = window.setTimeout(() => {\n this.setState({visible: true, pickingInfo});\n }, SHOW_TOOLTIP_TIMEOUT);\n } else {\n this.setState({visible: false});\n }\n });\n }\n\n timeoutID: number | null | undefined = null;\n state: State = undefined!;\n\n _getTooltip(pickingInfo: Record<string, any>): string {\n return pickingInfo.object.style.tooltip;\n }\n\n _makeOverlay() {\n const {pickingInfo} = this.state;\n\n if (pickingInfo) {\n return (\n <HtmlOverlayItem key={0} coordinates={pickingInfo.lngLat} style={styles.tooltip}>\n {this._getTooltip(pickingInfo)}\n </HtmlOverlayItem>\n );\n }\n\n return null;\n }\n\n getItems(): Array<Record<string, any> | null | undefined> {\n if (this.state.visible) {\n return [this._makeOverlay()];\n }\n\n return [];\n }\n}\n"],
5
- "mappings": "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",
6
- "names": ["React", "PropTypes", "import_react", "import_prop_types", "React", "PropTypes", "import_react", "React", "React", "import_styled_components", "Modal", "React", "React", "React", "Supercluster", "React", "styles"]
3
+ "sources": ["../src/index.ts", "../src/components/long-press-button.tsx", "../src/components/modal.tsx", "../src/components/icon.tsx", "../src/overlays/html-overlay.tsx", "../src/overlays/html-overlay-item.tsx", "../src/overlays/html-cluster-overlay.ts", "../src/overlays/html-tooltip-overlay.tsx"],
4
+ "sourcesContent": ["// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n// Components (originally from @deck.gl-community/graph-layers)\n\nexport {LongPressButton} from './components/long-press-button';\n\n// Components (originally from @nebula.gl/editor)\n\nexport {EditorModal as Modal} from './components/modal';\nexport {Button} from './components/modal';\nexport {Icon} from './components/icon';\n\n// Overlays (originally from @nebula.gl/overlays)\n\nexport {HtmlOverlay} from './overlays/html-overlay';\nexport {HtmlOverlayItem} from './overlays/html-overlay-item';\nexport {HtmlClusterOverlay} from './overlays/html-cluster-overlay';\n\nexport {HtmlTooltipOverlay} from './overlays/html-tooltip-overlay';\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport React, {PureComponent} from 'react';\nimport PropTypes from 'prop-types';\n\nexport class LongPressButton extends PureComponent {\n static propTypes = {\n onClick: PropTypes.func.isRequired,\n // eslint-disable-next-line react/forbid-prop-types\n children: PropTypes.any.isRequired\n };\n\n buttonPressTimer: ReturnType<typeof setTimeout> | null = null;\n\n _repeat = () => {\n if (this.buttonPressTimer) {\n (this.props as any).onClick();\n this.buttonPressTimer = setTimeout(this._repeat, 100);\n }\n };\n\n _handleButtonPress = () => {\n this.buttonPressTimer = setTimeout(this._repeat, 100);\n };\n\n _handleButtonRelease = () => {\n if (this.buttonPressTimer) {\n clearTimeout(this.buttonPressTimer);\n }\n this.buttonPressTimer = null;\n };\n\n render() {\n return (\n <div\n onMouseDown={(event) => {\n this._handleButtonPress();\n document.addEventListener('mouseup', this._handleButtonRelease, {once: true});\n }}\n >\n {(this.props as any).children}\n </div>\n );\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\n// @ts-nocheck This modal file should be phased out.\n\n/* eslint-env browser */\n\nimport * as React from 'react';\nimport Modal, {ModalProvider} from 'styled-react-modal';\nimport styled from 'styled-components';\n\nexport const Button = styled.button`\n display: inline-block;\n color: #fff;\n background-color: rgb(90, 98, 94);\n font-size: 1em;\n margin: 0.25em;\n padding: 0.375em 0.75em;\n border: 1px solid transparent;\n border-radius: 0.25em;\n display: block;\n`;\n\nconst StyledModal = Modal.styled`\n position: relative;\n display: block;\n width: 50rem;\n height: auto;\n max-width: 500px;\n margin: 1.75rem auto;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 1rem;\n font-weight: 400;\n color: rgb(21, 25, 29);\n line-height: 1.5;\n text-align: left;\n`;\n\nconst Content = styled.div`\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%;\n pointer-events: auto;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 0.3rem;\n outline: 0;\n`;\n\nconst HeaderRow = styled.div`\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n padding: 0.75rem 0.75rem;\n border-bottom: 1px solid rgb(222, 226, 230);\n`;\n\nconst Header = styled.h5`\n font-size: 1.25rem;\n font-weight: 500;\n margin: 0;\n`;\n\nexport type ModalProps = {\n title: any;\n content: any;\n onClose: () => unknown;\n};\n\nexport function EditorModal(props: ModalProps) {\n const [isOpen, setIsOpen] = React.useState(true);\n\n function toggleModal() {\n if (isOpen) {\n props.onClose();\n }\n setIsOpen(!isOpen);\n }\n\n return (\n <>\n <ModalProvider>\n <StyledModal isOpen={isOpen} onBackgroundClick={toggleModal} onEscapeKeydown={toggleModal}>\n <Content>\n <HeaderRow>\n <Header>{props.title}</Header>\n </HeaderRow>\n {props.content}\n </Content>\n </StyledModal>\n </ModalProvider>\n </>\n );\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\nimport 'boxicons';\n\nexport function Icon(props) {\n // @ts-expect-error TODO\n return <box-icon color=\"currentColor\" {...props} />;\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\n\nconst styles = {\n mainContainer: {\n width: '100%',\n height: '100%',\n position: 'absolute',\n pointerEvents: 'none',\n overflow: 'hidden'\n }\n};\n\ninterface Props {\n viewport?: Record<string, any>;\n zIndex?: number;\n children?: React.ReactNode;\n // Overlay items abruptly disappear when their anchor point passes the edge of the map, which is\n // visible to the user. The overflowMargin prop is used to effectively create a hidden buffer\n // zone that extends from all sides of the map while leaving the visible edge of the map\n // unchanged. With this, overlay items can move into the buffer zone and disappear only when\n // their anchor passes the edge of the buffer zone. This produces a perceived effect of overlay\n // items being rendered as part of the map, instead of separate entities tacked on to the map.\n overflowMargin?: number;\n}\n\nexport class HtmlOverlay extends React.Component<Props> {\n // This is needed for Deck.gl 8.0+\n static deckGLViewProps = true;\n\n // Override this to provide your items\n getItems(): Array<any> {\n const {children} = this.props;\n if (children) {\n return Array.isArray(children) ? children : [children];\n }\n return [];\n }\n\n getCoords(coordinates: number[]): [number, number] {\n const pos = this.props.viewport.project(coordinates);\n if (!pos) return [-1, -1];\n return pos;\n }\n\n inView([x, y]: number[]): boolean {\n const {viewport, overflowMargin = 0} = this.props;\n const {width, height} = viewport;\n return !(\n x < -overflowMargin ||\n y < -overflowMargin ||\n x > width + overflowMargin ||\n y > height + overflowMargin\n );\n }\n\n scaleWithZoom(n: number) {\n const {zoom} = this.props.viewport;\n return n / Math.pow(2, 20 - zoom);\n }\n\n breakpointWithZoom(threshold: number, a: any, b: any): any {\n const {zoom} = this.props.viewport;\n return zoom > threshold ? a : b;\n }\n\n getViewport() {\n return this.props.viewport;\n }\n\n getZoom() {\n return this.props.viewport.zoom;\n }\n\n render() {\n const {zIndex = 1} = this.props;\n const style = Object.assign({zIndex} as any, styles.mainContainer);\n\n const renderItems = [];\n this.getItems()\n .filter(Boolean)\n .forEach((item, index) => {\n const [x, y] = this.getCoords(item.props.coordinates);\n if (this.inView([x, y])) {\n const key = item.key === null || item.key === undefined ? index : item.key;\n renderItems.push(React.cloneElement(item, {x, y, key}));\n }\n });\n\n return <div style={style}>{renderItems}</div>;\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\n\ntype Props = {\n // Injected by HtmlOverlay\n x?: number;\n y?: number;\n\n // User provided\n coordinates: number[];\n children: any;\n style?: Record<string, any>;\n};\n\nexport class HtmlOverlayItem extends React.Component<Props> {\n render() {\n const {x, y, children, style, /* coordinates, */ ...props} = this.props;\n const {zIndex = 'auto', ...remainingStyle} = style || {};\n\n return (\n // Using transform translate to position overlay items will result in a smooth zooming\n // effect, whereas using the top/left css properties will cause overlay items to\n // jiggle when zooming\n <div style={{transform: `translate(${x}px, ${y}px)`, position: 'absolute', zIndex}}>\n <div style={{userSelect: 'none', ...remainingStyle}} {...props}>\n {children}\n </div>\n </div>\n );\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport {point} from '@turf/helpers';\nimport Supercluster from 'supercluster';\nimport {HtmlOverlay} from './html-overlay';\n\nexport class HtmlClusterOverlay<ObjType> extends HtmlOverlay {\n _superCluster: Supercluster;\n _lastObjects: ObjType[] | null | undefined = null;\n\n getItems(): Record<string, any>[] {\n // supercluster().load() is expensive and we want to run it only\n // when necessary and not for every frame.\n\n // TODO: Warn if this is running many times / sec\n\n const newObjects = this.getAllObjects();\n if (newObjects !== this._lastObjects) {\n this._superCluster = new Supercluster(this.getClusterOptions());\n this._superCluster.load(\n newObjects.map((object) => point(this.getObjectCoordinates(object), {object}))\n );\n this._lastObjects = newObjects;\n // console.log('new Supercluster() run');\n }\n\n const clusters = this._superCluster.getClusters(\n [-180, -90, 180, 90],\n Math.round(this.getZoom())\n );\n\n return clusters.map(\n ({\n geometry: {coordinates},\n properties: {cluster, point_count: pointCount, cluster_id: clusterId, object}\n }) =>\n cluster\n ? this.renderCluster(coordinates, clusterId, pointCount)\n : this.renderObject(coordinates, object)\n );\n }\n\n getClusterObjects(clusterId: number): ObjType[] {\n return this._superCluster\n .getLeaves(clusterId, Infinity)\n .map((object) => object.properties.object);\n }\n\n // Override to provide items that need clustering.\n // If the items have not changed please provide the same array to avoid\n // regeneration of the cluster which causes performance issues.\n getAllObjects(): ObjType[] {\n return [];\n }\n\n // override to provide coordinates for each object of getAllObjects()\n getObjectCoordinates(obj: ObjType): [number, number] {\n return [0, 0];\n }\n\n // Get options object used when instantiating supercluster\n getClusterOptions(): Record<string, any> | null | undefined {\n return {\n maxZoom: 20\n };\n }\n\n // override to return an HtmlOverlayItem\n renderObject(coordinates: number[], obj: ObjType): Record<string, any> | null | undefined {\n return null;\n }\n\n // override to return an HtmlOverlayItem\n // use getClusterObjects() to get cluster contents\n renderCluster(\n coordinates: number[],\n clusterId: number,\n pointCount: number\n ): Record<string, any> | null | undefined {\n return null;\n }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\n\nimport * as React from 'react';\n\nimport {HtmlOverlay} from './html-overlay';\nimport {HtmlOverlayItem} from './html-overlay-item';\n\ntype State = {\n visible: boolean;\n pickingInfo: Record<string, any> | null | undefined;\n};\n\nconst styles = {\n tooltip: {\n transform: 'translate(-50%,-100%)',\n backgroundColor: 'rgba(0, 0, 0, 0.3)',\n padding: '4px 8px',\n borderRadius: 8,\n color: 'white'\n }\n};\n\nconst SHOW_TOOLTIP_TIMEOUT = 250;\n\nexport class HtmlTooltipOverlay extends HtmlOverlay {\n constructor(props: any) {\n super(props);\n this.state = {visible: false, pickingInfo: null};\n }\n\n componentWillMount() {\n (this.context as any).nebula.queryObjectEvents.on('pick', ({event, pickingInfo}) => {\n if (this.timeoutID !== null) {\n window.clearTimeout(this.timeoutID);\n }\n this.timeoutID = null;\n\n if (pickingInfo && this._getTooltip(pickingInfo)) {\n this.timeoutID = window.setTimeout(() => {\n this.setState({visible: true, pickingInfo});\n }, SHOW_TOOLTIP_TIMEOUT);\n } else {\n this.setState({visible: false});\n }\n });\n }\n\n timeoutID: number | null | undefined = null;\n state: State = undefined!;\n\n _getTooltip(pickingInfo: Record<string, any>): string {\n return pickingInfo.object.style.tooltip;\n }\n\n _makeOverlay() {\n const {pickingInfo} = this.state;\n\n if (pickingInfo) {\n return (\n <HtmlOverlayItem key={0} coordinates={pickingInfo.lngLat} style={styles.tooltip}>\n {this._getTooltip(pickingInfo)}\n </HtmlOverlayItem>\n );\n }\n\n return null;\n }\n\n getItems(): Array<Record<string, any> | null | undefined> {\n if (this.state.visible) {\n return [this._makeOverlay()];\n }\n\n return [];\n }\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["React", "PropTypes", "React", "styled", "Modal", "React", "React", "React", "Supercluster", "React", "styles"]
7
7
  }
package/dist/index.d.ts CHANGED
@@ -1,6 +1,4 @@
1
1
  export { LongPressButton } from "./components/long-press-button.js";
2
- export { ViewControl } from "./components/view-control.js";
3
- export { PositionedViewControl } from "./components/positioned-view-control.js";
4
2
  export { EditorModal as Modal } from "./components/modal.js";
5
3
  export { Button } from "./components/modal.js";
6
4
  export { Icon } from "./components/icon.js";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAC,eAAe,EAAC,0CAAuC;AAC/D,OAAO,EAAC,WAAW,EAAC,qCAAkC;AACtD,OAAO,EAAC,qBAAqB,EAAC,gDAA6C;AAI3E,OAAO,EAAC,WAAW,IAAI,KAAK,EAAC,8BAA2B;AACxD,OAAO,EAAC,MAAM,EAAC,8BAA2B;AAC1C,OAAO,EAAC,IAAI,EAAC,6BAA0B;AAIvC,OAAO,EAAC,WAAW,EAAC,mCAAgC;AACpD,OAAO,EAAC,eAAe,EAAC,wCAAqC;AAC7D,OAAO,EAAC,kBAAkB,EAAC,2CAAwC;AAEnE,OAAO,EAAC,kBAAkB,EAAC,2CAAwC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAC,eAAe,EAAC,0CAAuC;AAI/D,OAAO,EAAC,WAAW,IAAI,KAAK,EAAC,8BAA2B;AACxD,OAAO,EAAC,MAAM,EAAC,8BAA2B;AAC1C,OAAO,EAAC,IAAI,EAAC,6BAA0B;AAIvC,OAAO,EAAC,WAAW,EAAC,mCAAgC;AACpD,OAAO,EAAC,eAAe,EAAC,wCAAqC;AAC7D,OAAO,EAAC,kBAAkB,EAAC,2CAAwC;AAEnE,OAAO,EAAC,kBAAkB,EAAC,2CAAwC"}
package/dist/index.js CHANGED
@@ -3,8 +3,6 @@
3
3
  // Copyright (c) vis.gl contributors
4
4
  // Components (originally from @deck.gl-community/graph-layers)
5
5
  export { LongPressButton } from "./components/long-press-button.js";
6
- export { ViewControl } from "./components/view-control.js";
7
- export { PositionedViewControl } from "./components/positioned-view-control.js";
8
6
  // Components (originally from @nebula.gl/editor)
9
7
  export { EditorModal as Modal } from "./components/modal.js";
10
8
  export { Button } from "./components/modal.js";
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,oBAAoB;AACpB,+BAA+B;AAC/B,oCAAoC;AAEpC,+DAA+D;AAE/D,OAAO,EAAC,eAAe,EAAC,0CAAuC;AAC/D,OAAO,EAAC,WAAW,EAAC,qCAAkC;AACtD,OAAO,EAAC,qBAAqB,EAAC,gDAA6C;AAE3E,iDAAiD;AAEjD,OAAO,EAAC,WAAW,IAAI,KAAK,EAAC,8BAA2B;AACxD,OAAO,EAAC,MAAM,EAAC,8BAA2B;AAC1C,OAAO,EAAC,IAAI,EAAC,6BAA0B;AAEvC,iDAAiD;AAEjD,OAAO,EAAC,WAAW,EAAC,mCAAgC;AACpD,OAAO,EAAC,eAAe,EAAC,wCAAqC;AAC7D,OAAO,EAAC,kBAAkB,EAAC,2CAAwC;AAEnE,OAAO,EAAC,kBAAkB,EAAC,2CAAwC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,oBAAoB;AACpB,+BAA+B;AAC/B,oCAAoC;AAEpC,+DAA+D;AAE/D,OAAO,EAAC,eAAe,EAAC,0CAAuC;AAE/D,iDAAiD;AAEjD,OAAO,EAAC,WAAW,IAAI,KAAK,EAAC,8BAA2B;AACxD,OAAO,EAAC,MAAM,EAAC,8BAA2B;AAC1C,OAAO,EAAC,IAAI,EAAC,6BAA0B;AAEvC,iDAAiD;AAEjD,OAAO,EAAC,WAAW,EAAC,mCAAgC;AACpD,OAAO,EAAC,eAAe,EAAC,wCAAqC;AAC7D,OAAO,EAAC,kBAAkB,EAAC,2CAAwC;AAEnE,OAAO,EAAC,kBAAkB,EAAC,2CAAwC"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@deck.gl-community/react",
3
3
  "description": "React components for deck.gl",
4
4
  "license": "MIT",
5
- "version": "9.1.1",
5
+ "version": "9.2.0-beta.3",
6
6
  "repository": {
7
7
  "type": "git",
8
8
  "url": "https://github.com/visgl/deck.gl-community"
@@ -39,11 +39,11 @@
39
39
  "boxicons": "^2.1.4",
40
40
  "preact": "^10.17.0",
41
41
  "prop-types": "^15.8.1",
42
- "react": "^18.2.0",
43
- "react-dom": "^18.2.0",
42
+ "react": "^18.3.1",
43
+ "react-dom": "^18.3.1",
44
44
  "styled-components": "^6.1.1",
45
45
  "styled-react-modal": "^3.1.1",
46
46
  "supercluster": "^8.0.1"
47
47
  },
48
- "gitHead": "e88211052d3ecba78a5982ee581d6c7b95008b65"
48
+ "gitHead": "6110b774c8be16f199ecdf67723851a2e34901e5"
49
49
  }
@@ -2,11 +2,13 @@
2
2
  // SPDX-License-Identifier: MIT
3
3
  // Copyright (c) vis.gl contributors
4
4
 
5
+ // @ts-nocheck This modal file should be phased out.
6
+
5
7
  /* eslint-env browser */
6
8
 
7
9
  import * as React from 'react';
8
10
  import Modal, {ModalProvider} from 'styled-react-modal';
9
- import {styled} from 'styled-components';
11
+ import styled from 'styled-components';
10
12
 
11
13
  export const Button = styled.button`
12
14
  display: inline-block;
package/src/index.ts CHANGED
@@ -5,8 +5,6 @@
5
5
  // Components (originally from @deck.gl-community/graph-layers)
6
6
 
7
7
  export {LongPressButton} from './components/long-press-button';
8
- export {ViewControl} from './components/view-control';
9
- export {PositionedViewControl} from './components/positioned-view-control';
10
8
 
11
9
  // Components (originally from @nebula.gl/editor)
12
10
 
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- export declare const PositionedViewControl: ({ fitBounds, panBy, zoomBy, zoomLevel, maxZoom, minZoom }: {
3
- fitBounds: any;
4
- panBy: any;
5
- zoomBy: any;
6
- zoomLevel: any;
7
- maxZoom?: number;
8
- minZoom?: number;
9
- }) => React.JSX.Element;
10
- //# sourceMappingURL=positioned-view-control.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"positioned-view-control.d.ts","sourceRoot":"","sources":["../../src/components/positioned-view-control.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,eAAO,MAAM,qBAAqB;;;;;;;uBAkBjC,CAAC"}
@@ -1,9 +0,0 @@
1
- // deck.gl-community
2
- // SPDX-License-Identifier: MIT
3
- // Copyright (c) vis.gl contributors
4
- import { ViewControl } from "./view-control.js";
5
- import React from 'react';
6
- // A wrapper for positioning the ViewControl component
7
- export const PositionedViewControl = ({ fitBounds, panBy, zoomBy, zoomLevel, maxZoom = 20, minZoom = -20 }) => (React.createElement("div", { style: { position: 'relative', top: '20px', left: '20px' } },
8
- React.createElement(ViewControl, { fitBounds: fitBounds, panBy: panBy, zoomBy: zoomBy, zoomLevel: zoomLevel, maxZoom: maxZoom, minZoom: minZoom })));
9
- //# sourceMappingURL=positioned-view-control.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"positioned-view-control.js","sourceRoot":"","sources":["../../src/components/positioned-view-control.tsx"],"names":[],"mappings":"AAAA,oBAAoB;AACpB,+BAA+B;AAC/B,oCAAoC;AAEpC,OAAO,EAAC,WAAW,EAAC,0BAAuB;AAC3C,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,sDAAsD;AACtD,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EACpC,SAAS,EACT,KAAK,EACL,MAAM,EACN,SAAS,EACT,OAAO,GAAG,EAAE,EACZ,OAAO,GAAG,CAAC,EAAE,EACd,EAAE,EAAE,CAAC,CACJ,6BAAK,KAAK,EAAE,EAAC,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAC;IAC3D,oBAAC,WAAW,IACV,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,GAChB,CACE,CACP,CAAC"}
@@ -1,39 +0,0 @@
1
- import React, { PureComponent } from 'react';
2
- import PropTypes from 'prop-types';
3
- export declare const ViewControlWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
4
- export declare const NavigationButtonContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
5
- export declare const NavigationButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
6
- export declare const ZoomControlWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
7
- export declare const VerticalSlider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
8
- export declare const ZoomControlButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
9
- export declare class ViewControl extends PureComponent {
10
- static displayName: string;
11
- static propTypes: {
12
- fitBounds: PropTypes.Requireable<(...args: any[]) => any>;
13
- panBy: PropTypes.Requireable<(...args: any[]) => any>;
14
- zoomBy: PropTypes.Requireable<(...args: any[]) => any>;
15
- zoomLevel: PropTypes.Requireable<number>;
16
- minZoom: PropTypes.Requireable<number>;
17
- maxZoom: PropTypes.Requireable<number>;
18
- deltaPan: PropTypes.Requireable<number>;
19
- deltaZoom: PropTypes.Requireable<number>;
20
- };
21
- static defaultProps: {
22
- fitBounds: () => void;
23
- panBy: () => void;
24
- zoomBy: () => void;
25
- deltaPan: number;
26
- deltaZoom: number;
27
- minZoom: number;
28
- maxZoom: number;
29
- };
30
- panUp: () => any;
31
- panDown: () => any;
32
- panLeft: () => any;
33
- panRight: () => any;
34
- zoomIn: () => any;
35
- zoomOut: () => any;
36
- onChangeZoomLevel: (evt: any) => void;
37
- render(): React.JSX.Element;
38
- }
39
- //# sourceMappingURL=view-control.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"view-control.d.ts","sourceRoot":"","sources":["../../src/components/view-control.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAC3C,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,eAAO,MAAM,kBAAkB,yMAO9B,CAAC;AAEF,eAAO,MAAM,yBAAyB,yMAOrC,CAAC;AAEF,eAAO,MAAM,gBAAgB,yMAY5B,CAAC;AAEF,eAAO,MAAM,kBAAkB,yMAS9B,CAAC;AAEF,eAAO,MAAM,cAAc,yMAa1B,CAAC;AAEF,eAAO,MAAM,iBAAiB,yMAU7B,CAAC;AAEF,qBAAa,WAAY,SAAQ,aAAa;IAC5C,MAAM,CAAC,WAAW,SAAiB;IAEnC,MAAM,CAAC,SAAS;;;;;;;;;MAYd;IAEF,MAAM,CAAC,YAAY;;;;;;;;MAQjB;IAGF,KAAK,YAAoE;IACzE,OAAO,YAAyE;IAChF,OAAO,YAAoE;IAC3E,QAAQ,YAAyE;IAGjF,MAAM,YAAmE;IACzE,OAAO,YAAwE;IAC/E,iBAAiB,qBAGf;IAEF,MAAM;CAiDP"}
@@ -1,132 +0,0 @@
1
- // deck.gl-community
2
- // SPDX-License-Identifier: MIT
3
- // Copyright (c) vis.gl contributors
4
- // @ts-nocheck TODO
5
- import React, { PureComponent } from 'react';
6
- import PropTypes from 'prop-types';
7
- import { styled } from 'styled-components';
8
- import { LongPressButton } from "./long-press-button.js";
9
- export const ViewControlWrapper = styled.div `
10
- align-items: center;
11
- display: flex;
12
- flex-direction: column;
13
- position: absolute;
14
- z-index: 99;
15
- user-select: none;
16
- `;
17
- export const NavigationButtonContainer = styled.div `
18
- background: #f7f7f7;
19
- border-radius: 23px;
20
- border: 0.5px solid #eaeaea;
21
- box-shadow: inset 11px 11px 5px -7px rgba(230, 230, 230, 0.49);
22
- height: 46px;
23
- width: 46px;
24
- `;
25
- export const NavigationButton = styled.div `
26
- color: #848484;
27
- cursor: pointer;
28
- left: ${(props) => props.$left};
29
- position: absolute;
30
- top: ${(props) => props.$top};
31
- transform: rotate(${(props) => props.rotate || 0}deg);
32
-
33
- &:hover,
34
- &:active {
35
- color: #00ade6;
36
- }
37
- `;
38
- export const ZoomControlWrapper = styled.div `
39
- align-items: center;
40
- background: #f7f7f7;
41
- border: 0.5px solid #eaeaea;
42
- display: flex;
43
- flex-direction: column;
44
- margin-top: 6px;
45
- padding: 2px 0;
46
- width: 18px;
47
- `;
48
- export const VerticalSlider = styled.div `
49
- display: inline-block;
50
- height: 100px;
51
- padding: 0;
52
- width: 10px;
53
-
54
- > input[type='range'][orient='vertical'] {
55
- writing-mode: vertical-lr;
56
- height: 100px;
57
- padding: 0;
58
- margin: 0;
59
- width: 10px;
60
- }
61
- `;
62
- export const ZoomControlButton = styled.div `
63
- cursor: pointer;
64
- font-size: 14px;
65
- font-weight: 500;
66
- margin: -4px;
67
-
68
- &:hover,
69
- &:active {
70
- color: #00ade6;
71
- }
72
- `;
73
- export class ViewControl extends PureComponent {
74
- static displayName = 'ViewControl';
75
- static propTypes = {
76
- // functions
77
- fitBounds: PropTypes.func,
78
- panBy: PropTypes.func,
79
- zoomBy: PropTypes.func,
80
- // current zoom level
81
- zoomLevel: PropTypes.number,
82
- // configuration
83
- minZoom: PropTypes.number,
84
- maxZoom: PropTypes.number,
85
- deltaPan: PropTypes.number,
86
- deltaZoom: PropTypes.number
87
- };
88
- static defaultProps = {
89
- fitBounds: () => { },
90
- panBy: () => { },
91
- zoomBy: () => { },
92
- deltaPan: 10,
93
- deltaZoom: 0.1,
94
- minZoom: 0.1,
95
- maxZoom: 1
96
- };
97
- // pan actions
98
- panUp = () => this.props.panBy(0, this.props.deltaPan);
99
- panDown = () => this.props.panBy(0, -1 * this.props.deltaPan);
100
- panLeft = () => this.props.panBy(this.props.deltaPan, 0);
101
- panRight = () => this.props.panBy(-1 * this.props.deltaPan, 0);
102
- // zoom actions
103
- zoomIn = () => this.props.zoomBy(this.props.deltaZoom);
104
- zoomOut = () => this.props.zoomBy(-1 * this.props.deltaZoom);
105
- onChangeZoomLevel = (evt) => {
106
- const delta = evt.target.value - this.props.zoomLevel;
107
- this.props.zoomBy(delta);
108
- };
109
- render() {
110
- const buttons = [
111
- { top: -2, left: 14, rotate: 0, onClick: this.panUp, content: '▲', key: 'up' },
112
- { top: 12, left: 0, rotate: -90, onClick: this.panLeft, content: '◀', key: 'left' },
113
- { top: 12, left: 28, rotate: 90, onClick: this.panRight, content: '▶', key: 'right' },
114
- { top: 25, left: 14, rotate: 180, onClick: this.panDown, content: '▼', key: 'down' }
115
- ];
116
- return (React.createElement(ViewControlWrapper, null,
117
- React.createElement(NavigationButtonContainer, null,
118
- buttons.map((b) => (React.createElement(NavigationButton, { key: b.key, "$top": `${b.top}px`, "$left": `${b.left}px`, rotate: b.rotate },
119
- React.createElement(LongPressButton, { onClick: b.onClick }, b.content)))),
120
- React.createElement(NavigationButton, { "$top": '12px', "$left": '16px', onClick: this.props.fitBounds }, '¤')),
121
- React.createElement(ZoomControlWrapper, null,
122
- React.createElement(ZoomControlButton, null,
123
- React.createElement(LongPressButton, { onClick: this.zoomIn }, '+')),
124
- React.createElement(VerticalSlider, null,
125
- React.createElement("input", { type: "range", value: this.props.zoomLevel, min: this.props.minZoom, max: this.props.maxZoom, step: this.props.deltaZoom, onChange: this.onChangeZoomLevel,
126
- /* @ts-expect-error TODO */
127
- orient: "vertical" })),
128
- React.createElement(ZoomControlButton, null,
129
- React.createElement(LongPressButton, { onClick: this.zoomOut }, '-')))));
130
- }
131
- }
132
- //# sourceMappingURL=view-control.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"view-control.js","sourceRoot":"","sources":["../../src/components/view-control.tsx"],"names":[],"mappings":"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"}
@@ -1,27 +0,0 @@
1
- // deck.gl-community
2
- // SPDX-License-Identifier: MIT
3
- // Copyright (c) vis.gl contributors
4
-
5
- import {ViewControl} from './view-control';
6
- import React from 'react';
7
-
8
- // A wrapper for positioning the ViewControl component
9
- export const PositionedViewControl = ({
10
- fitBounds,
11
- panBy,
12
- zoomBy,
13
- zoomLevel,
14
- maxZoom = 20,
15
- minZoom = -20
16
- }) => (
17
- <div style={{position: 'relative', top: '20px', left: '20px'}}>
18
- <ViewControl
19
- fitBounds={fitBounds}
20
- panBy={panBy}
21
- zoomBy={zoomBy}
22
- zoomLevel={zoomLevel}
23
- maxZoom={maxZoom}
24
- minZoom={minZoom}
25
- />
26
- </div>
27
- );
@@ -1,172 +0,0 @@
1
- // deck.gl-community
2
- // SPDX-License-Identifier: MIT
3
- // Copyright (c) vis.gl contributors
4
-
5
- // @ts-nocheck TODO
6
-
7
- import React, {PureComponent} from 'react';
8
- import PropTypes from 'prop-types';
9
- import {styled} from 'styled-components';
10
- import {LongPressButton} from './long-press-button';
11
-
12
- export const ViewControlWrapper = styled.div`
13
- align-items: center;
14
- display: flex;
15
- flex-direction: column;
16
- position: absolute;
17
- z-index: 99;
18
- user-select: none;
19
- `;
20
-
21
- export const NavigationButtonContainer = styled.div`
22
- background: #f7f7f7;
23
- border-radius: 23px;
24
- border: 0.5px solid #eaeaea;
25
- box-shadow: inset 11px 11px 5px -7px rgba(230, 230, 230, 0.49);
26
- height: 46px;
27
- width: 46px;
28
- `;
29
-
30
- export const NavigationButton = styled.div`
31
- color: #848484;
32
- cursor: pointer;
33
- left: ${(props: any) => props.$left};
34
- position: absolute;
35
- top: ${(props: any) => props.$top};
36
- transform: rotate(${(props: any) => props.rotate || 0}deg);
37
-
38
- &:hover,
39
- &:active {
40
- color: #00ade6;
41
- }
42
- `;
43
-
44
- export const ZoomControlWrapper = styled.div`
45
- align-items: center;
46
- background: #f7f7f7;
47
- border: 0.5px solid #eaeaea;
48
- display: flex;
49
- flex-direction: column;
50
- margin-top: 6px;
51
- padding: 2px 0;
52
- width: 18px;
53
- `;
54
-
55
- export const VerticalSlider = styled.div`
56
- display: inline-block;
57
- height: 100px;
58
- padding: 0;
59
- width: 10px;
60
-
61
- > input[type='range'][orient='vertical'] {
62
- writing-mode: vertical-lr;
63
- height: 100px;
64
- padding: 0;
65
- margin: 0;
66
- width: 10px;
67
- }
68
- `;
69
-
70
- export const ZoomControlButton = styled.div`
71
- cursor: pointer;
72
- font-size: 14px;
73
- font-weight: 500;
74
- margin: -4px;
75
-
76
- &:hover,
77
- &:active {
78
- color: #00ade6;
79
- }
80
- `;
81
-
82
- export class ViewControl extends PureComponent {
83
- static displayName = 'ViewControl';
84
-
85
- static propTypes = {
86
- // functions
87
- fitBounds: PropTypes.func,
88
- panBy: PropTypes.func,
89
- zoomBy: PropTypes.func,
90
- // current zoom level
91
- zoomLevel: PropTypes.number,
92
- // configuration
93
- minZoom: PropTypes.number,
94
- maxZoom: PropTypes.number,
95
- deltaPan: PropTypes.number,
96
- deltaZoom: PropTypes.number
97
- };
98
-
99
- static defaultProps = {
100
- fitBounds: () => {},
101
- panBy: () => {},
102
- zoomBy: () => {},
103
- deltaPan: 10,
104
- deltaZoom: 0.1,
105
- minZoom: 0.1,
106
- maxZoom: 1
107
- };
108
-
109
- // pan actions
110
- panUp = () => (this.props as any).panBy(0, (this.props as any).deltaPan);
111
- panDown = () => (this.props as any).panBy(0, -1 * (this.props as any).deltaPan);
112
- panLeft = () => (this.props as any).panBy((this.props as any).deltaPan, 0);
113
- panRight = () => (this.props as any).panBy(-1 * (this.props as any).deltaPan, 0);
114
-
115
- // zoom actions
116
- zoomIn = () => (this.props as any).zoomBy((this.props as any).deltaZoom);
117
- zoomOut = () => (this.props as any).zoomBy(-1 * (this.props as any).deltaZoom);
118
- onChangeZoomLevel = (evt) => {
119
- const delta = evt.target.value - (this.props as any).zoomLevel;
120
- (this.props as any).zoomBy(delta);
121
- };
122
-
123
- render() {
124
- const buttons = [
125
- {top: -2, left: 14, rotate: 0, onClick: this.panUp, content: '▲', key: 'up'},
126
- {top: 12, left: 0, rotate: -90, onClick: this.panLeft, content: '◀', key: 'left'},
127
- {top: 12, left: 28, rotate: 90, onClick: this.panRight, content: '▶', key: 'right'},
128
- {top: 25, left: 14, rotate: 180, onClick: this.panDown, content: '▼', key: 'down'}
129
- ];
130
-
131
- return (
132
- <ViewControlWrapper>
133
- <NavigationButtonContainer>
134
- {buttons.map((b: any) => (
135
- <NavigationButton
136
- key={b.key}
137
- $top={`${b.top}px`}
138
- $left={`${b.left}px`}
139
- rotate={b.rotate}
140
- >
141
- <LongPressButton onClick={b.onClick}>{b.content}</LongPressButton>
142
- </NavigationButton>
143
- ))}
144
- {/* @ts-expect-error TODO */}
145
- <NavigationButton $top={'12px'} $left={'16px'} onClick={this.props.fitBounds}>
146
- {'¤'}
147
- </NavigationButton>
148
- </NavigationButtonContainer>
149
- <ZoomControlWrapper>
150
- <ZoomControlButton>
151
- <LongPressButton onClick={this.zoomIn}>{'+'}</LongPressButton>
152
- </ZoomControlButton>
153
- <VerticalSlider>
154
- <input
155
- type="range"
156
- value={(this.props as any).zoomLevel}
157
- min={(this.props as any).minZoom}
158
- max={(this.props as any).maxZoom}
159
- step={(this.props as any).deltaZoom}
160
- onChange={this.onChangeZoomLevel}
161
- /* @ts-expect-error TODO */
162
- orient="vertical"
163
- />
164
- </VerticalSlider>
165
- <ZoomControlButton>
166
- <LongPressButton onClick={this.zoomOut}>{'-'}</LongPressButton>
167
- </ZoomControlButton>
168
- </ZoomControlWrapper>
169
- </ViewControlWrapper>
170
- );
171
- }
172
- }