@replohq/sandbox-runtime 1.9.0 → 1.10.1

package/_vendor/replo-utils/lib/fonts.mjs

@@ -184,16 +184,28 @@ function describeFontFile(fileName) {
 }
 function fontFormatFromExtension(extension) {
   const normalized = extension.toLowerCase().replace(/^\./u, "");
-  if (normalized === "woff2") return "woff2";
-  if (normalized === "woff") return "woff";
-  if (normalized === "otf") return "opentype";
-  if (normalized === "ttf") return "truetype";
+  if (normalized === "woff2") {
+    return "woff2";
+  }
+  if (normalized === "woff") {
+    return "woff";
+  }
+  if (normalized === "otf") {
+    return "opentype";
+  }
+  if (normalized === "ttf") {
+    return "truetype";
+  }
   return "woff2";
 }
 function fontFormatFromMimeType(mimeType) {
   const normalized = mimeType.toLowerCase();
-  if (normalized.includes("woff2")) return "woff2";
-  if (normalized.includes("woff")) return "woff";
+  if (normalized.includes("woff2")) {
+    return "woff2";
+  }
+  if (normalized.includes("woff")) {
+    return "woff";
+  }
   if (normalized.includes("otf") || normalized.includes("opentype")) {
     return "opentype";
   }

package/_vendor/schemas/generated/selectMode.d.ts

@@ -34,6 +34,17 @@ export type SelectModeBoundingRect = {
     width: number;
     height: number;
 };
+export type SelectModeHoverRect = {
+    x: number;
+    y: number;
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+    width: number;
+    height: number;
+    isSection?: boolean;
+};
 export type SelectModeSelectionRect = {
     id: string;
     rect: SelectModeBoundingRect;
@@ -77,9 +88,13 @@ export type SelectModeImage = {
 export type SelectedElement = {
     kind: "react-element";
     selector: string;
+    section?: {
+        selector: string;
+    };
     tagName: string;
     elementType: string;
     textContent: string | null;
+    sectionLabel?: string;
     rect: SelectModeBoundingRect;
     textMetrics: SelectModeTextMetrics | null;
     outerHTML: string;

package/_vendor/schemas/generated/selectModeIframeRpc.d.ts

@@ -1,4 +1,4 @@
-import type { SelectModeBoundingRect, DisplayMode, SelectModeSelectionType, SelectModeOptimisticUpdatePayload, SelectModeFormatCommand, SelectableData, SelectModeClickPosition, SelectModeSelectionRect, SelectModeTiptapActiveMarks } from "./selectMode";
+import type { SelectModeBoundingRect, DisplayMode, SelectModeSelectionType, SelectModeOptimisticUpdatePayload, SelectModeFormatCommand, SelectableData, SelectModeHoverRect, SelectModeClickPosition, SelectModeSelectionRect, SelectModeTiptapActiveMarks } from "./selectMode";
 export type InlineEditFeedback = {
     status: "pending" | "unavailable" | "failed";
     rect: SelectModeBoundingRect;
@@ -11,6 +11,16 @@ export type IframeRuntimeBuildMetadata = {
     builtAt: string | null;
 };
 export type SelectModeParentMessage = {
+    method: "expandToSection";
+    data: {
+        targetSelector: string;
+    };
+} | {
+    method: "setSectionPreview";
+    data: {
+        targetSelector: string | null;
+    };
+} | {
     method: "setDisplayMode";
     data: {
         displayMode: DisplayMode;
@@ -67,7 +77,7 @@ export type SelectModeIframeMessage = {
 } | {
     method: "hoverElement";
     data: {
-        rect: SelectModeBoundingRect | null;
+        rect: SelectModeHoverRect | null;
     };
 } | {
     method: "selectedElementRectUpdate";

package/_vendor/schemas/selectMode.d.ts

@@ -46,6 +46,17 @@ export declare const selectModeBoundingRectSchema: z.ZodObject<{
     width: z.ZodNumber;
     height: z.ZodNumber;
 }, z.core.$strip>;
+export declare const selectModeHoverRectSchema: z.ZodObject<{
+    x: z.ZodNumber;
+    y: z.ZodNumber;
+    left: z.ZodNumber;
+    top: z.ZodNumber;
+    right: z.ZodNumber;
+    bottom: z.ZodNumber;
+    width: z.ZodNumber;
+    height: z.ZodNumber;
+    isSection: z.ZodOptional<z.ZodBoolean>;
+}, z.core.$strip>;
 export declare const selectModeSelectionRectSchema: z.ZodObject<{
     id: z.ZodString;
     rect: z.ZodObject<{
@@ -128,9 +139,13 @@ export declare const selectModeImageSchema: z.ZodObject<{
 export declare const selectedElementSchema: z.ZodObject<{
     kind: z.ZodLiteral<"react-element">;
     selector: z.ZodString;
+    section: z.ZodOptional<z.ZodObject<{
+        selector: z.ZodString;
+    }, z.core.$strip>>;
     tagName: z.ZodString;
     elementType: z.ZodString;
     textContent: z.ZodNullable<z.ZodString>;
+    sectionLabel: z.ZodOptional<z.ZodString>;
     rect: z.ZodObject<{
         x: z.ZodNumber;
         y: z.ZodNumber;
@@ -226,9 +241,13 @@ export declare const selectableDataPayloadSchema: z.ZodDiscriminatedUnion<[z.Zod
 export declare const selectableDataSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
     kind: z.ZodLiteral<"react-element">;
     selector: z.ZodString;
+    section: z.ZodOptional<z.ZodObject<{
+        selector: z.ZodString;
+    }, z.core.$strip>>;
     tagName: z.ZodString;
     elementType: z.ZodString;
     textContent: z.ZodNullable<z.ZodString>;
+    sectionLabel: z.ZodOptional<z.ZodString>;
     rect: z.ZodObject<{
         x: z.ZodNumber;
         y: z.ZodNumber;
@@ -314,6 +333,7 @@ export type SelectModeBoundingRect = z.infer<typeof selectModeBoundingRectSchema
 export type SelectModeClickPosition = z.infer<typeof selectModeClickPositionSchema>;
 export type SelectableData = z.infer<typeof selectableDataSchema>;
 export type SelectableDataPayload = z.infer<typeof selectableDataPayloadSchema>;
+export declare function isSelectedSection(data: SelectableData): boolean;
 export declare function transformSelectedElement({ element, offset, scale, }: {
     element: z.infer<typeof selectedElementSchema>;
     offset: RectOffset;
@@ -418,9 +438,13 @@ export declare const selectModeSelectionSchema: z.ZodDiscriminatedUnion<[z.ZodOb
     data: z.ZodDiscriminatedUnion<[z.ZodObject<{
         kind: z.ZodLiteral<"react-element">;
         selector: z.ZodString;
+        section: z.ZodOptional<z.ZodObject<{
+            selector: z.ZodString;
+        }, z.core.$strip>>;
         tagName: z.ZodString;
         elementType: z.ZodString;
         textContent: z.ZodNullable<z.ZodString>;
+        sectionLabel: z.ZodOptional<z.ZodString>;
         rect: z.ZodObject<{
             x: z.ZodNumber;
             y: z.ZodNumber;
@@ -517,9 +541,13 @@ export declare const selectModeSelectionSchema: z.ZodDiscriminatedUnion<[z.ZodOb
     items: z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
         kind: z.ZodLiteral<"react-element">;
         selector: z.ZodString;
+        section: z.ZodOptional<z.ZodObject<{
+            selector: z.ZodString;
+        }, z.core.$strip>>;
         tagName: z.ZodString;
         elementType: z.ZodString;
         textContent: z.ZodNullable<z.ZodString>;
+        sectionLabel: z.ZodOptional<z.ZodString>;
         rect: z.ZodObject<{
             x: z.ZodNumber;
             y: z.ZodNumber;

package/_vendor/schemas/selectMode.mjs

@@ -1,4 +1,4 @@
-export { SELECT_MODE_SELECTABLE_ATTRIBUTE, SELECT_MODE_SELECTABLE_PAYLOAD_ATTRIBUTE, displayModeSchema, getIframeOffset, readSelectablePayload, selectModeBoundingRectSchema, selectModeClickPositionSchema, selectModeDefinedStyleSchema, selectModeFiberChainEntrySchema, selectModeFormatCommandSchema, selectModeImageSchema, selectModeImageScopeSchema, selectModeImageSourceSchema, selectModeInlineTextStatusSchema, selectModeOptimisticUpdatePayloadSchema, selectModeSelectionRectSchema, selectModeSelectionSchema, selectModeSelectionTypeSchema, selectModeSourceLocationSchema, selectModeStyleAtRuleSchema, selectModeStyleVariantSchema, selectModeTextMetricsSchema, selectModeTiptapActiveMarksSchema, selectableDataPayloadSchema, selectableDataSchema, selectablePlanDataSchema, selectablePlanPayloadSchema, selectedElementSchema, transformPoint, transformRect, transformSelectableData, transformSelectedElement } from '../../chunk-XWNBKE63.mjs';
+export { SELECT_MODE_SELECTABLE_ATTRIBUTE, SELECT_MODE_SELECTABLE_PAYLOAD_ATTRIBUTE, displayModeSchema, getIframeOffset, isSelectedSection, readSelectablePayload, selectModeBoundingRectSchema, selectModeClickPositionSchema, selectModeDefinedStyleSchema, selectModeFiberChainEntrySchema, selectModeFormatCommandSchema, selectModeHoverRectSchema, selectModeImageSchema, selectModeImageScopeSchema, selectModeImageSourceSchema, selectModeInlineTextStatusSchema, selectModeOptimisticUpdatePayloadSchema, selectModeSelectionRectSchema, selectModeSelectionSchema, selectModeSelectionTypeSchema, selectModeSourceLocationSchema, selectModeStyleAtRuleSchema, selectModeStyleVariantSchema, selectModeTextMetricsSchema, selectModeTiptapActiveMarksSchema, selectableDataPayloadSchema, selectableDataSchema, selectablePlanDataSchema, selectablePlanPayloadSchema, selectedElementSchema, transformPoint, transformRect, transformSelectableData, transformSelectedElement } from '../../chunk-NBVMONRN.mjs';
 import '../../chunk-JUKCUPQ6.mjs';
 import '../../chunk-FLYEIRFK.mjs';
 import '../../chunk-TESFJQID.mjs';

package/_vendor/schemas/selectModeIframeRpc.d.ts

@@ -37,6 +37,7 @@ export declare const selectModeEventInputSchemas: {
             bottom: z.ZodNumber;
             width: z.ZodNumber;
             height: z.ZodNumber;
+            isSection: z.ZodOptional<z.ZodBoolean>;
         }, z.core.$strip>>;
     }, z.core.$strip>;
     areaSelection: z.ZodObject<{
@@ -53,9 +54,13 @@ export declare const selectModeEventInputSchemas: {
         items: z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
             kind: z.ZodLiteral<"react-element">;
             selector: z.ZodString;
+            section: z.ZodOptional<z.ZodObject<{
+                selector: z.ZodString;
+            }, z.core.$strip>>;
             tagName: z.ZodString;
             elementType: z.ZodString;
             textContent: z.ZodNullable<z.ZodString>;
+            sectionLabel: z.ZodOptional<z.ZodString>;
             rect: z.ZodObject<{
                 x: z.ZodNumber;
                 y: z.ZodNumber;
@@ -175,13 +180,29 @@ export declare const selectModeEventInputSchemas: {
     }, z.core.$strip>;
 };
 export declare const websiteBuilderToPreviewIframeMethodConfig: {
+    expandToSection: {
+        inputSchema: z.ZodObject<{
+            targetSelector: z.ZodString;
+        }, z.core.$strip>;
+        outputSchema: z.ZodVoid;
+    };
+    setSectionPreview: {
+        inputSchema: z.ZodObject<{
+            targetSelector: z.ZodNullable<z.ZodString>;
+        }, z.core.$strip>;
+        outputSchema: z.ZodVoid;
+    };
     symbolicateSelectedElement: {
         inputSchema: z.ZodObject<{
             kind: z.ZodLiteral<"react-element">;
             selector: z.ZodString;
+            section: z.ZodOptional<z.ZodObject<{
+                selector: z.ZodString;
+            }, z.core.$strip>>;
             tagName: z.ZodString;
             elementType: z.ZodString;
             textContent: z.ZodNullable<z.ZodString>;
+            sectionLabel: z.ZodOptional<z.ZodString>;
             rect: z.ZodObject<{
                 x: z.ZodNumber;
                 y: z.ZodNumber;
@@ -252,9 +273,13 @@ export declare const websiteBuilderToPreviewIframeMethodConfig: {
         outputSchema: z.ZodObject<{
             kind: z.ZodLiteral<"react-element">;
             selector: z.ZodString;
+            section: z.ZodOptional<z.ZodObject<{
+                selector: z.ZodString;
+            }, z.core.$strip>>;
             tagName: z.ZodString;
             elementType: z.ZodString;
             textContent: z.ZodNullable<z.ZodString>;
+            sectionLabel: z.ZodOptional<z.ZodString>;
             rect: z.ZodObject<{
                 x: z.ZodNumber;
                 y: z.ZodNumber;
@@ -444,9 +469,13 @@ export declare const previewIframeToWebsiteBuilderMethodConfig: {
             element: z.ZodObject<{
                 kind: z.ZodLiteral<"react-element">;
                 selector: z.ZodString;
+                section: z.ZodOptional<z.ZodObject<{
+                    selector: z.ZodString;
+                }, z.core.$strip>>;
                 tagName: z.ZodString;
                 elementType: z.ZodString;
                 textContent: z.ZodNullable<z.ZodString>;
+                sectionLabel: z.ZodOptional<z.ZodString>;
                 rect: z.ZodObject<{
                     x: z.ZodNumber;
                     y: z.ZodNumber;
@@ -535,9 +564,13 @@ export declare const previewIframeToWebsiteBuilderMethodConfig: {
             data: z.ZodDiscriminatedUnion<[z.ZodObject<{
                 kind: z.ZodLiteral<"react-element">;
                 selector: z.ZodString;
+                section: z.ZodOptional<z.ZodObject<{
+                    selector: z.ZodString;
+                }, z.core.$strip>>;
                 tagName: z.ZodString;
                 elementType: z.ZodString;
                 textContent: z.ZodNullable<z.ZodString>;
+                sectionLabel: z.ZodOptional<z.ZodString>;
                 rect: z.ZodObject<{
                     x: z.ZodNumber;
                     y: z.ZodNumber;
@@ -633,6 +666,7 @@ export declare const previewIframeToWebsiteBuilderMethodConfig: {
                 bottom: z.ZodNumber;
                 width: z.ZodNumber;
                 height: z.ZodNumber;
+                isSection: z.ZodOptional<z.ZodBoolean>;
             }, z.core.$strip>>;
         }, z.core.$strip>;
         outputSchema: z.ZodVoid;
@@ -714,9 +748,13 @@ export declare const previewIframeToWebsiteBuilderMethodConfig: {
             items: z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
                 kind: z.ZodLiteral<"react-element">;
                 selector: z.ZodString;
+                section: z.ZodOptional<z.ZodObject<{
+                    selector: z.ZodString;
+                }, z.core.$strip>>;
                 tagName: z.ZodString;
                 elementType: z.ZodString;
                 textContent: z.ZodNullable<z.ZodString>;
+                sectionLabel: z.ZodOptional<z.ZodString>;
                 rect: z.ZodObject<{
                     x: z.ZodNumber;
                     y: z.ZodNumber;
@@ -851,6 +889,16 @@ export declare const previewIframeToWebsiteBuilderMethodConfig: {
     };
 };
 export declare const selectModeParentMessageSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
+    method: z.ZodLiteral<"expandToSection">;
+    data: z.ZodObject<{
+        targetSelector: z.ZodString;
+    }, z.core.$strip>;
+}, z.core.$strip>, z.ZodObject<{
+    method: z.ZodLiteral<"setSectionPreview">;
+    data: z.ZodObject<{
+        targetSelector: z.ZodNullable<z.ZodString>;
+    }, z.core.$strip>;
+}, z.core.$strip>, z.ZodObject<{
     method: z.ZodLiteral<"setDisplayMode">;
     data: z.ZodObject<{
         displayMode: z.ZodEnum<{
@@ -961,9 +1009,13 @@ export declare const selectModeIframeMessageSchema: z.ZodDiscriminatedUnion<[z.Z
         data: z.ZodDiscriminatedUnion<[z.ZodObject<{
             kind: z.ZodLiteral<"react-element">;
             selector: z.ZodString;
+            section: z.ZodOptional<z.ZodObject<{
+                selector: z.ZodString;
+            }, z.core.$strip>>;
             tagName: z.ZodString;
             elementType: z.ZodString;
             textContent: z.ZodNullable<z.ZodString>;
+            sectionLabel: z.ZodOptional<z.ZodString>;
             rect: z.ZodObject<{
                 x: z.ZodNumber;
                 y: z.ZodNumber;
@@ -1058,6 +1110,7 @@ export declare const selectModeIframeMessageSchema: z.ZodDiscriminatedUnion<[z.Z
             bottom: z.ZodNumber;
             width: z.ZodNumber;
             height: z.ZodNumber;
+            isSection: z.ZodOptional<z.ZodBoolean>;
         }, z.core.$strip>>;
     }, z.core.$strip>;
 }, z.core.$strip>, z.ZodObject<{
@@ -1135,9 +1188,13 @@ export declare const selectModeIframeMessageSchema: z.ZodDiscriminatedUnion<[z.Z
         items: z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
             kind: z.ZodLiteral<"react-element">;
             selector: z.ZodString;
+            section: z.ZodOptional<z.ZodObject<{
+                selector: z.ZodString;
+            }, z.core.$strip>>;
             tagName: z.ZodString;
             elementType: z.ZodString;
             textContent: z.ZodNullable<z.ZodString>;
+            sectionLabel: z.ZodOptional<z.ZodString>;
             rect: z.ZodObject<{
                 x: z.ZodNumber;
                 y: z.ZodNumber;

package/_vendor/schemas/selectModeIframeRpc.mjs

@@ -1,4 +1,4 @@
-import { selectModeBoundingRectSchema, selectModeTiptapActiveMarksSchema, selectModeSelectionRectSchema, selectableDataSchema, selectModeFormatCommandSchema, selectModeOptimisticUpdatePayloadSchema, selectModeSelectionTypeSchema, displayModeSchema, selectModeClickPositionSchema, selectedElementSchema } from '../../chunk-XWNBKE63.mjs';
+import { selectModeBoundingRectSchema, selectModeTiptapActiveMarksSchema, selectModeSelectionRectSchema, selectableDataSchema, selectModeHoverRectSchema, selectModeFormatCommandSchema, selectModeOptimisticUpdatePayloadSchema, selectModeSelectionTypeSchema, displayModeSchema, selectModeClickPositionSchema, selectedElementSchema } from '../../chunk-NBVMONRN.mjs';
 import '../../chunk-JUKCUPQ6.mjs';
 import '../../chunk-FLYEIRFK.mjs';
 import '../../chunk-TESFJQID.mjs';
@@ -20,7 +20,7 @@ var iframeRuntimeBuildMetadataSchema = z.object({
 }).describe("IframeRuntimeBuildMetadata");
 var selectModeEventInputSchemas = {
   hover: z.object({
-    rect: selectModeBoundingRectSchema.nullable()
+    rect: selectModeHoverRectSchema.nullable()
   }),
   areaSelection: z.object({
     rect: selectModeBoundingRectSchema,
@@ -37,6 +37,14 @@ var selectModeEventInputSchemas = {
   })
 };
 var websiteBuilderToPreviewIframeMethodConfig = {
+  expandToSection: {
+    inputSchema: z.object({ targetSelector: z.string() }),
+    outputSchema: z.void()
+  },
+  setSectionPreview: {
+    inputSchema: z.object({ targetSelector: z.string().nullable() }),
+    outputSchema: z.void()
+  },
   symbolicateSelectedElement: {
     inputSchema: selectedElementSchema,
     outputSchema: selectedElementSchema,
@@ -168,6 +176,14 @@ var previewIframeToWebsiteBuilderMethodConfig = {
   }
 };
 var selectModeParentMessageSchema = z.discriminatedUnion("method", [
+  z.object({
+    method: z.literal("expandToSection"),
+    data: websiteBuilderToPreviewIframeMethodConfig.expandToSection.inputSchema
+  }),
+  z.object({
+    method: z.literal("setSectionPreview"),
+    data: websiteBuilderToPreviewIframeMethodConfig.setSectionPreview.inputSchema
+  }),
   z.object({
     method: z.literal("setDisplayMode"),
     data: websiteBuilderToPreviewIframeMethodConfig.setDisplayMode.inputSchema

package/_vendor/schemas/selectModeImage.mjs

@@ -1,8 +1,12 @@
 function getImageEditSnapshot(image, baseURI) {
-  if (!image) return null;
+  if (!image) {
+    return null;
+  }
   const baseUrl = baseURI ?? (URL.canParse(image.currentSrc) ? image.currentSrc : "https://replo.invalid");
   const normalizeUrl = (url) => {
-    if (!url) return url;
+    if (!url) {
+      return url;
+    }
     try {
       const parsed = new URL(url, baseUrl);
       const original = parsed.pathname.endsWith("/_next/image") ? parsed.searchParams.get("url") : null;

package/buildMetadata.js

@@ -1,7 +1,7 @@
 export const BUILD_METADATA = {
   "packageName": "@replohq/sandbox-runtime",
-  "version": "1.9.0",
+  "version": "1.10.1",
   "branch": "HEAD",
-  "commit": "455eef2903f4cc6a8f457d5ec77be1e1dc95aad9",
-  "builtAt": "2026-09-25T00:24:57.880Z"
+  "commit": "5ce66a48693aaff17decf0e5a29f032c61aa2a12",
+  "builtAt": "2026-09-26T19:04:09.729Z"
 };

package/{chunk-XWNBKE63.mjs → chunk-NBVMONRN.mjs}

@@ -48,6 +48,7 @@ var selectModeBoundingRectSchema = z.object({
   width: z.number(),
   height: z.number()
 }).describe("SelectModeBoundingRect");
+var selectModeHoverRectSchema = selectModeBoundingRectSchema.extend({ isSection: z.boolean().optional() }).describe("SelectModeHoverRect");
 var selectModeSelectionRectSchema = z.object({
   id: z.string(),
   rect: selectModeBoundingRectSchema
@@ -122,9 +123,11 @@ var selectModeImageSchema = z.object({
 var selectedElementSchema = z.object({
   kind: z.literal("react-element"),
   selector: z.string(),
+  section: z.object({ selector: z.string() }).optional(),
   tagName: z.string(),
   elementType: z.string(),
   textContent: z.string().nullable(),
+  sectionLabel: z.string().optional(),
   rect: selectModeBoundingRectSchema,
   textMetrics: selectModeTextMetricsSchema.nullable(),
   outerHTML: z.string(),
@@ -145,6 +148,9 @@ var selectablePlanDataSchema = z.object({
 var selectablePlanPayloadSchema = selectablePlanDataSchema.omit({ rect: true }).describe("SelectablePlanPayload");
 var selectableDataPayloadSchema = z.discriminatedUnion("kind", [selectablePlanPayloadSchema]).describe("SelectableDataPayload");
 var selectableDataSchema = z.discriminatedUnion("kind", [selectedElementSchema, selectablePlanDataSchema]).describe("SelectableData");
+function isSelectedSection(data) {
+  return data.kind === "react-element" && data.selector === data.section?.selector;
+}
 function transformSelectedElement({
   element,
   offset,
@@ -232,4 +238,4 @@ var selectModeSelectionSchema = z.discriminatedUnion("type", [
   })
 ]).describe("SelectModeSelection");
 
-export { SELECT_MODE_SELECTABLE_ATTRIBUTE, SELECT_MODE_SELECTABLE_PAYLOAD_ATTRIBUTE, displayModeSchema, getIframeOffset, readSelectablePayload, selectModeBoundingRectSchema, selectModeClickPositionSchema, selectModeDefinedStyleSchema, selectModeFiberChainEntrySchema, selectModeFormatCommandSchema, selectModeImageSchema, selectModeImageScopeSchema, selectModeImageSourceSchema, selectModeInlineTextStatusSchema, selectModeOptimisticUpdatePayloadSchema, selectModeSelectionRectSchema, selectModeSelectionSchema, selectModeSelectionTypeSchema, selectModeSourceLocationSchema, selectModeStyleAtRuleSchema, selectModeStyleVariantSchema, selectModeTextMetricsSchema, selectModeTiptapActiveMarksSchema, selectableDataPayloadSchema, selectableDataSchema, selectablePlanDataSchema, selectablePlanPayloadSchema, selectedElementSchema, transformPoint, transformRect, transformSelectableData, transformSelectedElement };
+export { SELECT_MODE_SELECTABLE_ATTRIBUTE, SELECT_MODE_SELECTABLE_PAYLOAD_ATTRIBUTE, displayModeSchema, getIframeOffset, isSelectedSection, readSelectablePayload, selectModeBoundingRectSchema, selectModeClickPositionSchema, selectModeDefinedStyleSchema, selectModeFiberChainEntrySchema, selectModeFormatCommandSchema, selectModeHoverRectSchema, selectModeImageSchema, selectModeImageScopeSchema, selectModeImageSourceSchema, selectModeInlineTextStatusSchema, selectModeOptimisticUpdatePayloadSchema, selectModeSelectionRectSchema, selectModeSelectionSchema, selectModeSelectionTypeSchema, selectModeSourceLocationSchema, selectModeStyleAtRuleSchema, selectModeStyleVariantSchema, selectModeTextMetricsSchema, selectModeTiptapActiveMarksSchema, selectableDataPayloadSchema, selectableDataSchema, selectablePlanDataSchema, selectablePlanPayloadSchema, selectedElementSchema, transformPoint, transformRect, transformSelectableData, transformSelectedElement };

package/design-library-preview/DesignLibraryPreview.js

@@ -14,9 +14,13 @@ function DesignLibraryPreview() {
   const ownsDefaultFont = useRef(false);
   useEffect(() => {
     const handleMessage = (event) => {
-      if (!isAllowedEditorMessage(event)) return;
+      if (!isAllowedEditorMessage(event)) {
+        return;
+      }
       const parsed = designLibraryPreviewMessageSchema.safeParse(event.data);
-      if (!parsed.success) return;
+      if (!parsed.success) {
+        return;
+      }
       const { cssVars, fonts, defaultFontCssVar } = parsed.data;
       const root = document.documentElement;
       const nextVars = { ...cssVars };
@@ -25,7 +29,9 @@ function DesignLibraryPreview() {
       }
       const owned = ownedKeys.current ?? /* @__PURE__ */ new Set();
       for (const key of owned) {
-        if (!(key in nextVars)) root.style.removeProperty(key);
+        if (!(key in nextVars)) {
+          root.style.removeProperty(key);
+        }
       }
       ownedKeys.current = new Set(Object.keys(nextVars));
       for (const [key, value] of Object.entries(nextVars)) {
@@ -44,7 +50,9 @@ function DesignLibraryPreview() {
         }
       }
       for (const href of nextHrefs) {
-        if (links.has(href)) continue;
+        if (links.has(href)) {
+          continue;
+        }
         const link = document.createElement("link");
         link.rel = "stylesheet";
         link.href = href;
@@ -62,9 +70,13 @@ function DesignLibraryPreview() {
         }
       }
       for (const font of customFonts) {
-        if (!font.faceUrl) continue;
+        if (!font.faceUrl) {
+          continue;
+        }
         const existing = faces.get(font.family);
-        if (existing?.url === font.faceUrl) continue;
+        if (existing?.url === font.faceUrl) {
+          continue;
+        }
         existing?.style.remove();
         const style = document.createElement("style");
         style.dataset[FONT_LINK_DATA_KEY] = "";

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@replohq/sandbox-runtime",
-  "version": "1.9.0",
+  "version": "1.10.1",
   "reploBuild": {
     "packageName": "@replohq/sandbox-runtime",
-    "version": "1.9.0",
+    "version": "1.10.1",
     "branch": "HEAD",
-    "commit": "455eef2903f4cc6a8f457d5ec77be1e1dc95aad9",
-    "builtAt": "2026-09-25T00:24:57.880Z"
+    "commit": "5ce66a48693aaff17decf0e5a29f032c61aa2a12",
+    "builtAt": "2026-09-26T19:04:09.729Z"
   },
   "description": "Replo sandbox runtime — editor integration for agent-built Next.js sites.",
   "license": "SEE LICENSE IN LICENSE",

package/select-mode/EditorSelection.js

@@ -18,6 +18,8 @@ function EditorSelection() {
   const store = useSelectModeStore();
   const displayMode = useDisplayMode();
   const {
+    expandToSection,
+    setSectionPreview,
     formatCommand,
     postSelectedElementSnapshot,
     revertInlineEdit,
@@ -38,7 +40,9 @@ function EditorSelection() {
     const scheduleSnapshot = () => {
       clearTimeout(refreshTimeout);
       refreshTimeout = setTimeout(() => {
-        if (store.getState().editingElement) return;
+        if (store.getState().editingElement) {
+          return;
+        }
         if (postSelectedElementSnapshot()) {
           clearTimeout(missingTimeout);
           missingTimeout = void 0;
@@ -54,15 +58,26 @@ function EditorSelection() {
       }, 250);
     };
     const observer = new MutationObserver((records) => {
-      const session = store.getState().interactionSession;
-      if (store.getState().editingElement || session.type !== "element") return;
+      const {
+        actions,
+        editingElement,
+        interactionSession: session,
+        sectionPreviewElement
+      } = store.getState();
+      if (sectionPreviewElement && !sectionPreviewElement.isConnected) {
+        actions.setSectionPreview({ targetSelector: null });
+      }
+      if (editingElement || session.type !== "element") {
+        return;
+      }
       if (!session.element.isConnected || records.some((record) => session.element.contains(record.target))) {
         scheduleSnapshot();
       }
     });
     const watchRender = () => {
-      if (store.getState().editingElement || store.getState().interactionSession.type !== "element")
+      if (store.getState().editingElement || store.getState().interactionSession.type !== "element") {
         return;
+      }
       clearTimeout(observationTimeout);
       observer.observe(document.body, {
         subtree: true,
@@ -118,6 +133,8 @@ function EditorSelection() {
   useParentMessaging({
     applyOptimisticUpdate,
     markCommitted,
+    onExpandToSection: expandToSection,
+    onSetSectionPreview: setSectionPreview,
     onExitEditMode: revertInlineEdit,
     onFormatCommand: formatCommand,
     resolveSessionOverrides,