@promptbook/components 0.112.0-103 → 0.112.0-105

package/umd/index.umd.js

@@ -31,7 +31,7 @@
      * @generated
      * @see https://github.com/webgptorg/promptbook
      */
-    const PROMPTBOOK_ENGINE_VERSION = '0.112.0-103';
+    const PROMPTBOOK_ENGINE_VERSION = '0.112.0-105';
     /**
      * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
      * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -3243,7 +3243,7 @@
      *
      * @private helper of `minecraft2AvatarVisual`
      */
-    const LIGHT_DIRECTION$2 = normalizeVector3({
+    const LIGHT_DIRECTION$3 = normalizeVector3({
         x: 0.4,
         y: -0.65,
         z: 0.92,
@@ -3455,7 +3455,7 @@
                 corners: projectedCorners,
                 texture: faceDefinition.texture,
                 averageDepth: transformedCorners.reduce((depthSum, corner) => depthSum + corner.z, 0) / transformedCorners.length,
-                lightIntensity: clampNumber$1(dotProduct3D(faceNormal, LIGHT_DIRECTION$2), -1, 1),
+                lightIntensity: clampNumber$1(dotProduct3D(faceNormal, LIGHT_DIRECTION$3), -1, 1),
                 outlineColor: cuboid.outlineColor,
             };
         });
@@ -4646,7 +4646,7 @@
      *
      * @private helper of `octopus3dAvatarVisual`
      */
-    const LIGHT_DIRECTION$1 = normalizeVector3({
+    const LIGHT_DIRECTION$2 = normalizeVector3({
         x: 0.48,
         y: -0.62,
         z: 0.94,
@@ -4856,7 +4856,7 @@
                     corners: projectedCorners,
                     averageDepth: transformedCorners.reduce((depthSum, transformedCorner) => depthSum + transformedCorner.z, 0) /
                         transformedCorners.length,
-                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$1), -1, 1),
+                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$2), -1, 1),
                     fillStyle: resolveSurfacePatchFillStyle(palette, verticalProgress + verticalColorBias),
                     outlineColor,
                 });
@@ -5045,7 +5045,7 @@
      *
      * @private helper of `octopus3d2AvatarVisual`
      */
-    const LIGHT_DIRECTION = normalizeVector3({
+    const LIGHT_DIRECTION$1 = normalizeVector3({
         x: 0.38,
         y: -0.6,
         z: 0.98,
@@ -5194,7 +5194,7 @@
                     corners: projectedCorners,
                     averageDepth: transformedCorners.reduce((depthSum, transformedCorner) => depthSum + transformedCorner.z, 0) /
                         transformedCorners.length,
-                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION), -1, 1),
+                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$1), -1, 1),
                     fillStyle: resolveBlobbySurfacePatchFillStyle(palette, verticalProgress, Math.max(0, Math.cos(centerLongitude)), resolveLowerLobeWave(centerLongitude, morphologyProfile, animationPhase, timeMs)),
                     outlineColor: verticalProgress < 0.58 ? `${palette.highlight}73` : `${palette.shadow}8a`,
                 });
@@ -5294,6 +5294,514 @@
         context.restore();
     }
 
+    /* eslint-disable no-magic-numbers */
+    /**
+     * Light direction used by the continuous octopus mesh shading.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    const LIGHT_DIRECTION = normalizeVector3({
+        x: 0.34,
+        y: -0.62,
+        z: 1,
+    });
+    /**
+     * Real-octopus tentacle count used by the continuous lower mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    const OCTOPUS_TENTACLE_COUNT = 8;
+    /**
+     * Octopus 3D 3 avatar visual.
+     *
+     * @private built-in avatar visual
+     */
+    const octopus3d3AvatarVisual = {
+        id: 'octopus3d3',
+        title: 'Octopus 3D 3',
+        description: 'Cute continuous 3D octopus with a blobby single mesh, waving tentacle lobes, rich shading, and cursor-aware eyes.',
+        isAnimated: true,
+        supportsPointerTracking: true,
+        render({ context, size, palette, createRandom, timeMs, interaction }) {
+            const morphologyProfile = createOctopus3MorphologyProfile(createRandom);
+            const animationRandom = createRandom('octopus3d3-animation-profile');
+            const eyeRandom = createRandom('octopus3d3-eye-profile');
+            const animationPhase = animationRandom() * Math.PI * 2;
+            const tentacleProfiles = createContinuousTentacleProfiles(createRandom, morphologyProfile);
+            const sceneCenterX = size * 0.5;
+            const sceneCenterY = size * 0.535;
+            const bob = Math.sin(timeMs / 960 + animationPhase) * size * 0.012;
+            const meshCenter = {
+                x: interaction.bodyOffsetX * size * 0.048 + size * morphologyProfile.body.centerXJitterRatio * 0.44,
+                y: -size * 0.07 + interaction.bodyOffsetY * size * 0.026 + bob,
+                z: interaction.intensity * size * 0.018,
+            };
+            const rotationY = -0.1 +
+                Math.sin(timeMs / 2700 + animationPhase) * 0.035 +
+                interaction.bodyOffsetX * 0.22 +
+                interaction.gazeX * 0.88;
+            const rotationX = -0.07 +
+                Math.cos(timeMs / 3100 + animationPhase * 0.7) * 0.018 -
+                interaction.bodyOffsetY * 0.08 -
+                interaction.gazeY * 0.38;
+            const surfaceOptions = {
+                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.1,
+                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.08,
+                radiusZ: size *
+                    morphologyProfile.body.bodyRadiusRatio *
+                    (1.02 + (morphologyProfile.body.horizontalStretch - 1) * 0.18),
+                morphologyProfile,
+                timeMs,
+                animationPhase,
+                tentacleProfiles,
+            };
+            const surfacePatches = resolveVisibleContinuousOctopusPatches({
+                ...surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+            });
+            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.2 - 0.03, -0.22, 0.08);
+            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.1, 0.18, 0.32);
+            const mouthLatitude = clampNumber$1(eyeLatitude + 0.2 + morphologyProfile.face.mouthYOffsetRatio, 0.08, 0.34);
+            const mouthCenterLongitude = clampNumber$1(morphologyProfile.face.mouthCenterOffsetRatio * 5.6, -0.08, 0.08);
+            const mouthHalfLongitude = clampNumber$1(eyeLongitude * 0.78, 0.15, 0.28);
+            const mouthCurveLatitude = clampNumber$1(mouthLatitude + morphologyProfile.face.mouthCurveDepthRatio * 0.78, mouthLatitude + 0.03, 0.42);
+            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.76;
+            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.9;
+            drawAvatarFrame(context, size, palette);
+            drawContinuousOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
+            drawContinuousOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile);
+            for (const surfacePatch of surfacePatches.sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
+                drawContinuousSurfacePatch(context, surfacePatch);
+            }
+            drawProjectedSurfaceCurrents({
+                context,
+                surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+                morphologyProfile,
+                timeMs,
+                animationPhase,
+            });
+            drawProjectedTentacleSuckers({
+                context,
+                surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+            });
+            drawProjectedOrganicEye(context, sampleContinuousOctopusSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + eyeRandom() * 0.7, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedOrganicEye(context, sampleContinuousOctopusSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.85 + eyeRandom() * 0.7, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedOrganicMouth(context, [
+                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
+                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
+                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
+            ], meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, palette, size);
+        },
+    };
+    /**
+     * Creates seeded tentacle-lobe profiles around the visible lower octopus body.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function createContinuousTentacleProfiles(createRandom, morphologyProfile) {
+        return Array.from({ length: OCTOPUS_TENTACLE_COUNT }, (_, tentacleIndex) => {
+            const tentacleRandom = createRandom(`octopus3d3-tentacle-${tentacleIndex}`);
+            const progress = tentacleIndex / (OCTOPUS_TENTACLE_COUNT - 1);
+            return {
+                centerLongitude: -Math.PI * 0.86 +
+                    progress * Math.PI * 1.72 +
+                    (tentacleRandom() - 0.5) * (0.08 + morphologyProfile.tentacles.rootSpreadScale * 0.03),
+                widthScale: 0.86 + tentacleRandom() * 0.34 + (morphologyProfile.tentacles.baseWidthScale - 1) * 0.16,
+                lengthScale: 0.86 + tentacleRandom() * 0.36 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.22,
+                swayScale: 0.82 + tentacleRandom() * 0.38 + (morphologyProfile.tentacles.swayScale - 1) * 0.2,
+                depthScale: 0.86 + tentacleRandom() * 0.32 + (morphologyProfile.tentacles.tipReachScale - 1) * 0.2,
+                phase: tentacleRandom() * Math.PI * 2,
+                suckerSide: tentacleRandom() > 0.5 ? 1 : -1,
+            };
+        });
+    }
+    /**
+     * Draws the soft underwater atmosphere behind the continuous octopus mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawContinuousOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
+        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.11, sceneCenterY - size * 0.17 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY, size * (0.66 + interaction.intensity * 0.02));
+        glowGradient.addColorStop(0, `${palette.highlight}66`);
+        glowGradient.addColorStop(0.34, `${palette.accent}2e`);
+        glowGradient.addColorStop(1, `${palette.highlight}00`);
+        context.fillStyle = glowGradient;
+        context.fillRect(0, 0, size, size);
+        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1550) * size * 0.05, sceneCenterY + size * 0.29, size * 0.06, sceneCenterX, sceneCenterY + size * 0.3, size * 0.54);
+        lowerGradient.addColorStop(0, `${palette.secondary}25`);
+        lowerGradient.addColorStop(1, `${palette.secondary}00`);
+        context.fillStyle = lowerGradient;
+        context.fillRect(0, 0, size, size);
+    }
+    /**
+     * Draws the soft lower shadow that anchors the octopus in the avatar frame.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawContinuousOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
+        context.save();
+        context.fillStyle = `${palette.shadow}66`;
+        context.filter = `blur(${size * 0.025}px)`;
+        context.beginPath();
+        context.ellipse(size * 0.5 + interaction.gazeX * size * 0.045, size * 0.9 + Math.sin(timeMs / 980) * size * 0.007, size * (0.19 + morphologyProfile.tentacles.rootSpreadScale * 0.022 + interaction.intensity * 0.02), size * 0.06, 0, 0, Math.PI * 2);
+        context.fill();
+        context.restore();
+    }
+    /**
+     * Resolves visible projected patches for the continuous octopus mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function resolveVisibleContinuousOctopusPatches(options) {
+        const { center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette } = options;
+        const latitudePatchCount = 16;
+        const longitudePatchCount = 40;
+        const surfacePatches = [];
+        for (let latitudeIndex = 0; latitudeIndex < latitudePatchCount; latitudeIndex++) {
+            const startLatitude = -Math.PI / 2 + (latitudeIndex / latitudePatchCount) * Math.PI;
+            const endLatitude = -Math.PI / 2 + ((latitudeIndex + 1) / latitudePatchCount) * Math.PI;
+            const centerLatitude = (startLatitude + endLatitude) / 2;
+            const verticalProgress = (Math.sin(centerLatitude) + 1) / 2;
+            for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
+                const startLongitude = -Math.PI + (longitudeIndex / longitudePatchCount) * Math.PI * 2;
+                const endLongitude = -Math.PI + ((longitudeIndex + 1) / longitudePatchCount) * Math.PI * 2;
+                const centerLongitude = (startLongitude + endLongitude) / 2;
+                const localCorners = [
+                    sampleContinuousOctopusSurfacePoint(options, startLatitude, startLongitude),
+                    sampleContinuousOctopusSurfacePoint(options, startLatitude, endLongitude),
+                    sampleContinuousOctopusSurfacePoint(options, endLatitude, endLongitude),
+                    sampleContinuousOctopusSurfacePoint(options, endLatitude, startLongitude),
+                ];
+                const transformedCorners = localCorners.map((localCorner) => transformScenePoint(localCorner, center, rotationX, rotationY));
+                const surfaceNormal = normalizeVector3(crossProduct3D(subtractPoint3D(transformedCorners[1], transformedCorners[0]), subtractPoint3D(transformedCorners[2], transformedCorners[0])));
+                if (surfaceNormal.z <= 0.008) {
+                    continue;
+                }
+                const projectedCorners = transformedCorners.map((transformedCorner) => projectScenePoint(transformedCorner, size, sceneCenterX, sceneCenterY));
+                const tentacleInfluence = resolveContinuousTentacleInfluence(options, centerLongitude);
+                const lowerLobeWave = resolveContinuousLobeWave(options, centerLongitude);
+                surfacePatches.push({
+                    corners: projectedCorners,
+                    averageDepth: transformedCorners.reduce((depthSum, transformedCorner) => depthSum + transformedCorner.z, 0) /
+                        transformedCorners.length,
+                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION), -1, 1),
+                    fillStyle: resolveContinuousSurfacePatchFillStyle(palette, verticalProgress, Math.max(0, Math.cos(centerLongitude)), tentacleInfluence.core, lowerLobeWave),
+                    outlineColor: verticalProgress < 0.54 ? `${palette.highlight}69` : `${palette.shadow}78`,
+                });
+            }
+        }
+        return surfacePatches;
+    }
+    /**
+     * Samples one point on the continuous Octopus 3D 3 surface.
+     *
+     * The lower hemisphere is pulled into eight seeded waving lobes, so the portrait reads as
+     * tentacled while still being rendered as one connected blobby mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function sampleContinuousOctopusSurfacePoint(options, latitude, longitude) {
+        const { radiusX, radiusY, radiusZ, morphologyProfile, timeMs, animationPhase } = options;
+        const cosineLatitude = Math.max(0, Math.cos(latitude));
+        const verticalProgress = (Math.sin(latitude) + 1) / 2;
+        const upperBlend = Math.pow(1 - verticalProgress, 1.28);
+        const lowerBlend = smoothStep(0.38, 1, verticalProgress);
+        const tipBlend = smoothStep(0.68, 1, verticalProgress);
+        const tentacleInfluence = resolveContinuousTentacleInfluence(options, longitude);
+        const centerPull = resolveSignedAngularDistance(longitude, tentacleInfluence.centerLongitude);
+        const effectiveLongitude = longitude + centerPull * lowerBlend * tentacleInfluence.core * (0.24 + tipBlend * 0.2);
+        const lowerLobeWave = resolveContinuousLobeWave(options, longitude);
+        const mantleRipple = Math.sin(longitude * morphologyProfile.body.lobeCount +
+            animationPhase * 0.6 +
+            timeMs / (1750 + morphologyProfile.body.lobeCount * 30)) *
+            (0.018 + morphologyProfile.body.wobbleAmplitudeRatio * 0.8) *
+            (0.3 + lowerBlend * 0.7);
+        const tentacleWave = Math.sin(timeMs / 760 + tentacleInfluence.phase + verticalProgress * 2.4) *
+            lowerBlend *
+            tentacleInfluence.core *
+            tentacleInfluence.swayScale;
+        const horizontalScale = 1.04 +
+            mantleRipple +
+            lowerBlend * (0.16 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.1) +
+            lowerBlend * tentacleInfluence.core * (0.2 + lowerLobeWave * 0.12) -
+            upperBlend * 0.08;
+        const depthScale = 1.06 +
+            upperBlend * 0.16 +
+            Math.max(0, Math.cos(effectiveLongitude)) * 0.1 +
+            lowerBlend * tentacleInfluence.core * (0.1 + tentacleInfluence.depthScale * 0.06) -
+            Math.max(0, -Math.cos(effectiveLongitude)) * 0.05;
+        const tentacleTubeRadius = lowerBlend * tentacleInfluence.core * (0.11 + tipBlend * 0.06 + tentacleInfluence.widthScale * 0.025) * radiusX;
+        const planarRadiusX = cosineLatitude * radiusX * horizontalScale + tentacleTubeRadius;
+        const planarRadiusZ = cosineLatitude * radiusZ * depthScale + tentacleTubeRadius * 0.72;
+        const lowerDrop = lowerBlend *
+            radiusY *
+            (0.18 +
+                tentacleInfluence.core *
+                    (0.38 +
+                        tentacleInfluence.lengthScale * 0.22 +
+                        (morphologyProfile.tentacles.flowLengthScale - 1) * 0.08));
+        return {
+            x: Math.sin(effectiveLongitude) * planarRadiusX + tentacleWave * radiusX * (0.052 + tipBlend * 0.05),
+            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.12) -
+                upperBlend * radiusY * 0.1 +
+                lowerDrop +
+                Math.sin(timeMs / 1420 + animationPhase + latitude * 1.6) * lowerBlend * radiusY * 0.018 +
+                Math.cos(timeMs / 880 + tentacleInfluence.phase) *
+                    lowerBlend *
+                    tipBlend *
+                    tentacleInfluence.core *
+                    radiusY *
+                    0.034,
+            z: Math.cos(effectiveLongitude) * planarRadiusZ +
+                Math.cos(timeMs / 980 + tentacleInfluence.phase + verticalProgress) *
+                    lowerBlend *
+                    tentacleInfluence.core *
+                    radiusZ *
+                    0.04,
+        };
+    }
+    /**
+     * Blends nearby seeded tentacle profiles at one mesh longitude.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function resolveContinuousTentacleInfluence(options, longitude) {
+        let totalWeight = 0;
+        let weightedSin = 0;
+        let weightedCos = 0;
+        let weightedWidthScale = 0;
+        let weightedLengthScale = 0;
+        let weightedSwayScale = 0;
+        let weightedDepthScale = 0;
+        let weightedPhase = 0;
+        for (const tentacleProfile of options.tentacleProfiles) {
+            const distance = Math.abs(resolveSignedAngularDistance(longitude, tentacleProfile.centerLongitude));
+            const width = 0.2 * tentacleProfile.widthScale;
+            const weight = Math.exp(-(distance * distance) / (width * width));
+            totalWeight += weight;
+            weightedSin += Math.sin(tentacleProfile.centerLongitude) * weight;
+            weightedCos += Math.cos(tentacleProfile.centerLongitude) * weight;
+            weightedWidthScale += tentacleProfile.widthScale * weight;
+            weightedLengthScale += tentacleProfile.lengthScale * weight;
+            weightedSwayScale += tentacleProfile.swayScale * weight;
+            weightedDepthScale += tentacleProfile.depthScale * weight;
+            weightedPhase += tentacleProfile.phase * weight;
+        }
+        if (totalWeight < 0.0001) {
+            return {
+                core: 0,
+                centerLongitude: longitude,
+                widthScale: 1,
+                lengthScale: 1,
+                swayScale: 1,
+                depthScale: 1,
+                phase: 0,
+            };
+        }
+        return {
+            core: clampNumber$1(totalWeight, 0, 1),
+            centerLongitude: Math.atan2(weightedSin / totalWeight, weightedCos / totalWeight),
+            widthScale: weightedWidthScale / totalWeight,
+            lengthScale: weightedLengthScale / totalWeight,
+            swayScale: weightedSwayScale / totalWeight,
+            depthScale: weightedDepthScale / totalWeight,
+            phase: weightedPhase / totalWeight,
+        };
+    }
+    /**
+     * Resolves the soft lower wave that makes the continuous mesh read as a set of tentacles.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function resolveContinuousLobeWave(options, longitude) {
+        const { morphologyProfile, animationPhase, timeMs } = options;
+        return ((Math.cos(longitude * OCTOPUS_TENTACLE_COUNT +
+            animationPhase +
+            timeMs / (980 + morphologyProfile.body.lobeCount * 18)) +
+            1) /
+            2);
+    }
+    /**
+     * Resolves one base fill tone for a patch on the continuous octopus mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function resolveContinuousSurfacePatchFillStyle(palette, verticalProgress, forwardness, tentacleCore, lowerLobeWave) {
+        const tonalProgress = clampNumber$1(verticalProgress + lowerLobeWave * 0.1 + tentacleCore * 0.08 - forwardness * 0.08, 0, 1);
+        if (tonalProgress < 0.14) {
+            return palette.highlight;
+        }
+        if (tonalProgress < 0.32) {
+            return palette.secondary;
+        }
+        if (tonalProgress < 0.72) {
+            return forwardness > 0.55 ? palette.secondary : palette.primary;
+        }
+        return tentacleCore > 0.44 ? `${palette.primary}f4` : `${palette.shadow}ee`;
+    }
+    /**
+     * Draws one projected mesh patch with soft shading and a subtle edge.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawContinuousSurfacePatch(context, surfacePatch) {
+        drawProjectedQuad(context, surfacePatch.corners, surfacePatch.fillStyle);
+        if (surfacePatch.lightIntensity > 0) {
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.18 * surfacePatch.lightIntensity})`);
+        }
+        else if (surfacePatch.lightIntensity < 0) {
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.25 * Math.abs(surfacePatch.lightIntensity)})`);
+        }
+        context.save();
+        context.beginPath();
+        context.moveTo(surfacePatch.corners[0].x, surfacePatch.corners[0].y);
+        for (let cornerIndex = 1; cornerIndex < surfacePatch.corners.length; cornerIndex++) {
+            context.lineTo(surfacePatch.corners[cornerIndex].x, surfacePatch.corners[cornerIndex].y);
+        }
+        context.closePath();
+        context.strokeStyle = surfacePatch.outlineColor;
+        context.lineWidth = Math.max(0.7, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0032);
+        context.lineJoin = 'round';
+        context.stroke();
+        context.restore();
+    }
+    /**
+     * Draws projected mantle-current lines on the front of the mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawProjectedSurfaceCurrents(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, morphologyProfile, timeMs, animationPhase, } = options;
+        const currentCount = Math.min(6, morphologyProfile.details.mantleCurrentCount);
+        const centerIndex = (currentCount - 1) / 2;
+        context.save();
+        context.lineCap = 'round';
+        context.lineJoin = 'round';
+        for (let currentIndex = 0; currentIndex < currentCount; currentIndex++) {
+            const baseLongitude = (currentIndex - centerIndex) * 0.15;
+            const projectedPoints = [];
+            for (let sampleIndex = 0; sampleIndex < 8; sampleIndex++) {
+                const progress = sampleIndex / 7;
+                const latitude = -0.46 + progress * 0.74;
+                const longitude = baseLongitude + Math.sin(timeMs / 1160 + animationPhase + currentIndex * 0.7 + progress * 2) * 0.035;
+                const scenePoint = transformScenePoint(sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude), center, rotationX, rotationY);
+                if (scenePoint.z > center.z - size * 0.016) {
+                    projectedPoints.push(projectScenePoint(scenePoint, size, sceneCenterX, sceneCenterY));
+                }
+            }
+            if (projectedPoints.length < 3) {
+                continue;
+            }
+            context.beginPath();
+            context.moveTo(projectedPoints[0].x, projectedPoints[0].y);
+            for (const projectedPoint of projectedPoints.slice(1)) {
+                context.lineTo(projectedPoint.x, projectedPoint.y);
+            }
+            context.strokeStyle = currentIndex % 2 === 0 ? `${palette.highlight}3d` : `${palette.accent}33`;
+            context.lineWidth = size * (0.0055 + currentIndex * 0.00045);
+            context.stroke();
+        }
+        context.restore();
+    }
+    /**
+     * Draws small projected sucker highlights on the waving lower mesh lobes.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawProjectedTentacleSuckers(options) {
+        const { surfaceOptions, size } = options;
+        const { timeMs } = surfaceOptions;
+        for (const tentacleProfile of surfaceOptions.tentacleProfiles) {
+            if (Math.cos(tentacleProfile.centerLongitude) < -0.12) {
+                continue;
+            }
+            for (let suckerIndex = 0; suckerIndex < 3; suckerIndex++) {
+                const latitude = 0.52 + suckerIndex * 0.14;
+                const sideOffset = tentacleProfile.suckerSide * (0.035 + suckerIndex * 0.012) * tentacleProfile.widthScale;
+                const waveOffset = Math.sin(timeMs / 900 + tentacleProfile.phase + suckerIndex * 0.8) * 0.018;
+                drawProjectedSurfaceSpot({
+                    ...options,
+                    latitude,
+                    longitude: tentacleProfile.centerLongitude + sideOffset + waveOffset,
+                    radiusScale: size * (0.0065 - suckerIndex * 0.0007),
+                });
+            }
+        }
+    }
+    /**
+     * Draws one tiny projected surface spot by sampling local mesh tangents.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawProjectedSurfaceSpot(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, latitude, longitude, radiusScale, } = options;
+        const localCenter = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude);
+        const localHorizontal = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude + 0.018);
+        const localVertical = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude + 0.018, longitude);
+        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
+        if (sceneCenterPoint.z <= center.z - size * 0.012) {
+            return;
+        }
+        const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
+        const projectedHorizontalPoint = projectScenePoint(transformScenePoint(localHorizontal, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
+        const projectedVerticalPoint = projectScenePoint(transformScenePoint(localVertical, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
+        const horizontalRadius = clampNumber$1(Math.hypot(projectedHorizontalPoint.x - projectedCenterPoint.x, projectedHorizontalPoint.y - projectedCenterPoint.y) *
+            radiusScale *
+            0.74, size * 0.003, size * 0.018);
+        const verticalRadius = clampNumber$1(Math.hypot(projectedVerticalPoint.x - projectedCenterPoint.x, projectedVerticalPoint.y - projectedCenterPoint.y) *
+            radiusScale *
+            0.52, size * 0.0024, size * 0.014);
+        const rotation = Math.atan2(projectedHorizontalPoint.y - projectedCenterPoint.y, projectedHorizontalPoint.x - projectedCenterPoint.x);
+        context.save();
+        context.translate(projectedCenterPoint.x, projectedCenterPoint.y);
+        context.rotate(rotation);
+        context.beginPath();
+        context.ellipse(0, 0, horizontalRadius, verticalRadius, 0, 0, Math.PI * 2);
+        context.fillStyle = `${palette.highlight}73`;
+        context.fill();
+        context.strokeStyle = `${palette.highlight}99`;
+        context.lineWidth = Math.max(0.7, size * 0.0028);
+        context.stroke();
+        context.restore();
+    }
+    /**
+     * Resolves a signed angular distance from the source longitude to the target longitude.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function resolveSignedAngularDistance(sourceLongitude, targetLongitude) {
+        return Math.atan2(Math.sin(targetLongitude - sourceLongitude), Math.cos(targetLongitude - sourceLongitude));
+    }
+    /**
+     * Smoothly maps a value between two bounds into `[0, 1]`.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function smoothStep(edgeStart, edgeEnd, value) {
+        const progress = clampNumber$1((value - edgeStart) / (edgeEnd - edgeStart), 0, 1);
+        return progress * progress * (3 - 2 * progress);
+    }
+
     /* eslint-disable no-magic-numbers */
     /**
      * Octopus avatar visual.
@@ -6064,6 +6572,7 @@
         octopus3AvatarVisual,
         octopus3dAvatarVisual,
         octopus3d2AvatarVisual,
+        octopus3d3AvatarVisual,
         asciiOctopusAvatarVisual,
         minecraftAvatarVisual,
         minecraft2AvatarVisual,
@@ -6145,7 +6654,7 @@
      *
      * @private shared avatar contract
      */
-    const DEFAULT_AGENT_AVATAR_VISUAL_ID = 'octopus3';
+    const DEFAULT_AGENT_AVATAR_VISUAL_ID = 'octopus3d3';
     /**
      * Resolves the avatar visual preferred by an agent, then falls back to a federated server default
      * and finally to the caller/server default.
@@ -22869,6 +23378,30 @@
         DIAGNOSTIC_MARKER_OWNER: 'book-editor-diagnostics',
     };
 
+    /**
+     * Theme used for the actual notebook editor surface.
+     *
+     * The host application can still pass its resolved app theme, but book sources
+     * are intentionally rendered as light paper in both light and dark app modes.
+     *
+     * @private internal constant of `BookEditor`
+     */
+    const BOOK_EDITOR_RENDER_THEME = 'LIGHT';
+    /**
+     * Resolves an app-level theme into the visual theme used by `<BookEditor/>`.
+     *
+     * @param hostTheme - Resolved theme from the embedding application.
+     * @returns Light theme used by the Book editor surface.
+     *
+     * @private internal utility of `BookEditor`
+     */
+    function resolveBookEditorRenderTheme(hostTheme = BOOK_EDITOR_RENDER_THEME) {
+        if (hostTheme === 'DARK') {
+            return BOOK_EDITOR_RENDER_THEME;
+        }
+        return hostTheme;
+    }
+
     /**
      * Gets a commitment definition by its type
      *
@@ -23878,19 +24411,20 @@
      *
      * @private function of BookEditorMonaco
      */
-    function ensureBookEditorMonacoLanguage(monaco, theme = 'LIGHT') {
+    function ensureBookEditorMonacoLanguage(monaco, theme = BOOK_EDITOR_RENDER_THEME) {
+        const renderedTheme = resolveBookEditorRenderTheme(theme);
         const monacoWithLanguageState = monaco;
         if (monacoWithLanguageState[BOOK_EDITOR_LANGUAGE_INITIALIZED_FLAG]) {
-            if (monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] !== theme) {
-                applyBookEditorMonacoTheme(monaco, theme);
-                monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] = theme;
+            if (monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] !== renderedTheme) {
+                applyBookEditorMonacoTheme(monaco, renderedTheme);
+                monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] = renderedTheme;
                 return;
             }
             monaco.editor.setTheme(BookEditorMonacoConstants.BOOK_THEME_ID);
             return;
         }
         monacoWithLanguageState[BOOK_EDITOR_LANGUAGE_INITIALIZED_FLAG] = true;
-        monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] = theme;
+        monacoWithLanguageState[BOOK_EDITOR_THEME_MODE_FLAG] = renderedTheme;
         monaco.languages.register({ id: BookEditorMonacoConstants.BOOK_LANGUAGE_ID });
         const commitmentDefinitions = getAllCommitmentDefinitions();
         const commitmentTypes = [...new Set(commitmentDefinitions.map(({ type }) => type))];
@@ -24000,7 +24534,7 @@
                 return { links };
             },
         });
-        applyBookEditorMonacoTheme(monaco, theme);
+        applyBookEditorMonacoTheme(monaco, renderedTheme);
     }
     /**
      * Ensures the mounted Monaco editor model uses Book language and Book theme.
@@ -24013,8 +24547,9 @@
      * @private function of BookEditorMonaco
      */
     function ensureBookEditorMonacoLanguageForEditor(props) {
-        const { monaco, monacoEditor, theme = 'LIGHT' } = props;
-        ensureBookEditorMonacoLanguage(monaco, theme);
+        const { monaco, monacoEditor, theme = BOOK_EDITOR_RENDER_THEME } = props;
+        const renderedTheme = resolveBookEditorRenderTheme(theme);
+        ensureBookEditorMonacoLanguage(monaco, renderedTheme);
         const model = monacoEditor.getModel();
         if (!model) {
             return;
@@ -25246,7 +25781,8 @@
      * @private Internal component used by `BookEditor`
      */
     function BookEditorMonaco(props) {
-        const { value, onChange, diagnostics, isReadonly, theme = 'LIGHT', translations, onFileUpload, isUploadButtonShown, isCameraButtonShown, isDownloadButtonShown, isAboutButtonShown = true, isFullscreenButtonShown = true, onFullscreenClick, isFullscreen, zoom = 1, monacoModelPath, hoistedMenuItems, } = props;
+        const { value, onChange, diagnostics, isReadonly, theme: hostTheme = BOOK_EDITOR_RENDER_THEME, translations, onFileUpload, isUploadButtonShown, isCameraButtonShown, isDownloadButtonShown, isAboutButtonShown = true, isFullscreenButtonShown = true, onFullscreenClick, isFullscreen, zoom = 1, monacoModelPath, hoistedMenuItems, } = props;
+        const theme = resolveBookEditorRenderTheme(hostTheme);
         const zoomLevel = zoom;
         const { scaledLineHeight, scaledContentPaddingLeft, scaledVerticalLineLeft, scaledFontSize, scaledScrollbarSize } = createBookEditorMonacoScale(zoomLevel);
         const monaco = MonacoEditor.useMonaco();
@@ -25335,15 +25871,16 @@
      * @public exported from `@promptbook/components`
      */
     function BookEditor(props) {
-        const { agentSource, className, style, theme = 'LIGHT', zoom = 1, value, onChange, diagnostics, onFileUpload, isVerbose = DEFAULT_IS_VERBOSE, isBorderRadiusDisabled = false, isReadonly = false, translations, isUploadButtonShown = true, isCameraButtonShown, isDownloadButtonShown = true, isAboutButtonShown = true, isFullscreenButtonShown = true, sync, monacoModelPath, hoistedMenuItems, } = props;
+        const { agentSource, className, style, theme: hostTheme = BOOK_EDITOR_RENDER_THEME, zoom = 1, value, onChange, diagnostics, onFileUpload, isVerbose = DEFAULT_IS_VERBOSE, isBorderRadiusDisabled = false, isReadonly = false, translations, isUploadButtonShown = true, isCameraButtonShown, isDownloadButtonShown = true, isAboutButtonShown = true, isFullscreenButtonShown = true, sync, monacoModelPath, hoistedMenuItems, } = props;
         const [isFullscreen, setIsFullscreen] = react.useState(false);
+        const renderedTheme = resolveBookEditorRenderTheme(hostTheme);
         /**
          * Toggles fullscreen mode for the editor.
          */
         const handleFullscreenToggle = () => {
             setIsFullscreen(!isFullscreen);
         };
-        const editorContent = (jsxRuntime.jsx("div", { "data-book-component": "BookEditor", "data-book-editor-theme": theme.toLowerCase(), className: classNames(styles$d.BookEditor, isVerbose && styles$d.isVerbose, styles$d.bookEditorWrapper, isBorderRadiusDisabled && styles$d.isBorderRadiusDisabled, isFullscreen && styles$d.fullscreen, className), style: isFullscreen
+        const editorContent = (jsxRuntime.jsx("div", { "data-book-component": "BookEditor", "data-book-editor-theme": renderedTheme.toLowerCase(), className: classNames(styles$d.BookEditor, isVerbose && styles$d.isVerbose, styles$d.bookEditorWrapper, isBorderRadiusDisabled && styles$d.isBorderRadiusDisabled, isFullscreen && styles$d.fullscreen, className), style: isFullscreen
                 ? style
                 : {
                     ...(style || {}),
@@ -25354,7 +25891,7 @@
                                 ? `${props.height}px`
                                 : props.height || `${DEFAULT_BOOK_EDITOR_HEIGHT}px`,
                         }),
-                }, children: jsxRuntime.jsx(BookEditorMonaco, { value: agentSource || value, onChange: onChange, diagnostics: diagnostics, onFileUpload: onFileUpload, isVerbose: isVerbose, isBorderRadiusDisabled: isBorderRadiusDisabled, isReadonly: isReadonly, translations: translations, isUploadButtonShown: isUploadButtonShown, isCameraButtonShown: isCameraButtonShown, isDownloadButtonShown: isDownloadButtonShown, isAboutButtonShown: isAboutButtonShown, isFullscreenButtonShown: isFullscreenButtonShown, onFullscreenClick: handleFullscreenToggle, isFullscreen: isFullscreen, sync: sync, zoom: zoom, monacoModelPath: monacoModelPath, hoistedMenuItems: hoistedMenuItems, theme: theme }) }));
+                }, children: jsxRuntime.jsx(BookEditorMonaco, { value: agentSource || value, onChange: onChange, diagnostics: diagnostics, onFileUpload: onFileUpload, isVerbose: isVerbose, isBorderRadiusDisabled: isBorderRadiusDisabled, isReadonly: isReadonly, translations: translations, isUploadButtonShown: isUploadButtonShown, isCameraButtonShown: isCameraButtonShown, isDownloadButtonShown: isDownloadButtonShown, isAboutButtonShown: isAboutButtonShown, isFullscreenButtonShown: isFullscreenButtonShown, onFullscreenClick: handleFullscreenToggle, isFullscreen: isFullscreen, sync: sync, zoom: zoom, monacoModelPath: monacoModelPath, hoistedMenuItems: hoistedMenuItems, theme: renderedTheme }) }));
         return isFullscreen && typeof document !== 'undefined' ? reactDom.createPortal(editorContent, document.body) : editorContent;
     }