@treasuryspatial/viewer-ui-kit 0.1.41 → 0.1.56

package/dist/ScienceMetricsPanelContent.js

@@ -0,0 +1,415 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import styled from 'styled-components';
+import { panelPillButtonCss, panelPillRowCss, } from './panelPrimitives.js';
+const SCIENCE_OUTPUT_LABELS = [
+    { id: 'attention', label: 'attention' },
+    { id: 'navigation', label: 'navigation' },
+    { id: 'visual-perception', label: 'visual perception' },
+    { id: 'locomotion', label: 'locomotion' },
+    { id: 'agency', label: 'agency' },
+    { id: 'object-perception', label: 'object perception' },
+    { id: 'tactile-perception', label: 'tactile perception' },
+    { id: 'affect', label: 'affect' },
+    { id: 'social-cognition', label: 'social cognition' },
+    { id: 'social-interaction', label: 'social interaction' },
+    { id: 'goal-directed-behavior', label: 'goal-directed behavior' },
+    { id: 'auditory-perception', label: 'auditory perception' },
+];
+const CEILING_TYPE_IDS = {
+    flat: 0,
+    vault: 1,
+    dome: 2,
+    pyramid: 3,
+    inverted_dome: 4,
+    shed: 5,
+};
+const Root = styled.div.attrs({ className: 'viewer-ui-panel-sections' }) ``;
+const TabRow = styled.div `
+  ${panelPillRowCss}
+`;
+const TabButton = styled.button `
+  ${panelPillButtonCss}
+`;
+const Section = styled.section.attrs({ className: 'panel-section' }) ``;
+const SectionHeader = styled.div.attrs({ className: 'panel-section-header' }) ``;
+const SectionHeaderCopy = styled.div `
+  min-width: 0;
+`;
+const SectionList = styled.div.attrs({ className: 'panel-section-list' }) ``;
+const MetricRow = styled.div.attrs({ className: 'panel-section-row' }) ``;
+const MetricMeta = styled.div.attrs({ className: 'panel-section-row-copy' }) ``;
+const MetricLabel = styled.span.attrs({ className: 'panel-section-row-label' }) ``;
+const MetricHelp = styled.span.attrs({ className: 'panel-section-row-help' }) ``;
+const MetricValue = styled.span.attrs({ className: 'panel-section-row-value' }) ``;
+const isRecord = (value) => typeof value === 'object' && value !== null && !Array.isArray(value);
+const resolvePathValue = (root, path) => {
+    if (!root || !path.trim())
+        return null;
+    const parts = path.split('.').map((part) => part.trim()).filter(Boolean);
+    let current = root;
+    for (const part of parts) {
+        if (!isRecord(current))
+            return null;
+        current = current[part];
+    }
+    return current ?? null;
+};
+const asFiniteNumber = (value) => {
+    if (typeof value === 'number' && Number.isFinite(value))
+        return value;
+    if (typeof value === 'string' && value.trim() !== '') {
+        const parsed = Number(value);
+        return Number.isFinite(parsed) ? parsed : null;
+    }
+    return null;
+};
+const asBoolean = (value) => {
+    if (typeof value === 'boolean')
+        return value;
+    if (typeof value === 'number' && Number.isFinite(value))
+        return value !== 0;
+    if (typeof value === 'string') {
+        const normalized = value.trim().toLowerCase();
+        if (['true', 'yes', 'on', '1', 'enabled'].includes(normalized))
+            return true;
+        if (['false', 'no', 'off', '0', 'disabled'].includes(normalized))
+            return false;
+    }
+    return null;
+};
+const asText = (value) => {
+    if (typeof value === 'string' && value.trim())
+        return value.trim();
+    if (typeof value === 'number' && Number.isFinite(value))
+        return String(value);
+    return null;
+};
+const firstResolvedValue = (root, paths) => {
+    if (!root)
+        return null;
+    for (const path of paths) {
+        const value = resolvePathValue(root, path);
+        if (value !== null && value !== undefined && value !== '')
+            return value;
+    }
+    return null;
+};
+const firstNumber = (root, paths, fallback = null) => {
+    const value = asFiniteNumber(firstResolvedValue(root, paths));
+    return value === null ? fallback : value;
+};
+const firstBoolean = (root, paths, fallback = null) => {
+    const value = asBoolean(firstResolvedValue(root, paths));
+    return value === null ? fallback : value;
+};
+const firstText = (root, paths, fallback = null) => {
+    const value = asText(firstResolvedValue(root, paths));
+    return value === null ? fallback : value;
+};
+const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
+const clamp01 = (value) => clamp(value, 0, 1);
+const smoothRatio = (value, min, max) => clamp01((value - min) / Math.max(0.0001, max - min));
+const bellRatio = (value, target, spread = 0.85) => value > 0 && target > 0 ? clamp01(Math.exp(-0.5 * Math.pow(Math.log(value / target) / spread, 2))) : 0;
+const formatDecimal = (value, digits = 2) => value === null || !Number.isFinite(value) ? 'not emitted' : value.toFixed(digits);
+const formatArea = (value) => value === null || !Number.isFinite(value) ? 'not emitted' : `${value.toFixed(2)} sqm`;
+const formatMeters = (value, digits = 2) => value === null || !Number.isFinite(value) ? 'not emitted' : `${value.toFixed(digits)} m`;
+const formatCount = (value) => String(Math.max(0, Math.round(value)));
+const formatYesNo = (value) => (value ? 'yes' : 'no');
+const arrayCount = (value) => (Array.isArray(value) && value.length > 0 ? value.length : null);
+const mmToMeters = (value) => value === null || !Number.isFinite(value) ? null : value / 1000;
+const ellipsePerimeterMeters = (majorRadius, minorRadius) => {
+    if (majorRadius === null || minorRadius === null || majorRadius <= 0 || minorRadius <= 0)
+        return null;
+    const h = Math.pow(majorRadius - minorRadius, 2) / Math.pow(majorRadius + minorRadius, 2);
+    return Math.PI * (majorRadius + minorRadius) * (1 + (3 * h) / (10 + Math.sqrt(4 - 3 * h)));
+};
+const normalizeKey = (value, fallback) => (value || fallback).trim().toLowerCase();
+const sideSpanCount = (parameters, side) => {
+    const normalized = side.trim().toLowerCase();
+    if (normalized === 'north')
+        return Math.max(1, Math.round(firstNumber(parameters, ['rectNorthSegments'], 1) ?? 1));
+    if (normalized === 'east')
+        return Math.max(1, Math.round(firstNumber(parameters, ['rectEastSegments'], 1) ?? 1));
+    if (normalized === 'south')
+        return Math.max(1, Math.round(firstNumber(parameters, ['rectSouthSegments'], 1) ?? 1));
+    if (normalized === 'west')
+        return Math.max(1, Math.round(firstNumber(parameters, ['rectWestSegments'], 1) ?? 1));
+    return 1;
+};
+const estimateWallTargetCount = (parameters, baseType, targetSpec, groundSpans) => {
+    const specs = targetSpec
+        .split(',')
+        .map((part) => part.trim().toLowerCase())
+        .filter(Boolean);
+    if (!specs.length)
+        return Math.max(1, groundSpans);
+    return specs.reduce((sum, spec) => {
+        if (baseType === 'elliptical' && spec.startsWith('arc.*')) {
+            return sum + Math.max(1, Math.round(firstNumber(parameters, ['ellipseSectorCount'], groundSpans) ?? groundSpans));
+        }
+        if (baseType === 'ribbon' && (spec.startsWith('run.*') || spec.startsWith('ribbon.*'))) {
+            return sum + Math.max(1, Math.round(firstNumber(parameters, ['ribbonSpanCount', 'ribbonStationCount'], groundSpans) ?? groundSpans));
+        }
+        if (spec.startsWith('*.vband.'))
+            return sum + Math.max(1, groundSpans);
+        const sideMatch = spec.match(/^(north|east|south|west)\.\*/);
+        if (sideMatch)
+            return sum + sideSpanCount(parameters, sideMatch[1] ?? '');
+        return sum + 1;
+    }, 0);
+};
+const resolveScienceInputs = (parameters) => {
+    const baseType = normalizeKey(firstText(parameters, ['baseType', 'room.baseType']), 'rectilinear');
+    const shellClass = normalizeKey(firstText(parameters, ['shellClass', 'room.shellClass']), 'basic-structure');
+    const roomHeight = mmToMeters(firstNumber(parameters, ['heightMm'])) ??
+        firstNumber(parameters, ['roomHeight', 'ceilingHeight', 'room.shared.height', 'room.height', 'height']);
+    const rectLength = mmToMeters(firstNumber(parameters, ['rectLengthMm']));
+    const rectDepth = mmToMeters(firstNumber(parameters, ['rectDepthMm']));
+    const ellipseMajor = mmToMeters(firstNumber(parameters, ['ellipseMajorRadiusMm']));
+    const ellipseMinor = mmToMeters(firstNumber(parameters, ['ellipseMinorRadiusMm']));
+    const ribbonLength = mmToMeters(firstNumber(parameters, ['ribbonLengthMm']));
+    const ribbonWidth = mmToMeters(firstNumber(parameters, ['ribbonWidthMm']));
+    const rectSpans = Math.max(1, Math.round((firstNumber(parameters, ['rectNorthSegments'], 1) ?? 1) +
+        (firstNumber(parameters, ['rectEastSegments'], 1) ?? 1) +
+        (firstNumber(parameters, ['rectSouthSegments'], 1) ?? 1) +
+        (firstNumber(parameters, ['rectWestSegments'], 1) ?? 1)));
+    const ellipseSectors = Math.max(1, Math.round(firstNumber(parameters, ['ellipseSectorCount'], 1) ?? 1));
+    const ribbonSpans = Math.max(1, Math.round(firstNumber(parameters, ['ribbonSpanCount', 'ribbonStationCount'], 1) ?? 1));
+    const verticalBands = Math.max(1, Math.round(firstNumber(parameters, ['verticalBandCount'], 1) ?? 1));
+    const length = baseType === 'elliptical'
+        ? ellipseMajor !== null
+            ? ellipseMajor * 2
+            : null
+        : baseType === 'ribbon'
+            ? ribbonLength
+            : rectLength;
+    const width = baseType === 'elliptical'
+        ? ellipseMinor !== null
+            ? ellipseMinor * 2
+            : null
+        : baseType === 'ribbon'
+            ? ribbonWidth
+            : rectDepth;
+    const floorArea = firstNumber(parameters, ['metrics.floorArea', 'diagnostics.floorArea', 'room.floorArea', 'floorArea']) ??
+        (baseType === 'elliptical' && ellipseMajor !== null && ellipseMinor !== null
+            ? Math.PI * ellipseMajor * ellipseMinor
+            : length !== null && width !== null
+                ? length * width
+                : null);
+    const perimeter = firstNumber(parameters, ['metrics.perimeter', 'diagnostics.perimeter', 'room.perimeter', 'perimeter']) ??
+        (baseType === 'elliptical'
+            ? ellipsePerimeterMeters(ellipseMajor, ellipseMinor)
+            : length !== null && width !== null
+                ? 2 * (length + width)
+                : null);
+    const wallCount = baseType === 'rectilinear' ? 4 : 1;
+    const groundSpans = baseType === 'elliptical' ? ellipseSectors : baseType === 'ribbon' ? ribbonSpans : rectSpans;
+    const curvature = baseType === 'rectilinear' ? 0 : baseType === 'elliptical' ? 0.72 : 0.9;
+    const wallAperturesEnabled = firstBoolean(parameters, ['wallAperturesEnabled', 'enableWindows'], false) ?? false;
+    const roofAperturesEnabled = firstBoolean(parameters, ['roofAperturesEnabled', 'enableSkylights'], false) ?? false;
+    const wallCutsPerTarget = Math.max(0, Math.round(firstNumber(parameters, ['wallApertureCount', 'windowCount', 'apertures.windows.count'], 0) ?? 0));
+    const wallTargetSpec = firstText(parameters, ['wallApertureTargetSpec'], '') ?? '';
+    const wallTargetCount = wallAperturesEnabled
+        ? estimateWallTargetCount(parameters, baseType, wallTargetSpec, groundSpans)
+        : 0;
+    const generatedWindowCount = arrayCount(resolvePathValue(parameters, 'windows'));
+    const windows = wallAperturesEnabled
+        ? Math.max(0, Math.round(generatedWindowCount ?? wallTargetCount * Math.max(1, wallCutsPerTarget)))
+        : 0;
+    const roofPattern = normalizeKey(firstText(parameters, ['roofAperturePatternKind'], 'none'), 'none');
+    const roofCountParameter = Math.max(0, Math.round(firstNumber(parameters, ['roofApertureCount', 'skylightCount'], 0) ?? 0));
+    const generatedSkylightCount = arrayCount(resolvePathValue(parameters, 'skylights'));
+    const skylights = roofAperturesEnabled
+        ? Math.max(0, Math.round(generatedSkylightCount ?? (['oculus', 'atrium'].includes(roofPattern) ? 1 : roofCountParameter)))
+        : 0;
+    const windowWidth = mmToMeters(firstNumber(parameters, ['wallApertureWidthMm'])) ??
+        firstNumber(parameters, ['windowWidth', 'apertures.windowWidth'], 1.2) ??
+        1.2;
+    const windowHeight = mmToMeters(firstNumber(parameters, ['wallApertureHeightMm'])) ??
+        firstNumber(parameters, ['windowHeight', 'apertures.windowHeight'], 1.5) ??
+        1.5;
+    const roofWidth = mmToMeters(firstNumber(parameters, ['roofOculusDiameterMm', 'roofApertureWidthMm'])) ??
+        firstNumber(parameters, ['skylightSize', 'apertures.skylightSize'], 1.8) ??
+        1.8;
+    const roofHeight = mmToMeters(firstNumber(parameters, ['roofOculusDiameterMm', 'roofApertureHeightMm'])) ??
+        firstNumber(parameters, ['skylightSize', 'apertures.skylightSize'], roofWidth) ??
+        roofWidth;
+    const wallOpeningArea = windows * windowWidth * windowHeight;
+    const roofOpeningArea = roofPattern === 'oculus'
+        ? skylights * Math.PI * Math.pow(roofWidth / 2, 2)
+        : skylights * roofWidth * roofHeight;
+    const aperturesEnabled = wallAperturesEnabled || roofAperturesEnabled;
+    const openingArea = aperturesEnabled ? Math.max(0, wallOpeningArea + roofOpeningArea) : 0;
+    const apertureRatio = floorArea && floorArea > 0 ? openingArea / floorArea : null;
+    const roofFamily = normalizeKey(firstText(parameters, ['roofFamily'], 'flat'), 'flat');
+    const ceilingEnabled = firstBoolean(parameters, ['roofEnabled', 'enableCeiling', 'ceiling.enabled'], true) ?? true;
+    const typeId = CEILING_TYPE_IDS[roofFamily] ?? 0;
+    const coverage = firstNumber(parameters, ['roofOculusEllipseScale', 'ceilingCoverageFactor', 'ceiling.coverage'], 1) ?? 1;
+    const apexOffset = mmToMeters(firstNumber(parameters, ['rectRoofRiseMm', 'domeOuterRiseMm'])) ?? 0;
+    const sag = mmToMeters(firstNumber(parameters, ['domeInnerRiseMm'])) ?? 0;
+    const capMode = roofFamily === 'shed'
+        ? `low ${formatYesNo(firstBoolean(parameters, ['shedRoofCapLowEnd'], false) ?? false)}, high ${formatYesNo(firstBoolean(parameters, ['shedRoofCapHighEnd'], true) ?? true)}`
+        : roofFamily === 'gable'
+            ? `gable ends ${formatYesNo(firstBoolean(parameters, ['gableRoofCapEnds'], true) ?? true)}`
+            : 'n/a';
+    return {
+        room: {
+            baseType,
+            shellClass,
+            floorArea,
+            perimeter,
+            roomHeight,
+            wallCount,
+            length,
+            width,
+            curvature,
+            groundSpans,
+            verticalBands,
+        },
+        apertures: {
+            windows,
+            skylights,
+            enabled: aperturesEnabled,
+            openingArea,
+            apertureRatio,
+            wallTargetCount,
+            wallCutsPerTarget,
+            wallTargetSpec: wallTargetSpec || 'all generated wall cells',
+            roofPattern,
+        },
+        ceiling: {
+            roofFamily,
+            typeId,
+            coverage,
+            sag,
+            apexOffset,
+            capMode,
+            enabled: ceilingEnabled ?? false,
+        },
+    };
+};
+const buildScienceInputGroups = (inputs) => [
+    {
+        id: 'base',
+        label: 'base',
+        summary: 'Science Env base type, shell class, and footprint metrics from the active model parameters.',
+        rows: [
+            { id: 'base-type', label: 'base type', value: inputs.room.baseType },
+            { id: 'shell-class', label: 'shell class', value: inputs.room.shellClass },
+            { id: 'floor-area', label: 'floor area', value: formatArea(inputs.room.floorArea) },
+            { id: 'perimeter', label: 'perimeter', value: formatMeters(inputs.room.perimeter) },
+            { id: 'base-length', label: 'base length / major', value: formatMeters(inputs.room.length) },
+            { id: 'base-width', label: 'base width / minor', value: formatMeters(inputs.room.width) },
+            { id: 'height', label: 'height', value: formatMeters(inputs.room.roomHeight) },
+            { id: 'wall-groups', label: 'wall / run groups', value: formatCount(inputs.room.wallCount) },
+            { id: 'ground-spans', label: 'ground spans / sectors', value: formatCount(inputs.room.groundSpans) },
+            { id: 'vertical-bands', label: 'vertical bands', value: formatCount(inputs.room.verticalBands) },
+        ],
+    },
+    {
+        id: 'apertures',
+        label: 'apertures',
+        summary: 'Estimated wall and roof aperture instances from the current route, target spec, and per-target count.',
+        rows: [
+            { id: 'wall-openings', label: 'wall openings', value: formatCount(inputs.apertures.windows) },
+            { id: 'wall-targets', label: 'wall target cells', value: formatCount(inputs.apertures.wallTargetCount) },
+            { id: 'cuts-per-target', label: 'cuts per target', value: formatCount(inputs.apertures.wallCutsPerTarget) },
+            { id: 'wall-target-spec', label: 'wall target spec', value: inputs.apertures.wallTargetSpec },
+            { id: 'roof-openings', label: 'roof openings', value: formatCount(inputs.apertures.skylights) },
+            { id: 'roof-pattern', label: 'roof pattern', value: inputs.apertures.roofPattern },
+            { id: 'opening-area', label: 'opening area', value: formatArea(inputs.apertures.openingArea) },
+            { id: 'aperture-ratio', label: 'aperture ratio', value: formatDecimal(inputs.apertures.apertureRatio, 3) },
+            { id: 'apertures-enabled', label: 'apertures enabled', value: formatYesNo(inputs.apertures.enabled) },
+        ],
+    },
+    {
+        id: 'roof',
+        label: 'roof',
+        summary: 'Roof family and principal roof parameters currently driving the generated shell.',
+        rows: [
+            { id: 'roof-family', label: 'roof family', value: inputs.ceiling.roofFamily },
+            { id: 'roof-enabled', label: 'roof enabled', value: formatYesNo(inputs.ceiling.enabled) },
+            { id: 'roof-type-id', label: 'roof type id', value: formatCount(inputs.ceiling.enabled ? inputs.ceiling.typeId : 0) },
+            { id: 'coverage', label: 'coverage / scale', value: formatDecimal(inputs.ceiling.coverage) },
+            { id: 'inner-rise', label: 'inner rise', value: formatMeters(inputs.ceiling.sag) },
+            { id: 'outer rise', label: 'outer / ridge rise', value: formatMeters(inputs.ceiling.apexOffset) },
+            { id: 'cap-mode', label: 'cap mode', value: inputs.ceiling.capMode },
+        ],
+    },
+];
+const scoreValue = (value) => `${clamp(value, 0, 10).toFixed(2)} demo`;
+const metricRow = (id, value, detail) => ({
+    id,
+    label: SCIENCE_OUTPUT_LABELS.find((metric) => metric.id === id)?.label ?? id,
+    value: scoreValue(value),
+    detail,
+});
+const deriveScienceResearchOutputs = (inputs) => {
+    const area = inputs.room.floorArea ?? 0;
+    const height = inputs.room.roomHeight ?? 3.2;
+    const safeArea = area > 0 ? area : 64;
+    const roomLength = inputs.room.length ?? Math.sqrt(safeArea);
+    const roomWidth = inputs.room.width ?? Math.sqrt(safeArea);
+    const longerSpan = Math.max(roomLength, roomWidth, 0);
+    const shorterSpan = Math.max(Math.min(roomLength, roomWidth), 0.1);
+    const aspectRatio = longerSpan > 0 ? longerSpan / shorterSpan : 1;
+    const perimeter = inputs.room.perimeter ?? (roomLength && roomWidth ? 2 * (roomLength + roomWidth) : 32);
+    const volume = safeArea * Math.max(height, 0.1);
+    const wallRatio = clamp01(inputs.room.wallCount / 4);
+    const areaFit = bellRatio(safeArea, 72, 0.95);
+    const mediumScale = smoothRatio(safeArea, 24, 360);
+    const largeScale = smoothRatio(safeArea, 140, 980);
+    const overscale = smoothRatio(safeArea, 420, 1400);
+    const spanScale = smoothRatio(roomLength + roomWidth, 12, 72);
+    const volumeScale = smoothRatio(volume, 120, 3600);
+    const aspectBalance = bellRatio(aspectRatio, 1.35, 0.7);
+    const perimeterCue = smoothRatio(perimeter, 24, 140);
+    const compactness = clamp01((4 * Math.PI * safeArea) / Math.max(perimeter * perimeter, 0.0001));
+    const heightComfort = bellRatio(height, 3.6, 0.38);
+    const heightOpenness = smoothRatio(height, 2.4, 7.2);
+    const apertureRatio = clamp01((inputs.apertures.apertureRatio ?? 0) / 0.18);
+    const apertureCue = clamp01((inputs.apertures.windows + inputs.apertures.skylights * 2.2) / 9);
+    const daylight = clamp01(apertureRatio * 0.62 + apertureCue * 0.2 + heightOpenness * 0.1 + (inputs.apertures.enabled ? 0.08 : 0));
+    const glareRisk = clamp01((inputs.apertures.apertureRatio ?? 0) / 0.32 + inputs.apertures.skylights * 0.045);
+    const ceilingRelief = clamp01((inputs.ceiling.enabled && inputs.ceiling.typeId > 0 ? 0.35 : 0) +
+        Math.abs(inputs.ceiling.coverage - 1) * 0.45 +
+        Math.abs(inputs.ceiling.sag) * 0.18 +
+        Math.abs(inputs.ceiling.apexOffset) * 0.12);
+    const ceilingCalm = clamp01(1 - ceilingRelief * 0.52);
+    const curvatureCue = clamp01(inputs.room.curvature);
+    const enclosure = clamp01(wallRatio * 0.72 + compactness * 0.24 - daylight * 0.16 - largeScale * 0.1);
+    const legibility = clamp01(aspectBalance * 0.33 + compactness * 0.2 + perimeterCue * 0.16 + daylight * 0.13 + ceilingRelief * 0.08 + curvatureCue * 0.1);
+    const movement = clamp01(mediumScale * 0.28 + largeScale * 0.24 + spanScale * 0.2 + aspectBalance * 0.17 + heightComfort * 0.11);
+    const socialCapacity = clamp01(mediumScale * 0.32 + largeScale * 0.26 + spanScale * 0.18 + aspectBalance * 0.14 + daylight * 0.1);
+    const scaleComfort = clamp01(areaFit * 0.34 + heightComfort * 0.24 + aspectBalance * 0.2 + compactness * 0.12 + ceilingCalm * 0.1);
+    const acousticControl = clamp01(enclosure * 0.35 + compactness * 0.26 + heightComfort * 0.17 - daylight * 0.1 - volumeScale * 0.18 - ceilingRelief * 0.08 + 0.22);
+    return [
+        metricRow('attention', 4.5 + daylight * 2.1 + scaleComfort * 1.2 + heightComfort * 0.8 + ceilingCalm * 0.45 - overscale * 0.7, 'drivers: daylight, room scale, height, ceiling calm'),
+        metricRow('navigation', 4.35 + legibility * 2.15 + perimeterCue * 0.75 + aspectBalance * 0.65 + curvatureCue * 0.35 - overscale * 0.55, 'drivers: perimeter, proportion, enclosure, curvature cues'),
+        metricRow('visual-perception', 4.55 + daylight * 2.65 + heightOpenness * 0.7 + ceilingRelief * 0.55 - glareRisk * 0.45, 'drivers: aperture area, skylights, height, ceiling relief'),
+        metricRow('locomotion', 4.2 + movement * 2.7 + largeScale * 0.75 + aspectBalance * 0.45 - overscale * 0.28, 'drivers: floor area, spans, aspect ratio, clear height'),
+        metricRow('agency', 4.25 + socialCapacity * 1.1 + scaleComfort * 0.95 + daylight * 0.7 + ceilingRelief * 0.35 + (inputs.apertures.enabled ? 0.28 : 0), 'drivers: usable scale, openings, daylight, ceiling articulation'),
+        metricRow('object-perception', 4.65 + daylight * 1.9 + scaleComfort * 0.9 + aspectBalance * 0.55 + enclosure * 0.35 - overscale * 0.25, 'drivers: daylight, proportion, enclosure, overscale'),
+        metricRow('tactile-perception', 4.05 + enclosure * 1.55 + scaleComfort * 1.2 + compactness * 0.55 - largeScale * 0.6, 'drivers: enclosure, compactness, reachable scale'),
+        metricRow('affect', 4.35 + daylight * 1.35 + scaleComfort * 1.55 + ceilingCalm * 0.6 + heightComfort * 0.45 - overscale * 0.5, 'drivers: daylight, scale comfort, height fit, ceiling calm'),
+        metricRow('social-cognition', 4.15 + socialCapacity * 1.65 + daylight * 0.65 + aspectBalance * 0.55 + scaleComfort * 0.45 - overscale * 0.28, 'drivers: social capacity, daylight, proportion, scale'),
+        metricRow('social-interaction', 4.05 + socialCapacity * 2.2 + movement * 0.65 + spanScale * 0.45 - overscale * 0.55, 'drivers: capacity, circulation, span, overscale load'),
+        metricRow('goal-directed-behavior', 4.25 + legibility * 1.55 + movement * 0.85 + scaleComfort * 0.6 + ceilingCalm * 0.28 - overscale * 0.22, 'drivers: legibility, circulation, scale fit'),
+        metricRow('auditory-perception', 4.55 + acousticControl * 2.25 + enclosure * 0.45 - volumeScale * 0.35 - glareRisk * 0.22, 'drivers: volume, enclosure, aperture ratio, ceiling relief'),
+    ];
+};
+const renderRows = (rows) => (_jsx(SectionList, { children: rows.map((row) => (_jsxs(MetricRow, { children: [_jsxs(MetricMeta, { children: [_jsx(MetricLabel, { children: row.label }), row.detail ? _jsx(MetricHelp, { children: row.detail }) : null] }), _jsx(MetricValue, { children: row.value })] }, row.id))) }));
+export default function ScienceMetricsPanelContent({ modeId, modeLabel, moduleLabel, moduleSummary, promptPackLabel, promptPackDescription, parameters, renderState, }) {
+    const [activeTab, setActiveTab] = useState('inputs');
+    const scienceInputs = useMemo(() => resolveScienceInputs(parameters), [parameters]);
+    const inputGroups = useMemo(() => buildScienceInputGroups(scienceInputs), [scienceInputs]);
+    const outputRows = useMemo(() => deriveScienceResearchOutputs(scienceInputs), [scienceInputs]);
+    const contextRows = [
+        { id: 'mode', label: 'mode', value: modeLabel },
+        { id: 'module', label: 'module', value: moduleLabel?.trim() || 'none' },
+        { id: 'geometry-status', label: 'geometry', value: renderState?.geometryStatus?.trim() || 'idle' },
+    ];
+    return (_jsxs(Root, { children: [_jsxs(Section, { "data-panel-id": "science-metrics-overview", children: [_jsx(SectionHeader, { children: _jsxs(SectionHeaderCopy, { children: [_jsx("h3", { children: "science metrics" }), _jsxs("p", { children: ["model inputs ", '->', " cognition outputs"] }), _jsx("p", { children: "Inputs summarize the generated shell. Outputs are provisional cognition estimates and need a data-capture research module before they are treated as measured results." })] }) }), _jsx(TabRow, { children: ['inputs', 'outputs'].map((tab) => (_jsx(TabButton, { type: "button", "$active": activeTab === tab, onClick: () => setActiveTab(tab), children: tab }, tab))) })] }), activeTab === 'inputs' ? (_jsx(_Fragment, { children: inputGroups.map((group) => (_jsxs(Section, { "data-panel-id": `science-metrics-${group.id}`, children: [_jsx(SectionHeader, { children: _jsxs(SectionHeaderCopy, { children: [_jsx("h3", { children: group.label }), _jsx("p", { children: group.summary })] }) }), renderRows(group.rows)] }, group.id))) })) : (_jsx(_Fragment, { children: _jsxs(Section, { "data-panel-id": "science-metrics-cognition", children: [_jsx(SectionHeader, { children: _jsxs(SectionHeaderCopy, { children: [_jsx("h3", { children: "spatial cognition indicators" }), _jsx("p", { children: "Demo scores from the current shell inputs; replace with measured plugin/Data Graph outputs." })] }) }), renderRows(outputRows)] }) })), _jsxs(Section, { "data-panel-id": "science-metrics-context", children: [_jsx(SectionHeader, { children: _jsx(SectionHeaderCopy, { children: _jsx("h3", { children: "runtime context" }) }) }), _jsxs("div", { className: "panel-section-note", children: [contextRows.map((row) => `${row.label}: ${row.value}`).join(' · '), moduleSummary?.trim() ? ` · ${moduleSummary}` : '', promptPackLabel?.trim() ? ` · prompt kit: ${promptPackLabel}` : '', promptPackDescription?.trim() ? ` · ${promptPackDescription}` : ''] })] })] }));
+}

package/dist/SpatialHud.d.ts

@@ -0,0 +1,18 @@
+export interface SpatialHudProps {
+    unitsLabel: string;
+    sceneSpanLabel: string;
+    viewWidthLabel: string;
+    gridStepLabel: string;
+    scaleBarLabel: string;
+    distanceToFloorLabel: string;
+    distanceToCeilingLabel: string;
+    distanceToNorthLabel: string;
+    distanceToSouthLabel: string;
+    distanceToEastLabel: string;
+    distanceToWestLabel: string;
+    compassAngleLabel: string;
+    pitchAngleLabel: string;
+    veilsEnabled?: boolean;
+}
+export default function SpatialHud({ unitsLabel, sceneSpanLabel, viewWidthLabel, gridStepLabel, scaleBarLabel, distanceToFloorLabel, distanceToCeilingLabel, distanceToNorthLabel, distanceToSouthLabel, distanceToEastLabel, distanceToWestLabel, compassAngleLabel, pitchAngleLabel, veilsEnabled, }: SpatialHudProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SpatialHud.d.ts.map

package/dist/SpatialHud.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpatialHud.d.ts","sourceRoot":"","sources":["../src/SpatialHud.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,mBAAmB,EAAE,MAAM,CAAC;IAC5B,mBAAmB,EAAE,MAAM,CAAC;IAC5B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AA6GD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,UAAU,EACV,cAAc,EACd,cAAc,EACd,aAAa,EACb,aAAa,EACb,oBAAoB,EACpB,sBAAsB,EACtB,oBAAoB,EACpB,oBAAoB,EACpB,mBAAmB,EACnB,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,YAAmB,GACpB,EAAE,eAAe,2CAgDjB"}

package/dist/SpatialHud.js

@@ -0,0 +1,120 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from 'styled-components';
+const HudWrapper = styled.div `
+  position: absolute;
+  right: 24px;
+  bottom: 24px;
+  pointer-events: none;
+  z-index: 18;
+`;
+const HudCard = styled.div `
+  position: relative;
+  background: rgba(255, 255, 255, 0.96);
+  border: 1px solid var(--brand-panel-border);
+  border-radius: 12px;
+  padding: 12px 14px;
+  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.1);
+  overflow: hidden;
+
+  &[data-veil='true'] .hud-grid {
+    opacity: 0;
+  }
+
+  &:hover .hud-grid {
+    opacity: 1;
+  }
+
+  &:hover .hud-veil {
+    opacity: 0;
+  }
+`;
+const Grid = styled.div.attrs({ className: 'hud-grid' }) `
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 8px 12px;
+  transition: opacity 0.2s ease;
+`;
+const MetaGrid = styled.div `
+  display: grid;
+  grid-template-columns: repeat(3, minmax(58px, 1fr));
+  gap: 8px 12px;
+  margin-bottom: 10px;
+  padding-bottom: 10px;
+  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
+`;
+const Label = styled.div `
+  font-size: 9px;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  color: var(--brand-text-secondary);
+`;
+const Value = styled.div `
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--brand-text-primary);
+`;
+const HudVeil = styled.div `
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.14em;
+  color: var(--brand-text-secondary);
+  opacity: ${(props) => (props.$visible ? 0.7 : 0)};
+  transition: opacity 0.2s ease;
+`;
+const ScaleLegend = styled.div `
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 10px;
+  padding-bottom: 10px;
+  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
+`;
+const ScaleBar = styled.div `
+  position: relative;
+  width: 84px;
+  height: 10px;
+  flex: 0 0 auto;
+
+  &::before {
+    content: '';
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 4px;
+    border-top: 2px solid rgba(15, 23, 42, 0.9);
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+    inset: 0;
+    background:
+      linear-gradient(rgba(15, 23, 42, 0.9), rgba(15, 23, 42, 0.9)) left center / 2px 10px no-repeat,
+      linear-gradient(rgba(15, 23, 42, 0.9), rgba(15, 23, 42, 0.9)) right center / 2px 10px no-repeat;
+  }
+`;
+export default function SpatialHud({ unitsLabel, sceneSpanLabel, viewWidthLabel, gridStepLabel, scaleBarLabel, distanceToFloorLabel, distanceToCeilingLabel, distanceToNorthLabel, distanceToSouthLabel, distanceToEastLabel, distanceToWestLabel, compassAngleLabel, pitchAngleLabel, veilsEnabled = true, }) {
+    const scaleMetrics = [
+        { label: 'units', value: unitsLabel },
+        { label: 'scene', value: sceneSpanLabel },
+        { label: 'view', value: viewWidthLabel },
+        { label: 'grid', value: gridStepLabel },
+        { label: 'compass', value: compassAngleLabel },
+        { label: 'pitch', value: pitchAngleLabel },
+    ];
+    const metrics = [
+        { label: 'floor', value: distanceToFloorLabel },
+        { label: 'ceiling', value: distanceToCeilingLabel },
+        { label: 'north', value: distanceToNorthLabel },
+        { label: 'south', value: distanceToSouthLabel },
+        { label: 'east', value: distanceToEastLabel },
+        { label: 'west', value: distanceToWestLabel },
+    ];
+    return (_jsx(HudWrapper, { children: _jsxs(HudCard, { "data-veil": veilsEnabled, children: [_jsx(MetaGrid, { children: scaleMetrics.map((metric) => (_jsxs("div", { children: [_jsx(Label, { children: metric.label }), _jsx(Value, { children: metric.value })] }, metric.label))) }), _jsxs(ScaleLegend, { children: [_jsx(ScaleBar, {}), _jsxs("div", { children: [_jsx(Label, { children: "scale" }), _jsx(Value, { children: scaleBarLabel })] })] }), _jsx(Grid, { children: metrics.map((metric) => (_jsxs("div", { children: [_jsx(Label, { children: metric.label }), _jsx(Value, { children: metric.value })] }, metric.label))) }), _jsx(HudVeil, { className: "hud-veil", "$visible": veilsEnabled, children: "distances" })] }) }));
+}

package/dist/StreetviewModeSurface.d.ts

@@ -0,0 +1,40 @@
+export type StreetviewSearchSuggestion = {
+    id: string;
+    label: string;
+    secondaryLabel?: string;
+    center: [number, number];
+};
+export type StreetviewModeSurfaceProps = {
+    panoramaUrl?: string | null;
+    imageAlt?: string;
+    imageCaption?: string | null;
+    locationQuery?: string;
+    captureReady?: boolean;
+    captureLabel?: string;
+    searchPlaceholder?: string;
+    providerLabel?: string;
+    statusLabel?: string;
+    loading?: boolean;
+    error?: string | null;
+    geocoderOptions?: Array<{
+        id: string;
+        label: string;
+    }>;
+    activeGeocoderId?: string;
+    searchSuggestions?: StreetviewSearchSuggestion[];
+    suggestionsOpen?: boolean;
+    suggestionsPending?: boolean;
+    activeSuggestionIndex?: number;
+    onLocationQueryChange?: (query: string) => void;
+    onLocationSearch?: (query: string) => void | Promise<void>;
+    onGeocoderChange?: (providerId: string) => void;
+    onSuggestionSelect?: (suggestion: StreetviewSearchSuggestion) => void;
+    onSuggestionActiveIndexChange?: (index: number) => void;
+    onSuggestionsOpenChange?: (open: boolean) => void;
+};
+export type StreetviewModeSurfaceHandle = {
+    capturePngDataUrl: () => Promise<string>;
+};
+declare const StreetviewModeSurface: import("react").ForwardRefExoticComponent<StreetviewModeSurfaceProps & import("react").RefAttributes<StreetviewModeSurfaceHandle>>;
+export default StreetviewModeSurface;
+//# sourceMappingURL=StreetviewModeSurface.d.ts.map

package/dist/StreetviewModeSurface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StreetviewModeSurface.d.ts","sourceRoot":"","sources":["../src/StreetviewModeSurface.tsx"],"names":[],"mappings":"AAWA,MAAM,MAAM,0BAA0B,GAAG;IACvC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACvD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,0BAA0B,EAAE,CAAC;IACjD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3D,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtE,6BAA6B,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,uBAAuB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG;IACxC,iBAAiB,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;CAC1C,CAAC;AAiVF,QAAA,MAAM,qBAAqB,oIA6JzB,CAAC;AAEH,eAAe,qBAAqB,CAAC"}