@industry-theme/file-city-panel 0.5.64 → 0.5.66

package/dist/panels/FileCityTrailExplorerPanel/FileCityTrailExplorerPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileCityTrailExplorerPanel.d.ts","sourceRoot":"","sources":["../../../src/panels/FileCityTrailExplorerPanel/FileCityTrailExplorerPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,8BAA8B,CAAC;AAiBtC,OAAO,KAAK,EAEV,oCAAoC,EAErC,MAAM,wCAAwC,CAAC;AA4BhD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,EAAE,CAC/C,oCAAoC,CA+ErC,CAAC"}
+{"version":3,"file":"FileCityTrailExplorerPanel.d.ts","sourceRoot":"","sources":["../../../src/panels/FileCityTrailExplorerPanel/FileCityTrailExplorerPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,8BAA8B,CAAC;AAiBtC,OAAO,KAAK,EAEV,oCAAoC,EAErC,MAAM,wCAAwC,CAAC;AA2BhD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,EAAE,CAC/C,oCAAoC,CA+ErC,CAAC"}

package/dist/panels/FileCityTrailExplorerPanel/overlays/TrailMarkdownOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TrailMarkdownOverlay.d.ts","sourceRoot":"","sources":["../../../../src/panels/FileCityTrailExplorerPanel/overlays/TrailMarkdownOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,cAAc;IAC7B,kEAAkE;IAClE,QAAQ,EAAE,MAAM,CAAC;IACjB,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,qEAAqE;IACrE,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B,kDAAkD;IAClD,UAAU,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,4DAA4D;IAC5D,QAAQ,EAAE,OAAO,CAAC;IAClB,uEAAuE;IACvE,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CACrD;AAED,MAAM,WAAW,yBAAyB;IACxC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,8EAA8E;IAC9E,QAAQ,EAAE,MAAM,CAAC;IACjB,mEAAmE;IACnE,aAAa,EAAE,MAAM,CAAC;IACtB,4FAA4F;IAC5F,YAAY,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACzC;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;OAGG;IACH,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,EAAE,CAAC;CAC1B;AAQD,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CA4OpE,CAAC"}
+{"version":3,"file":"TrailMarkdownOverlay.d.ts","sourceRoot":"","sources":["../../../../src/panels/FileCityTrailExplorerPanel/overlays/TrailMarkdownOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,cAAc;IAC7B,kEAAkE;IAClE,QAAQ,EAAE,MAAM,CAAC;IACjB,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,qEAAqE;IACrE,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B,kDAAkD;IAClD,UAAU,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,4DAA4D;IAC5D,QAAQ,EAAE,OAAO,CAAC;IAClB,uEAAuE;IACvE,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CACrD;AAED,MAAM,WAAW,yBAAyB;IACxC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,8EAA8E;IAC9E,QAAQ,EAAE,MAAM,CAAC;IACjB,mEAAmE;IACnE,aAAa,EAAE,MAAM,CAAC;IACtB,4FAA4F;IAC5F,YAAY,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACzC;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;OAGG;IACH,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,EAAE,CAAC;CAC1B;AAQD,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAoPpE,CAAC"}

package/dist/panels.bundle.js

@@ -258096,31 +258096,43 @@ const TrailMarkdownOverlay = ({
             ]
           }
         ) : null,
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsxs(
           "div",
           {
             style: {
               flex: 1,
               minHeight: 0,
-              maxHeight: files && files.length > 0 ? "30%" : void 0,
-              position: "relative"
+              overflowY: "auto",
+              display: "flex",
+              flexDirection: "column"
             },
-            children: /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0 }, children: /* @__PURE__ */ jsx(
-              IndustryMarkdownSlide,
-              {
-                content: body,
-                slideIdPrefix,
-                slideIndex: 0,
-                isVisible: true,
-                theme: theme2,
-                transparentBackground: true,
-                enableKeyboardScrolling: false
-              }
-            ) })
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    position: "relative",
+                    flex: "0 0 100%"
+                  },
+                  children: /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0 }, children: /* @__PURE__ */ jsx(
+                    IndustryMarkdownSlide,
+                    {
+                      content: body,
+                      slideIdPrefix,
+                      slideIndex: 0,
+                      isVisible: true,
+                      theme: theme2,
+                      transparentBackground: true,
+                      enableKeyboardScrolling: false
+                    }
+                  ) })
+                }
+              ),
+              nav ? /* @__PURE__ */ jsx(TrailMarkdownOverlayFooter, { nav }) : null,
+              files && files.length > 0 ? /* @__PURE__ */ jsx(TrailFilesList, { files }) : null
+            ]
           }
         ),
-        nav ? /* @__PURE__ */ jsx(TrailMarkdownOverlayFooter, { nav }) : null,
-        files && files.length > 0 ? /* @__PURE__ */ jsx(TrailFilesList, { files }) : null,
         /* @__PURE__ */ jsx(
           "div",
           {
@@ -258163,14 +258175,14 @@ const TrailFilesList = ({ files }) => {
     {
       style: {
         borderTop: `1px solid ${theme2.colors.border}`,
-        // Markdown body is capped at 50% above; files take the rest
-        // of the remaining column. Grows past 50% if the summary is
-        // shorter than its cap (the markdown body shrinks below 50%
-        // to accommodate, since `max-height` doesn't force it).
-        flex: 1,
+        // Lives inside the markdown body's scroll container, below
+        // the slide and Start/nav footer. Sized to its content with
+        // a 20% floor (of the scroll container's visible height) so
+        // it always feels like a substantial section once revealed.
+        flex: "0 0 auto",
+        minHeight: "20%",
         display: "flex",
-        flexDirection: "column",
-        minHeight: 0
+        flexDirection: "column"
       },
       children: [
         /* @__PURE__ */ jsx(
@@ -258188,7 +258200,7 @@ const TrailFilesList = ({ files }) => {
             children: "Files in this trail"
           }
         ),
-        /* @__PURE__ */ jsx("div", { style: { overflowY: "auto", minHeight: 0, padding: "0 6px 8px" }, children: files.map((file) => {
+        /* @__PURE__ */ jsx("div", { style: { padding: "0 6px 8px" }, children: files.map((file) => {
           const fileName = file.sourcePath.split("/").pop() ?? file.sourcePath;
           const dir = file.sourcePath.slice(
             0,
@@ -258684,7 +258696,6 @@ const pierreStyle = {
 };
 const SEQUENCE_DRAWER_HEIGHT_PCT = 45;
 const SNIPPET_PANE_WIDTH_PX = 460;
-const HEADER_HEIGHT_PX = 48;
 const PANEL_TRANSITION_MS = 280;
 const THREE_D_TOGGLE_DISABLED = true;
 const FileCityTrailExplorerPanel = ({ context, actions }) => {
@@ -258766,6 +258777,7 @@ const FileCityTrailSequenceLayout = ({
     return;
   }, [hasLineCounts]);
   const effectiveShow3D = false;
+  const [viewMode, setViewMode] = React.useState("city");
   const [showSequenceDrawer, setShowSequenceDrawer] = React.useState(false);
   const [drawerHeightOverridePct, setDrawerHeightOverridePct] = React.useState(null);
   const [isResizingDrawer, setIsResizingDrawer] = React.useState(false);
@@ -259086,16 +259098,28 @@ const FileCityTrailSequenceLayout = ({
               setDrawerHeightOverridePct(null);
               setShowSequenceDrawer((v) => !v);
             },
-            canExit: selectedMarkerId != null || showSequenceDrawer || snippetExpanded,
+            canExit: selectedMarkerId != null || showSequenceDrawer || snippetExpanded || viewMode !== "city",
             onExitTrail: () => {
               onSelectMarker(null);
               setShowSequenceDrawer(false);
               setDrawerHeightOverridePct(null);
               setSnippetExpanded(false);
-            }
+              setViewMode("city");
+            },
+            viewMode,
+            onSetViewMode: setViewMode
           }
         ),
-        /* @__PURE__ */ jsxs(
+        viewMode === "doc" ? /* @__PURE__ */ jsx(
+          TrailDocumentView,
+          {
+            markers: markersForThisRepo,
+            summary: trail2.summary,
+            readFile,
+            selectedMarkerId,
+            onSelectMarker
+          }
+        ) : /* @__PURE__ */ jsxs(
           "div",
           {
             ref: containerRef,
@@ -259643,6 +259667,251 @@ const SidePaneFrame = React.forwardRef(
     );
   }
 );
+const TrailDocumentView = ({
+  markers,
+  summary,
+  readFile,
+  selectedMarkerId,
+  onSelectMarker
+}) => {
+  const { theme: theme2 } = useTheme();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        flex: 1,
+        minHeight: 0,
+        overflowY: "auto",
+        overflowX: "hidden",
+        padding: "24px 32px 64px",
+        background: theme2.colors.background
+      },
+      children: /* @__PURE__ */ jsxs("div", { style: { maxWidth: 880, margin: "0 auto" }, children: [
+        summary ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontFamily: theme2.fonts.body,
+              fontSize: theme2.fontSizes[1],
+              lineHeight: 1.6,
+              color: theme2.colors.text,
+              whiteSpace: "pre-wrap",
+              marginBottom: 32,
+              paddingBottom: 24,
+              borderBottom: `1px solid ${theme2.colors.border}`
+            },
+            children: summary
+          }
+        ) : null,
+        markers.length === 0 ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontFamily: theme2.fonts.body,
+              fontSize: theme2.fontSizes[1],
+              color: theme2.colors.textSecondary
+            },
+            children: "No markers in this repo."
+          }
+        ) : markers.map((marker, idx) => /* @__PURE__ */ jsx(
+          TrailDocumentCard,
+          {
+            index: idx,
+            total: markers.length,
+            marker,
+            readFile,
+            isActive: marker.id === selectedMarkerId,
+            onActivate: () => onSelectMarker(
+              marker.id === selectedMarkerId ? null : marker.id
+            )
+          },
+          marker.id
+        ))
+      ] })
+    }
+  );
+};
+const TrailDocumentCard = ({
+  index: index2,
+  total,
+  marker,
+  readFile,
+  isActive,
+  onActivate
+}) => {
+  const { theme: theme2 } = useTheme();
+  const fileName = marker.sourcePath ? marker.sourcePath.split("/").pop() ?? marker.sourcePath : null;
+  const headingLabel = marker.label ?? `Marker ${index2 + 1}`;
+  const snippet2 = marker.snippet;
+  const [snippetExpanded, setSnippetExpanded] = React.useState(false);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        marginBottom: 32,
+        border: `1px solid ${isActive ? theme2.colors.accent : theme2.colors.border}`,
+        borderRadius: theme2.radii[3],
+        background: theme2.colors.background,
+        boxShadow: isActive ? `0 0 0 2px ${withAlpha(theme2.colors.accent, 0.18)}` : "none",
+        overflow: "hidden"
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: onActivate,
+            title: isActive ? "Clear selection" : "Select this marker on the city view",
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "flex-start",
+              gap: 4,
+              width: "100%",
+              textAlign: "left",
+              padding: "16px 20px",
+              background: "transparent",
+              border: "none",
+              borderBottom: `1px solid ${theme2.colors.border}`,
+              cursor: "pointer",
+              color: theme2.colors.text
+            },
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    fontFamily: theme2.fonts.body,
+                    fontSize: theme2.fontSizes[0],
+                    color: theme2.colors.textSecondary,
+                    letterSpacing: "0.04em",
+                    textTransform: "uppercase"
+                  },
+                  children: [
+                    index2 + 1,
+                    " / ",
+                    total
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    fontFamily: theme2.fonts.heading,
+                    fontSize: theme2.fontSizes[2],
+                    fontWeight: theme2.fontWeights.semibold,
+                    color: theme2.colors.text
+                  },
+                  children: headingLabel
+                }
+              ),
+              marker.sourcePath ? /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    fontFamily: theme2.fonts.monospace,
+                    fontSize: theme2.fontSizes[0],
+                    color: theme2.colors.textSecondary
+                  },
+                  children: marker.sourcePath
+                }
+              ) : null
+            ]
+          }
+        ),
+        marker.description ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontFamily: theme2.fonts.body,
+              fontSize: theme2.fontSizes[1],
+              lineHeight: 1.6,
+              color: theme2.colors.text,
+              whiteSpace: "pre-wrap",
+              padding: "16px 20px",
+              borderBottom: snippet2 ? `1px solid ${theme2.colors.border}` : "none"
+            },
+            children: marker.description
+          }
+        ) : null,
+        snippet2 && marker.sourcePath ? /* @__PURE__ */ jsxs("div", { style: { background: theme2.colors.background }, children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => setSnippetExpanded((v) => !v),
+              "aria-expanded": snippetExpanded,
+              title: snippetExpanded ? "Hide snippet" : "Show snippet",
+              style: {
+                display: "flex",
+                alignItems: "center",
+                gap: 8,
+                width: "100%",
+                textAlign: "left",
+                padding: "10px 20px",
+                background: "transparent",
+                border: "none",
+                borderBottom: snippetExpanded ? `1px solid ${theme2.colors.border}` : "none",
+                cursor: "pointer",
+                fontFamily: theme2.fonts.body,
+                fontSize: theme2.fontSizes[0],
+                fontWeight: theme2.fontWeights.medium,
+                color: theme2.colors.textSecondary,
+                letterSpacing: "0.04em",
+                textTransform: "uppercase"
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    "aria-hidden": true,
+                    style: {
+                      display: "inline-block",
+                      width: 10,
+                      transform: snippetExpanded ? "rotate(90deg)" : "rotate(0deg)",
+                      transition: "transform 120ms ease"
+                    },
+                    children: "▶"
+                  }
+                ),
+                snippetExpanded ? "Hide snippet" : "Show snippet"
+              ]
+            }
+          ),
+          snippetExpanded ? /* @__PURE__ */ jsx("div", { style: { padding: 12 }, children: snippet2.kind === "slice" ? /* @__PURE__ */ jsx(
+            TrailSnippetView,
+            {
+              filePath: marker.sourcePath,
+              fileName: fileName ?? marker.sourcePath,
+              startLine: snippet2.startLine,
+              endLine: snippet2.endLine,
+              focusLine: snippet2.focusLine,
+              contextLines: snippet2.contextLines,
+              readFile,
+              background: theme2.colors.background
+            }
+          ) : /* @__PURE__ */ jsx(
+            TrailDiffSnippetView,
+            {
+              filePath: marker.sourcePath,
+              fileName: fileName ?? marker.sourcePath,
+              oldContents: snippet2.oldContents,
+              newContents: snippet2.newContents,
+              readFile,
+              startLine: snippet2.startLine,
+              endLine: snippet2.endLine,
+              focusLine: snippet2.focusLine,
+              contextLines: snippet2.contextLines,
+              diffStyle: snippet2.diffStyle,
+              background: theme2.colors.background
+            }
+          ) }) : null
+        ] }) : null
+      ]
+    }
+  );
+};
 const TrailHeader = ({
   trail: trail2,
   markerCount,
@@ -259652,7 +259921,9 @@ const TrailHeader = ({
   showSequenceDrawer,
   onToggleSequenceDrawer,
   canExit,
-  onExitTrail
+  onExitTrail,
+  viewMode,
+  onSetViewMode
 }) => {
   const { theme: theme2 } = useTheme();
   const toggleButtonStyle = (active) => ({
@@ -259668,11 +259939,28 @@ const TrailHeader = ({
     cursor: "pointer",
     lineHeight: 1.2
   });
+  const segmentStyle = (active, side) => ({
+    flexShrink: 0,
+    fontFamily: theme2.fonts.body,
+    fontSize: theme2.fontSizes[0],
+    fontWeight: theme2.fontWeights.medium,
+    color: active ? theme2.colors.background : theme2.colors.text,
+    background: active ? theme2.colors.accent : "transparent",
+    border: `1px solid ${active ? theme2.colors.accent : theme2.colors.muted}`,
+    borderTopLeftRadius: side === "left" ? theme2.radii[3] : 0,
+    borderBottomLeftRadius: side === "left" ? theme2.radii[3] : 0,
+    borderTopRightRadius: side === "right" ? theme2.radii[3] : 0,
+    borderBottomRightRadius: side === "right" ? theme2.radii[3] : 0,
+    marginLeft: side === "right" ? -1 : 0,
+    padding: "4px 10px",
+    cursor: "pointer",
+    lineHeight: 1.2
+  });
+  const isDoc = viewMode === "doc";
   return /* @__PURE__ */ jsxs(
     "div",
     {
       style: {
-        height: HEADER_HEIGHT_PX,
         padding: "8px 16px",
         borderBottom: `1px solid ${theme2.colors.border}`,
         display: "flex",
@@ -259726,7 +260014,7 @@ const TrailHeader = ({
           }
         ),
         /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
-          /* @__PURE__ */ jsx(
+          isDoc ? null : /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
@@ -259761,7 +260049,7 @@ const TrailHeader = ({
               children: "Exit"
             }
           ),
-          hideToggle ? null : /* @__PURE__ */ jsx(
+          hideToggle || isDoc ? null : /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
@@ -259771,7 +260059,31 @@ const TrailHeader = ({
               style: toggleButtonStyle(show3D),
               children: "3D"
             }
-          )
+          ),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", marginLeft: 6 }, children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => onSetViewMode("city"),
+                "aria-pressed": !isDoc,
+                title: "City view — 3D buildings + sequence drawer",
+                style: segmentStyle(!isDoc, "left"),
+                children: "City"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => onSetViewMode("doc"),
+                "aria-pressed": isDoc,
+                title: "Document view — scroll all markers as one page",
+                style: segmentStyle(isDoc, "right"),
+                children: "Doc"
+              }
+            )
+          ] })
         ] })
       ]
     }