@tileflow/react 0.1.0-alpha.34 → 0.1.0-alpha.35
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/README.md +7 -6
- package/dist/index.js +2 -0
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -55,8 +55,8 @@ hosted manifest.
|
|
|
55
55
|
In a Vite application's client entry, add this before mounting React:
|
|
56
56
|
|
|
57
57
|
```ts
|
|
58
|
-
import workerUrl from 'maplibre-gl/dist/maplibre-gl-worker.mjs?worker&url';
|
|
59
58
|
import {configureTileflowMapLibre} from '@tileflow/react';
|
|
59
|
+
import workerUrl from 'maplibre-gl/dist/maplibre-gl-worker.mjs?worker&url';
|
|
60
60
|
|
|
61
61
|
configureTileflowMapLibre({workerUrl});
|
|
62
62
|
```
|
|
@@ -73,8 +73,8 @@ Import MapLibre's CSS once in the application. After the worker and assets are r
|
|
|
73
73
|
<!-- docs:check -->
|
|
74
74
|
|
|
75
75
|
```tsx
|
|
76
|
-
import 'maplibre-gl/dist/maplibre-gl.css';
|
|
77
76
|
import {Map} from '@tileflow/react';
|
|
77
|
+
import 'maplibre-gl/dist/maplibre-gl.css';
|
|
78
78
|
|
|
79
79
|
export function App() {
|
|
80
80
|
return (
|
|
@@ -105,7 +105,8 @@ Maps without this capability ignore the option; omitting it keeps the selected t
|
|
|
105
105
|
Changing it uses the existing theme transition. `themeBlend` takes precedence. See the
|
|
106
106
|
[authoring contract](https://github.com/tileflow/tileflow-sdk/blob/main/packages/core/README.md#style-with-themes-and-semantic-modules).
|
|
107
107
|
|
|
108
|
-
|
|
108
|
+
Theme and `timeOfDay` changes cross-fade over 450 ms by default, respecting reduced motion.
|
|
109
|
+
`themeTransition={{duration: 700}}` customizes the duration; use `duration: 0` for an immediate change.
|
|
109
110
|
`themeBlend={{themes: ['night', 'dusk', 'day'], position}}` shows a continuous blend of the map's
|
|
110
111
|
themes instead of `theme`: position 0 is the first theme and 1.5 is halfway from the second to the
|
|
111
112
|
third. Moving the position updates the map at once. See
|
|
@@ -142,9 +143,9 @@ and memoize the values; each new object replaces the previous ones, and `null` c
|
|
|
142
143
|
<!-- docs:check -->
|
|
143
144
|
|
|
144
145
|
```tsx
|
|
146
|
+
import {Map, useBoundaryFeatureState} from '@tileflow/react';
|
|
145
147
|
import {useMemo, useState} from 'react';
|
|
146
148
|
import type {Map as MapLibreMap} from 'maplibre-gl';
|
|
147
|
-
import {Map, useBoundaryFeatureState} from '@tileflow/react';
|
|
148
149
|
|
|
149
150
|
export function Unemployment({rates}: {rates: {ine: string; rate: number}[]}) {
|
|
150
151
|
const [map, setMap] = useState<MapLibreMap | null>(null);
|
|
@@ -180,9 +181,9 @@ into hosts managed by the interaction runtime:
|
|
|
180
181
|
<!-- docs:check -->
|
|
181
182
|
|
|
182
183
|
```tsx
|
|
184
|
+
import {Map} from '@tileflow/react';
|
|
183
185
|
import {useState} from 'react';
|
|
184
186
|
import type {TileflowAnnotation, TileflowInteractionState} from '@tileflow/interactions';
|
|
185
|
-
import {Map} from '@tileflow/react';
|
|
186
187
|
|
|
187
188
|
type Property = {price: number; title: string};
|
|
188
189
|
|
|
@@ -260,8 +261,8 @@ Tileflow credentials on that server, not in React props or a browser bundle.
|
|
|
260
261
|
<!-- docs:check -->
|
|
261
262
|
|
|
262
263
|
```tsx
|
|
263
|
-
import {useState} from 'react';
|
|
264
264
|
import {StaticMap} from '@tileflow/react/static';
|
|
265
|
+
import {useState} from 'react';
|
|
265
266
|
import type {StaticMapAttributionEntry} from '@tileflow/static/client';
|
|
266
267
|
|
|
267
268
|
export function StaticPreview({idempotencyKey}: {idempotencyKey: string}) {
|
package/dist/index.js
CHANGED
|
@@ -41,6 +41,7 @@ import { createPortal } from "react-dom";
|
|
|
41
41
|
import {
|
|
42
42
|
attachTileflowAtmosphere,
|
|
43
43
|
attachTileflowFairUseNotice,
|
|
44
|
+
attachTileflowLabelPlacement,
|
|
44
45
|
attachTileflowMap3D,
|
|
45
46
|
attachTileflowMapLifecycle,
|
|
46
47
|
attachTileflowNauticalLights,
|
|
@@ -832,6 +833,7 @@ function Map2(props) {
|
|
|
832
833
|
registerCleanup(attachTileflowAtmosphere(map));
|
|
833
834
|
registerCleanup(attachTileflowNotices(map));
|
|
834
835
|
registerCleanup(attachTileflowNauticalLights(map));
|
|
836
|
+
registerCleanup(attachTileflowLabelPlacement(map));
|
|
835
837
|
const themeController = initialRuntimeStyle.theme === void 0 ? void 0 : createTileflowThemeController({
|
|
836
838
|
initial: initialRuntimeStyle,
|
|
837
839
|
map,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tileflow/react",
|
|
3
|
-
"version": "0.1.0-alpha.
|
|
3
|
+
"version": "0.1.0-alpha.35",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"description": "React components for rendering Tileflow maps with MapLibre.",
|
|
6
6
|
"type": "module",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"access": "public"
|
|
44
44
|
},
|
|
45
45
|
"dependencies": {
|
|
46
|
-
"@tileflow/core": ">=0.1.0-alpha.
|
|
46
|
+
"@tileflow/core": ">=0.1.0-alpha.40 <0.1.0-beta.0",
|
|
47
47
|
"@tileflow/interactions": ">=0.1.0-alpha.6 <0.1.0-beta.0",
|
|
48
48
|
"@tileflow/static": ">=0.1.0-alpha.28 <0.1.0-beta.0"
|
|
49
49
|
},
|