@tileflow/core 0.1.0-alpha.31 → 0.1.0-alpha.32

package/dist/browser.js

@@ -2042,10 +2042,231 @@ var init_dist = __esm({
   }
 });
 
+// src/dynamic-style-images.ts
+var owners = /* @__PURE__ */ new WeakMap();
+function isRestoredCopy(image, previous) {
+  if (!image || !previous) return false;
+  const a = image, b2 = previous;
+  if (!a.data || !b2.data || a.data.width !== b2.data.width || a.data.height !== b2.data.height || a.pixelRatio !== b2.pixelRatio || a.sdf !== b2.sdf || a.content !== b2.content || a.stretchX !== b2.stretchX || a.stretchY !== b2.stretchY || a.data.data.length !== b2.data.data.length)
+    return false;
+  return a.data.data.every((byte, index) => byte === b2.data.data[index]);
+}
+function createTileflowDynamicImageRegistry(input, context, beforeRestore) {
+  for (const method of [
+    "addImage",
+    "getImage",
+    "getStyle",
+    "removeImage",
+    "updateImage"
+  ]) {
+    if (typeof input[method] !== "function") {
+      throw new TypeError(`Dynamic images require a map with ${method}().`);
+    }
+  }
+  const map = input;
+  const names = owners.get(map) ?? /* @__PURE__ */ new Set();
+  owners.set(map, names);
+  const entries = /* @__PURE__ */ new Map();
+  const view = typeof map.getCanvas === "function" ? map.getCanvas().ownerDocument?.defaultView : void 0;
+  let cancelFrame;
+  let disposed = false;
+  let suspended = false;
+  const imageContext = (entry, current) => Object.freeze({
+    ...current,
+    width: entry.pixels.width,
+    height: entry.pixels.height,
+    pixelRatio: entry.pixelRatio
+  });
+  const keyOf = (entry, current) => JSON.stringify([
+    current.theme,
+    current.blend,
+    (entry.definition.states ?? []).map((name) => [
+      name,
+      typeof current.states[name],
+      current.states[name]
+    ])
+  ]);
+  const report = (entry, cause) => {
+    const error = cause instanceof Error ? cause : new Error(String(cause));
+    if (entry.definition.onError) entry.definition.onError(error);
+    else console.error(`Tileflow dynamic image "${entry.name}":`, error);
+  };
+  function render(entry, current) {
+    const output = entry.definition.render(imageContext(entry, current));
+    if (output === void 0) return false;
+    if (!(output instanceof Uint8Array || output instanceof Uint8ClampedArray) || output.byteLength !== entry.pixels.width * entry.pixels.height * 4) {
+      throw new TypeError(
+        `Dynamic image "${entry.name}" must return width \xD7 height \xD7 4 RGBA bytes.`
+      );
+    }
+    entry.pixels = { ...entry.pixels, data: Uint8Array.from(output) };
+    return true;
+  }
+  function install(entry, changed = false) {
+    if (suspended) return;
+    const existing = map.getImage(entry.name);
+    if (!existing && !map.getStyle()) return;
+    if (existing && existing !== entry.installed && !isRestoredCopy(existing, entry.recoveryImage)) {
+      throw new Error(`Dynamic image "${entry.name}" conflicts with an existing image owner.`);
+    }
+    if (!existing) map.addImage(entry.name, entry.pixels, { pixelRatio: entry.pixelRatio });
+    else if (changed) map.updateImage(entry.name, entry.pixels);
+    entry.installed = map.getImage(entry.name);
+    entry.recoveryImage = void 0;
+  }
+  function flush() {
+    cancelFrame = void 0;
+    if (disposed || suspended) return;
+    const current = context();
+    for (const entry of entries.values()) {
+      if (!entry.dirty) continue;
+      entry.dirty = false;
+      entry.key = keyOf(entry, current);
+      try {
+        const changed = render(entry, current);
+        install(entry, changed);
+      } catch (error) {
+        report(entry, error);
+      }
+    }
+  }
+  function schedule() {
+    if (cancelFrame || disposed || suspended) return;
+    if (view?.requestAnimationFrame) {
+      const id = view.requestAnimationFrame(flush);
+      cancelFrame = () => view.cancelAnimationFrame(id);
+    } else {
+      let cancelled = false;
+      cancelFrame = () => {
+        cancelled = true;
+      };
+      queueMicrotask(() => {
+        if (!cancelled) flush();
+      });
+    }
+  }
+  function restore() {
+    if (disposed || suspended) return;
+    beforeRestore();
+    for (const entry of entries.values()) {
+      try {
+        install(entry, true);
+      } catch (error) {
+        report(entry, error);
+      }
+    }
+    if ([...entries.values()].some((entry) => entry.dirty)) schedule();
+  }
+  function loseContext() {
+    suspended = true;
+    for (const entry of entries.values()) entry.recoveryImage = entry.installed;
+    cancelFrame?.();
+    cancelFrame = void 0;
+  }
+  function restoreContext() {
+    suspended = false;
+    restore();
+  }
+  function release(entry, remove) {
+    if (entries.get(entry.name) !== entry) return;
+    entries.delete(entry.name);
+    names.delete(entry.name);
+    if (remove && entry.installed && map.getImage(entry.name) === entry.installed) {
+      map.removeImage(entry.name);
+    }
+    if (!entries.size) {
+      cancelFrame?.();
+      cancelFrame = void 0;
+    }
+  }
+  function dispose(remove = true) {
+    if (disposed) return;
+    disposed = true;
+    cancelFrame?.();
+    cancelFrame = void 0;
+    for (const entry of [...entries.values()]) release(entry, remove);
+    map.off("style.load", restore);
+    map.off("webglcontextlost", loseContext);
+    map.off("webglcontextrestored", restoreContext);
+    map.off("remove", removed);
+  }
+  const removed = () => dispose(false);
+  map.on("style.load", restore);
+  map.on("webglcontextlost", loseContext);
+  map.on("webglcontextrestored", restoreContext);
+  map.on("remove", removed);
+  return {
+    dispose,
+    assertBlend(images) {
+      for (const image of images) {
+        if (image.names.some((name) => entries.has(name))) {
+          throw new TypeError("Dynamic image names must remain identical across blended themes.");
+        }
+      }
+    },
+    invalidate(state) {
+      if (disposed) return;
+      const current = context();
+      for (const entry of entries.values()) {
+        if (state !== void 0 && !entry.definition.states?.includes(state)) continue;
+        if (keyOf(entry, current) === entry.key) continue;
+        entry.dirty = true;
+      }
+      if ([...entries.values()].some((entry) => entry.dirty)) schedule();
+    },
+    register(name, definition) {
+      if (disposed) throw new Error("Dynamic image registry is disposed.");
+      if (typeof name !== "string" || !name.trim())
+        throw new TypeError("Dynamic image names must be non-empty.");
+      if (names.has(name))
+        throw new Error(`Dynamic image "${name}" already has a registered owner.`);
+      if (map.getImage(name)) throw new Error(`Dynamic image "${name}" already exists.`);
+      const { width, height, pixelRatio = 1 } = definition;
+      if (![width, height].every((value) => Number.isInteger(value) && value > 0 && value <= 2048) || !Number.isFinite(pixelRatio) || pixelRatio <= 0 || typeof definition.render !== "function" || definition.states !== void 0 && (!Array.isArray(definition.states) || definition.states.some(
+        (state) => typeof state !== "string" || !state.trim() || state !== state.trim()
+      ))) {
+        throw new TypeError(
+          "Dynamic images require fixed dimensions, a positive pixel ratio, valid state names and a render function."
+        );
+      }
+      const entry = {
+        name,
+        definition: { ...definition, states: definition.states?.slice() },
+        pixelRatio,
+        pixels: { width, height, data: new Uint8Array(width * height * 4) },
+        dirty: false,
+        key: ""
+      };
+      names.add(name);
+      try {
+        const current = context();
+        entry.key = keyOf(entry, current);
+        render(entry, current);
+        install(entry);
+        entries.set(name, entry);
+      } catch (error) {
+        names.delete(name);
+        throw error;
+      }
+      return {
+        refresh() {
+          if (disposed || entries.get(name) !== entry) return;
+          entry.dirty = true;
+          schedule();
+        },
+        dispose() {
+          release(entry, !disposed);
+        }
+      };
+    }
+  };
+}
+
 // src/browser.ts
 init_portable_identity_rules();
 
 // src/runtime.ts
+init_portable_identity_rules();
 var defaultTileflowRuntimeView = Object.freeze({
   bearing: 0,
   center: [0, 20],
@@ -2066,6 +2287,11 @@ var maximumManifestBytes = 1024 * 1024;
 var maximumSessionGrantBytes = 64 * 1024;
 var manifestCache = new globalThis.Map();
 var tileflowThemeBlendLimits = Object.freeze({ maximumThemes: 8, minimumThemes: 2 });
+function validateTileflowThemeBlendSelection(value) {
+  if (!value || typeof value !== "object") return false;
+  const { position, themes } = value;
+  return Array.isArray(themes) && themes.length >= tileflowThemeBlendLimits.minimumThemes && themes.length <= tileflowThemeBlendLimits.maximumThemes && themes.every((theme) => isTileflowThemeName(theme)) && typeof position === "number" && Number.isFinite(position) && position >= 0 && position <= themes.length - 1;
+}
 function getTileflowStyleFontFaces(style) {
   const input = style.metadata?.[tileflowStyleFontFacesMetadataKey];
   if (input === void 0) return [];
@@ -3181,6 +3407,8 @@ function createTileflowThemeBlender(input, plan, options) {
   const positionPaints = plan.paints.filter((paint) => paint.follows === "position");
   const dominantPaints = plan.paints.filter((paint) => paint.follows === "dominant");
   const pixels = createImageMixer(map, plan.images);
+  const mixesArtwork = plan.images.some((image) => image.follows === "position");
+  const relayoutAt = relayoutPositions(plan);
   const shownValues = /* @__PURE__ */ new Map();
   const baseValues = /* @__PURE__ */ new Map();
   const valueKey = (layer, property) => `${layer}\0${property}`;
@@ -3191,6 +3419,8 @@ function createTileflowThemeBlender(input, plan, options) {
   let fade;
   let frameRequest;
   let disposed = false;
+  let holding = false;
+  let artworkWaits = false;
   pixels.paint("position", position);
   pixels.paint("dominant", label);
   const drive = (paints, at) => {
@@ -3241,9 +3471,13 @@ function createTileflowThemeBlender(input, plan, options) {
     get dominant() {
       return dominant;
     },
+    get held() {
+      return holding && (artworkWaits || Math.round(position) !== dominant);
+    },
     get position() {
       return position;
     },
+    relayoutAt,
     refresh(include) {
       if (disposed) return;
       drive(
@@ -3274,22 +3508,30 @@ function createTileflowThemeBlender(input, plan, options) {
       }
       frameRequest = void 0;
     },
-    set(next) {
+    set(next, setOptions) {
       if (disposed) return;
+      const hold = setOptions?.hold === true;
+      if (hold) holding = true;
       const target = clamp(next);
       const reachesTheme = target % 1 === 0 && target !== position;
       if (Math.abs(target - position) >= 25e-4 || reachesTheme) {
         position = target;
         drive(positionPaints, position);
-        pixels.paint("position", position);
+        if (holding) artworkWaits ||= mixesArtwork;
+        else pixels.paint("position", position);
         if (plan.sky !== void 0 && typeof map.setSky === "function")
           map.setSky(fillTileflowThemeBlendTemplate(plan.sky, position), { validate: false });
         if (plan.light !== void 0 && typeof map.setLight === "function")
           map.setLight(fillTileflowThemeBlendTemplate(plan.light, position), { validate: false });
         options.onPosition?.();
       }
+      if (!hold && holding) {
+        holding = false;
+        if (artworkWaits) pixels.paint("position", position);
+        artworkWaits = false;
+      }
       const nextDominant = Math.round(target);
-      if (nextDominant === dominant) return;
+      if (nextDominant === dominant || holding) return;
       dominant = nextDominant;
       if (plan.switches.length > 0) {
         const change = () => applySwitches(nextDominant);
@@ -3306,20 +3548,34 @@ function createImageMixer(map, images) {
   const art = /* @__PURE__ */ new Map();
   const shown = /* @__PURE__ */ new Map();
   const unusable = /* @__PURE__ */ new Set();
+  const names = /* @__PURE__ */ new Map();
+  const alike = /* @__PURE__ */ new Map();
   const artOf = (name) => {
     if (!art.has(name)) {
       const image = map.getImage(name)?.data;
       if (!image) return void 0;
-      art.set(name, { data: Uint8Array.from(image.data), height: image.height, width: image.width });
+      const copy = { data: Uint8Array.from(image.data), height: image.height, width: image.width };
+      art.set(name, copy);
+      names.set(copy, name);
     }
     return art.get(name);
   };
+  const same2 = (from, to) => {
+    if (from === to) return true;
+    const key = `${names.get(from)}\0${names.get(to)}`;
+    if (!alike.has(key)) {
+      let equal = from.data.length === to.data.length;
+      for (let byte = 0; equal && byte < from.data.length; byte += 1)
+        equal = from.data[byte] === to.data[byte];
+      alike.set(key, equal);
+    }
+    return alike.get(key);
+  };
   return {
     paint(follows, position) {
       const quantized = Math.round(position * 32) / 32;
       for (const image of images) {
-        if (image.follows !== follows || unusable.has(image) || shown.get(image) === quantized)
-          continue;
+        if (image.follows !== follows || unusable.has(image)) continue;
         const sources = image.names.map(artOf);
         if (sources.some((source) => !source)) continue;
         const [first] = sources;
@@ -3327,14 +3583,21 @@ function createImageMixer(map, images) {
           unusable.add(image);
           continue;
         }
-        shown.set(image, quantized);
+        if (!shown.has(image)) shown.set(image, first);
         const index = Math.min(sources.length - 2, Math.floor(quantized));
         const t = quantized - index;
         const from = sources[index];
         const to = sources[index + 1];
-        let data = from.data;
-        if (t >= 1) data = to.data;
-        else if (t > 0 && from !== to) {
+        let content = from;
+        if (t >= 1) content = to;
+        else if (t > 0 && !same2(from, to)) content = `${index}:${t}`;
+        const before = shown.get(image);
+        if (before === content || typeof before !== "string" && typeof content !== "string" && same2(before, content))
+          continue;
+        shown.set(image, content);
+        let data;
+        if (typeof content !== "string") data = content.data;
+        else {
           data = new Uint8Array(from.data.length);
           for (let byte = 0; byte < data.length; byte += 1)
             data[byte] = from.data[byte] + (to.data[byte] - from.data[byte]) * t;
@@ -3344,6 +3607,20 @@ function createImageMixer(map, images) {
     }
   };
 }
+function relayoutPositions(plan) {
+  const positions = [];
+  const relays = (entry) => entry.group === "layout" || entry.property.endsWith("-pattern") || entry.values.some(readsTileflowFeatureData);
+  for (let index = 0; index + 1 < plan.themes; index += 1) {
+    const switched = plan.switches.some(
+      (entry) => relays(entry) && JSON.stringify(entry.values[index]) !== JSON.stringify(entry.values[index + 1])
+    );
+    const icons = plan.images.some(
+      (image) => image.follows === "dominant" && image.names[index] !== image.names[index + 1]
+    );
+    if (switched || icons) positions.push(index + 0.5);
+  }
+  return positions;
+}
 function isCrossfadeMap(map) {
   return typeof map.getCanvas === "function" && typeof map.redraw === "function" && typeof map.project === "function" && typeof map.unproject === "function" && typeof map.isStyleLoaded === "function" && typeof map.areTilesLoaded === "function";
 }
@@ -5046,6 +5323,7 @@ l(H, "PMTiles");
 var w = H;
 
 // src/pmtiles-browser.ts
+var missingRasterTile = null;
 var registeredPmtilesProtocols = /* @__PURE__ */ new WeakSet();
 var maximumSectionBytes = 16 * 1024 * 1024;
 var maximumParserBytes = 32 * 1024 * 1024;
@@ -5073,7 +5351,9 @@ var TileflowPmtilesProtocol = class {
       const archive2 = this.#archive(parseArchiveTarget(request.url));
       const header2 = await archive2.getHeader();
       const tileJson = await archive2.getTileJson(request.url);
-      const data = header2.tileType === O.Mlt && isRecord4(tileJson) ? { ...tileJson, encoding: "mlt" } : tileJson;
+      if (!isRecord4(tileJson))
+        throw new TypeError("A PMTiles archive described no TileJSON object.");
+      const data = header2.tileType === O.Mlt ? { ...tileJson, encoding: "mlt" } : tileJson;
       abortController.signal.throwIfAborted();
       return { data };
     }
@@ -5090,7 +5370,7 @@ var TileflowPmtilesProtocol = class {
       };
     }
     return {
-      data: header.tileType === O.Mvt || header.tileType === O.Mlt ? new Uint8Array() : null
+      data: header.tileType === O.Mvt || header.tileType === O.Mlt ? new Uint8Array() : missingRasterTile
     };
   };
   tile = protocolCompatibility(this.tilev4);
@@ -5274,10 +5554,22 @@ function handleSystemColorSchemeChange() {
   systemColorScheme = next;
   for (const listener of systemColorSchemeListeners) listener(next);
 }
+function validateTileflowBrowserThemeBlendSelection(value) {
+  if (!validateTileflowThemeBlendSelection(value)) return false;
+  const { hold } = value;
+  return hold === void 0 || typeof hold === "boolean";
+}
 var maximumBlendThemes = 8;
 var maximumTransitionMs = 5e3;
 var blendLabelFadeMs = 450;
 var maximumTileflowBlendStyleBytes = 16 * 1024 * 1024;
+function validateStyleState(name, value) {
+  if (typeof name !== "string" || !name.trim())
+    return new TypeError("Style state names must be non-empty strings.");
+  if (value === null || typeof value === "boolean" || typeof value === "string" || typeof value === "number" && Number.isFinite(value))
+    return void 0;
+  return new TypeError("Style state values must be booleans, finite numbers, strings, or null.");
+}
 function createTileflowThemeController(options) {
   assertConcreteRuntimeTheme(options.initial, "initial");
   const loadFonts = options.loadFonts ?? ((runtimeStyle) => loadTileflowStyleFonts(runtimeStyle.style, { fontFaces: runtimeStyle.fontFaces }));
@@ -5307,26 +5599,72 @@ function createTileflowThemeController(options) {
   let emphasisRun = 0;
   let emphasisFrame;
   let emphasisSettle;
+  const states = /* @__PURE__ */ new Map();
+  let images;
+  function imageContext() {
+    return {
+      theme: current.theme,
+      blend: activeBlend ? Object.freeze({
+        position: activeBlend.blender.position,
+        themes: Object.freeze(activeBlend.themes.map((theme) => theme.theme))
+      }) : void 0,
+      states: Object.freeze(
+        Object.fromEntries([...states].map(([name, state]) => [name, state.shown]))
+      )
+    };
+  }
   return {
     dispose() {
       disposed = true;
+      images?.dispose();
       requestId += 1;
       activeBlend?.blender.dispose();
       stopEmphasisMotion({ status: "superseded", theme: current.theme });
+      for (const state of states.values())
+        stopStateMotion(state, { status: "superseded", theme: current.theme });
     },
     getBlend() {
       if (!activeBlend) return void 0;
       return {
+        held: activeBlend.blender.held,
         position: activeBlend.blender.position,
+        relayoutAt: activeBlend.blender.relayoutAt,
         themes: activeBlend.themes.map((theme) => theme.theme)
       };
     },
+    registerImage(name, definition) {
+      if (disposed) throw new Error("Tileflow theme controller is disposed.");
+      if (activeBlend?.plan.images.some((image) => image.names.includes(name))) {
+        throw new TypeError("Dynamic image names must remain identical across blended themes.");
+      }
+      images ??= createTileflowDynamicImageRegistry(options.map, imageContext, resetStates);
+      return images.register(name, definition);
+    },
     getCurrent() {
       return current;
     },
     getEmphasis() {
       return emphasis;
     },
+    getState(name) {
+      return typeof name === "string" ? states.get(name.trim())?.value : void 0;
+    },
+    setState(name, value, changeOptions) {
+      const invalid = validateStyleState(name, value);
+      if (invalid) return Promise.resolve({ error: invalid, status: "failed", theme: current.theme });
+      if (disposed) return Promise.resolve(disposedResult(current.theme));
+      if (typeof options.map.setGlobalStateProperty !== "function") {
+        return Promise.resolve({
+          error: new TypeError("Style states need a MapLibre map with global state (GL JS 5.6+)."),
+          status: "failed",
+          theme: current.theme
+        });
+      }
+      const transition = transitionOf(changeOptions);
+      if (transition instanceof TypeError)
+        return Promise.resolve({ error: transition, status: "failed", theme: current.theme });
+      return changeState(name.trim(), value, reducedMotion() ? 0 : transition);
+    },
     setEmphasis(request, changeOptions) {
       if (request !== void 0) {
         const invalid = validateTileflowEmphasis(request);
@@ -5350,8 +5688,9 @@ function createTileflowThemeController(options) {
       const key = blendKey(request.themes);
       if (activeBlend?.key === key) {
         requestId += 1;
-        activeBlend.blender.set(request.position);
+        activeBlend.blender.set(request.position, { hold: request.hold === true });
         current = activeBlend.themes[activeBlend.blender.dominant];
+        images?.invalidate();
         return Promise.resolve({ status: "applied", theme: current.theme });
       }
       if (pendingBlend?.key === key) {
@@ -5439,7 +5778,9 @@ function createTileflowThemeController(options) {
       ),
       Promise.all(themes.map((theme) => loadFonts(theme)))
     ]);
-    return planTileflowThemeBlend(styles);
+    const plan = planTileflowThemeBlend(styles);
+    images?.assertBlend(plan.images);
+    return plan;
   }
   function enqueue(runId, target) {
     const operation = applyQueue.then(
@@ -5458,6 +5799,8 @@ function createTileflowThemeController(options) {
   async function applyTarget(runId, target) {
     const targetTheme = targetThemeOf(target);
     if (disposed || runId !== requestId) return { status: "superseded", theme: targetTheme };
+    await whenContextAvailable(options.map);
+    if (disposed || runId !== requestId) return { status: "superseded", theme: targetTheme };
     const previous = { current, shown };
     options.onTransition?.({ currentTheme: previous.current.theme, phase: "applying", targetTheme });
     const cover = beginTileflowStyleCrossfade(options.map, target.transition);
@@ -5465,6 +5808,7 @@ function createTileflowThemeController(options) {
     activeBlend = void 0;
     const styleInput = target.kind === "theme" ? target.style.style : target.plan.styleAt(target.position());
     try {
+      if (target.kind === "blend") images?.assertBlend(target.plan.images);
       await applyMapStyle(options.map, styleInput, timeoutMs);
       if (disposed) {
         cover?.cancel();
@@ -5490,6 +5834,8 @@ function createTileflowThemeController(options) {
       }
       shownLayers = typeof styleInput === "string" ? void 0 : styleInput.layers;
       resetEmphasis();
+      resetStates();
+      images?.invalidate();
       await cover?.finish({ stop: () => disposed || runId !== requestId });
       options.onTransition?.({
         currentTheme: current.theme,
@@ -5531,6 +5877,7 @@ function createTileflowThemeController(options) {
     });
   }
   async function restore(previous) {
+    await whenContextAvailable(options.map);
     const blend = previous.shown.blend;
     if (blend) {
       const position = blend.blender.position;
@@ -5546,6 +5893,73 @@ function createTileflowThemeController(options) {
     }
     current = previous.current;
     resetEmphasis();
+    resetStates();
+    images?.invalidate();
+  }
+  function writeState(name, value) {
+    const set = options.map.setGlobalStateProperty;
+    try {
+      set?.call(options.map, name, value);
+    } catch {
+    }
+    images?.invalidate(name);
+  }
+  function resetStates() {
+    for (const [name, state] of states) {
+      if (state.shown !== void 0) writeState(name, state.shown);
+    }
+  }
+  function stopStateMotion(state, result) {
+    state.stop?.();
+    state.stop = void 0;
+    const settle = state.settle;
+    state.settle = void 0;
+    if (result) settle?.(result);
+  }
+  function changeState(name, value, duration) {
+    const state = states.get(name) ?? { run: 0, shown: void 0, value };
+    states.set(name, state);
+    stopStateMotion(state, { status: "superseded", theme: current.theme });
+    const run = ++state.run;
+    const from = state.shown;
+    state.value = value;
+    const view = tileflowThemeMotionView(options.map);
+    if (duration <= 0 || !view || typeof from !== "number" || typeof value !== "number" || from === value) {
+      state.shown = value;
+      writeState(name, value);
+      return Promise.resolve({ status: "applied", theme: current.theme });
+    }
+    return new Promise((resolve) => {
+      state.settle = resolve;
+      const now = () => view.performance?.now?.() ?? Date.now();
+      const start = now();
+      const least = Math.abs(value - from) / 100;
+      let cancelled = false;
+      let frame;
+      const step = () => {
+        frame = void 0;
+        if (cancelled || disposed || run !== state.run) return;
+        const t = Math.min(1, (now() - start) / duration);
+        const eased = t * t * (3 - 2 * t);
+        const shown2 = t >= 1 ? value : from + (value - from) * eased;
+        if (t >= 1 || Math.abs(shown2 - state.shown) >= least) {
+          state.shown = shown2;
+          writeState(name, shown2);
+        }
+        if (t >= 1) {
+          state.stop = void 0;
+          state.settle = void 0;
+          resolve({ status: "applied", theme: current.theme });
+          return;
+        }
+        frame = view.requestAnimationFrame(step);
+      };
+      state.stop = () => {
+        cancelled = true;
+        if (frame !== void 0) view.cancelAnimationFrame(frame);
+      };
+      frame = view.requestAnimationFrame(step);
+    });
   }
   function valueKey(layer, property) {
     return `${layer}\0${property}`;
@@ -5806,6 +6220,26 @@ function validateConcreteRuntimeTheme(style, role) {
     `Tileflow theme controller ${role} style requires a concrete portable theme name; received ${JSON.stringify(style.theme)}.`
   );
 }
+function whenContextAvailable(map) {
+  if (!isContextLost(map)) return Promise.resolve();
+  return new Promise((resolve) => {
+    const restored = () => {
+      map.off("webglcontextrestored", restored);
+      resolve();
+    };
+    map.on("webglcontextrestored", restored);
+  });
+}
+function isContextLost(map) {
+  if (typeof map.getCanvas !== "function") return false;
+  try {
+    const canvas = map.getCanvas.call(map);
+    const context = canvas?.getContext?.("webgl2") ?? canvas?.getContext?.("webgl");
+    return context?.isContextLost?.() === true;
+  } catch {
+    return false;
+  }
+}
 function applyMapStyle(map, style, timeoutMs) {
   return new Promise((resolve, reject) => {
     let settled = false;
@@ -6115,37 +6549,21 @@ function attachTileflowMapLifecycle(options) {
   };
 }
 function createTileflowTransformRequest(options) {
-  if (!options.always && !options.transformRequest && !options.worldRequestBridge) {
-    const analytics = options.getAnalytics();
-    const requiresCommercialSession = Boolean(options.sessionController && analytics?.mapId);
-    if (!requiresCommercialSession && (!analytics || analytics.enabled === false)) {
-      return void 0;
-    }
-  }
-  const asyncAnalyticsTiming = options.asyncAnalyticsTiming ?? "request";
   return (url, resourceType) => {
     const request = options.transformRequest?.(url, resourceType);
-    const analyticsAtRequest = asyncAnalyticsTiming === "request" ? options.getAnalytics() : void 0;
-    if (isPromiseLike(request)) {
-      return request.then(
-        (resolvedRequest) => applyTileflowRequest(
-          url,
-          resolvedRequest,
-          asyncAnalyticsTiming === "resolution" ? options.getAnalytics() : analyticsAtRequest,
-          options.sessionId,
-          options.sessionController,
-          options.worldRequestBridge
-        ) ?? resolvedRequest
-      );
-    }
-    return applyTileflowRequest(
+    const analytics = options.getAnalytics();
+    const apply = (resolvedRequest) => applyTileflowRequest(
       url,
-      request,
-      asyncAnalyticsTiming === "resolution" ? options.getAnalytics() : analyticsAtRequest,
+      resolvedRequest,
+      analytics,
       options.sessionId,
       options.sessionController,
       options.worldRequestBridge
     );
+    if (isPromiseLike(request)) {
+      return request.then((resolvedRequest) => apply(resolvedRequest) ?? resolvedRequest);
+    }
+    return apply(request);
   };
 }
 function applyTileflowRequest(url, request, analytics, sessionId, sessionController, worldRequestBridge) {
@@ -6215,6 +6633,7 @@ export {
   tileflowMaplibreContourVersion,
   tileflowPmtilesMaximumDirectoryDepth,
   tileflowPmtilesProtocol,
+  validateTileflowBrowserThemeBlendSelection,
   validateTileflowEmphasis
 };
 /*! Bundled license information: