@tileflow/react 0.1.0-alpha.25 → 0.1.0-alpha.27

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.
Files changed (3) hide show
  1. package/README.md +16 -13
  2. package/dist/index.js +17 -35
  3. package/package.json +3 -3
package/README.md CHANGED
@@ -79,7 +79,7 @@ import {Map} from '@tileflow/react';
79
79
  export function App() {
80
80
  return (
81
81
  <Map
82
- source={{kind: 'tileflow', map: 'madrid'}}
82
+ source={{map: 'madrid'}}
83
83
  theme="system"
84
84
  center={[-3.7038, 40.4168]}
85
85
  zoom={12}
@@ -89,19 +89,21 @@ export function App() {
89
89
  }
90
90
  ```
91
91
 
92
- Coordinates are `[longitude, latitude]`. `source.map` must match the config's portable map ID,
93
- not a hosted `map_...` identifier. The default manifest URL is exactly `/tileflow/manifest.json`.
94
- For a subpath or external host, provide `manifestUrl` in the source; the component does not infer
95
- bundler configuration or search for assets.
92
+ Coordinates are `[longitude, latitude]`. `source` is one object, `{map, manifestUrl?}`.
93
+ `source.map` must match the config's portable map ID, not a hosted `map_...` identifier.
94
+ The default manifest URL is exactly `/tileflow/manifest.json`. For a subpath or external host,
95
+ provide `manifestUrl` in the source; the component does not infer bundler configuration or search
96
+ for assets.
96
97
 
97
98
  `theme` selects a published concrete theme. Omission uses `defaultTheme`; `system` requires an
98
99
  explicit light/dark mapping, which Streets supplies. Theme changes preserve the MapLibre instance,
99
100
  camera, and interactions, and roll back on failure. `onThemeChange` reports transitions.
100
101
 
101
102
  `mapOptions` accepts native MapLibre options except `container` and `style`. Direct camera props
102
- take priority over `mapOptions`, then the manifest view, then shared defaults. To load one unmanaged
103
- style, use `source={{kind: 'maplibre', style: styleUrl}}`; that source has no Tileflow theme switching
104
- or manifest identity. Do not supply a Tileflow theme with an unmanaged source.
103
+ take priority over `mapOptions`, then the manifest view, then shared defaults. `Map` always selects
104
+ a Tileflow map through its manifest; it has no renderer discriminator or direct-style mode.
105
+ The obsolete source fields `kind` and `style` are rejected. For a completely unmanaged map, use
106
+ `maplibre-gl` directly rather than a Tileflow component.
105
107
 
106
108
  ## Add annotations and popups
107
109
 
@@ -141,7 +143,7 @@ export function PropertyMap() {
141
143
 
142
144
  return (
143
145
  <Map
144
- source={{kind: 'tileflow', map: 'madrid'}}
146
+ source={{map: 'madrid'}}
145
147
  annotations={annotations}
146
148
  interactionState={state}
147
149
  onInteractionStateChange={setState}
@@ -178,10 +180,11 @@ Keep tooltips non-interactive; put buttons, links, and forms in popups.
178
180
 
179
181
  ## Display an image or create a render
180
182
 
181
- `<Map mode="image">` displays an existing explicit `imageUrl` or an image URL in the published
182
- manifest. It does not create a static render, poll an operation, or load MapLibre. A local style
183
- build alone does not create that image. Annotations, semantic bindings, and interaction state are
184
- not supported in image mode.
183
+ `<Map mode="image">` displays an explicit `imageUrl` or derives an image URL from the selected
184
+ manifest map's `mapId`, `apiUrl`, concrete theme and view. It still requires a valid Tileflow source.
185
+ It does not create a static render, poll an operation, or load MapLibre. A local style build alone
186
+ does not create that image. Annotations, semantic bindings, and interaction state are not supported
187
+ in image mode.
185
188
 
186
189
  To request a new static render, use `StaticMap` from `@tileflow/react/static`. First install the
187
190
  shared client/types used by this example:
package/dist/index.js CHANGED
@@ -11,6 +11,7 @@ import {
11
11
  } from "react";
12
12
  import { createPortal } from "react-dom";
13
13
  import {
14
+ attachTileflowAtmosphere,
14
15
  attachTileflowFairUseNotice,
15
16
  attachTileflowMapLifecycle,
16
17
  createTileflowSessionStarter,
@@ -37,8 +38,7 @@ import {
37
38
  resolveTileflowRuntimeStyle,
38
39
  resolveTileflowRuntimeTheme,
39
40
  resolveTileflowRuntimeView,
40
- resolveTileflowStaticImageUrl,
41
- shouldLoadTileflowManifest
41
+ resolveTileflowStaticImageUrl
42
42
  } from "@tileflow/core/runtime";
43
43
  import {
44
44
  createTileflowMapLibreDomRuntime,
@@ -175,9 +175,6 @@ function validateTileflowMapStyleInputs(input) {
175
175
  if (input.theme !== void 0 && !validateTileflowThemeSelection(input.theme)) {
176
176
  return { error: 'theme must be a concrete portable theme name or "system"', ok: false };
177
177
  }
178
- if (input.theme !== void 0 && input.source.kind !== "tileflow") {
179
- return { error: "theme is only valid with a tileflow source", ok: false };
180
- }
181
178
  return { ok: true };
182
179
  }
183
180
  function assertTileflowMapStyleInputs(input) {
@@ -253,16 +250,14 @@ function Map2(props) {
253
250
  } = props;
254
251
  const generalRenderPopup = renderPopup;
255
252
  const generalRenderTooltip = renderTooltip;
256
- const sourceKind = source.kind;
257
- const sourceMap = source.kind === "tileflow" ? source.map : void 0;
258
- const sourceManifestUrl = source.kind === "tileflow" ? source.manifestUrl : void 0;
259
- const sourceStyle = source.kind === "maplibre" ? source.style : void 0;
253
+ const sourceMap = source.map;
254
+ const sourceManifestUrl = source.manifestUrl;
260
255
  const runtimeSource = useMemo(
261
- () => sourceKind === "tileflow" ? { kind: "tileflow", manifestUrl: sourceManifestUrl, map: sourceMap } : { kind: "maplibre", style: sourceStyle },
262
- [sourceKind, sourceManifestUrl, sourceMap, sourceStyle]
256
+ () => ({ manifestUrl: sourceManifestUrl, map: sourceMap }),
257
+ [sourceManifestUrl, sourceMap]
263
258
  );
264
- const mapName = runtimeSource.kind === "tileflow" ? runtimeSource.map : void 0;
265
- const manifestUrl = runtimeSource.kind === "tileflow" ? runtimeSource.manifestUrl ?? defaultTileflowManifestUrl : defaultTileflowManifestUrl;
259
+ const mapName = runtimeSource.map;
260
+ const manifestUrl = runtimeSource.manifestUrl ?? defaultTileflowManifestUrl;
266
261
  const preparedAnnotations = useMemo(
267
262
  () => prepareTileflowReactAnnotations(annotations),
268
263
  [annotations]
@@ -328,22 +323,12 @@ function Map2(props) {
328
323
  const resolvedCaptureId = normalizeTileflowCaptureId(captureId);
329
324
  const resolvedMode = resolveTileflowMapMode({ mode });
330
325
  const isImageMode = resolvedMode === "image";
331
- const shouldLoadManifest = shouldLoadTileflowManifest({
332
- source: runtimeSource
333
- });
334
- const manifestRequestKey = shouldLoadManifest ? JSON.stringify([manifestUrl, mapName]) : "not-needed";
335
- const currentManifestResolution = manifestResolution.key === manifestRequestKey ? manifestResolution : {
336
- key: manifestRequestKey,
337
- map: null,
338
- state: shouldLoadManifest ? "loading" : "not-needed"
339
- };
326
+ const manifestRequestKey = JSON.stringify([manifestUrl, mapName]);
327
+ const currentManifestResolution = manifestResolution.key === manifestRequestKey ? manifestResolution : { key: manifestRequestKey, map: null, state: "loading" };
340
328
  const manifestMap = currentManifestResolution.state === "ready" ? currentManifestResolution.map : null;
341
329
  const themeResolution = useMemo(() => {
342
- if (!manifestMap || runtimeSource.kind !== "tileflow") {
343
- return {
344
- error: false,
345
- name: runtimeSource.kind === "tileflow" && theme && theme !== "system" ? theme : void 0
346
- };
330
+ if (!manifestMap) {
331
+ return { error: false, name: theme && theme !== "system" ? theme : void 0 };
347
332
  }
348
333
  try {
349
334
  return {
@@ -353,7 +338,7 @@ function Map2(props) {
353
338
  } catch {
354
339
  return { error: true, name: void 0 };
355
340
  }
356
- }, [manifestMap, runtimeSource, systemColorScheme, theme]);
341
+ }, [manifestMap, systemColorScheme, theme]);
357
342
  const resolvedThemeName = themeResolution.name;
358
343
  const manifestView = resolveTileflowRuntimeView({ manifestMap });
359
344
  const manifestCenter = useStableMapOptionValue(
@@ -458,10 +443,6 @@ function Map2(props) {
458
443
  reportedDeclarativeDiagnosticKeysRef.current = nextKeys;
459
444
  }, [declarativeInteractionDiagnostics]);
460
445
  useEffect(() => {
461
- if (!shouldLoadManifest) {
462
- setManifestResolution({ key: manifestRequestKey, map: null, state: "not-needed" });
463
- return;
464
- }
465
446
  let cancelled = false;
466
447
  setManifestResolution({ key: manifestRequestKey, map: null, state: "loading" });
467
448
  loadTileflowManifest(manifestUrl).then((manifest) => {
@@ -483,7 +464,7 @@ function Map2(props) {
483
464
  return () => {
484
465
  cancelled = true;
485
466
  };
486
- }, [manifestRequestKey, manifestUrl, mapName, shouldLoadManifest]);
467
+ }, [manifestRequestKey, manifestUrl, mapName]);
487
468
  const runtimeStyle = useMemo(() => {
488
469
  if (isImageMode || themeResolution.error) {
489
470
  return null;
@@ -496,7 +477,7 @@ function Map2(props) {
496
477
  });
497
478
  }, [isImageMode, manifestMap, runtimeSource, systemColorScheme, themeResolution]);
498
479
  runtimeStyleRef.current = runtimeStyle;
499
- const runtimeMapIdentity = runtimeSource.kind === "tileflow" ? `${manifestUrl}\0${runtimeSource.map}` : runtimeSource.style;
480
+ const runtimeMapIdentity = `${manifestUrl}\0${runtimeSource.map}`;
500
481
  const runtimeStyleReady = runtimeStyle !== null || themeResolution.error && mapRef.current !== null;
501
482
  const resolvedAnalytics = useMemo(
502
483
  () => mergeTileflowAnalytics(analytics, runtimeStyle?.analytics),
@@ -544,7 +525,7 @@ function Map2(props) {
544
525
  ]
545
526
  );
546
527
  const runtimeResolutionState = (() => {
547
- if (shouldLoadManifest && currentManifestResolution.state !== "ready") {
528
+ if (currentManifestResolution.state !== "ready") {
548
529
  return currentManifestResolution.state === "error" ? "error" : "loading";
549
530
  }
550
531
  if (themeResolution.error) return "error";
@@ -739,6 +720,7 @@ function Map2(props) {
739
720
  mapRef.current = map;
740
721
  setupResources.map = map;
741
722
  registerCleanup(() => map.remove());
723
+ registerCleanup(attachTileflowAtmosphere(map));
742
724
  const themeController = initialRuntimeStyle.theme === void 0 ? void 0 : createTileflowThemeController({
743
725
  initial: initialRuntimeStyle,
744
726
  map,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tileflow/react",
3
- "version": "0.1.0-alpha.25",
3
+ "version": "0.1.0-alpha.27",
4
4
  "license": "Apache-2.0",
5
5
  "description": "React components for rendering Tileflow maps with MapLibre.",
6
6
  "type": "module",
@@ -43,9 +43,9 @@
43
43
  "access": "public"
44
44
  },
45
45
  "dependencies": {
46
- "@tileflow/core": ">=0.1.0-alpha.25 <0.1.0-beta.0",
46
+ "@tileflow/core": ">=0.1.0-alpha.29 <0.1.0-beta.0",
47
47
  "@tileflow/interactions": ">=0.1.0-alpha.4 <0.1.0-beta.0",
48
- "@tileflow/static": ">=0.1.0-alpha.26 <0.1.0-beta.0"
48
+ "@tileflow/static": ">=0.1.0-alpha.27 <0.1.0-beta.0"
49
49
  },
50
50
  "peerDependencies": {
51
51
  "maplibre-gl": ">=6.4.1 <7",