@layoutit/polycss-react 0.2.6 → 0.2.8

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
 };