@layoutit/polycss-react 0.2.6 → 0.2.7

package/README.md

@@ -69,7 +69,7 @@ export default function App() {
 ### PolyScene
 
 - `polygons` renders a static `Polygon[]` directly.
-- `directionalLight` and `ambientLight` control scene lighting.
+- `directionalLight`, `pointLights` (direction-only, baked mode; optional per-light `castShadow`), and `ambientLight` control scene lighting.
 - `textureLighting` chooses `"baked"` or `"dynamic"`.
 - `textureQuality` controls atlas raster budget.
 - `strategies` can disable selected render strategies for diagnostics.
@@ -84,7 +84,6 @@ export default function App() {
 - `autoCenter` shifts the mesh bbox center to local origin.
 - `meshResolution` chooses `"lossy"` (default) or `"lossless"` optimization. STL imports use the conservative lossless path in both modes.
 - `castShadow` emits CSS-projected shadows in dynamic lighting mode.
-- Tooling can reuse `buildPolyMeshTransform`, `buildPolySceneTransform`, `worldPositionToPolyCss`, `worldDirectionToPolyCss`, `worldDirectionalLightToPolyCss`, `worldDistanceToPolyCss`, `polyCssDistanceToWorld`, and `polyCssPositionToWorld` for renderer-compatible transforms and world/CSS conversions.
 
 ### Controls
 

package/dist/index.cjs

@@ -2748,6 +2748,7 @@ function PolySceneInner({
   rotY: _rotY,
   zoom: _zoom,
   directionalLight,
+  pointLights,
   ambientLight,
   textureLighting = "baked",
   textureQuality,
@@ -2805,17 +2806,19 @@ function PolySceneInner({
   const sceneBbox = centerInputPolygons ? centerSceneBbox : renderSceneBbox;
   const directionalForAtlas = textureLighting === "dynamic" ? void 0 : directionalLight;
   const ambientForAtlas = textureLighting === "dynamic" ? void 0 : ambientLight;
+  const pointLightsForAtlas = textureLighting === "dynamic" ? void 0 : pointLights;
   const polyContext = (0, import_react14.useMemo)(() => {
     const tileSize = 50;
     return {
       tileSize,
       layerElevation: tileSize,
       directionalLight: directionalForAtlas,
+      pointLights: pointLightsForAtlas,
       ambientLight: ambientForAtlas,
       textureLighting,
       seamBleed
     };
-  }, [directionalForAtlas, ambientForAtlas, textureLighting, seamBleed]);
+  }, [directionalForAtlas, pointLightsForAtlas, ambientForAtlas, textureLighting, seamBleed]);
   const autoCenterOffset = (0, import_react14.useMemo)(() => {
     if (!autoCenter) return [0, 0, 0];
     return [
@@ -3001,6 +3004,7 @@ function PolySceneInner({
     () => ({
       textureLighting,
       directionalLight,
+      pointLights,
       ambientLight,
       strategies,
       seamBleed,
@@ -3017,7 +3021,7 @@ function PolySceneInner({
       groundCssZ,
       sceneEl
     }),
-    [textureLighting, directionalLight, ambientLight, strategies, seamBleed, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, shadow, registerShadowCaster, registerShadowReceiver, shadowCastersVersion, hasShadowReceiver, groundCssZ, sceneEl]
+    [textureLighting, directionalLight, pointLights, ambientLight, strategies, seamBleed, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, shadow, registerShadowCaster, registerShadowReceiver, shadowCastersVersion, hasShadowReceiver, groundCssZ, sceneEl]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(PolySceneContext.Provider, { value: sceneCtxValue, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "div",
@@ -3907,6 +3911,7 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
   onFrameReady,
   castShadow,
   receiveShadow,
+  shadowDefinition,
   merge = true,
   children,
   fallback,
@@ -4175,6 +4180,18 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
       direction: (0, import_polycss_core16.inverseRotateVec3)(cssLight.direction, rot)
     };
   }, [effectiveDirectional, bakedRotation]);
+  const bakedPointLights = (0, import_react16.useMemo)(() => {
+    const pls = sceneCtx?.pointLights;
+    if (!pls || pls.length === 0) return void 0;
+    const pos = position ?? [0, 0, 0];
+    const rot = bakedRotation ?? [0, 0, 0];
+    const hasRot = rot[0] !== 0 || rot[1] !== 0 || rot[2] !== 0;
+    return pls.map((pl) => {
+      const rel = [pl.position[0] - pos[0], pl.position[1] - pos[1], pl.position[2] - pos[2]];
+      const local = hasRot ? (0, import_polycss_core16.inverseRotateVec3)(rel, rot) : rel;
+      return { ...pl, position: local };
+    });
+  }, [sceneCtx?.pointLights, position, bakedRotation]);
   const lightOccludedPolyIndices = void 0;
   const atlasPlans = (0, import_react16.useMemo)(
     () => {
@@ -4193,6 +4210,7 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
         i,
         {
           directionalLight: bakedDirectional,
+          pointLights: bakedPointLights,
           ambientLight: effectiveAmbient,
           seamBleed: seamBleedEdges?.has(i) ? effectiveSeamBleed : void 0,
           seamEdges: seamBleedEdges?.get(i),
@@ -4202,7 +4220,7 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
         basisHints[i]
       ));
     },
-    [renderPolygon, directVoxelEnabled, polygons, bakedDirectional, effectiveAmbient, effectiveSeamBleed, lightOccludedPolyIndices]
+    [renderPolygon, directVoxelEnabled, polygons, bakedDirectional, bakedPointLights, effectiveAmbient, effectiveSeamBleed, lightOccludedPolyIndices]
   );
   const textureAtlas = useTextureAtlas(
     atlasPlans,
@@ -4248,23 +4266,32 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
     }
     return s;
   }, [atlasPlans, polygons]);
+  const shadowCasterRegisteredRef = (0, import_react16.useRef)(false);
+  const lastShadowPolyCountRef = (0, import_react16.useRef)(-1);
   (0, import_react16.useEffect)(() => {
-    if (!sceneRegisterShadowCaster) return;
-    if (castShadow) {
-      sceneRegisterShadowCaster(meshIdRef.current, {
-        polygons,
-        position: position ?? [0, 0, 0],
-        scale,
-        rotation,
-        renderedPolygonIndices
-      });
-    } else {
-      sceneRegisterShadowCaster(meshIdRef.current, null);
-    }
+    if (!sceneRegisterShadowCaster || !castShadow) return;
     return () => {
       sceneRegisterShadowCaster(meshIdRef.current, null);
+      shadowCasterRegisteredRef.current = false;
+      lastShadowPolyCountRef.current = -1;
     };
-  }, [sceneRegisterShadowCaster, castShadow, polygons, position, scale, rotation, renderedPolygonIndices]);
+  }, [sceneRegisterShadowCaster, castShadow]);
+  (0, import_react16.useEffect)(() => {
+    if (!sceneRegisterShadowCaster || !castShadow) return;
+    const followAnimation = sceneCtx?.shadow?.followAnimation ?? false;
+    const topologyChanged = polygons.length !== lastShadowPolyCountRef.current;
+    if (shadowCasterRegisteredRef.current && !followAnimation && !topologyChanged) return;
+    lastShadowPolyCountRef.current = polygons.length;
+    shadowCasterRegisteredRef.current = true;
+    sceneRegisterShadowCaster(meshIdRef.current, {
+      polygons,
+      position: position ?? [0, 0, 0],
+      scale,
+      rotation,
+      renderedPolygonIndices,
+      shadowDefinition
+    });
+  }, [sceneRegisterShadowCaster, castShadow, polygons, position, scale, rotation, renderedPolygonIndices, shadowDefinition, sceneCtx?.shadow]);
   const sceneRegisterShadowReceiver = sceneCtx?.registerShadowReceiver;
   (0, import_react16.useEffect)(() => {
     if (!sceneRegisterShadowReceiver) return;
@@ -4390,6 +4417,16 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
     if (!shadowCasters || shadowCasters.size === 0) return null;
     const userLightDir = sceneDirectionalLight?.direction ?? [0.4, -0.7, 0.59];
     const lightDir = (0, import_polycss_core16.worldDirectionToCss)(userLightDir);
+    const dynamicShading = effectiveTextureLighting === "dynamic";
+    const scenePoints = dynamicShading ? [] : sceneCtx?.pointLights ?? [];
+    const allPointLightsCss = scenePoints.map((pl) => ({
+      position: (0, import_polycss_core16.worldPositionToCss)(pl.position),
+      color: pl.color,
+      intensity: pl.intensity
+    }));
+    const shadowPointIndices = scenePoints.map((pl, i) => pl.castShadow ? i : -1).filter((i) => i >= 0);
+    const runDirectionalShadow = !!sceneDirectionalLight?.direction && (sceneDirectionalLight.intensity ?? 1) > 0;
+    const hasShadowPoints = shadowPointIndices.length > 0;
     const shadowLift = sceneShadow?.lift ?? 1e-3;
     const planes = (0, import_polycss_core16.prepareReceiverFacePlanes)(
       polygons,
@@ -4402,18 +4439,17 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
     if (planes.length === 0) return null;
     const casterInputs = [];
     for (const [casterId, data] of shadowCasters) {
-      const rendered = data.renderedPolygonIndices;
       const items = (0, import_polycss_core16.prepareCasterPolyItems)(
         data.polygons,
         data.position,
         data.scale,
-        rendered ? (idx) => rendered.has(idx) : () => true,
+        () => true,
         data.rotation ?? null
       );
       const isSelf = data.polygons === polygons;
       const selfMap = isSelf ? selfShadowEdgeMap : void 0;
       let edgeOwners;
-      if (!isSelf && data.polygons.length >= 40) {
+      if (!isSelf && (data.polygons.length >= 40 || hasShadowPoints)) {
         const dposArr = data.position;
         const drot = data.rotation ?? null;
         const dsKey = JSON.stringify(data.scale ?? null);
@@ -4426,12 +4462,29 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
         }
         edgeOwners = cachedOwners;
       }
+      let overrideSilhouette;
+      let overridePointSilhouettes;
+      if (sceneShadow?.parametric) {
+        const def = data.shadowDefinition ?? sceneShadow.definition ?? 16;
+        const result = (0, import_polycss_core16.buildParametricCasterOverride)({
+          polysWorldVerts: items.map((it) => it.wv),
+          lightDir,
+          definition: def,
+          isSelf,
+          style: sceneShadow.style,
+          pointLights: shadowPointIndices.map((i) => ({ position: allPointLightsCss[i].position, index: i }))
+        });
+        overrideSilhouette = result.overrideSilhouette;
+        overridePointSilhouettes = result.overridePointSilhouettes;
+      }
       casterInputs.push({
         id: casterId,
         items,
         selfShadowEdgeMap: selfMap,
         edgeOwners,
-        casterPolygonCount: data.polygons.length
+        casterPolygonCount: data.polygons.length,
+        overrideSilhouette,
+        overridePointSilhouettes
       });
     }
     const cameraState = cameraCtx?.store.getState().cameraState;
@@ -4440,27 +4493,31 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
       rotY: cameraState?.rotY ?? 45,
       meshRotation: rotation
     };
-    const specs = (0, import_polycss_core16.computeReceiverShadowFaces)({
+    const faces = (0, import_polycss_core16.computeMergedReceiverShadows)({
       receiverPlanes: planes,
       receiverPolygons: polygons,
       receiverHasTexture: polygons.some((p) => p.texture !== void 0),
       casters: casterInputs,
       lightDir,
+      runDirectional: runDirectionalShadow,
+      pointPasses: shadowPointIndices.map((i) => ({ lightPos: allPointLightsCss[i].position, index: i })),
+      allPointLights: allPointLightsCss,
       cameraRot,
       ambientLight: sceneCtx?.ambientLight,
       directionalLight: sceneDirectionalLight,
       shadow: { color: sceneShadow?.color, opacity: sceneShadow?.opacity ?? 0.25, maxExtend: sceneShadow?.maxExtend }
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: specs.map((spec) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    if (faces.length === 0) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: faces.map((fc) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
       "svg",
       {
         className: "polycss-shadow polycss-shadow-svg polycss-shadow-receiver",
         "data-poly-shadow-type": "receiver",
-        "data-poly-shadow-receiver-face": spec.faceIndex,
-        "data-poly-shadow-receiver-polys": JSON.stringify(spec.memberPolyIndices),
-        width: spec.width,
-        height: spec.height,
-        viewBox: `0 0 ${spec.width} ${spec.height}`,
+        "data-poly-shadow-receiver-face": fc.faceIndex,
+        "data-poly-shadow-receiver-polys": JSON.stringify(fc.memberPolyIndices),
+        width: fc.width,
+        height: fc.height,
+        viewBox: `0 0 ${fc.width} ${fc.height}`,
         style: {
           position: "absolute",
           top: 0,
@@ -4470,25 +4527,27 @@ var PolyMesh = (0, import_react16.forwardRef)(function PolyMesh2({
           transformOrigin: "0 0",
           pointerEvents: "none",
           willChange: "transform",
-          transform: spec.matrixCss
+          opacity: fc.svgOpacity,
+          transform: fc.matrixCss
         },
-        children: spec.paths.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          "path",
-          {
-            d: p.d,
-            fill: spec.fill,
-            stroke: spec.fill,
-            strokeWidth: "3",
-            strokeLinejoin: "round",
-            opacity: spec.opacity.toFixed(4),
-            "data-poly-shadow-caster-polys": JSON.stringify(p.casterPolygonIndices)
-          },
-          i
-        ))
+        children: [
+          fc.baseFill && fc.baseD ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: fc.baseD, fill: fc.baseFill, fillRule: "nonzero" }) : null,
+          fc.layers.map((layer, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            "path",
+            {
+              d: layer.d,
+              fill: layer.fill,
+              fillRule: "nonzero",
+              opacity: layer.opacity !== 1 ? layer.opacity.toFixed(4) : void 0,
+              style: layer.multiply ? { mixBlendMode: "multiply" } : void 0
+            },
+            i
+          ))
+        ]
       },
-      `receiver-${spec.faceIndex}`
+      `receiver-${fc.faceIndex}`
     )) });
-  }, [receiveShadow, shadowCasters, shadowCastersVersion, polygons, position, scale, rotation, sceneDirectionalLight, sceneShadow, sceneCtx?.ambientLight, cameraCtx?.store, cameraTick, selfShadowEdgeMap]);
+  }, [receiveShadow, shadowCasters, shadowCastersVersion, polygons, position, scale, rotation, sceneDirectionalLight, sceneCtx?.pointLights, effectiveTextureLighting, sceneShadow, sceneCtx?.ambientLight, cameraCtx?.store, cameraTick, selfShadowEdgeMap]);
   const portalSceneEl = sceneCtx?.sceneEl ?? null;
   const portaledReceiverShadowSvgs = portalSceneEl && receiverShadowSvgs ? (0, import_react_dom.createPortal)(receiverShadowSvgs, portalSceneEl) : null;
   setPolygonsImplRef.current = (nextPolygons) => {

package/dist/index.d.cts

@@ -2,7 +2,7 @@ import * as React$1 from 'react';
 import React__default, { ReactNode, CSSProperties, MouseEventHandler, PointerEventHandler, FocusEventHandler, KeyboardEventHandler, IframeHTMLAttributes, RefObject, MouseEvent as MouseEvent$1 } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _layoutit_polycss_core from '@layoutit/polycss-core';
-import { Vec3, CameraState, CameraHandle, PolyCameraProjection, PolyTextureImageSource, PolyTexturePresentation, Vec2, PolyMaterial, PolyDirectionalLight, PolyTextureLightingMode, TextureQuality, PolyTextureLeafSizing, PolyTextureImageRendering, PolyTextureBackend, PolyTextureProjection, Polygon, PolyAmbientLight, PolySeamBleed, PolyRenderStrategiesOption, LoadMeshOptions, ParseResult, MeshResolution, BoxPolygonsOptions, ConePolygonsOptions, CylinderPolygonsOptions, DodecahedronPolygonsOptions, IcosahedronPolygonsOptions, OctahedronPolygonsOptions, PlanePolygonsOptions, RingPolygonsOptions, SpherePolygonsOptions, TetrahedronPolygonsOptions, TorusPolygonsOptions, PolyAnimationTarget, PolyAnimationMixer, PolyAnimationClip, PolyAnimationAction, ParseAnimationController } from '@layoutit/polycss-core';
+import { Vec3, CameraState, CameraHandle, PolyCameraProjection, PolyTextureImageSource, PolyTexturePresentation, Vec2, PolyMaterial, PolyDirectionalLight, PolyTextureLightingMode, TextureQuality, PolyTextureLeafSizing, PolyTextureImageRendering, PolyTextureBackend, PolyTextureProjection, Polygon, PolyPointLight, PolyAmbientLight, PolySeamBleed, PolyRenderStrategiesOption, LoadMeshOptions, ParseResult, MeshResolution, BoxPolygonsOptions, ConePolygonsOptions, CylinderPolygonsOptions, DodecahedronPolygonsOptions, IcosahedronPolygonsOptions, OctahedronPolygonsOptions, PlanePolygonsOptions, RingPolygonsOptions, SpherePolygonsOptions, TetrahedronPolygonsOptions, TorusPolygonsOptions, PolyAnimationTarget, PolyAnimationMixer, PolyAnimationClip, PolyAnimationAction, ParseAnimationController } from '@layoutit/polycss-core';
 export { ArrowPolygonsOptions, AutoRotateConfig, AutoRotateOption, AxesHelperOptions, BASE_TILE, BoxFace, BoxFaceOptions, BoxPolygonsOptions, CAMERA_BACKFACE_CULL_EPS, CameraCullNormalGroup, CameraCullRotation, CameraHandle, CameraState, CameraStyleInput, ConePolygonsOptions, CoverPlanarPolygonsOptions, CullInteriorOptions, CylinderPolygonsOptions, DEFAULT_CAMERA_STATE, DEFAULT_PROJECTION, DEFAULT_SEAM_FACET_SPLIT_OPTIONS, DEFAULT_SEAM_OVERLAP_OPTIONS, DodecahedronPolygonsOptions, GltfParseOptions, IcosahedronPolygonsOptions, LoadMeshOptions, LoopMode, LoopOnce, LoopPingPong, LoopRepeat, MeshResolution, MtlParseResult, NormalizeResult, ObjParseOptions, OctahedronPolygonsOptions, OptimizeAnimatedMeshPolygonsOptions, OptimizeMeshParseResultOptions, OptimizeMeshPolygonsOptions, ParseAnimationClip, ParseAnimationController, ParseResult, ParseStlColor, ParseStlSolid, ParseStlTopology, ParsedColor, PlanePolygonsOptions, PolyAmbientLight, PolyAnimationAction, PolyAnimationClip, PolyAnimationMixer, PolyAnimationTarget, PolyCameraProjection, PolyCameraSnapshot, PolyCameraSnapshotOptions, PolyCameraSnapshotSource, PolyDirectionalLight, PolyMaterial, PolyMeshTransformInput, PolyRenderStrategiesOption, PolyRenderStrategy, PolySceneTransformInput, PolyTextureBackend, PolyTextureImageLighting, PolyTextureImageRendering, PolyTextureImageSource, PolyTextureLeafSizing, PolyTextureLightingMode, PolyTexturePresentation, PolyTextureProjection, Polygon, PolygonFace, RingPolygonsOptions, SceneBbox, SceneContext, SceneContextBuildArgs, SceneContextBuildResult, SeamFacetSplitCandidate, SeamFacetSplitCandidateReason, SeamFacetSplitOptions, SeamFacetSplitReport, SeamOverlapCandidate, SeamOverlapCandidateKind, SeamOverlapDiagnostics, SeamOverlapOptions, SimplifyTriangleMeshPolygonsOptions, SolidTextureSampleOptions, StlParseOptions, TetrahedronPolygonsOptions, TexturePaintMetrics, TexturePaintMetricsOptions, TextureTriangle, TorusPolygonsOptions, VOXEL_CAMERA_CULL_AXIS_EPS, VOXEL_CAMERA_CULL_NORMAL_LIMIT, Vec2, Vec3, VoxParseOptions, arrowPolygons, axesHelperPolygons, bakeSolidTextureSampledPolygons, bakeSolidTextureSamples, boxPolygons, buildPolyCameraSceneTransform, buildPolyMeshTransform, buildPolySceneTransform, buildSceneContext, cameraCullNormalGroups, cameraCullNormalGroupsFromPolygons, cameraCullNormalKey, cameraCullVisibleSignature, cameraFacingDepth, capturePolyCameraSnapshot, clampChannel, computeSceneBbox, computeShapeLighting, computeTexturePaintMetrics, conePolygons, coverPlanarPolygons, createIsometricCamera, createPolyAnimationMixer, cssDistanceToWorld, cssPositionToWorld, cullInteriorPolygons, cylinderPolygons, dodecahedronPolygons, formatColor, icosahedronPolygons, inverseRotateVec3, isAxisAlignedSurfaceNormal, isVoxelCameraCullableNormalGroups, loadMesh, mergePolygons, normalFacesCamera, normalizeInvertMultiplier, normalizePolygons, octahedronPolygons, optimizeAnimatedMeshPolygons, optimizeMeshParseResult, optimizeMeshPolygons, parseColor, parseGltf, parseHexColor, parseMtl, parseObj, parsePureColor, parseRgbColor, parseStl, parseVox, planePolygons, polyCameraTargetToCss, polyCssDistanceToWorld, polyCssPositionToWorld, polygonCssSurfaceNormal, polygonFaces, polygonFacesCamera, repairMeshSeams, resolvePolyCameraAppliedPerspectiveStyle, ringPolygons, rotateVec3, seamFacetSplitPolygons, seamFacetSplitReport, seamOverlapDiagnostics, seamOverlapPolygons, seamOverlapReport, shadeColor, simplifyTriangleMeshPolygons, tetrahedronPolygons, torusPolygons, worldDirectionToCss, worldDirectionToPolyCss, worldDirectionalLightToCss, worldDirectionalLightToPolyCss, worldDistanceToCss, worldDistanceToPolyCss, worldPositionToCss, worldPositionToPolyCss } from '@layoutit/polycss-core';
 
 interface PolyPerspectiveCameraProps {
@@ -118,6 +118,32 @@ interface ShadowOptions {
      * disable the cap entirely.
      */
     maxExtend?: number;
+    /**
+     * Cast a low-resolution parametric silhouette per caster instead of its full
+     * geometry — lighter DOM + cheaper projection at the cost of an approximate
+     * outline. Casts onto every receiver through the normal pipeline. Default:
+     * `false`. (Directional + point lights; the exact path stays the default.)
+     */
+    parametric?: boolean;
+    /**
+     * Parametric-shadow detail (max silhouette points / pixel-grid resolution).
+     * Only used when `parametric` is true. Default: `16`. Override per mesh via
+     * `<PolyMesh shadowDefinition>`.
+     */
+    definition?: number;
+    /**
+     * Parametric render style: `"vector"` (smooth contour, default) or `"pixel"`
+     * (greedy-meshed voxel blocks; `definition` becomes the grid resolution).
+     */
+    style?: "vector" | "pixel";
+    /**
+     * Re-emit a caster's shadow while it animates (deforms) so the shadow follows
+     * the pose instead of freezing. Default `false`: a same-topology deform keeps
+     * the last shadow pose (re-emitting every frame is expensive). Best with
+     * `parametric` — a low-res silhouette is cheap to reproject. Topology changes
+     * (different polygon count) always re-emit regardless.
+     */
+    followAnimation?: boolean;
 }
 
 /** Three.js-style transform props accepted by every PolyCSS component. */
@@ -227,6 +253,9 @@ interface PolySceneProps extends TransformProps {
     rotY?: number;
     zoom?: number;
     directionalLight?: PolyDirectionalLight;
+    /** Point lights (world-space positions). Direction-only per-face Lambert,
+     *  baked-mode only. */
+    pointLights?: PolyPointLight[];
     ambientLight?: PolyAmbientLight;
     /** Textured polygon lighting mode. Defaults to "baked". */
     textureLighting?: PolyTextureLightingMode;
@@ -275,7 +304,7 @@ interface PolySceneProps extends TransformProps {
     debugShowLabels?: boolean;
     debugShowBackfaces?: boolean;
 }
-declare function PolySceneInner({ polygons: polygonsProp, centerPolygons: centerPolygonsProp, perspective: _perspective, rotX: _rotX, rotY: _rotY, zoom: _zoom, directionalLight, ambientLight, textureLighting, textureQuality, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, seamBleed, strategies, autoCenter, shadow, className, style, children, position: _position, scale: _scale, rotation: _rotation, debugShowLabels: _debugShowLabels, debugShowBackfaces, }: PolySceneProps): react_jsx_runtime.JSX.Element;
+declare function PolySceneInner({ polygons: polygonsProp, centerPolygons: centerPolygonsProp, perspective: _perspective, rotX: _rotX, rotY: _rotY, zoom: _zoom, directionalLight, pointLights, ambientLight, textureLighting, textureQuality, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, seamBleed, strategies, autoCenter, shadow, className, style, children, position: _position, scale: _scale, rotation: _rotation, debugShowLabels: _debugShowLabels, debugShowBackfaces, }: PolySceneProps): react_jsx_runtime.JSX.Element;
 declare const PolyScene: React$1.MemoExoticComponent<typeof PolySceneInner>;
 
 type UseMeshOptions = LoadMeshOptions;
@@ -511,6 +540,12 @@ interface PolyMeshProps extends TransformProps, InteractionProps {
      * for caster meshes — receivers handle shadow display. Defaults to `false`.
      */
     receiveShadow?: boolean;
+    /**
+     * Per-mesh parametric-shadow detail, overriding the scene's
+     * `shadow.definition` for this mesh's cast/self shadow. Only used when the
+     * scene's `shadow.parametric` is true. Unset → inherit the scene definition.
+     */
+    shadowDefinition?: number;
     /**
      * Apply mesh optimization (coplanar merge + interior cull) before
      * rendering. Defaults to `true` — matches vanilla `scene.add`'s default.

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import * as React$1 from 'react';
 import React__default, { ReactNode, CSSProperties, MouseEventHandler, PointerEventHandler, FocusEventHandler, KeyboardEventHandler, IframeHTMLAttributes, RefObject, MouseEvent as MouseEvent$1 } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _layoutit_polycss_core from '@layoutit/polycss-core';
-import { Vec3, CameraState, CameraHandle, PolyCameraProjection, PolyTextureImageSource, PolyTexturePresentation, Vec2, PolyMaterial, PolyDirectionalLight, PolyTextureLightingMode, TextureQuality, PolyTextureLeafSizing, PolyTextureImageRendering, PolyTextureBackend, PolyTextureProjection, Polygon, PolyAmbientLight, PolySeamBleed, PolyRenderStrategiesOption, LoadMeshOptions, ParseResult, MeshResolution, BoxPolygonsOptions, ConePolygonsOptions, CylinderPolygonsOptions, DodecahedronPolygonsOptions, IcosahedronPolygonsOptions, OctahedronPolygonsOptions, PlanePolygonsOptions, RingPolygonsOptions, SpherePolygonsOptions, TetrahedronPolygonsOptions, TorusPolygonsOptions, PolyAnimationTarget, PolyAnimationMixer, PolyAnimationClip, PolyAnimationAction, ParseAnimationController } from '@layoutit/polycss-core';
+import { Vec3, CameraState, CameraHandle, PolyCameraProjection, PolyTextureImageSource, PolyTexturePresentation, Vec2, PolyMaterial, PolyDirectionalLight, PolyTextureLightingMode, TextureQuality, PolyTextureLeafSizing, PolyTextureImageRendering, PolyTextureBackend, PolyTextureProjection, Polygon, PolyPointLight, PolyAmbientLight, PolySeamBleed, PolyRenderStrategiesOption, LoadMeshOptions, ParseResult, MeshResolution, BoxPolygonsOptions, ConePolygonsOptions, CylinderPolygonsOptions, DodecahedronPolygonsOptions, IcosahedronPolygonsOptions, OctahedronPolygonsOptions, PlanePolygonsOptions, RingPolygonsOptions, SpherePolygonsOptions, TetrahedronPolygonsOptions, TorusPolygonsOptions, PolyAnimationTarget, PolyAnimationMixer, PolyAnimationClip, PolyAnimationAction, ParseAnimationController } from '@layoutit/polycss-core';
 export { ArrowPolygonsOptions, AutoRotateConfig, AutoRotateOption, AxesHelperOptions, BASE_TILE, BoxFace, BoxFaceOptions, BoxPolygonsOptions, CAMERA_BACKFACE_CULL_EPS, CameraCullNormalGroup, CameraCullRotation, CameraHandle, CameraState, CameraStyleInput, ConePolygonsOptions, CoverPlanarPolygonsOptions, CullInteriorOptions, CylinderPolygonsOptions, DEFAULT_CAMERA_STATE, DEFAULT_PROJECTION, DEFAULT_SEAM_FACET_SPLIT_OPTIONS, DEFAULT_SEAM_OVERLAP_OPTIONS, DodecahedronPolygonsOptions, GltfParseOptions, IcosahedronPolygonsOptions, LoadMeshOptions, LoopMode, LoopOnce, LoopPingPong, LoopRepeat, MeshResolution, MtlParseResult, NormalizeResult, ObjParseOptions, OctahedronPolygonsOptions, OptimizeAnimatedMeshPolygonsOptions, OptimizeMeshParseResultOptions, OptimizeMeshPolygonsOptions, ParseAnimationClip, ParseAnimationController, ParseResult, ParseStlColor, ParseStlSolid, ParseStlTopology, ParsedColor, PlanePolygonsOptions, PolyAmbientLight, PolyAnimationAction, PolyAnimationClip, PolyAnimationMixer, PolyAnimationTarget, PolyCameraProjection, PolyCameraSnapshot, PolyCameraSnapshotOptions, PolyCameraSnapshotSource, PolyDirectionalLight, PolyMaterial, PolyMeshTransformInput, PolyRenderStrategiesOption, PolyRenderStrategy, PolySceneTransformInput, PolyTextureBackend, PolyTextureImageLighting, PolyTextureImageRendering, PolyTextureImageSource, PolyTextureLeafSizing, PolyTextureLightingMode, PolyTexturePresentation, PolyTextureProjection, Polygon, PolygonFace, RingPolygonsOptions, SceneBbox, SceneContext, SceneContextBuildArgs, SceneContextBuildResult, SeamFacetSplitCandidate, SeamFacetSplitCandidateReason, SeamFacetSplitOptions, SeamFacetSplitReport, SeamOverlapCandidate, SeamOverlapCandidateKind, SeamOverlapDiagnostics, SeamOverlapOptions, SimplifyTriangleMeshPolygonsOptions, SolidTextureSampleOptions, StlParseOptions, TetrahedronPolygonsOptions, TexturePaintMetrics, TexturePaintMetricsOptions, TextureTriangle, TorusPolygonsOptions, VOXEL_CAMERA_CULL_AXIS_EPS, VOXEL_CAMERA_CULL_NORMAL_LIMIT, Vec2, Vec3, VoxParseOptions, arrowPolygons, axesHelperPolygons, bakeSolidTextureSampledPolygons, bakeSolidTextureSamples, boxPolygons, buildPolyCameraSceneTransform, buildPolyMeshTransform, buildPolySceneTransform, buildSceneContext, cameraCullNormalGroups, cameraCullNormalGroupsFromPolygons, cameraCullNormalKey, cameraCullVisibleSignature, cameraFacingDepth, capturePolyCameraSnapshot, clampChannel, computeSceneBbox, computeShapeLighting, computeTexturePaintMetrics, conePolygons, coverPlanarPolygons, createIsometricCamera, createPolyAnimationMixer, cssDistanceToWorld, cssPositionToWorld, cullInteriorPolygons, cylinderPolygons, dodecahedronPolygons, formatColor, icosahedronPolygons, inverseRotateVec3, isAxisAlignedSurfaceNormal, isVoxelCameraCullableNormalGroups, loadMesh, mergePolygons, normalFacesCamera, normalizeInvertMultiplier, normalizePolygons, octahedronPolygons, optimizeAnimatedMeshPolygons, optimizeMeshParseResult, optimizeMeshPolygons, parseColor, parseGltf, parseHexColor, parseMtl, parseObj, parsePureColor, parseRgbColor, parseStl, parseVox, planePolygons, polyCameraTargetToCss, polyCssDistanceToWorld, polyCssPositionToWorld, polygonCssSurfaceNormal, polygonFaces, polygonFacesCamera, repairMeshSeams, resolvePolyCameraAppliedPerspectiveStyle, ringPolygons, rotateVec3, seamFacetSplitPolygons, seamFacetSplitReport, seamOverlapDiagnostics, seamOverlapPolygons, seamOverlapReport, shadeColor, simplifyTriangleMeshPolygons, tetrahedronPolygons, torusPolygons, worldDirectionToCss, worldDirectionToPolyCss, worldDirectionalLightToCss, worldDirectionalLightToPolyCss, worldDistanceToCss, worldDistanceToPolyCss, worldPositionToCss, worldPositionToPolyCss } from '@layoutit/polycss-core';
 
 interface PolyPerspectiveCameraProps {
@@ -118,6 +118,32 @@ interface ShadowOptions {
      * disable the cap entirely.
      */
     maxExtend?: number;
+    /**
+     * Cast a low-resolution parametric silhouette per caster instead of its full
+     * geometry — lighter DOM + cheaper projection at the cost of an approximate
+     * outline. Casts onto every receiver through the normal pipeline. Default:
+     * `false`. (Directional + point lights; the exact path stays the default.)
+     */
+    parametric?: boolean;
+    /**
+     * Parametric-shadow detail (max silhouette points / pixel-grid resolution).
+     * Only used when `parametric` is true. Default: `16`. Override per mesh via
+     * `<PolyMesh shadowDefinition>`.
+     */
+    definition?: number;
+    /**
+     * Parametric render style: `"vector"` (smooth contour, default) or `"pixel"`
+     * (greedy-meshed voxel blocks; `definition` becomes the grid resolution).
+     */
+    style?: "vector" | "pixel";
+    /**
+     * Re-emit a caster's shadow while it animates (deforms) so the shadow follows
+     * the pose instead of freezing. Default `false`: a same-topology deform keeps
+     * the last shadow pose (re-emitting every frame is expensive). Best with
+     * `parametric` — a low-res silhouette is cheap to reproject. Topology changes
+     * (different polygon count) always re-emit regardless.
+     */
+    followAnimation?: boolean;
 }
 
 /** Three.js-style transform props accepted by every PolyCSS component. */
@@ -227,6 +253,9 @@ interface PolySceneProps extends TransformProps {
     rotY?: number;
     zoom?: number;
     directionalLight?: PolyDirectionalLight;
+    /** Point lights (world-space positions). Direction-only per-face Lambert,
+     *  baked-mode only. */
+    pointLights?: PolyPointLight[];
     ambientLight?: PolyAmbientLight;
     /** Textured polygon lighting mode. Defaults to "baked". */
     textureLighting?: PolyTextureLightingMode;
@@ -275,7 +304,7 @@ interface PolySceneProps extends TransformProps {
     debugShowLabels?: boolean;
     debugShowBackfaces?: boolean;
 }
-declare function PolySceneInner({ polygons: polygonsProp, centerPolygons: centerPolygonsProp, perspective: _perspective, rotX: _rotX, rotY: _rotY, zoom: _zoom, directionalLight, ambientLight, textureLighting, textureQuality, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, seamBleed, strategies, autoCenter, shadow, className, style, children, position: _position, scale: _scale, rotation: _rotation, debugShowLabels: _debugShowLabels, debugShowBackfaces, }: PolySceneProps): react_jsx_runtime.JSX.Element;
+declare function PolySceneInner({ polygons: polygonsProp, centerPolygons: centerPolygonsProp, perspective: _perspective, rotX: _rotX, rotY: _rotY, zoom: _zoom, directionalLight, pointLights, ambientLight, textureLighting, textureQuality, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, seamBleed, strategies, autoCenter, shadow, className, style, children, position: _position, scale: _scale, rotation: _rotation, debugShowLabels: _debugShowLabels, debugShowBackfaces, }: PolySceneProps): react_jsx_runtime.JSX.Element;
 declare const PolyScene: React$1.MemoExoticComponent<typeof PolySceneInner>;
 
 type UseMeshOptions = LoadMeshOptions;
@@ -511,6 +540,12 @@ interface PolyMeshProps extends TransformProps, InteractionProps {
      * for caster meshes — receivers handle shadow display. Defaults to `false`.
      */
     receiveShadow?: boolean;
+    /**
+     * Per-mesh parametric-shadow detail, overriding the scene's
+     * `shadow.definition` for this mesh's cast/self shadow. Only used when the
+     * scene's `shadow.parametric` is true. Unset → inherit the scene definition.
+     */
+    shadowDefinition?: number;
     /**
      * Apply mesh optimization (coplanar merge + interior cull) before
      * rendering. Defaults to `true` — matches vanilla `scene.add`'s default.

package/dist/index.js

@@ -2638,6 +2638,7 @@ function PolySceneInner({
   rotY: _rotY,
   zoom: _zoom,
   directionalLight,
+  pointLights,
   ambientLight,
   textureLighting = "baked",
   textureQuality,
@@ -2695,17 +2696,19 @@ function PolySceneInner({
   const sceneBbox = centerInputPolygons ? centerSceneBbox : renderSceneBbox;
   const directionalForAtlas = textureLighting === "dynamic" ? void 0 : directionalLight;
   const ambientForAtlas = textureLighting === "dynamic" ? void 0 : ambientLight;
+  const pointLightsForAtlas = textureLighting === "dynamic" ? void 0 : pointLights;
   const polyContext = useMemo6(() => {
     const tileSize = 50;
     return {
       tileSize,
       layerElevation: tileSize,
       directionalLight: directionalForAtlas,
+      pointLights: pointLightsForAtlas,
       ambientLight: ambientForAtlas,
       textureLighting,
       seamBleed
     };
-  }, [directionalForAtlas, ambientForAtlas, textureLighting, seamBleed]);
+  }, [directionalForAtlas, pointLightsForAtlas, ambientForAtlas, textureLighting, seamBleed]);
   const autoCenterOffset = useMemo6(() => {
     if (!autoCenter) return [0, 0, 0];
     return [
@@ -2891,6 +2894,7 @@ function PolySceneInner({
     () => ({
       textureLighting,
       directionalLight,
+      pointLights,
       ambientLight,
       strategies,
       seamBleed,
@@ -2907,7 +2911,7 @@ function PolySceneInner({
       groundCssZ,
       sceneEl
     }),
-    [textureLighting, directionalLight, ambientLight, strategies, seamBleed, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, shadow, registerShadowCaster, registerShadowReceiver, shadowCastersVersion, hasShadowReceiver, groundCssZ, sceneEl]
+    [textureLighting, directionalLight, pointLights, ambientLight, strategies, seamBleed, textureLeafSizing, textureImageRendering, textureBackend, textureProjection, shadow, registerShadowCaster, registerShadowReceiver, shadowCastersVersion, hasShadowReceiver, groundCssZ, sceneEl]
   );
   return /* @__PURE__ */ jsx8(PolySceneContext.Provider, { value: sceneCtxValue, children: /* @__PURE__ */ jsxs(
     "div",
@@ -2943,9 +2947,10 @@ import {
 } from "react";
 import {
   BASE_TILE as BASE_TILE3,
+  buildParametricCasterOverride,
   buildPolyMeshTransform,
   buildSharedEdgeMap,
-  computeReceiverShadowFaces,
+  computeMergedReceiverShadows,
   computeSceneBbox,
   DEFAULT_SEAM_BLEED as DEFAULT_SEAM_BLEED2,
   ensureCcw2D,
@@ -2958,7 +2963,8 @@ import {
   prepareReceiverFacePlanes,
   projectCssVertexToGround,
   resolvePolyTextureLeafGeometry as resolvePolyTextureLeafGeometry2,
-  worldDirectionToCss as worldDirectionToCss2
+  worldDirectionToCss as worldDirectionToCss2,
+  worldPositionToCss
 } from "@layoutit/polycss-core";
 
 // src/scene/useMesh.ts
@@ -3835,6 +3841,7 @@ var PolyMesh = forwardRef(function PolyMesh2({
   onFrameReady,
   castShadow,
   receiveShadow,
+  shadowDefinition,
   merge = true,
   children,
   fallback,
@@ -4103,6 +4110,18 @@ var PolyMesh = forwardRef(function PolyMesh2({
       direction: inverseRotateVec3(cssLight.direction, rot)
     };
   }, [effectiveDirectional, bakedRotation]);
+  const bakedPointLights = useMemo7(() => {
+    const pls = sceneCtx?.pointLights;
+    if (!pls || pls.length === 0) return void 0;
+    const pos = position ?? [0, 0, 0];
+    const rot = bakedRotation ?? [0, 0, 0];
+    const hasRot = rot[0] !== 0 || rot[1] !== 0 || rot[2] !== 0;
+    return pls.map((pl) => {
+      const rel = [pl.position[0] - pos[0], pl.position[1] - pos[1], pl.position[2] - pos[2]];
+      const local = hasRot ? inverseRotateVec3(rel, rot) : rel;
+      return { ...pl, position: local };
+    });
+  }, [sceneCtx?.pointLights, position, bakedRotation]);
   const lightOccludedPolyIndices = void 0;
   const atlasPlans = useMemo7(
     () => {
@@ -4121,6 +4140,7 @@ var PolyMesh = forwardRef(function PolyMesh2({
         i,
         {
           directionalLight: bakedDirectional,
+          pointLights: bakedPointLights,
           ambientLight: effectiveAmbient,
           seamBleed: seamBleedEdges?.has(i) ? effectiveSeamBleed : void 0,
           seamEdges: seamBleedEdges?.get(i),
@@ -4130,7 +4150,7 @@ var PolyMesh = forwardRef(function PolyMesh2({
         basisHints[i]
       ));
     },
-    [renderPolygon, directVoxelEnabled, polygons, bakedDirectional, effectiveAmbient, effectiveSeamBleed, lightOccludedPolyIndices]
+    [renderPolygon, directVoxelEnabled, polygons, bakedDirectional, bakedPointLights, effectiveAmbient, effectiveSeamBleed, lightOccludedPolyIndices]
   );
   const textureAtlas = useTextureAtlas(
     atlasPlans,
@@ -4176,23 +4196,32 @@ var PolyMesh = forwardRef(function PolyMesh2({
     }
     return s;
   }, [atlasPlans, polygons]);
+  const shadowCasterRegisteredRef = useRef6(false);
+  const lastShadowPolyCountRef = useRef6(-1);
   useEffect5(() => {
-    if (!sceneRegisterShadowCaster) return;
-    if (castShadow) {
-      sceneRegisterShadowCaster(meshIdRef.current, {
-        polygons,
-        position: position ?? [0, 0, 0],
-        scale,
-        rotation,
-        renderedPolygonIndices
-      });
-    } else {
-      sceneRegisterShadowCaster(meshIdRef.current, null);
-    }
+    if (!sceneRegisterShadowCaster || !castShadow) return;
     return () => {
       sceneRegisterShadowCaster(meshIdRef.current, null);
+      shadowCasterRegisteredRef.current = false;
+      lastShadowPolyCountRef.current = -1;
     };
-  }, [sceneRegisterShadowCaster, castShadow, polygons, position, scale, rotation, renderedPolygonIndices]);
+  }, [sceneRegisterShadowCaster, castShadow]);
+  useEffect5(() => {
+    if (!sceneRegisterShadowCaster || !castShadow) return;
+    const followAnimation = sceneCtx?.shadow?.followAnimation ?? false;
+    const topologyChanged = polygons.length !== lastShadowPolyCountRef.current;
+    if (shadowCasterRegisteredRef.current && !followAnimation && !topologyChanged) return;
+    lastShadowPolyCountRef.current = polygons.length;
+    shadowCasterRegisteredRef.current = true;
+    sceneRegisterShadowCaster(meshIdRef.current, {
+      polygons,
+      position: position ?? [0, 0, 0],
+      scale,
+      rotation,
+      renderedPolygonIndices,
+      shadowDefinition
+    });
+  }, [sceneRegisterShadowCaster, castShadow, polygons, position, scale, rotation, renderedPolygonIndices, shadowDefinition, sceneCtx?.shadow]);
   const sceneRegisterShadowReceiver = sceneCtx?.registerShadowReceiver;
   useEffect5(() => {
     if (!sceneRegisterShadowReceiver) return;
@@ -4318,6 +4347,16 @@ var PolyMesh = forwardRef(function PolyMesh2({
     if (!shadowCasters || shadowCasters.size === 0) return null;
     const userLightDir = sceneDirectionalLight?.direction ?? [0.4, -0.7, 0.59];
     const lightDir = worldDirectionToCss2(userLightDir);
+    const dynamicShading = effectiveTextureLighting === "dynamic";
+    const scenePoints = dynamicShading ? [] : sceneCtx?.pointLights ?? [];
+    const allPointLightsCss = scenePoints.map((pl) => ({
+      position: worldPositionToCss(pl.position),
+      color: pl.color,
+      intensity: pl.intensity
+    }));
+    const shadowPointIndices = scenePoints.map((pl, i) => pl.castShadow ? i : -1).filter((i) => i >= 0);
+    const runDirectionalShadow = !!sceneDirectionalLight?.direction && (sceneDirectionalLight.intensity ?? 1) > 0;
+    const hasShadowPoints = shadowPointIndices.length > 0;
     const shadowLift = sceneShadow?.lift ?? 1e-3;
     const planes = prepareReceiverFacePlanes(
       polygons,
@@ -4330,18 +4369,17 @@ var PolyMesh = forwardRef(function PolyMesh2({
     if (planes.length === 0) return null;
     const casterInputs = [];
     for (const [casterId, data] of shadowCasters) {
-      const rendered = data.renderedPolygonIndices;
       const items = prepareCasterPolyItems(
         data.polygons,
         data.position,
         data.scale,
-        rendered ? (idx) => rendered.has(idx) : () => true,
+        () => true,
         data.rotation ?? null
       );
       const isSelf = data.polygons === polygons;
       const selfMap = isSelf ? selfShadowEdgeMap : void 0;
       let edgeOwners;
-      if (!isSelf && data.polygons.length >= 40) {
+      if (!isSelf && (data.polygons.length >= 40 || hasShadowPoints)) {
         const dposArr = data.position;
         const drot = data.rotation ?? null;
         const dsKey = JSON.stringify(data.scale ?? null);
@@ -4354,12 +4392,29 @@ var PolyMesh = forwardRef(function PolyMesh2({
         }
         edgeOwners = cachedOwners;
       }
+      let overrideSilhouette;
+      let overridePointSilhouettes;
+      if (sceneShadow?.parametric) {
+        const def = data.shadowDefinition ?? sceneShadow.definition ?? 16;
+        const result = buildParametricCasterOverride({
+          polysWorldVerts: items.map((it) => it.wv),
+          lightDir,
+          definition: def,
+          isSelf,
+          style: sceneShadow.style,
+          pointLights: shadowPointIndices.map((i) => ({ position: allPointLightsCss[i].position, index: i }))
+        });
+        overrideSilhouette = result.overrideSilhouette;
+        overridePointSilhouettes = result.overridePointSilhouettes;
+      }
       casterInputs.push({
         id: casterId,
         items,
         selfShadowEdgeMap: selfMap,
         edgeOwners,
-        casterPolygonCount: data.polygons.length
+        casterPolygonCount: data.polygons.length,
+        overrideSilhouette,
+        overridePointSilhouettes
       });
     }
     const cameraState = cameraCtx?.store.getState().cameraState;
@@ -4368,27 +4423,31 @@ var PolyMesh = forwardRef(function PolyMesh2({
       rotY: cameraState?.rotY ?? 45,
       meshRotation: rotation
     };
-    const specs = computeReceiverShadowFaces({
+    const faces = computeMergedReceiverShadows({
       receiverPlanes: planes,
       receiverPolygons: polygons,
       receiverHasTexture: polygons.some((p) => p.texture !== void 0),
       casters: casterInputs,
       lightDir,
+      runDirectional: runDirectionalShadow,
+      pointPasses: shadowPointIndices.map((i) => ({ lightPos: allPointLightsCss[i].position, index: i })),
+      allPointLights: allPointLightsCss,
       cameraRot,
       ambientLight: sceneCtx?.ambientLight,
       directionalLight: sceneDirectionalLight,
       shadow: { color: sceneShadow?.color, opacity: sceneShadow?.opacity ?? 0.25, maxExtend: sceneShadow?.maxExtend }
     });
-    return /* @__PURE__ */ jsx9(Fragment, { children: specs.map((spec) => /* @__PURE__ */ jsx9(
+    if (faces.length === 0) return null;
+    return /* @__PURE__ */ jsx9(Fragment, { children: faces.map((fc) => /* @__PURE__ */ jsxs2(
       "svg",
       {
         className: "polycss-shadow polycss-shadow-svg polycss-shadow-receiver",
         "data-poly-shadow-type": "receiver",
-        "data-poly-shadow-receiver-face": spec.faceIndex,
-        "data-poly-shadow-receiver-polys": JSON.stringify(spec.memberPolyIndices),
-        width: spec.width,
-        height: spec.height,
-        viewBox: `0 0 ${spec.width} ${spec.height}`,
+        "data-poly-shadow-receiver-face": fc.faceIndex,
+        "data-poly-shadow-receiver-polys": JSON.stringify(fc.memberPolyIndices),
+        width: fc.width,
+        height: fc.height,
+        viewBox: `0 0 ${fc.width} ${fc.height}`,
         style: {
           position: "absolute",
           top: 0,
@@ -4398,25 +4457,27 @@ var PolyMesh = forwardRef(function PolyMesh2({
           transformOrigin: "0 0",
           pointerEvents: "none",
           willChange: "transform",
-          transform: spec.matrixCss
+          opacity: fc.svgOpacity,
+          transform: fc.matrixCss
         },
-        children: spec.paths.map((p, i) => /* @__PURE__ */ jsx9(
-          "path",
-          {
-            d: p.d,
-            fill: spec.fill,
-            stroke: spec.fill,
-            strokeWidth: "3",
-            strokeLinejoin: "round",
-            opacity: spec.opacity.toFixed(4),
-            "data-poly-shadow-caster-polys": JSON.stringify(p.casterPolygonIndices)
-          },
-          i
-        ))
+        children: [
+          fc.baseFill && fc.baseD ? /* @__PURE__ */ jsx9("path", { d: fc.baseD, fill: fc.baseFill, fillRule: "nonzero" }) : null,
+          fc.layers.map((layer, i) => /* @__PURE__ */ jsx9(
+            "path",
+            {
+              d: layer.d,
+              fill: layer.fill,
+              fillRule: "nonzero",
+              opacity: layer.opacity !== 1 ? layer.opacity.toFixed(4) : void 0,
+              style: layer.multiply ? { mixBlendMode: "multiply" } : void 0
+            },
+            i
+          ))
+        ]
       },
-      `receiver-${spec.faceIndex}`
+      `receiver-${fc.faceIndex}`
     )) });
-  }, [receiveShadow, shadowCasters, shadowCastersVersion, polygons, position, scale, rotation, sceneDirectionalLight, sceneShadow, sceneCtx?.ambientLight, cameraCtx?.store, cameraTick, selfShadowEdgeMap]);
+  }, [receiveShadow, shadowCasters, shadowCastersVersion, polygons, position, scale, rotation, sceneDirectionalLight, sceneCtx?.pointLights, effectiveTextureLighting, sceneShadow, sceneCtx?.ambientLight, cameraCtx?.store, cameraTick, selfShadowEdgeMap]);
   const portalSceneEl = sceneCtx?.sceneEl ?? null;
   const portaledReceiverShadowSvgs = portalSceneEl && receiverShadowSvgs ? createPortal(receiverShadowSvgs, portalSceneEl) : null;
   setPolygonsImplRef.current = (nextPolygons) => {
@@ -7819,7 +7880,7 @@ import {
   worldDirectionalLightToPolyCss,
   worldDistanceToCss,
   worldDistanceToPolyCss,
-  worldPositionToCss,
+  worldPositionToCss as worldPositionToCss2,
   worldPositionToPolyCss,
   BASE_TILE as BASE_TILE7,
   DEFAULT_CAMERA_STATE as DEFAULT_CAMERA_STATE2,
@@ -7968,6 +8029,6 @@ export {
   worldDirectionalLightToPolyCss,
   worldDistanceToCss,
   worldDistanceToPolyCss,
-  worldPositionToCss,
+  worldPositionToCss2 as worldPositionToCss,
   worldPositionToPolyCss
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@layoutit/polycss-react",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "description": "React components for the CSS-based polygon mesh rendering engine",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -41,7 +41,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@layoutit/polycss-core": "^0.2.6"
+    "@layoutit/polycss-core": "^0.2.7"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",