@replohq/sandbox-runtime 1.20.0 → 1.22.0

package/select-mode/symbolicate.js

@@ -229,13 +229,17 @@ async function symbolicateSelectedElement(selectedElement) {
       });
     }
   }
-  let sourceLocation = selectedElement.sourceLocation;
-  if (fiberChain.length === 0 && sourceLocation && isLikelyCompiledLocation(sourceLocation)) {
-    const captured = sourceLocation;
+  const capturedSourceLocation = selectedElement.sourceLocation;
+  let sourceLocation = capturedSourceLocation;
+  const symbolicatedCapture = {
+    location: null
+  };
+  if (sourceLocation && isLikelyCompiledLocation(sourceLocation)) {
     targets.push({
-      location: captured,
+      location: sourceLocation,
       apply: (next) => {
         sourceLocation = next;
+        symbolicatedCapture.location = next;
       }
     });
   }
@@ -249,13 +253,27 @@ async function symbolicateSelectedElement(selectedElement) {
     const frame = extractResolvedFrame(resolved[index] ?? null);
     target.apply(applyResolved({ original: target.location, frame }));
   }
-  if (fiberChain.length > 0) {
-    sourceLocation = findUserSourceLocation(fiberChain) ?? fiberChain[0].sourceLocation;
+  if (!isUserSourceLocation(sourceLocation)) {
+    sourceLocation = findUserSourceLocation(fiberChain) ?? sourceLocation ?? fiberChain[0]?.sourceLocation;
   }
+  const anchor = selectedElement.anchor;
+  const anchorSource = anchor?.source;
+  const resolvedCapture = anchorSource && anchorSource.filePath === capturedSourceLocation?.filePath && anchorSource.line === capturedSourceLocation.lineNumber ? symbolicatedCapture.location : null;
   return {
     ...selectedElement,
     sourceLocation,
-    fiberChain
+    fiberChain,
+    ...anchor && anchorSource && resolvedCapture ? {
+      anchor: {
+        ...anchor,
+        source: {
+          ...anchorSource,
+          filePath: resolvedCapture.filePath,
+          line: resolvedCapture.lineNumber,
+          col: resolvedCapture.columnNumber
+        }
+      }
+    } : {}
   };
 }
 export {

package/chunk-QTGDSYSU.mjs

@@ -1,249 +0,0 @@
-import { exhaustiveSwitch } from './chunk-THOBCJJA.mjs';
-import * as z from 'zod';
-
-function parseJsonOrNull(json) {
-  try {
-    return JSON.parse(json);
-  } catch {
-    return null;
-  }
-}
-
-function parseSchemaOrNull(value, schema) {
-  const parseResult = schema.safeParse(value);
-  return parseResult.success ? parseResult.data : null;
-}
-var SELECT_MODE_SELECTABLE_ATTRIBUTE = "data-replo-selectable";
-var SELECT_MODE_SELECTABLE_PAYLOAD_ATTRIBUTE = "data-replo-selectable-payload";
-var displayModeSchema = z.enum(["browse", "selection"]).describe("DisplayMode");
-var selectModeInlineTextStatusSchema = z.enum(["editable", "dynamic", "translated"]).nullable().describe("SelectModeInlineTextStatus");
-var selectModeTextMetricsSchema = z.object({
-  tightWidth: z.number(),
-  lineCount: z.number(),
-  lineHeight: z.number()
-}).describe("SelectModeTextMetrics");
-var selectModeClickPositionSchema = z.object({
-  x: z.number(),
-  y: z.number()
-}).describe("SelectModeClickPosition");
-var selectModeSourceLocationSchema = z.object({
-  filePath: z.string(),
-  lineNumber: z.number(),
-  columnNumber: z.number().optional(),
-  componentName: z.string().optional()
-}).describe("SelectModeSourceLocation");
-var selectModeFiberChainEntrySchema = z.object({
-  sourceLocation: selectModeSourceLocationSchema,
-  tagName: z.string().optional(),
-  componentName: z.string().optional(),
-  props: z.record(z.string(), z.unknown()).optional()
-}).describe("SelectModeFiberChainEntry");
-var selectModeBoundingRectSchema = z.object({
-  x: z.number(),
-  y: z.number(),
-  left: z.number(),
-  top: z.number(),
-  right: z.number(),
-  bottom: z.number(),
-  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
-}).describe("SelectModeSelectionRect");
-var selectModeStyleAtRuleSchema = z.object({
-  type: z.string(),
-  text: z.string()
-}).describe("SelectModeStyleAtRule");
-var selectModeStyleVariantSchema = z.object({
-  atRules: z.array(selectModeStyleAtRuleSchema),
-  pseudo: z.string().nullable()
-}).describe("SelectModeStyleVariant");
-var selectModeDefinedStyleSchema = z.object({
-  property: z.string(),
-  variant: selectModeStyleVariantSchema.nullable(),
-  className: z.string().nullable(),
-  raw: z.string(),
-  resolved: z.string()
-}).describe("SelectModeDefinedStyle");
-function transformRect({
-  rect,
-  offset,
-  scale = 1
-}) {
-  return {
-    x: rect.x * scale + offset.left,
-    y: rect.y * scale + offset.top,
-    left: rect.left * scale + offset.left,
-    right: rect.right * scale + offset.left,
-    top: rect.top * scale + offset.top,
-    bottom: rect.bottom * scale + offset.top,
-    width: rect.width * scale,
-    height: rect.height * scale
-  };
-}
-function transformPoint({
-  point,
-  offset,
-  scale = 1
-}) {
-  return {
-    x: point.x * scale + offset.left,
-    y: point.y * scale + offset.top
-  };
-}
-function getIframeOffset(iframe) {
-  if (!iframe) {
-    return { left: 0, top: 0 };
-  }
-  const iframeRect = iframe.getBoundingClientRect();
-  return { left: iframeRect.left, top: iframeRect.top };
-}
-var selectModeImageScopeSchema = z.discriminatedUnion("kind", [
-  z.object({ kind: z.literal("all") }),
-  z.object({ kind: z.literal("media"), media: z.string() })
-]).describe("SelectModeImageScope");
-var selectModeImageSourceSchema = z.object({
-  srcSet: z.string(),
-  sizes: z.string(),
-  media: z.string(),
-  type: z.string(),
-  previewUrl: z.string().nullable()
-}).describe("SelectModeImageSource");
-var selectModeImageSchema = z.object({
-  src: z.string(),
-  currentSrc: z.string(),
-  srcSet: z.string(),
-  sizes: z.string(),
-  previewUrl: z.string().nullable(),
-  sources: z.array(selectModeImageSourceSchema)
-}).describe("SelectModeImage");
-var selectModeVideoSchema = z.object({
-  src: z.string(),
-  currentSrc: z.string()
-}).describe("SelectModeVideo");
-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(),
-  image: selectModeImageSchema.optional(),
-  video: selectModeVideoSchema.optional(),
-  definedStyles: z.array(selectModeDefinedStyleSchema).default([]),
-  authoredStyles: z.record(z.string(), z.string()).default({}).describe(
-    "Authored CSS value of the winning declaration per control property, custom properties expanded (e.g. 1.5rem for text-2xl at a wide viewport)."
-  ),
-  inheritedStyles: z.record(z.string(), z.string()).default({}),
-  clickPosition: selectModeClickPositionSchema,
-  sourceLocation: selectModeSourceLocationSchema.optional(),
-  fiberChain: z.array(selectModeFiberChainEntrySchema).default([]),
-  siblingSelectors: z.array(z.string()).default([])
-}).describe("SelectedElement");
-var selectablePlanDataSchema = z.object({
-  kind: z.literal("plan"),
-  planId: z.string(),
-  label: z.string(),
-  rect: selectModeBoundingRectSchema
-}).describe("SelectablePlanData");
-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,
-  scale = 1
-}) {
-  return {
-    ...element,
-    rect: transformRect({ rect: element.rect, offset, scale }),
-    clickPosition: transformPoint({
-      point: element.clickPosition,
-      offset,
-      scale
-    })
-  };
-}
-function transformSelectableData({
-  data,
-  offset
-}) {
-  return exhaustiveSwitch(
-    data,
-    "kind"
-  )({
-    "react-element": (element) => transformSelectedElement({ element, offset }),
-    plan: (plan) => ({
-      ...plan,
-      rect: transformRect({ rect: plan.rect, offset })
-    })
-  });
-}
-function readSelectablePayload(rawPayload) {
-  if (!rawPayload) {
-    return null;
-  }
-  const parsedPayload = parseJsonOrNull(rawPayload);
-  if (!parsedPayload) {
-    return null;
-  }
-  return parseSchemaOrNull(parsedPayload, selectableDataPayloadSchema);
-}
-var selectModeOptimisticUpdatePayloadSchema = z.discriminatedUnion("kind", [
-  z.object({
-    kind: z.literal("image"),
-    image: selectModeImageSchema
-  }),
-  z.object({
-    kind: z.literal("css"),
-    fontSource: z.enum(["google", "site"]).optional(),
-    property: z.string(),
-    value: z.string().nullable()
-  }),
-  z.object({
-    kind: z.literal("content"),
-    innerHTML: z.string()
-  }),
-  z.object({
-    kind: z.literal("attribute"),
-    name: z.string(),
-    value: z.string()
-  })
-]).describe("SelectModeOptimisticUpdatePayload");
-var selectModeTiptapActiveMarksSchema = z.object({
-  bold: z.boolean(),
-  italic: z.boolean(),
-  underline: z.boolean(),
-  strike: z.boolean()
-}).describe("SelectModeTiptapActiveMarks");
-var selectModeFormatCommandSchema = z.enum(["toggleBold", "toggleItalic", "toggleUnderline", "toggleStrike"]).describe("SelectModeFormatCommand");
-var selectModeSelectionTypeSchema = z.enum(["none", "element", "area", "drag"]).describe("SelectModeSelectionType");
-var selectModeSelectionSchema = z.discriminatedUnion("type", [
-  z.object({ type: z.literal("none") }),
-  z.object({
-    type: z.literal("element"),
-    data: selectableDataSchema
-  }),
-  z.object({
-    type: z.literal("area"),
-    rect: selectModeBoundingRectSchema,
-    items: z.array(selectableDataSchema)
-  }),
-  z.object({
-    type: z.literal("drag"),
-    dragRect: selectModeBoundingRectSchema,
-    selectionRects: z.array(selectModeSelectionRectSchema)
-  })
-]).describe("SelectModeSelection");
-
-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, selectModeVideoSchema, selectableDataPayloadSchema, selectableDataSchema, selectablePlanDataSchema, selectablePlanPayloadSchema, selectedElementSchema, transformPoint, transformRect, transformSelectableData, transformSelectedElement };