@blorkfield/overlay-core 0.5.5 → 0.5.7

package/dist/index.d.cts

@@ -31,11 +31,22 @@ interface FloorConfig {
      */
     threshold?: number | number[];
     /**
-     * Thickness of floor segments in pixels:
+     * Thickness of floor segments in pixels (collision body height):
      * - number: Same thickness for all segments (default: 50)
      * - number[]: Per-segment thickness (segment 0 uses value[0], etc.)
      */
     thickness?: number | number[];
+    /**
+     * Visible thickness of floor segments in pixels.
+     * When set, only this many pixels are visible above the canvas bottom,
+     * while the remaining (thickness - visibleThickness) extends below as hidden collision.
+     * - number: Same visible thickness for all segments (default: same as thickness)
+     * - number[]: Per-segment visible thickness (segment 0 uses value[0], etc.)
+     *
+     * Example: thickness=15, visibleThickness=2 creates a 15px collision body
+     * but only shows 2px, with 13px of hidden collision below the canvas.
+     */
+    visibleThickness?: number | number[];
     /**
      * Color of floor segments (visible when set):
      * - string: Same color for all segments

package/dist/index.d.ts

@@ -31,11 +31,22 @@ interface FloorConfig {
      */
     threshold?: number | number[];
     /**
-     * Thickness of floor segments in pixels:
+     * Thickness of floor segments in pixels (collision body height):
      * - number: Same thickness for all segments (default: 50)
      * - number[]: Per-segment thickness (segment 0 uses value[0], etc.)
      */
     thickness?: number | number[];
+    /**
+     * Visible thickness of floor segments in pixels.
+     * When set, only this many pixels are visible above the canvas bottom,
+     * while the remaining (thickness - visibleThickness) extends below as hidden collision.
+     * - number: Same visible thickness for all segments (default: same as thickness)
+     * - number[]: Per-segment visible thickness (segment 0 uses value[0], etc.)
+     *
+     * Example: thickness=15, visibleThickness=2 creates a 15px collision body
+     * but only shows 2px, with 13px of hidden collision below the canvas.
+     */
+    visibleThickness?: number | number[];
     /**
      * Color of floor segments (visible when set):
      * - string: Same color for all segments

package/dist/index.js

@@ -497,9 +497,10 @@ function createBoundariesWithFloorConfig(bounds, floorConfig) {
   for (let i = 0; i < segmentCount; i++) {
     const segmentWidth = segmentWidths[i];
     const thickness = floorConfig?.thickness !== void 0 ? Array.isArray(floorConfig.thickness) ? floorConfig.thickness[i] ?? BOUNDARY_THICKNESS : floorConfig.thickness : BOUNDARY_THICKNESS;
+    const visibleThickness = floorConfig?.visibleThickness !== void 0 ? Array.isArray(floorConfig.visibleThickness) ? floorConfig.visibleThickness[i] ?? thickness : floorConfig.visibleThickness : thickness;
     const color = floorConfig?.color !== void 0 ? Array.isArray(floorConfig.color) ? floorConfig.color[i] : floorConfig.color : void 0;
     const segmentX = currentX + segmentWidth / 2;
-    const segmentY = bounds.bottom - thickness / 2;
+    const segmentY = bounds.bottom - visibleThickness + thickness / 2;
     const segmentOptions = {
       isStatic: true,
       label: `floor-segment-${i}`,
@@ -1514,9 +1515,21 @@ var OverlayScene = class {
       const { x, y } = entry.originalPosition;
       const width = entry.domElement.offsetWidth;
       const height = entry.domElement.offsetHeight;
-      shadowElement.style.left = `${x - width / 2}px`;
-      shadowElement.style.top = `${y - height / 2}px`;
-      shadowElement.style.transform = "rotate(0deg)";
+      const computedLeft = x - width / 2;
+      const computedTop = y - height / 2;
+      console.log("[Shadow Debug]", {
+        originalPosition: { x, y },
+        elementSize: { width, height },
+        computedPosition: { left: computedLeft, top: computedTop },
+        elementCurrentStyle: {
+          left: entry.domElement.style.left,
+          top: entry.domElement.style.top,
+          transform: entry.domElement.style.transform
+        }
+      });
+      shadowElement.style.setProperty("left", `${computedLeft}px`, "important");
+      shadowElement.style.setProperty("top", `${computedTop}px`, "important");
+      shadowElement.style.setProperty("transform", "rotate(0deg)", "important");
       entry.domElement.parentNode?.insertBefore(shadowElement, entry.domElement);
       entry.domShadowElement = shadowElement;
       return;