@vitreajs/vitrea 0.1.1 → 0.2.0

package/dist/index.js

@@ -302,9 +302,11 @@ var DIAGNOSTIC_CODES = [
   "same-plane-overlap",
   /** `regular` and `clear` nodes share one GlassGroup (§Material variants). */
   "variant-mixing",
+  /** Two different author tint seeds share one GlassGroup, which is one optics pass (§Material tint). */
+  "tint-mixing",
   /** A group's `mergeDistance` is below its `samplingPadding`, so proxies can double-filter (X1). */
   "merge-distance-below-padding",
-  /** Two groups' padded proxies cover the same pixels, so the filter applies twice (X1). */
+  /** A group's padded proxy samples pixels a neighbouring group paints, so the filter applies twice (X1). */
   "group-proxy-overlap",
   /** A `clear` node has no dimming policy, so it resolved to `regular` instead. */
   "clear-variant-needs-dimming",
@@ -420,10 +422,24 @@ var FRAME_PHASES = ["collect", "read", "update", "write", "render"];
 
 // src/material.ts
 var MATERIAL_VARIANTS = ["regular", "clear"];
+var clamp01 = (value) => Math.min(1, Math.max(0, value));
+function glassTint(color, strength = 1) {
+  return {
+    color: [clamp01(color[0]), clamp01(color[1]), clamp01(color[2])],
+    strength: clamp01(strength)
+  };
+}
+function normaliseTint(tint) {
+  if (tint === null || tint === void 0) return void 0;
+  const normalised = glassTint(tint.color, tint.strength);
+  return normalised.strength === 0 ? void 0 : normalised;
+}
 var DEFAULT_CLEAR_DIMMING = { scrim: 0.28, direction: "darken" };
 function resolveMaterial(request) {
   const { variant, dimming, nodeId, diagnostics } = request;
-  if (variant === "regular") return { variant: "regular", adaptation: "adaptive" };
+  const tint = normaliseTint(request.tint);
+  const tinted = tint === void 0 ? {} : { tint };
+  if (variant === "regular") return { variant: "regular", adaptation: "adaptive", ...tinted };
   if (dimming === void 0) {
     diagnostics?.report({
       code: "clear-variant-needs-dimming",
@@ -431,9 +447,31 @@ function resolveMaterial(request) {
       subjects: [nodeId ?? "*"],
       message: `The clear variant requires a dimming policy (\xA7Material variants); without one its foreground is not guaranteed legible. This surface rendered as regular instead. Supply one on the group's material profile \u2014 DEFAULT_CLEAR_DIMMING is a usable starting point.`
     });
-    return { variant: "regular", adaptation: "adaptive" };
+    return { variant: "regular", adaptation: "adaptive", ...tinted };
   }
-  return { variant: "clear", adaptation: "constrained", dimming };
+  return { variant: "clear", adaptation: "constrained", dimming, ...tinted };
+}
+function sameTint(a, b) {
+  if (a === void 0 || b === void 0) return a === b;
+  return a.strength === b.strength && a.color[0] === b.color[0] && a.color[1] === b.color[1] && a.color[2] === b.color[2];
+}
+function checkTintMixing(check) {
+  const { groupId, members, diagnostics } = check;
+  const tinted = members.filter(
+    (member) => member.tint !== void 0
+  );
+  const distinct = tinted.filter(
+    (member, index) => tinted.findIndex((other) => sameTint(other.tint, member.tint)) === index
+  );
+  if (distinct.length < 2) return false;
+  const name = (list) => list.map((member) => member.nodeId).join(", ");
+  diagnostics?.report({
+    code: "tint-mixing",
+    severity: "warning",
+    subjects: [groupId],
+    message: `Group "${groupId}" asks for ${distinct.length} different tint seeds (${name(tinted)}). A group is one optics pass and carries one seed, so the GPU tier paints them all with the first surface's colour while the CSS tier honours each \u2014 the two tiers will not agree. Apple's guidance is to tint one control rather than several; give a second tinted surface its own GlassGroup if it really needs a different colour.`
+  });
+  return true;
 }
 function checkVariantMixing(check) {
   const { groupId, members, diagnostics } = check;
@@ -475,6 +513,19 @@ function inflateRect(rect, by) {
     height: rect.height + by * 2
   };
 }
+function clipRect(rect, clip) {
+  if (clip === void 0 || clip.length === 0) return rect;
+  let { x, y } = rect;
+  let right = rect.x + rect.width;
+  let bottom = rect.y + rect.height;
+  for (const window of clip) {
+    x = Math.max(x, window.x);
+    y = Math.max(y, window.y);
+    right = Math.min(right, window.x + window.width);
+    bottom = Math.min(bottom, window.y + window.height);
+  }
+  return { x, y, width: Math.max(0, right - x), height: Math.max(0, bottom - y) };
+}
 function rectsOverlap(a, b) {
   if (a.width <= 0 || a.height <= 0 || b.width <= 0 || b.height <= 0) return false;
   return a.x < b.x + b.width && b.x < a.x + a.width && a.y < b.y + b.height && b.y < a.y + a.height;
@@ -553,17 +604,51 @@ function createGlassScene(options) {
   };
   const groupsOfSource = (sourceId) => [...groups.values()].filter((group) => group.descriptor.backdropSourceId === sourceId);
   const nodesOfGroup = (groupId) => [...nodes.values()].filter((node) => node.descriptor.groupId === groupId);
+  const concentricChildrenOf = (nodeId) => [...nodes.values()].filter((node) => node.descriptor.concentricOf?.nodeId === nodeId);
+  function requireConcentricParent(descriptor) {
+    const link = descriptor.concentricOf;
+    if (link === void 0) return;
+    if (link.nodeId === descriptor.id) {
+      throw new GlassSceneError(
+        "in-use",
+        `Glass node "${descriptor.id}" is its own concentric parent. A surface cannot be a level set of its own field.`
+      );
+    }
+    const parent = nodes.get(link.nodeId);
+    if (parent === void 0) {
+      throw unknown("glass node", link.nodeId);
+    }
+    if (parent.descriptor.groupId !== descriptor.groupId) {
+      throw new GlassSceneError(
+        "in-use",
+        `Glass node "${descriptor.id}" is concentric on "${link.nodeId}", which is in group "${parent.descriptor.groupId}" rather than "${descriptor.groupId}". A concentric child is drawn as a level set of its parent's field, and fields are resolved per group (X8 rider 2).`
+      );
+    }
+    const seen = /* @__PURE__ */ new Set([descriptor.id]);
+    let ancestor = link.nodeId;
+    while (ancestor !== void 0) {
+      if (seen.has(ancestor)) {
+        throw new GlassSceneError(
+          "in-use",
+          `Concentric parent "${link.nodeId}" would put glass node "${descriptor.id}" in a cycle (${[...seen].join(" \u2192 ")} \u2192 ${ancestor}). A level set has to bottom out in a shape.`
+        );
+      }
+      seen.add(ancestor);
+      ancestor = nodes.get(ancestor)?.descriptor.concentricOf?.nodeId;
+    }
+  }
   const isRebuildable = (record) => record.descriptor.kind === "texture" && record.dirtyEpoch > record.builtEpoch;
   function capabilityInputs(group, hint) {
     const source = requireSource(group.descriptor.backdropSourceId);
     const pressure = group.governor ?? governor;
+    const probe = group.platform ?? platform;
     return source.descriptor.kind === "texture" ? {
       configuredSource: "texture",
-      platform,
+      platform: probe,
       source: source.descriptor.probe,
       governor: pressure,
       hint
-    } : { configuredSource: "dom", platform, governor: pressure, hint };
+    } : { configuredSource: "dom", platform: probe, governor: pressure, hint };
   }
   const paddingOf = (group) => group.descriptor.samplingPadding ?? DEFAULT_GROUP_SAMPLING.samplingPadding;
   function samplingOf(group) {
@@ -659,6 +744,7 @@ function createGlassScene(options) {
     registerGlassNode(descriptor) {
       if (nodes.has(descriptor.id)) throw duplicate("glass node", descriptor.id);
       requireGroup(descriptor.groupId);
+      requireConcentricParent(descriptor);
       guardFrozenScene(descriptor.id);
       nodes.set(descriptor.id, { descriptor });
     },
@@ -666,12 +752,20 @@ function createGlassScene(options) {
       const record = requireNode(id);
       const descriptor = applyPatch(record.descriptor, patch);
       requireGroup(descriptor.groupId);
+      requireConcentricParent(descriptor);
       guardFrozenScene(id);
       nodes.set(id, { ...record, descriptor });
     },
     removeGlassNode(id) {
       requireNode(id);
       guardFrozenScene(id);
+      const children = concentricChildrenOf(id);
+      if (children.length > 0) {
+        throw new GlassSceneError(
+          "in-use",
+          `Glass node "${id}" is the concentric parent of ${children.map((node) => `"${node.descriptor.id}"`).join(", ")}. A child drawn as a level set of this field has no shape of its own once it is gone \u2014 remove the children first, or clear their \`concentricOf\`.`
+        );
+      }
       nodes.delete(id);
     },
     glassNode(id) {
@@ -690,8 +784,13 @@ function createGlassScene(options) {
       }
       nodes.set(id, { ...record, bounds, ...clip === void 0 ? {} : { clip } });
     },
-    setPlatformProbe(probe) {
-      platform = probe;
+    setPlatformProbe(probe, groupId) {
+      if (groupId === void 0) {
+        platform = probe;
+        return;
+      }
+      const record = requireGroup(groupId);
+      groups.set(groupId, { ...record, platform: probe });
     },
     setSourceProbe(sourceId, probe) {
       const record = requireSource(sourceId);
@@ -790,14 +889,21 @@ function createGlassScene(options) {
         resolvedGroups.push({ groupId, state, hint, foreground, sampling: samplingOf(group) });
         const profile = group.descriptor.material ?? { variant: "regular" };
         const members = nodesOfGroup(groupId);
+        const tinted = [];
         for (const node of members) {
           const nodeId = node.descriptor.id;
+          const declaredTint = node.descriptor.tint === void 0 ? profile.tint : node.descriptor.tint;
           const material = resolveMaterial({
             variant: node.descriptor.variant ?? profile.variant,
             ...profile.dimming === void 0 ? {} : { dimming: profile.dimming },
+            ...declaredTint === void 0 || declaredTint === null ? {} : { tint: declaredTint },
             nodeId,
             diagnostics
           });
+          tinted.push({
+            nodeId,
+            ...material.tint === void 0 ? {} : { tint: material.tint }
+          });
           resolvedNodes.push({
             nodeId,
             groupId,
@@ -817,6 +923,7 @@ function createGlassScene(options) {
             })),
             diagnostics
           });
+          checkTintMixing({ groupId, members: tinted, diagnostics });
         }
       }
       for (const group of settled) groups.set(group.descriptor.id, group);
@@ -831,16 +938,18 @@ function createGlassScene(options) {
       if (!devMode) return [];
       const measured = [...nodes.values()].filter(
         (node) => node.bounds !== void 0
-      );
+      ).map((node) => ({ node, visible: clipRect(node.bounds, node.clip) }));
       const overlaps = [];
       for (let i = 0; i < measured.length; i += 1) {
         for (let j = i + 1; j < measured.length; j += 1) {
-          const a = measured[i];
-          const b = measured[j];
+          const a = measured[i]?.node;
+          const b = measured[j]?.node;
           if (a === void 0 || b === void 0) continue;
           const plane = a.descriptor.zSlot.plane;
           if (plane !== b.descriptor.zSlot.plane) continue;
-          if (!rectsOverlap(a.bounds, b.bounds)) continue;
+          if (!rectsOverlap(measured[i]?.visible ?? a.bounds, measured[j]?.visible ?? b.bounds)) {
+            continue;
+          }
           const nodeIds = [a.descriptor.id, b.descriptor.id];
           overlaps.push({ plane, nodeIds });
           diagnostics.report({
@@ -863,12 +972,14 @@ function createGlassScene(options) {
         for (const node of nodesOfGroup(groupId)) {
           const { bounds } = node;
           if (bounds === void 0) continue;
+          const visible = clipRect(bounds, node.clip);
+          if (visible.width <= 0 || visible.height <= 0) continue;
           const plane = node.descriptor.zSlot.plane;
           const grown = byPlane.get(plane);
-          byPlane.set(plane, grown === void 0 ? bounds : unionRect(grown, bounds));
+          byPlane.set(plane, grown === void 0 ? visible : unionRect(grown, visible));
         }
         for (const [plane, union] of byPlane) {
-          boxes.push({ groupId, plane, box: inflateRect(union, padding) });
+          boxes.push({ groupId, plane, box: inflateRect(union, padding), clipUnion: union });
         }
       }
       const overlaps = [];
@@ -878,14 +989,14 @@ function createGlassScene(options) {
           const b = boxes[j];
           if (a === void 0 || b === void 0) continue;
           if (a.plane !== b.plane || a.groupId === b.groupId) continue;
-          if (!rectsOverlap(a.box, b.box)) continue;
+          if (!rectsOverlap(a.box, b.clipUnion) && !rectsOverlap(b.box, a.clipUnion)) continue;
           const groupIds = [a.groupId, b.groupId];
           overlaps.push({ plane: a.plane, groupIds });
           diagnostics.report({
             code: "group-proxy-overlap",
             severity: "warning",
             subjects: [...groupIds],
-            message: `Groups "${groupIds[0]}" and "${groupIds[1]}" sit close enough in the "${a.plane}" plane that their padded backdrop proxies overlap, and X1 says the filter then applies twice over that region \u2014 paint-order dependent, measured drifting up to 17/255. mergeDistance cannot help: it only unions members inside one group. Either put these surfaces in one group so they share a proxy, or separate them by more than the sum of their samplingPadding.`
+            message: `Groups "${groupIds[0]}" and "${groupIds[1]}" sit close enough in the "${a.plane}" plane that one group's padded backdrop proxy samples the pixels the other group paints, and X1 says the filter then applies twice over them \u2014 paint-order dependent, and steeply distance-dependent: measured at most 3/255 at a 1.5\u03C3 gap, mean 0.43 / max 4 at 1\u03C3, mean 2.56 / max 15 at 0.25\u03C3, and byte-identical zero once the gap reaches the padding. mergeDistance cannot help: it only unions members inside one group. Either put these surfaces in one group so they share a proxy, or separate them by at least the larger group's samplingPadding.`
           });
         }
       }
@@ -981,7 +1092,7 @@ function isHealthy(state) {
 
 // src/renderer-seam.ts
 async function loadWebGPURendererModule() {
-  return import('./dist-FGJI5LQM.js');
+  return import('./dist-RQ4ZMA3D.js');
 }
 async function loadWebGPURenderer() {
   const { createWebGPURenderer } = await loadWebGPURendererModule();
@@ -996,6 +1107,6 @@ var VITREA_CONTRACTS = {
 };
 var RENDERER_TIERS = ["webgpu", "css"];
 
-export { ACCESSIBILITY_BEHAVIOR_TABLE, ACCESSIBILITY_FLAGS, ACCESSIBILITY_PRECEDENCE, DEFAULT_BACKDROP_RESOLUTION, DEFAULT_CLEAR_DIMMING, DEFAULT_GROUP_SAMPLING, DEMOTION_REASONS, DEMOTION_RECOVERY, DIAGNOSTIC_CODES, FOREGROUND_MODES, FRAME_PHASES, GLASS_PLANES, GOVERNOR_PRESSURES, GlassSceneError, HINT_AVAILABILITIES, MATERIAL_VARIANTS, NOMINAL_ACCESSIBILITY_POLICY, OVERRIDABLE_ACCESSIBILITY_FLAGS, RENDERER_TIERS, SAMPLED_ASYNC_DEFAULTS, SAMPLED_ASYNC_RATE_LIMITS, VITREA_CONTRACTS, WEBGPU_AVAILABILITIES, checkVariantMixing, classifyStateChange, compareZSlot, createDiagnosticsChannel, createFrameScheduler, createGlassScene, defaultForegroundAdaptation, inflateRect, isHealthy, loadWebGPURenderer, loadWebGPURendererModule, rectsOverlap, resolveAccessibilityPolicy, resolveBackdropHint, resolveForegroundAdaptation, resolveGlassGroupState, resolveMaterial, unionRect };
+export { ACCESSIBILITY_BEHAVIOR_TABLE, ACCESSIBILITY_FLAGS, ACCESSIBILITY_PRECEDENCE, DEFAULT_BACKDROP_RESOLUTION, DEFAULT_CLEAR_DIMMING, DEFAULT_GROUP_SAMPLING, DEMOTION_REASONS, DEMOTION_RECOVERY, DIAGNOSTIC_CODES, FOREGROUND_MODES, FRAME_PHASES, GLASS_PLANES, GOVERNOR_PRESSURES, GlassSceneError, HINT_AVAILABILITIES, MATERIAL_VARIANTS, NOMINAL_ACCESSIBILITY_POLICY, OVERRIDABLE_ACCESSIBILITY_FLAGS, RENDERER_TIERS, SAMPLED_ASYNC_DEFAULTS, SAMPLED_ASYNC_RATE_LIMITS, VITREA_CONTRACTS, WEBGPU_AVAILABILITIES, checkTintMixing, checkVariantMixing, classifyStateChange, clipRect, compareZSlot, createDiagnosticsChannel, createFrameScheduler, createGlassScene, defaultForegroundAdaptation, glassTint, inflateRect, isHealthy, loadWebGPURenderer, loadWebGPURendererModule, rectsOverlap, resolveAccessibilityPolicy, resolveBackdropHint, resolveForegroundAdaptation, resolveGlassGroupState, resolveMaterial, unionRect };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map