@tileflow/react-native 0.1.0-alpha.1 → 0.1.0-alpha.2

package/dist/index.js

@@ -2,8 +2,8 @@ var __defProp = Object.defineProperty;
 var __typeError = (msg) => {
   throw TypeError(msg);
 };
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defNormalProp = (obj, key2, value) => key2 in obj ? __defProp(obj, key2, { enumerable: true, configurable: true, writable: true, value }) : obj[key2] = value;
+var __publicField = (obj, key2, value) => __defNormalProp(obj, typeof key2 !== "symbol" ? key2 + "" : key2, value);
 var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
@@ -53,11 +53,11 @@ function nativeInteractionDiagnostic(code) {
     message: messages[code]
   });
 }
-function nativeInteractionField(value, key) {
+function nativeInteractionField(value, key2) {
   if (!value || typeof value !== "object" || Array.isArray(value)) throw new Error();
   const prototype = Object.getPrototypeOf(value);
   if (prototype !== null && prototype !== Object.prototype) throw new Error();
-  const descriptor = Object.getOwnPropertyDescriptor(value, key);
+  const descriptor = Object.getOwnPropertyDescriptor(value, key2);
   if (!descriptor) return void 0;
   if (!("value" in descriptor) || !descriptor.enumerable) throw new Error();
   return descriptor.value;
@@ -92,18 +92,18 @@ function snapshotNativeInteractionJson(input) {
       if (keys2.length > length2 + 1) throw new Error();
       const result2 = new Array(length2);
       let sawLength = false;
-      for (const key of keys2) {
-        if (typeof key !== "string") throw new Error();
-        if (key === "length") {
+      for (const key2 of keys2) {
+        if (typeof key2 !== "string") throw new Error();
+        if (key2 === "length") {
           sawLength = true;
           continue;
         }
-        const index = Number(key);
-        if (!Number.isSafeInteger(index) || index < 0 || index >= length2 || String(index) !== key)
+        const index = Number(key2);
+        if (!Number.isSafeInteger(index) || index < 0 || index >= length2 || String(index) !== key2)
           throw new Error();
-        const descriptor = Object.getOwnPropertyDescriptor(value, key);
+        const descriptor = Object.getOwnPropertyDescriptor(value, key2);
         if (!descriptor || !("value" in descriptor) || !descriptor.enumerable) throw new Error();
-        Object.defineProperty(result2, key, {
+        Object.defineProperty(result2, key2, {
           value: copy(descriptor.value, depth + 1),
           enumerable: true,
           configurable: true,
@@ -118,12 +118,12 @@ function snapshotNativeInteractionJson(input) {
       throw new Error();
     properties2 += keys.length;
     const result = {};
-    for (const key of keys) {
-      if (typeof key !== "string" || key === "__proto__" || key === "prototype" || key === "constructor")
+    for (const key2 of keys) {
+      if (typeof key2 !== "string" || key2 === "__proto__" || key2 === "prototype" || key2 === "constructor")
         throw new Error();
-      const descriptor = Object.getOwnPropertyDescriptor(value, key);
+      const descriptor = Object.getOwnPropertyDescriptor(value, key2);
       if (!descriptor || !("value" in descriptor) || !descriptor.enumerable) throw new Error();
-      result[key] = copy(descriptor.value, depth + 1);
+      result[key2] = copy(descriptor.value, depth + 1);
     }
     return Object.freeze(result);
   };
@@ -148,9 +148,9 @@ function nativeInteractionValuesEqual(left, right) {
   const a = Object.keys(left).sort();
   const b = Object.keys(right).sort();
   return a.length === b.length && a.every(
-    (key, index) => key === b[index] && nativeInteractionValuesEqual(
-      Object.getOwnPropertyDescriptor(left, key)?.value,
-      Object.getOwnPropertyDescriptor(right, key)?.value
+    (key2, index) => key2 === b[index] && nativeInteractionValuesEqual(
+      Object.getOwnPropertyDescriptor(left, key2)?.value,
+      Object.getOwnPropertyDescriptor(right, key2)?.value
     )
   );
 }
@@ -267,8 +267,8 @@ function parseManifest(style) {
   if (priorityInput.length !== 4 || !priorityInput.every(representation) || new Set(priorityInput).size !== 4)
     throw new Error();
   const fieldsInput = nativeInteractionField(poi, "fields");
-  const readField = (key) => {
-    const value = nativeInteractionField(fieldsInput, key);
+  const readField = (key2) => {
+    const value = nativeInteractionField(fieldsInput, key2);
     if (!name(value)) throw new Error();
     return value;
   };
@@ -332,9 +332,9 @@ function featureId(value) {
   return typeof value === "string" && value.length > 0 && value.length <= tileflowInteractionLimits2.maxFeatureIdLength ? value : void 0;
 }
 function properties(input, fields) {
-  const read = (key) => {
+  const read = (key2) => {
     try {
-      return nativeInteractionField(input, fields[key]);
+      return nativeInteractionField(input, fields[key2]);
     } catch {
       return void 0;
     }
@@ -342,18 +342,18 @@ function properties(input, fields) {
   const result = {};
   const c = read("category");
   if (category(c)) result.category = c;
-  for (const [key, output, max] of [
+  for (const [key2, output, max] of [
     ["filterRank", "filter_rank", 5],
     ["sizeRank", "size_rank", 16]
   ]) {
-    const value = read(key);
+    const value = read(key2);
     if (typeof value === "number" && Number.isSafeInteger(value) && value >= 0 && value <= max)
       result[output] = value;
   }
-  for (const key of ["name", "type", "icon"]) {
-    const value = read(key);
-    if (typeof value === "string" && value.length <= tileflowInteractionLimits2.maxContentTextLength && (key === "name" || /^[a-z0-9]+(?:_[a-z0-9]+)*$/u.test(value)))
-      result[key] = value;
+  for (const key2 of ["name", "type", "icon"]) {
+    const value = read(key2);
+    if (typeof value === "string" && value.length <= tileflowInteractionLimits2.maxContentTextLength && (key2 === "name" || /^[a-z0-9]+(?:_[a-z0-9]+)*$/u.test(value)))
+      result[key2] = value;
   }
   return Object.freeze(result);
 }
@@ -1098,9 +1098,9 @@ function createMountedMapInteractions(getStyle, changed) {
       if (disposed) return;
       const version = ++propsVersion;
       let invalidCallback = false;
-      const callback = (key) => {
+      const callback = (key2) => {
         try {
-          const descriptor = Object.getOwnPropertyDescriptor(props, key);
+          const descriptor = Object.getOwnPropertyDescriptor(props, key2);
           if (!descriptor) return void 0;
           if (!("value" in descriptor) || !descriptor.enumerable || descriptor.value !== void 0 && typeof descriptor.value !== "function")
             throw new Error();
@@ -1262,9 +1262,9 @@ function createMapLifecycle(create, retire) {
       if (refreshAgain && active && active !== epoch) refresh(active);
     }
   };
-  const forScene = (key) => {
+  const forScene = (key2) => {
     const epoch = active;
-    return epoch?.owner.getSnapshot().renderer?.key === key ? epoch : void 0;
+    return epoch?.owner.getSnapshot().renderer?.key === key2 ? epoch : void 0;
   };
   return Object.freeze({
     getSnapshot: () => snapshot,
@@ -1318,29 +1318,29 @@ function createMapLifecycle(create, retire) {
     unbindInteractionHost(host) {
       active?.interactions.unbind(host);
     },
-    beginTouch(key) {
-      forScene(key)?.interactions.beginTouch();
+    beginTouch(key2) {
+      forScene(key2)?.interactions.beginTouch();
     },
-    claimMarker(key, annotation) {
-      forScene(key)?.interactions.claimMarker(annotation);
+    claimMarker(key2, annotation) {
+      forScene(key2)?.interactions.claimMarker(annotation);
     },
-    markerPress(key, annotation) {
-      forScene(key)?.interactions.markerPress(annotation);
+    markerPress(key2, annotation) {
+      forScene(key2)?.interactions.markerPress(annotation);
     },
-    mapPress(key, input) {
-      void forScene(key)?.interactions.mapPress(input).catch(() => void 0);
+    mapPress(key2, input) {
+      void forScene(key2)?.interactions.mapPress(input).catch(() => void 0);
     },
-    interactionDiagnostic(key, code) {
-      forScene(key)?.interactions.report(code);
+    interactionDiagnostic(key2, code) {
+      forScene(key2)?.interactions.report(code);
     },
-    rootMounted(key, root) {
-      active?.owner.rootMounted(key, root);
+    rootMounted(key2, root) {
+      active?.owner.rootMounted(key2, root);
     },
-    nativeStyleLoaded(key, root) {
-      active?.owner.nativeStyleLoaded(key, root);
+    nativeStyleLoaded(key2, root) {
+      active?.owner.nativeStyleLoaded(key2, root);
     },
-    layoutChanged(key) {
-      active?.owner.layoutChanged(key);
+    layoutChanged(key2) {
+      active?.owner.layoutChanged(key2);
     },
     background() {
       active?.interactions.background();
@@ -1637,11 +1637,11 @@ function hasReservedNativeContext(url) {
   const query = url.indexOf("?");
   if (query < 0) return false;
   return url.slice(query + 1).split("&").some((part) => {
-    const key = part.split("=", 1)[0].replace(
+    const key2 = part.split("=", 1)[0].replace(
       /%([0-9a-f]{2})/giu,
       (_, hex) => String.fromCharCode(Number.parseInt(hex, 16))
     );
-    return key.toLowerCase().startsWith("__tf_native");
+    return key2.toLowerCase().startsWith("__tf_native");
   });
 }
 function nativeResourceOrigin(url) {
@@ -2341,7 +2341,7 @@ function normalizeBinding(value) {
       return Object.freeze({ kind: "direct" });
     }
     if (value.kind !== "hosted" || Object.keys(value).some(
-      (key) => !["kind", "apiOrigin", "credential", "mapId", "surfaceId"].includes(key)
+      (key2) => !["kind", "apiOrigin", "credential", "mapId", "surfaceId"].includes(key2)
     ) || typeof value.credential !== "string" || !MOBILE_CREDENTIAL.test(value.credential) || typeof value.mapId !== "string" || !MAP_ID.test(value.mapId)) {
       throw new Error();
     }
@@ -2395,7 +2395,7 @@ function snapshotIdle(binding, session, lifecycle) {
   });
 }
 function parseSuccess(value, binding, expectedSessionId, expectedSurfaceId) {
-  if (!isRecord(value) || Object.keys(value).length !== SUCCESS_KEYS.size || Object.keys(value).some((key) => !SUCCESS_KEYS.has(key)) || value.ok !== true || value.kind !== "native" || value.version !== 1 || value.usageMode !== "session" || value.counted !== false || value.mapId !== binding.mapId || value.sessionId !== expectedSessionId || value.surfaceId !== expectedSurfaceId || typeof value.surfaceId !== "string" || !SURFACE_ID.test(value.surfaceId) || secretShaped(value.surfaceId) || typeof value.credentialId !== "string" || !CREDENTIAL_ID.test(value.credentialId) || !positiveRevision(value.credentialRevision) || !positiveRevision(value.deliveryPolicyRevision) || typeof value.grant !== "string" || value.grant.length === 0 || value.grant.length > GRANT_CHARACTER_LIMIT || !NATIVE_GRANT.test(value.grant) || !["disabled", "shadow", "enforced"].includes(String(value.meterMode)) || !["unmetered", "ordinary", "unbilled_fail_open"].includes(String(value.disposition)) || value.disposition === "unmetered" && value.meterMode !== "disabled") {
+  if (!isRecord(value) || Object.keys(value).length !== SUCCESS_KEYS.size || Object.keys(value).some((key2) => !SUCCESS_KEYS.has(key2)) || value.ok !== true || value.kind !== "native" || value.version !== 1 || value.usageMode !== "session" || value.counted !== false || value.mapId !== binding.mapId || value.sessionId !== expectedSessionId || value.surfaceId !== expectedSurfaceId || typeof value.surfaceId !== "string" || !SURFACE_ID.test(value.surfaceId) || secretShaped(value.surfaceId) || typeof value.credentialId !== "string" || !CREDENTIAL_ID.test(value.credentialId) || !positiveRevision(value.credentialRevision) || !positiveRevision(value.deliveryPolicyRevision) || typeof value.grant !== "string" || value.grant.length === 0 || value.grant.length > GRANT_CHARACTER_LIMIT || !NATIVE_GRANT.test(value.grant) || !["disabled", "shadow", "enforced"].includes(String(value.meterMode)) || !["unmetered", "ordinary", "unbilled_fail_open"].includes(String(value.disposition)) || value.disposition === "unmetered" && value.meterMode !== "disabled") {
     throw new HostedNativeSessionError("NATIVE_SESSION_RESPONSE_INVALID");
   }
   const issuedAtMs = parseExactIso(value.issuedAt);
@@ -2493,7 +2493,7 @@ function positiveRevision(value) {
   return typeof value === "number" && Number.isSafeInteger(value) && value > 0;
 }
 function isExactRestart(value, expectedSessionId) {
-  return isRecord(value) && Object.keys(value).length === RESTART_KEYS.size && Object.keys(value).every((key) => RESTART_KEYS.has(key)) && value.code === "COMMERCIAL_SESSION_RESTART_REQUIRED" && typeof value.error === "string" && value.error.length > 0 && value.error.length <= 500 && value.retryWithNewSession === true && value.sessionId === expectedSessionId;
+  return isRecord(value) && Object.keys(value).length === RESTART_KEYS.size && Object.keys(value).every((key2) => RESTART_KEYS.has(key2)) && value.code === "COMMERCIAL_SESSION_RESTART_REQUIRED" && typeof value.error === "string" && value.error.length > 0 && value.error.length <= 500 && value.retryWithNewSession === true && value.sessionId === expectedSessionId;
 }
 async function readBoundedResponse(response, abort) {
   let reader;
@@ -3217,6 +3217,8 @@ function createAdmissionInstallation(create) {
 // src/mounted-map-owner.ts
 import {
   createTileflowNativeSourceController,
+  nearestTileflowBlendTheme,
+  planTileflowThemeBlend,
   resolveTileflowNativeManifestUrl as resolveTileflowNativeManifestUrl5
 } from "@tileflow/core/native";
 
@@ -3252,18 +3254,18 @@ function ownRecord(value, allowed2) {
   const keys = Reflect.ownKeys(value);
   if (keys.length > allowed2.length) return fail();
   const copy = /* @__PURE__ */ Object.create(null);
-  for (const key of keys) {
-    if (typeof key !== "string" || !allowed2.includes(key)) return fail();
-    const property = Object.getOwnPropertyDescriptor(value, key);
+  for (const key2 of keys) {
+    if (typeof key2 !== "string" || !allowed2.includes(key2)) return fail();
+    const property = Object.getOwnPropertyDescriptor(value, key2);
     if (!property?.enumerable || !("value" in property)) return fail();
-    copy[key] = property.value;
+    copy[key2] = property.value;
   }
   return copy;
 }
 function requireCompleteView(value) {
   if (!value || typeof value !== "object") return fail();
-  for (const key of ["center", "zoom", "bearing", "pitch"]) {
-    const property = Object.getOwnPropertyDescriptor(value, key);
+  for (const key2 of ["center", "zoom", "bearing", "pitch"]) {
+    const property = Object.getOwnPropertyDescriptor(value, key2);
     if (!property || !("value" in property) || property.value === void 0) return fail();
   }
 }
@@ -3351,11 +3353,11 @@ function configurationRecord(value) {
   const keys = Reflect.ownKeys(value);
   if (keys.length > 32) return invalid2();
   const result = /* @__PURE__ */ Object.create(null);
-  for (const key of keys) {
-    if (typeof key !== "string") return invalid2();
-    const descriptor = Object.getOwnPropertyDescriptor(value, key);
+  for (const key2 of keys) {
+    if (typeof key2 !== "string") return invalid2();
+    const descriptor = Object.getOwnPropertyDescriptor(value, key2);
     if (!descriptor || !("value" in descriptor)) return invalid2();
-    result[key] = descriptor.value;
+    result[key2] = descriptor.value;
   }
   return result;
 }
@@ -3397,7 +3399,7 @@ function field(value, name3) {
 }
 function names(value, maximum2) {
   const keys = Reflect.ownKeys(record(value));
-  if (!keys.length || keys.length > maximum2 || keys.some((key) => typeof key !== "string"))
+  if (!keys.length || keys.length > maximum2 || keys.some((key2) => typeof key2 !== "string"))
     throw new Error();
   return keys;
 }
@@ -3529,6 +3531,8 @@ var nativePreparationLimits = Object.freeze({
   tileJsonBytes: 1048576,
   depth: 64,
   nodes: 54e4,
+  /** A blend style is planned locally from validated styles; split layers make it larger. */
+  blendNodes: 216e4,
   sources: 128,
   layers: 4096,
   fontFaces: 16,
@@ -3611,11 +3615,11 @@ function nativeJsonBytes(value) {
   }
   return bytes;
 }
-function freezeNativePreparedJson(value) {
+function freezeNativePreparedJson(value, maximumNodes = nativePreparationLimits.nodes) {
   let nodes = 0;
   const parents = /* @__PURE__ */ new Set();
   const visit = (input, depth) => {
-    if (++nodes > nativePreparationLimits.nodes || depth > nativePreparationLimits.depth)
+    if (++nodes > maximumNodes || depth > nativePreparationLimits.depth)
       throw new NativePreparationError();
     if (input === null || typeof input === "boolean") return;
     if (typeof input === "number" && Number.isFinite(input)) return;
@@ -3626,17 +3630,17 @@ function freezeNativePreparedJson(value) {
     if (!array3 && Object.getPrototypeOf(input) !== Object.prototype && Object.getPrototypeOf(input) !== null)
       throw new NativePreparationError();
     const keys = Reflect.ownKeys(input);
-    if (array3 && (input.length > nativePreparationLimits.nodes || Object.keys(input).length !== input.length))
+    if (array3 && (input.length > maximumNodes || Object.keys(input).length !== input.length))
       throw new NativePreparationError();
     parents.add(input);
-    for (const key of keys) {
-      if (array3 && key === "length") continue;
-      if (typeof key !== "string" || key === "__proto__" || key === "toJSON")
+    for (const key2 of keys) {
+      if (array3 && key2 === "length") continue;
+      if (typeof key2 !== "string" || key2 === "__proto__" || key2 === "toJSON")
         throw new NativePreparationError();
-      const property = Object.getOwnPropertyDescriptor(input, key);
+      const property = Object.getOwnPropertyDescriptor(input, key2);
       if (!property || !property.enumerable || !("value" in property))
         throw new NativePreparationError();
-      visit(key, depth + 1);
+      visit(key2, depth + 1);
       visit(property.value, depth + 1);
     }
     parents.delete(input);
@@ -3822,13 +3826,13 @@ function snapshotNativeMapOptions(value) {
     const keys = Reflect.ownKeys(value);
     if (keys.length > allowed.size) throw new Error();
     const result = {};
-    for (const key of keys) {
-      if (typeof key !== "string" || !allowed.has(key)) throw new Error();
-      const property = Object.getOwnPropertyDescriptor(value, key);
+    for (const key2 of keys) {
+      if (typeof key2 !== "string" || !allowed.has(key2)) throw new Error();
+      const property = Object.getOwnPropertyDescriptor(value, key2);
       if (!property || !property.enumerable || !("value" in property)) throw new Error();
       if (property.value === void 0) continue;
       if (typeof property.value !== "boolean") throw new Error();
-      result[key] = property.value;
+      result[key2] = property.value;
     }
     return Object.freeze(result);
   } catch {
@@ -3893,10 +3897,10 @@ function createMapCameraController(port, onError = () => void 0) {
   }
   function failed(run) {
     if (!current(run)) return;
-    const own2 = revision;
+    const own3 = revision;
     pending = void 0;
     retire(run);
-    if (disposed || revision !== own2) return;
+    if (disposed || revision !== own3) return;
     try {
       void Promise.resolve(report?.(new CameraControllerError("CAMERA_COMMAND_FAILED"))).catch(
         () => void 0
@@ -3947,9 +3951,9 @@ function createMapCameraController(port, onError = () => void 0) {
   function update(input) {
     assertUsable();
     if (!mounted) throw new CameraControllerError("CAMERA_NOT_MOUNTED");
-    const own2 = advance();
+    const own3 = advance();
     const next = snapshotCameraProps(input);
-    if (disposed || revision !== own2) return;
+    if (disposed || revision !== own3) return;
     if (next.mode !== mode) throw new CameraControllerError("CAMERA_MODE_CHANGE");
     props = next;
     reconcile();
@@ -3960,9 +3964,9 @@ function createMapCameraController(port, onError = () => void 0) {
       update(input);
       return;
     }
-    const own2 = advance();
+    const own3 = advance();
     const next = snapshotCameraProps(input, fallbacks);
-    if (disposed || revision !== own2) return;
+    if (disposed || revision !== own3) return;
     mode = next.mode;
     props = next;
     live = next.view;
@@ -3994,9 +3998,9 @@ function createMapCameraController(port, onError = () => void 0) {
     changeGesture(identity, input) {
       const active = gesture;
       if (disposed || !active || active.token !== identity) return;
-      const own2 = advance();
+      const own3 = advance();
       const view = snapshotCameraView(input);
-      if (disposed || gesture !== active || revision !== own2) return;
+      if (disposed || gesture !== active || revision !== own3) return;
       live = view;
       if (sameCameraView(active.lastEmitted, view)) return;
       active.lastEmitted = view;
@@ -4005,9 +4009,9 @@ function createMapCameraController(port, onError = () => void 0) {
     endGesture(identity, input) {
       const active = gesture;
       if (disposed || !active || active.token !== identity) return;
-      const own2 = advance();
+      const own3 = advance();
       const view = snapshotCameraView(input);
-      if (disposed || gesture !== active || revision !== own2) return;
+      if (disposed || gesture !== active || revision !== own3) return;
       live = view;
       gesture = void 0;
       const waiting = { token: identity, notifying: true };
@@ -4042,9 +4046,9 @@ function createMapCameraController(port, onError = () => void 0) {
     observeCommand(identity, input) {
       const run = pending;
       if (!run || !current(run) || run.command.token !== identity) return;
-      const own2 = advance();
+      const own3 = advance();
       const view = snapshotCameraView(input);
-      if (!current(run) || revision !== own2) return;
+      if (!current(run) || revision !== own3) return;
       live = view;
     },
     /** Called explicitly by the renderer owner after replacing style/source on this instance. */
@@ -4177,13 +4181,13 @@ function createNativeInteractionStyleOwner(changed) {
     get() {
       return proof?.isCurrent() ? proof : void 0;
     },
-    publish(key, token, style, current) {
+    publish(key2, token, style, current) {
       revoke?.();
       let live = true;
       revoke = () => {
         live = false;
       };
-      proof = Object.freeze({ key, token, style, isCurrent: () => live && current() });
+      proof = Object.freeze({ key: key2, token, style, isCurrent: () => live && current() });
       notify();
     },
     retire() {
@@ -4266,6 +4270,160 @@ function createNativeReadiness(notify) {
   });
 }
 
+// src/native-theme-blend.ts
+import {
+  fillTileflowThemeBlendTemplate
+} from "@tileflow/core/native";
+var nativeBlendLabelFadeMs = 450;
+var minimumStep = 25e-4;
+var imageSteps = 32;
+function createNativeThemeBlender(plan, port, options) {
+  const clamp = (value) => Math.min(plan.themes - 1, Math.max(0, Number.isFinite(value) ? value : 0));
+  const ground = plan.paints.filter((paint) => paint.follows === "position");
+  const symbols = plan.paints.filter((paint) => paint.follows === "dominant");
+  const patterns = plan.images.filter((image) => image.follows === "position");
+  const shownPaints = /* @__PURE__ */ new Map();
+  const shownSwitches = /* @__PURE__ */ new Map();
+  const shownImages = /* @__PURE__ */ new Map();
+  let shownLight;
+  const baked = clamp(options.baked);
+  let position = baked;
+  let dominant = Math.round(baked);
+  let target = baked;
+  let stepped = baked;
+  let scheduled = false;
+  let disposed = false;
+  let queue = Promise.resolve();
+  for (const paint of ground)
+    shownPaints.set(paint, key(fillTileflowThemeBlendTemplate(paint.template, baked)));
+  for (const paint of symbols)
+    shownPaints.set(paint, key(fillTileflowThemeBlendTemplate(paint.template, dominant)));
+  for (const entry of plan.switches) shownSwitches.set(entry, key(entry.values[dominant] ?? null));
+  for (const image of patterns) shownImages.set(image, imageKey(image, baked));
+  if (plan.light !== void 0) shownLight = key(fillTileflowThemeBlendTemplate(plan.light, baked));
+  function groundValues(at) {
+    const paint = [];
+    for (const entry of ground) {
+      const value = fillTileflowThemeBlendTemplate(entry.template, at);
+      const shown = key(value);
+      if (shownPaints.get(entry) === shown) continue;
+      shownPaints.set(entry, shown);
+      paint.push([entry.layer, entry.property, value]);
+    }
+    const images = [];
+    for (const image of patterns) {
+      const shown = imageKey(image, at);
+      if (shownImages.get(image) === shown) continue;
+      shownImages.set(image, shown);
+      const [index, t] = imageMix(image, at);
+      images.push([image.names[0], image.names[index], image.names[index + 1], t]);
+    }
+    let light2;
+    if (plan.light !== void 0) {
+      const value = fillTileflowThemeBlendTemplate(plan.light, at);
+      const shown = key(value);
+      if (shown !== shownLight) {
+        shownLight = shown;
+        light2 = value;
+      }
+    }
+    if (!paint.length && !images.length && light2 === void 0) return void 0;
+    return { paint, images, ...light2 === void 0 ? {} : { light: light2 } };
+  }
+  function nearestValues(theme) {
+    const paint = [];
+    const layout = [];
+    for (const entry of symbols) {
+      const value = fillTileflowThemeBlendTemplate(entry.template, theme);
+      const shown = key(value);
+      if (shownPaints.get(entry) === shown) continue;
+      shownPaints.set(entry, shown);
+      paint.push([entry.layer, entry.property, value]);
+    }
+    for (const entry of plan.switches) {
+      const value = entry.values[theme] ?? null;
+      const shown = key(value);
+      if (shownSwitches.get(entry) === shown) continue;
+      shownSwitches.set(entry, shown);
+      (entry.group === "paint" ? paint : layout).push([entry.layer, entry.property, value]);
+    }
+    if (!paint.length && !layout.length) return void 0;
+    return { paint, layout };
+  }
+  async function step() {
+    scheduled = false;
+    if (disposed) return;
+    const goal = target;
+    stepped = goal;
+    const reachesTheme = goal % 1 === 0 && goal !== position;
+    if (Math.abs(goal - position) >= minimumStep || reachesTheme) {
+      position = goal;
+      const values = groundValues(position);
+      if (values) await port.apply(values);
+    }
+    const nearest = Math.round(goal);
+    if (nearest !== dominant && !disposed) {
+      dominant = nearest;
+      const values = nearestValues(nearest);
+      if (values) {
+        const covered = await port.cover(nativeBlendLabelFadeMs).catch(() => false);
+        if (disposed) return;
+        await port.apply(values);
+        if (covered) void port.reveal(nativeBlendLabelFadeMs).catch(() => void 0);
+      }
+    }
+  }
+  function schedule() {
+    if (scheduled || disposed) return;
+    scheduled = true;
+    queue = queue.then(step).then(
+      () => {
+        if (!disposed && target !== stepped) schedule();
+      },
+      () => {
+        if (disposed) return;
+        disposed = true;
+        options.failed();
+      }
+    );
+  }
+  return Object.freeze({
+    get position() {
+      return position;
+    },
+    get dominant() {
+      return dominant;
+    },
+    set(next) {
+      if (disposed) return;
+      target = clamp(next);
+      schedule();
+    },
+    /** Resolves once every scheduled batch has been sent. */
+    async whenIdle() {
+      for (; ; ) {
+        const pending = queue;
+        await pending;
+        if (pending === queue && !scheduled) return;
+      }
+    },
+    dispose() {
+      disposed = true;
+    }
+  });
+}
+function key(value) {
+  return JSON.stringify(value) ?? "undefined";
+}
+function imageMix(image, at) {
+  const quantized = Math.round(at * imageSteps) / imageSteps;
+  const index = Math.min(image.names.length - 2, Math.max(0, Math.floor(quantized)));
+  return [index, Math.min(1, Math.max(0, quantized - index))];
+}
+function imageKey(image, at) {
+  return imageMix(image, at).join(":");
+}
+
 // src/native-renderer-owner.ts
 var blank = Object.freeze({ version: 8, sources: Object.freeze({}), layers: Object.freeze([]) });
 var selection = (target) => Object.freeze({
@@ -4275,7 +4433,7 @@ var selection = (target) => Object.freeze({
     colorScheme: target.source.theme.colorScheme
   })
 });
-function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
+function createNativeRendererOwner(key2, initialTarget, initialCamera, ports2) {
   let disposed = false;
   let terminal = false;
   let foreground = true;
@@ -4302,10 +4460,17 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
   let gesture;
   let settlement;
   let cameraProps = initialCamera;
+  let transitionMs = 0;
+  let drawn = false;
+  let covering = false;
+  let coverMs = 0;
+  let revealing;
+  let blender;
+  let blendPosition;
   const initial = snapshotCameraProps(initialCamera, { manifestView: initialTarget.source.map.view });
   const initialView = initial.view;
   let snapshot = Object.freeze({
-    key,
+    key: key2,
     style: blank,
     initialView,
     revision
@@ -4336,6 +4501,38 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     }
   };
   const readiness = createNativeReadiness((status) => {
+    if (disposed) return;
+    if (status === "ready" && covering) reveal();
+    else publishReadiness(status);
+  });
+  function reveal() {
+    const version = transaction;
+    const nativeSurface = surface;
+    if (revealing?.version === version) return;
+    if (!nativeSurface?.reveal) {
+      covering = false;
+      if (readiness.ready) publishReadiness("ready");
+      return;
+    }
+    const work = nativeSurface.reveal(coverMs).catch(() => nativeSurface.discardCover?.()).catch(() => void 0);
+    revealing = { version, work };
+    track(
+      work.then(() => {
+        if (revealing?.work === work) revealing = void 0;
+        if (disposed || version !== transaction) return;
+        covering = false;
+        if (readiness.ready) publishReadiness("ready");
+      })
+    );
+  }
+  function discardCover() {
+    if (!covering) return;
+    covering = false;
+    revealing = void 0;
+    const nativeSurface = surface;
+    if (nativeSurface?.discardCover) track(nativeSurface.discardCover().catch(() => void 0));
+  }
+  function publishReadiness(status) {
     if (disposed) return;
     const version = transaction;
     if (status === "ready" && pendingSuccess && !rollback) {
@@ -4352,11 +4549,12 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
         });
       }
     } else emit({ type: "readiness-change", generation: eventGeneration, status });
-  });
+  }
   const cameraPort = createNativeCameraPort({
     applyCamera(command, view) {
-      if (!surface || disposed || terminal || !loaded || !foreground)
+      if (!surface || disposed || terminal || !foreground)
         return Promise.reject(new NativePreparationError());
+      if (!loaded) return Promise.resolve(Object.freeze({ command, view }));
       return surface.applyCamera(command, view);
     },
     cancelCamera(command) {
@@ -4374,7 +4572,7 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     const expected = token;
     const generation = eventGeneration;
     interactionStyles.publish(
-      key,
+      key2,
       expected,
       style,
       () => !disposed && !terminal && foreground && !preloading && styleAccepted && loaded && surface === nativeSurface && token === expected && snapshot.style === style && transaction === version && eventGeneration === generation
@@ -4397,6 +4595,9 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     if (disposed || terminal || !foreground || !styleAccepted || loaded || version !== transaction)
       return;
     loaded = true;
+    drawn = true;
+    if (covering) reveal();
+    startBlender(version);
     publishInteractionStyle(version);
     if (disposed || version !== transaction || !foreground) return;
     emit({ type: "load", generation: eventGeneration, selection: selection(active) });
@@ -4418,8 +4619,45 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
       fail2();
     }
   }
+  function stopBlender() {
+    blender?.dispose();
+    blender = void 0;
+  }
+  function startBlender(version) {
+    const blend = active.blend;
+    const nativeSurface = surface;
+    if (!blend || blender || !nativeSurface?.applyThemeValues || version !== transaction) return;
+    const style = token;
+    const owned2 = () => !disposed && !terminal && version === transaction && surface === nativeSurface;
+    blender = createNativeThemeBlender(
+      blend.plan,
+      {
+        apply(values) {
+          if (!owned2()) return Promise.resolve();
+          return nativeSurface.applyThemeValues(style, values);
+        },
+        cover(duration) {
+          if (!owned2() || !foreground || !nativeSurface.cover) return Promise.resolve(false);
+          return nativeSurface.cover(duration);
+        },
+        reveal(duration) {
+          if (!nativeSurface.reveal) return Promise.resolve();
+          return nativeSurface.reveal(duration);
+        }
+      },
+      {
+        baked: blend.position,
+        failed() {
+          if (owned2()) fail2();
+        }
+      }
+    );
+    if (blendPosition !== void 0) blender.set(blendPosition);
+  }
   function apply(target, restoring) {
     if (disposed) return;
+    stopBlender();
+    blendPosition = target.blend?.position;
     const version = ++transaction;
     if (styleSequence >= Number.MAX_SAFE_INTEGER) {
       terminal = true;
@@ -4444,8 +4682,17 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     readiness.begin(expected);
     if (!surface) return;
     const nativeSurface = surface;
+    const duration = restoring || !drawn || !foreground ? 0 : transitionMs;
     const work = Promise.resolve().then(async () => {
       if (disposed || version !== transaction) return;
+      if (duration > 0 && nativeSurface.cover) {
+        const covered = await nativeSurface.cover(duration).catch(() => false);
+        if (covered && !disposed) {
+          covering = true;
+          coverMs = duration;
+        }
+        if (disposed || version !== transaction || surface !== nativeSurface) return;
+      }
       await nativeSurface.expectStyle(expected);
       if (disposed || version !== transaction || surface !== nativeSurface) return;
       const layers = target.style.layers;
@@ -4453,21 +4700,24 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
         (layer) => !layer || typeof layer !== "object" || typeof layer.id !== "string" || layer.id.startsWith("__tileflow_native_style_")
       ))
         throw new NativePreparationError();
-      const style = freezeNativePreparedJson({
-        ...target.style,
-        layers: [
-          ...layers,
-          {
-            id: `__tileflow_native_style_${expected}`,
-            type: "background",
-            paint: {
-              "background-color": "rgba(0,0,0,0)",
-              "background-opacity": 1
+      const style = freezeNativePreparedJson(
+        {
+          ...target.style,
+          layers: [
+            ...layers,
+            {
+              id: `__tileflow_native_style_${expected}`,
+              type: "background",
+              paint: {
+                "background-color": "rgba(0,0,0,0)",
+                "background-opacity": 1
+              }
             }
-          }
-        ]
-      });
-      snapshot = Object.freeze({ key, style, initialView, revision: ++revision });
+          ]
+        },
+        target.blend ? nativePreparationLimits.blendNodes : nativePreparationLimits.nodes
+      );
+      snapshot = Object.freeze({ key: key2, style, initialView, revision: ++revision });
       if (!restoring)
         emit({
           type: "theme-change",
@@ -4489,6 +4739,8 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     const previous = committed;
     const version = transaction;
     interactionStyles.retire();
+    discardCover();
+    stopBlender();
     if (disposed || version !== transaction) return;
     emit({ type: "renderer-error", generation });
     if (disposed || version !== transaction) return;
@@ -4574,6 +4826,20 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     get currentTarget() {
       return committed;
     },
+    /** The latest target applied, which may still be loading. */
+    get activeTarget() {
+      return terminal ? void 0 : active;
+    },
+    /** Moves a blend target to another position; ignored while no blend is shown. */
+    setBlendPosition(position) {
+      if (disposed || !Number.isFinite(position)) return;
+      blendPosition = position;
+      if (active.blend) blender?.set(position);
+    },
+    /** Cross-fade length for later style replacements, in milliseconds; 0 changes at once. */
+    setTransition(duration) {
+      transitionMs = Number.isSafeInteger(duration) && duration > 0 && duration <= 5e3 ? duration : 0;
+    },
     bindRoot(rootTag) {
       if (disposed || !Number.isSafeInteger(rootTag) || rootTag < 1 || root !== void 0 && root !== rootTag)
         return;
@@ -4629,7 +4895,16 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
       apply(target, false);
     },
     reuseTarget(source) {
-      if (disposed || !committed || terminal) return;
+      if (disposed || terminal) return;
+      if (active !== committed || !committed) {
+        active = { ...active, source };
+        eventGeneration = source.generation;
+        preloading = false;
+        interruptCamera();
+        invalidate();
+        publishInteractionStyle(transaction);
+        return;
+      }
       active = { ...committed, source };
       committed = active;
       const target = active;
@@ -4751,6 +5026,7 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
     async whenIdle() {
       for (; ; ) {
         await cameraPort.whenIdle();
+        await blender?.whenIdle();
         if (!tasks.size) return;
         await Promise.allSettled([...tasks]);
       }
@@ -4760,6 +5036,7 @@ function createNativeRendererOwner(key, initialTarget, initialCamera, ports2) {
       disposed = true;
       ++transaction;
       ++barrierEpoch;
+      stopBlender();
       interactionStyles.retire();
       readiness.dispose();
       camera.dispose();
@@ -4950,9 +5227,9 @@ function fontMetadata(input, developmentOrigin) {
     if (!record2(value)) throw invalid3();
     const keys = Reflect.ownKeys(value);
     if (keys.some(
-      (key) => typeof key !== "string" || !["id", "family", "url", "source", "format", "style", "weight"].includes(key)
-    ) || keys.some((key) => {
-      const descriptor = Object.getOwnPropertyDescriptor(value, key);
+      (key2) => typeof key2 !== "string" || !["id", "family", "url", "source", "format", "style", "weight"].includes(key2)
+    ) || keys.some((key2) => {
+      const descriptor = Object.getOwnPropertyDescriptor(value, key2);
       return !descriptor?.enumerable || !("value" in descriptor);
     }))
       throw invalid3();
@@ -4991,7 +5268,7 @@ function validateFontFaces(faces, documentUrl, metadata, add, rewrites, policy,
     for (const definition of definitions) {
       if (++count > nativePreparationLimits.fontFaces || !record2(definition)) throw invalid3();
       const keys = Object.keys(definition).sort();
-      if (keys.length !== 4 || !["font-family", "font-style", "font-weight", "url"].every((key) => keys.includes(key)))
+      if (keys.length !== 4 || !["font-family", "font-style", "font-weight", "url"].every((key2) => keys.includes(key2)))
         throw invalid3();
       if (typeof definition["font-family"] !== "string" || !fontStyles.has(String(definition["font-style"])) || typeof definition["font-weight"] !== "number" || !Number.isInteger(definition["font-weight"]) || !fontWeights.has(String(definition["font-weight"])))
         throw invalid3();
@@ -5064,7 +5341,7 @@ async function projectNativeResources(ports2) {
     const styleUrl = resolveUrl(ports2.styleUrl, ports2.styleUrl);
     const document = await read(styleUrl, "style");
     const style = JSON.parse(JSON.stringify(document.value));
-    if (style.version !== 8 || !record2(style.sources) || !Array.isArray(style.layers) || Object.keys(style).some((key) => !roots.has(key)) || Object.keys(style.sources).length > nativePreparationLimits.sources || style.layers.length > nativePreparationLimits.layers)
+    if (style.version !== 8 || !record2(style.sources) || !Array.isArray(style.layers) || Object.keys(style).some((key2) => !roots.has(key2)) || Object.keys(style.sources).length > nativePreparationLimits.sources || style.layers.length > nativePreparationLimits.layers)
       throw invalid3();
     const rewrites = [];
     for (const sourceId of Object.keys(style.sources).sort()) {
@@ -5080,9 +5357,9 @@ async function projectNativeResources(ports2) {
             throw invalid3();
           declaringUrl = tileJson.url;
           delete source.url;
-          for (const key of ["tiles", "bounds", "minzoom", "maxzoom", "scheme", "attribution"]) {
-            if (source[key] === void 0 && tileJson.value[key] !== void 0)
-              source[key] = JSON.parse(JSON.stringify(tileJson.value[key]));
+          for (const key2 of ["tiles", "bounds", "minzoom", "maxzoom", "scheme", "attribution"]) {
+            if (source[key2] === void 0 && tileJson.value[key2] !== void 0)
+              source[key2] = JSON.parse(JSON.stringify(tileJson.value[key2]));
           }
         }
         if (!Array.isArray(source.tiles) || source.tiles.length < 1 || source.tiles.length > 16)
@@ -5188,14 +5465,72 @@ function projectMapSourceState(state) {
   });
 }
 
+// src/theme-motion-input.ts
+import { validateTileflowThemeBlendSelection } from "@tileflow/core/native";
+var maximumTransitionMs = 5e3;
+function own(value, keys) {
+  const prototype = Object.getPrototypeOf(value);
+  if (Array.isArray(value) || prototype !== Object.prototype && prototype !== null)
+    throw new NativePreparationError();
+  const result = {};
+  for (const key2 of Reflect.ownKeys(value)) {
+    if (typeof key2 !== "string" || !keys.includes(key2)) throw new NativePreparationError();
+    const property = Object.getOwnPropertyDescriptor(value, key2);
+    if (!property || !("value" in property)) throw new NativePreparationError();
+    result[key2] = property.value;
+  }
+  return result;
+}
+function snapshotThemeTransition(value) {
+  if (value === void 0) return 0;
+  if (!value || typeof value !== "object") throw new NativePreparationError();
+  const { duration = 0 } = own(value, ["duration"]);
+  if (typeof duration !== "number" || !Number.isFinite(duration) || duration < 0 || duration > maximumTransitionMs)
+    throw new NativePreparationError();
+  return Math.round(duration);
+}
+function snapshotThemeBlend(value) {
+  if (value === void 0) return void 0;
+  if (!value || typeof value !== "object") throw new NativePreparationError();
+  const { themes, position } = own(value, ["themes", "position"]);
+  if (!Array.isArray(themes)) throw new NativePreparationError();
+  const blend = { themes: Object.freeze([...themes]), position };
+  if (!validateTileflowThemeBlendSelection(blend)) throw new NativePreparationError();
+  return Object.freeze(blend);
+}
+function themeBlendKey(blend) {
+  return JSON.stringify(blend.themes);
+}
+
 // src/mounted-map-owner.ts
+function themeSource(source, name3) {
+  const theme = Object.hasOwn(source.map.themes, name3) ? source.map.themes[name3] : void 0;
+  if (!theme) throw new NativePreparationError();
+  return { ...source, theme: { ...theme, name: name3 } };
+}
+function themeIdentity(source) {
+  return JSON.stringify([source.theme.name, source.theme.styleUrl, source.theme.revision ?? null]);
+}
+function heldStyle(targets, source) {
+  const identity = themeIdentity(source);
+  for (const target of targets) {
+    if (!target) continue;
+    if (!target.blend && themeIdentity(target.source) === identity) return target.style;
+    const held = target.blend?.styles.get(identity);
+    if (held) return held;
+  }
+  return void 0;
+}
+function sameTheme(shown, source) {
+  return shown.theme.name === source.theme.name && shown.theme.styleUrl === source.theme.styleUrl && shown.theme.revision === source.theme.revision;
+}
 function cameraInput(props) {
   const result = {};
-  for (const key of ["view", "initialView", "onViewChange"]) {
-    const property = Object.getOwnPropertyDescriptor(props, key);
+  for (const key2 of ["view", "initialView", "onViewChange"]) {
+    const property = Object.getOwnPropertyDescriptor(props, key2);
     if (!property) continue;
     if (!("value" in property)) throw new NativePreparationError();
-    result[key] = property.value;
+    result[key2] = property.value;
   }
   const input = result;
   snapshotCameraProps(input);
@@ -5207,7 +5542,7 @@ function snapshotSource(value) {
     const prototype = Object.getPrototypeOf(value);
     if (prototype !== Object.prototype && prototype !== null) return void 0;
     const keys = Reflect.ownKeys(value);
-    if (!keys.includes("map") || !keys.includes("manifestUrl") || keys.some((key) => !["map", "manifestUrl", "developmentOrigin"].includes(String(key))))
+    if (!keys.includes("map") || !keys.includes("manifestUrl") || keys.some((key2) => !["map", "manifestUrl", "developmentOrigin"].includes(String(key2))))
       return void 0;
     const map = Object.getOwnPropertyDescriptor(value, "map");
     const url = Object.getOwnPropertyDescriptor(value, "manifestUrl");
@@ -5232,6 +5567,11 @@ function createMountedMapOwner(ports2) {
   let props;
   let camera = {};
   let mapOptions = Object.freeze({});
+  let transitionMs = 0;
+  let blendSelection;
+  let blendTheme;
+  const blending = () => ports2.surfaces.blending?.() !== false;
+  const selectionTheme = () => blendSelection ? blendTheme : props?.theme;
   let sourceKey;
   let sourceObject;
   let selectedTheme;
@@ -5431,24 +5771,21 @@ function createMountedMapOwner(ports2) {
     const job = { live: true, operations: /* @__PURE__ */ new Set() };
     epoch.job = job;
     let styleReadFailed = false;
+    const blend = blending() ? blendSelection : void 0;
     const owns = () => !disposed && foreground && current === epoch && epoch.live && job.live && epoch.job === job && core.state === source;
     const work = Promise.resolve().then(async () => {
       if (!owns()) return;
       epoch.hosted.validate(source);
       const map = await context(epoch, source);
       if (!owns()) return;
-      const previous = epoch.renderer?.currentTarget;
-      if (previous && previous.source.theme.name === source.theme.name && previous.source.theme.styleUrl === source.theme.styleUrl && previous.source.theme.revision === source.theme.revision) {
-        epoch.renderer.reuseTarget(source);
-        return;
-      }
-      const policy = await map.prepare();
-      if (!owns()) return;
-      const prepared = await projectNativeResources({
-        styleUrl: source.theme.styleUrl,
-        developmentOrigin: source.source.developmentOrigin,
+      const renderer = epoch.renderer;
+      const shown = renderer?.activeTarget;
+      const held = [shown, renderer?.currentTarget];
+      const project = async (theme, policy) => (await projectNativeResources({
+        styleUrl: theme.theme.styleUrl,
+        developmentOrigin: theme.source.developmentOrigin,
         policy,
-        fontFaces: source.theme.fontFaces?.map((face) => ({
+        fontFaces: theme.theme.fontFaces?.map((face) => ({
           family: face.family,
           source: face.source,
           ...face.style === void 0 ? {} : { style: face.style },
@@ -5473,36 +5810,81 @@ function createMountedMapOwner(ports2) {
               maximumBytes,
               owns
             );
-            if (url === source.theme.styleUrl) assertHostedNativeStyleDocument(source, document);
+            if (url === theme.theme.styleUrl)
+              assertHostedNativeStyleDocument(theme, document);
             return document;
           } catch {
-            if (url === source.theme.styleUrl && resource?.scope === "style")
+            if (url === theme.theme.styleUrl && resource?.scope === "style")
               styleReadFailed = true;
             throw new NativePreparationError();
           }
         }
-      });
+      })).style;
+      let target;
+      if (blend) {
+        const themes = blend.themes.map((name3) => themeSource(source, name3));
+        const key2 = JSON.stringify(themes.map(themeIdentity));
+        if (renderer && shown?.blend?.key === key2) {
+          renderer.reuseTarget(source);
+          if (blendSelection) renderer.setBlendPosition(blendSelection.position);
+          return;
+        }
+        const policy = await map.prepare();
+        if (!owns()) return;
+        const styles = [];
+        for (const theme of themes) {
+          styles.push(heldStyle(held, theme) ?? await project(theme, policy));
+          if (!owns()) return;
+        }
+        const plan = planTileflowThemeBlend(styles, {
+          featureSwitches: "layers",
+          iconImages: "switch"
+        });
+        const position = blendSelection && themeBlendKey(blendSelection) === themeBlendKey(blend) ? blendSelection.position : blend.position;
+        target = {
+          source,
+          style: plan.styleAt(position),
+          blend: {
+            key: key2,
+            plan,
+            position,
+            styles: new Map(themes.map((theme, index) => [themeIdentity(theme), styles[index]]))
+          }
+        };
+      } else {
+        if (renderer && shown && !shown.blend && sameTheme(shown.source, source)) {
+          renderer.reuseTarget(source);
+          return;
+        }
+        const style = heldStyle(held, source);
+        if (renderer && style) {
+          renderer.setTarget({ source, style });
+          notify();
+          return;
+        }
+        const policy = await map.prepare();
+        if (!owns()) return;
+        target = { source, style: await project(source, policy) };
+      }
       if (!owns()) return;
       ports2.surfaces.available?.();
-      if (!epoch.renderer)
-        epoch.renderer = createNativeRendererOwner(
-          map.context,
-          { source, style: prepared.style },
-          camera,
-          {
-            surfaces: ports2.surfaces,
-            emit(event) {
-              if (current === epoch && epoch.live && !disposed) emit(event);
-            },
-            changed() {
-              if (current === epoch && epoch.live) notify();
-            },
-            interactionsChanged() {
-              if (current === epoch && epoch.live && !disposed) notify();
-            }
+      if (!epoch.renderer) {
+        epoch.renderer = createNativeRendererOwner(map.context, target, camera, {
+          surfaces: ports2.surfaces,
+          emit(event) {
+            if (current === epoch && epoch.live && !disposed) emit(event);
+          },
+          changed() {
+            if (current === epoch && epoch.live) notify();
+          },
+          interactionsChanged() {
+            if (current === epoch && epoch.live && !disposed) notify();
           }
-        );
-      else epoch.renderer.setTarget({ source, style: prepared.style });
+        });
+        epoch.renderer.setTransition(transitionMs);
+      } else epoch.renderer.setTarget(target);
+      if (target.blend && blendSelection)
+        epoch.renderer.setBlendPosition(blendSelection.position);
       notify();
     }).catch(() => {
       if (!owns()) return;
@@ -5510,7 +5892,7 @@ function createMountedMapOwner(ports2) {
         cancelJob(epoch);
         epoch.cache.clear();
         if (!disposed && foreground && current === epoch && epoch.live && props) {
-          track(core.replace(props.source, { theme: props.theme, colorScheme }));
+          track(core.replace(props.source, { theme: selectionTheme(), colorScheme }));
         }
         return;
       }
@@ -5547,7 +5929,7 @@ function createMountedMapOwner(ports2) {
   function select() {
     if (disposed || !props || !current?.live) return;
     current.hosted.select();
-    track(core.replace(props.source, { theme: props.theme, colorScheme }));
+    track(core.replace(props.source, { theme: selectionTheme(), colorScheme }));
   }
   function appearance(theme) {
     if (theme === "system" === Boolean(appearanceRelease)) return;
@@ -5606,16 +5988,27 @@ function createMountedMapOwner(ports2) {
       props = source ? { ...next, source } : next;
       let options;
       let input;
+      let transition;
+      let blend;
       try {
         options = snapshotNativeMapOptions(next.mapOptions);
         input = cameraInput(next);
+        transition = snapshotThemeTransition(next.themeTransition);
+        blend = snapshotThemeBlend(next.themeBlend);
       } catch {
         rendererError();
         return;
       }
-      const key = source && JSON.stringify(source);
-      const changedSource = !initialized || key !== sourceKey || key === void 0 && sourceObject !== next.source;
-      const changedTheme = !initialized || next.theme !== selectedTheme;
+      transitionMs = transition;
+      current?.renderer?.setTransition(transition);
+      const previousBlend = blendSelection;
+      const nearest = blend ? nearestTileflowBlendTheme(blend) : void 0;
+      const changedBlend = Boolean(blend) !== Boolean(previousBlend) || blend && previousBlend && themeBlendKey(blend) !== themeBlendKey(previousBlend) || blend && !blending() && nearest !== blendTheme;
+      blendSelection = blend;
+      if (changedBlend || !blend) blendTheme = nearest;
+      const key2 = source && JSON.stringify(source);
+      const changedSource = !initialized || key2 !== sourceKey || key2 === void 0 && sourceObject !== next.source;
+      const changedTheme = !initialized || !blend && next.theme !== selectedTheme;
       const changedOptions = JSON.stringify(options) !== JSON.stringify(mapOptions);
       camera = input;
       mapOptions = options;
@@ -5624,7 +6017,7 @@ function createMountedMapOwner(ports2) {
         current = void 0;
         if (previous) void retire(previous).catch(() => void 0);
         current = createEpoch(source?.developmentOrigin);
-        sourceKey = key;
+        sourceKey = key2;
         sourceObject = next.source;
       }
       selectedTheme = next.theme;
@@ -5634,19 +6027,20 @@ function createMountedMapOwner(ports2) {
       } catch {
         colorScheme = void 0;
       }
-      if (changedSource || changedTheme) select();
+      if (changedSource || changedTheme || changedBlend) select();
+      else if (blend && blending()) current?.renderer?.setBlendPosition(blend.position);
       if (changedOptions || changedSource) notify();
       current?.renderer?.afterCommit(camera);
     },
-    rootMounted(key, root) {
-      if (!disposed && current?.renderer?.snapshot.key === key) current.renderer.bindRoot(root);
+    rootMounted(key2, root) {
+      if (!disposed && current?.renderer?.snapshot.key === key2) current.renderer.bindRoot(root);
     },
-    nativeStyleLoaded(key, root) {
-      if (disposed || current?.renderer?.snapshot.key !== key) return;
+    nativeStyleLoaded(key2, root) {
+      if (disposed || current?.renderer?.snapshot.key !== key2) return;
       void current.renderer.attach(root).catch(() => void 0);
     },
-    layoutChanged(key) {
-      if (!disposed && current?.renderer?.snapshot.key === key) current.renderer.layoutChanged();
+    layoutChanged(key2) {
+      if (!disposed && current?.renderer?.snapshot.key === key2) current.renderer.layoutChanged();
     },
     background() {
       nativeLifecycle(false);
@@ -6145,9 +6539,9 @@ function createHostedNativeBindingResolver(readConfiguration) {
       });
       void result.catch(() => void 0);
       const previous = active;
-      const own2 = { reject };
-      active = own2;
-      const current = () => !disposed && generation === sequence && active === own2;
+      const own3 = { reject };
+      active = own3;
+      const current = () => !disposed && generation === sequence && active === own3;
       previous?.reject(new NativeConfigurationError("NATIVE_CONFIGURATION_REPLACED"));
       let metadata;
       try {
@@ -6519,25 +6913,54 @@ var methods = [
   "retireRoot"
 ];
 var positive = (value) => typeof value === "number" && Number.isSafeInteger(value) && value > 0;
-function own(value, name3) {
+var motionDuration = (value) => typeof value === "number" && Number.isSafeInteger(value) && value >= 0 && value <= 5e3;
+var nativeThemeValueLimits = Object.freeze({ values: 8192, images: 64, depth: 32 });
+var layerOrImage = (value) => typeof value === "string" && value.length > 0 && value.length <= 512;
+var propertyName = (value) => typeof value === "string" && /^[a-z][a-z-]{0,63}$/u.test(value);
+function plain(value, depth) {
+  if (value === null || typeof value === "boolean" || typeof value === "string") return true;
+  if (typeof value === "number") return Number.isFinite(value);
+  if (depth >= nativeThemeValueLimits.depth || !value || typeof value !== "object") return false;
+  if (Array.isArray(value)) return value.every((item2) => plain(item2, depth + 1));
+  const prototype = Object.getPrototypeOf(value);
+  if (prototype !== Object.prototype && prototype !== null) return false;
+  return Object.values(value).every((item2) => plain(item2, depth + 1));
+}
+function themeValues(values) {
+  if (!values || typeof values !== "object" || Array.isArray(values)) return false;
+  const { paint = [], layout = [], images = [], light: light2 } = values;
+  if (Object.keys(values).some((key2) => !["paint", "layout", "images", "light"].includes(key2)) || !Array.isArray(paint) || !Array.isArray(layout) || !Array.isArray(images) || paint.length + layout.length > nativeThemeValueLimits.values || images.length > nativeThemeValueLimits.images)
+    return false;
+  for (const entry of [...paint, ...layout]) {
+    if (!Array.isArray(entry) || entry.length !== 3 || !layerOrImage(entry[0]) || !propertyName(entry[1]) || !plain(entry[2], 0))
+      return false;
+  }
+  for (const entry of images) {
+    if (!Array.isArray(entry) || entry.length !== 4 || !layerOrImage(entry[0]) || !layerOrImage(entry[1]) || !layerOrImage(entry[2]) || typeof entry[3] !== "number" || !(entry[3] >= 0 && entry[3] <= 1))
+      return false;
+  }
+  if (light2 === void 0) return true;
+  return Boolean(light2) && typeof light2 === "object" && !Array.isArray(light2) && plain(light2, 0);
+}
+function own2(value, name3) {
   if (!value || typeof value !== "object" || Array.isArray(value)) throw new NativeSurfaceError();
   const property = Object.getOwnPropertyDescriptor(value, name3);
   if (!property || !("value" in property)) throw new NativeSurfaceError();
   return property.value;
 }
 function eventFromNative(value) {
-  const surface = own(value, "surface");
-  const style = own(value, "style");
-  const sequence = own(value, "sequence");
-  const layout = own(value, "layout");
-  const kind = own(value, "kind");
+  const surface = own2(value, "surface");
+  const style = own2(value, "style");
+  const sequence = own2(value, "sequence");
+  const layout = own2(value, "layout");
+  const kind = own2(value, "kind");
   if (!isNativeToken(surface) || !isNativeToken(style) || !positive(sequence) || !positive(layout))
     throw new NativeSurfaceError();
   const keys = Reflect.ownKeys(value);
   if (kind === "gesture-start" || kind === "gesture-change" || kind === "gesture-end") {
-    const gesture = own(value, "gesture");
+    const gesture = own2(value, "gesture");
     if (!positive(gesture) || keys.length !== 7 || keys.some(
-      (key) => typeof key !== "string" || !["surface", "style", "sequence", "layout", "kind", "gesture", "view"].includes(key)
+      (key2) => typeof key2 !== "string" || !["surface", "style", "sequence", "layout", "kind", "gesture", "view"].includes(key2)
     ))
       throw new NativeSurfaceError();
     return Object.freeze({
@@ -6547,11 +6970,11 @@ function eventFromNative(value) {
       layout,
       kind,
       gesture,
-      view: snapshotCameraView(own(value, "view"))
+      view: snapshotCameraView(own2(value, "view"))
     });
   }
   if (!["style", "render", "invalidate", "error"].includes(String(kind)) || keys.length !== 5 || keys.some(
-    (key) => typeof key !== "string" || !["surface", "style", "sequence", "layout", "kind"].includes(key)
+    (key2) => typeof key2 !== "string" || !["surface", "style", "sequence", "layout", "kind"].includes(key2)
   ))
     throw new NativeSurfaceError();
   return Object.freeze({ surface, style, sequence, layout, kind });
@@ -6579,6 +7002,14 @@ function createNativeSurfaceTransport(locate, listen) {
     available() {
       module();
     },
+    /** Whether the native build can apply blend values; older builds cannot. */
+    blending() {
+      try {
+        return typeof module().applyThemeValues === "function";
+      } catch {
+        return false;
+      }
+    },
     async attach(root, notify, failure3) {
       if (!positive(root) || reservations >= 16) throw new NativeSurfaceError();
       const native = module();
@@ -6629,7 +7060,7 @@ function createNativeSurfaceTransport(locate, listen) {
         unsubscribe = listen((value) => {
           if (!live || !id) return;
           try {
-            if (own(value, "surface") !== id) return;
+            if (own2(value, "surface") !== id) return;
           } catch {
             return;
           }
@@ -6710,6 +7141,37 @@ function createNativeSurfaceTransport(locate, listen) {
           if (ack?.cancelled !== true) throw new NativeSurfaceError();
           return Object.freeze({ cancelled: true });
         },
+        ...typeof native.coverSurface === "function" && typeof native.revealSurface === "function" && typeof native.discardSurfaceCover === "function" ? {
+          async cover(duration) {
+            check();
+            if (!motionDuration(duration)) throw new NativeSurfaceError();
+            const ack = await safe(() => native.coverSurface(surface, duration));
+            check();
+            if (typeof ack?.covered !== "boolean") throw new NativeSurfaceError();
+            return ack.covered;
+          },
+          async reveal(duration) {
+            check();
+            if (!motionDuration(duration)) throw new NativeSurfaceError();
+            const ack = await safe(() => native.revealSurface(surface, duration));
+            if (ack?.revealed !== true) throw new NativeSurfaceError();
+          },
+          async discardCover() {
+            const ack = await safe(() => native.discardSurfaceCover(surface));
+            if (ack?.discarded !== true) throw new NativeSurfaceError();
+          }
+        } : {},
+        ...typeof native.applyThemeValues === "function" ? {
+          async applyThemeValues(style, values) {
+            check();
+            if (!isNativeToken(style) || !themeValues(values)) throw new NativeSurfaceError();
+            const ack = await safe(() => native.applyThemeValues(surface, style, values));
+            check();
+            if (!Number.isSafeInteger(ack?.applied) || ack.applied < 0)
+              throw new NativeSurfaceError();
+            return ack.applied;
+          }
+        } : {},
         retire() {
           if (retirement) return retirement;
           live = false;
@@ -6845,6 +7307,10 @@ function NativeScene({
       lifecycle.unbindInteractionHost(host);
     };
   }, [host, lifecycle]);
+  const mapStyle = useMemo2(
+    () => JSON.stringify(scene.style),
+    [scene.style]
+  );
   const [initialViewState] = useState(() => {
     const center = [scene.initialView.center[0], scene.initialView.center[1]];
     Object.freeze(center);
@@ -6894,7 +7360,7 @@ function NativeScene({
           ...mapOptions,
           ref: nativeMap,
           style: fill,
-          mapStyle: scene.style,
+          mapStyle,
           onPress: (event) => {
             if (!host.current()) return;
             try {