@designfever/web-review-kit 0.8.2 → 0.8.3

package/dist/react-shell.cjs

@@ -492,6 +492,11 @@ var reviewShellSitemapStyle = `
 				    padding: 18px;
   }
 
+  /* \uB2EB\uC544\uB3C4 unmount \uD558\uC9C0 \uC54A\uACE0 \uC228\uAE34\uB2E4. visibility \uB294 \uB9AC\uC2A4\uD2B8 \uC2A4\uD06C\uB864 \uC704\uCE58\uB97C \uBCF4\uC874\uD55C\uB2E4. */
+  .df-review-sitemap-modal.is-hidden {
+    visibility: hidden;
+  }
+
 	  .df-review-sitemap-backdrop {
 	    position: absolute;
 	    inset: 0;
@@ -544,7 +549,7 @@ var reviewShellSitemapStyle = `
 	    font-weight: var(--df-review-font-weight-normal);
 	  }
 
-  .df-review-sitemap-header button {
+  .df-review-sitemap-header > button {
     display: grid;
     place-items: center;
 	    width: 34px;
@@ -558,11 +563,36 @@ var reviewShellSitemapStyle = `
 	    font-weight: var(--df-review-font-weight-normal);
 	  }
 
-	  .df-review-sitemap-header button:hover {
+	  .df-review-sitemap-header > button:hover {
 	    border-color: var(--df-review-accent);
 	    background: var(--df-review-control-hover);
 	  }
 
+  /* \uD5E4\uB354 \uC694\uC57D \uCE74\uC6B4\uD2B8\uB97C \uADF8\uB300\uB85C status filter \uD1A0\uAE00\uB85C \uC4F4\uB2E4. */
+  .df-review-sitemap-summary-filter {
+    display: inline;
+    border: 0;
+    padding: 0;
+    background: none;
+    color: var(--df-review-muted);
+    font: inherit;
+    cursor: pointer;
+  }
+
+  .df-review-sitemap-summary-filter:hover,
+  .df-review-sitemap-summary-filter:focus-visible {
+    color: var(--df-review-text);
+    text-decoration: underline;
+    text-underline-offset: 3px;
+    outline: none;
+  }
+
+  .df-review-sitemap-summary-filter.is-active {
+    color: var(--df-review-accent);
+    text-decoration: underline;
+    text-underline-offset: 3px;
+  }
+
   .df-review-sitemap-controls {
     display: flex;
     align-items: center;
@@ -2341,6 +2371,8 @@ var reviewShellQaPanelStyle = `
 
   .df-review-qa-draft-host[data-has-draft-composer="true"] {
     display: block;
+    /* Source Tree \uD328\uB110(z 900) \uC704\uB85C \uC62C\uB824 draft composer \uAC00 \uAC00\uB824\uC9C0\uC9C0 \uC54A\uAC8C \uD55C\uB2E4. */
+    z-index: 950;
   }
 
 	  .df-review-shell:not(.is-list-visible) .df-review-qa-panel,
@@ -6210,11 +6242,140 @@ function getReviewFigmaImageErrorMessage(error) {
   return error instanceof Error ? error.message : "Figma image request failed.";
 }
 
-// src/react-shell/figma/image.overlay.controller.ts
+// src/react-shell/figma/image.overlay.state.ts
+var STORAGE_KEY_PREFIX = "df-review-figma-image-overlay-state:";
+var STORAGE_VERSION = 2;
+var DEFAULT_MODE = "normal";
 var DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY = 0.48;
-var REVIEW_FIGMA_IMAGE_OVERLAY_STORAGE_KEY_PREFIX = "df-review-figma-image-overlay-state:";
-var REVIEW_FIGMA_IMAGE_OVERLAY_STORAGE_VERSION = 2;
-var DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_MODE = "normal";
+var DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE = {
+  selectedImageId: null,
+  imageStates: {},
+  lastVisibleImageIds: []
+};
+var DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE = {
+  isVisible: false,
+  opacity: DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY,
+  isLocked: false,
+  mode: DEFAULT_MODE,
+  offsetY: 0
+};
+function createReviewFigmaImageOverlayStorageKey(target) {
+  return `${STORAGE_KEY_PREFIX}${createReviewFigmaImageTargetKey(target)}`;
+}
+function readStoredReviewFigmaImageOverlayState(storageKey) {
+  if (typeof window === "undefined") {
+    return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
+  }
+  try {
+    const value = window.localStorage.getItem(storageKey);
+    if (!value) return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
+    return normalizeReviewFigmaImageOverlayState(JSON.parse(value));
+  } catch {
+    return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
+  }
+}
+function writeStoredReviewFigmaImageOverlayState(storageKey, state) {
+  if (typeof window === "undefined") return;
+  try {
+    if (isDefaultReviewFigmaImageOverlayState(state)) {
+      window.localStorage.removeItem(storageKey);
+      return;
+    }
+    window.localStorage.setItem(
+      storageKey,
+      JSON.stringify({
+        version: STORAGE_VERSION,
+        ...state
+      })
+    );
+  } catch {
+    return;
+  }
+}
+function normalizeReviewFigmaImageOverlayMode(value) {
+  return value === "invert" ? "invert" : DEFAULT_MODE;
+}
+function normalizeReviewFigmaImageOverlayOffsetY(value) {
+  if (typeof value !== "number" || !Number.isFinite(value)) return 0;
+  return Math.round(value);
+}
+function clampReviewFigmaImageOverlayOpacity(value) {
+  if (!Number.isFinite(value)) return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY;
+  return Math.min(1, Math.max(0, value));
+}
+function getReviewFigmaImageOverlayItemState(state, imageId) {
+  return imageId ? state.imageStates[imageId] ?? DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE : DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE;
+}
+function updateSelectedReviewFigmaImageOverlayItemState(state, updater) {
+  return state.selectedImageId ? updateReviewFigmaImageOverlayItemState(
+    state.imageStates,
+    state.selectedImageId,
+    updater
+  ) : state.imageStates;
+}
+function updateReviewFigmaImageOverlayItemState(imageStates, imageId, updater) {
+  return {
+    ...imageStates,
+    [imageId]: updater(
+      imageStates[imageId] ?? DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE
+    )
+  };
+}
+function normalizeReviewFigmaImageOverlayState(value) {
+  if (!value || typeof value !== "object") {
+    return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
+  }
+  const state = value;
+  const selectedImageId = typeof state.selectedImageId === "string" ? state.selectedImageId : null;
+  const lastVisibleImageIds = Array.isArray(state.lastVisibleImageIds) ? state.lastVisibleImageIds.filter(
+    (imageId) => typeof imageId === "string"
+  ) : [];
+  const imageStates = normalizeReviewFigmaImageOverlayItemStateRecord(
+    state.imageStates
+  );
+  if (Object.keys(imageStates).length === 0 && selectedImageId) {
+    imageStates[selectedImageId] = normalizeReviewFigmaImageOverlayItemState(
+      state
+    );
+  }
+  return {
+    selectedImageId,
+    imageStates,
+    lastVisibleImageIds
+  };
+}
+function normalizeReviewFigmaImageOverlayItemStateRecord(value) {
+  if (!value || typeof value !== "object") return {};
+  return Object.fromEntries(
+    Object.entries(value).flatMap(([imageId, itemState]) => {
+      if (!imageId || typeof itemState !== "object") return [];
+      return [
+        [
+          imageId,
+          normalizeReviewFigmaImageOverlayItemState(
+            itemState
+          )
+        ]
+      ];
+    })
+  );
+}
+function normalizeReviewFigmaImageOverlayItemState(value) {
+  return {
+    isVisible: value.isVisible === true,
+    opacity: clampReviewFigmaImageOverlayOpacity(
+      typeof value.opacity === "number" ? value.opacity : DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY
+    ),
+    isLocked: value.isLocked === true,
+    mode: normalizeReviewFigmaImageOverlayMode(value.mode),
+    offsetY: normalizeReviewFigmaImageOverlayOffsetY(value.offsetY)
+  };
+}
+function isDefaultReviewFigmaImageOverlayState(state) {
+  return state.selectedImageId === null && Object.keys(state.imageStates).length === 0 && state.lastVisibleImageIds.length === 0;
+}
+
+// src/react-shell/figma/image.overlay.controller.ts
 var useReviewFigmaImageOverlayController = ({
   images,
   isLoading,
@@ -6233,8 +6394,12 @@ var useReviewFigmaImageOverlayController = ({
     (updater) => {
       setStateContainer((currentContainer) => {
         const currentState = currentContainer.storageKey === storageKey ? currentContainer.state : readStoredReviewFigmaImageOverlayState(storageKey);
+        const nextState = updater(currentState);
+        if (currentContainer.storageKey === storageKey && nextState === currentState) {
+          return currentContainer;
+        }
         return {
-          state: updater(currentState),
+          state: nextState,
           storageKey
         };
       });
@@ -6274,7 +6439,7 @@ var useReviewFigmaImageOverlayController = ({
       const lastVisibleImageIds = currentState.lastVisibleImageIds.filter(
         (imageId) => nextImageIds.has(imageId)
       );
-      if (selectedImageId === currentState.selectedImageId && imageStates === currentState.imageStates && lastVisibleImageIds.length === currentState.lastVisibleImageIds.length) {
+      if (selectedImageId === currentState.selectedImageId && Object.keys(imageStates).length === Object.keys(currentState.imageStates).length && lastVisibleImageIds.length === currentState.lastVisibleImageIds.length) {
         return currentState;
       }
       return {
@@ -6471,78 +6636,54 @@ var useReviewFigmaImageOverlayController = ({
       };
     });
   }, [images, updateState]);
+  const updateSelectedOverlayState = (0, import_react7.useCallback)(
+    (updater) => {
+      updateState((currentState) => ({
+        ...currentState,
+        imageStates: updateSelectedReviewFigmaImageOverlayItemState(
+          currentState,
+          updater
+        )
+      }));
+    },
+    [updateState]
+  );
   const setOverlayOpacity = (0, import_react7.useCallback)((opacity) => {
-    updateState((currentState) => ({
-      ...currentState,
-      imageStates: updateSelectedReviewFigmaImageOverlayItemState(
-        currentState,
-        (itemState) => ({
-          ...itemState,
-          opacity: clampReviewFigmaImageOverlayOpacity(opacity)
-        })
-      )
+    updateSelectedOverlayState((itemState) => ({
+      ...itemState,
+      opacity: clampReviewFigmaImageOverlayOpacity(opacity)
     }));
-  }, [updateState]);
+  }, [updateSelectedOverlayState]);
   const setOverlayLocked = (0, import_react7.useCallback)((isLocked) => {
-    updateState((currentState) => ({
-      ...currentState,
-      imageStates: updateSelectedReviewFigmaImageOverlayItemState(
-        currentState,
-        (itemState) => ({
-          ...itemState,
-          isLocked
-        })
-      )
+    updateSelectedOverlayState((itemState) => ({
+      ...itemState,
+      isLocked
     }));
-  }, [updateState]);
+  }, [updateSelectedOverlayState]);
   const toggleOverlayLocked = (0, import_react7.useCallback)(() => {
-    updateState((currentState) => ({
-      ...currentState,
-      imageStates: updateSelectedReviewFigmaImageOverlayItemState(
-        currentState,
-        (itemState) => ({
-          ...itemState,
-          isLocked: !itemState.isLocked
-        })
-      )
+    updateSelectedOverlayState((itemState) => ({
+      ...itemState,
+      isLocked: !itemState.isLocked
     }));
-  }, [updateState]);
+  }, [updateSelectedOverlayState]);
   const setOverlayMode = (0, import_react7.useCallback)((mode) => {
-    updateState((currentState) => ({
-      ...currentState,
-      imageStates: updateSelectedReviewFigmaImageOverlayItemState(
-        currentState,
-        (itemState) => ({
-          ...itemState,
-          mode: normalizeReviewFigmaImageOverlayMode(mode)
-        })
-      )
+    updateSelectedOverlayState((itemState) => ({
+      ...itemState,
+      mode: normalizeReviewFigmaImageOverlayMode(mode)
     }));
-  }, [updateState]);
+  }, [updateSelectedOverlayState]);
   const toggleOverlayMode = (0, import_react7.useCallback)(() => {
-    updateState((currentState) => ({
-      ...currentState,
-      imageStates: updateSelectedReviewFigmaImageOverlayItemState(
-        currentState,
-        (itemState) => ({
-          ...itemState,
-          mode: itemState.mode === "invert" ? "normal" : "invert"
-        })
-      )
+    updateSelectedOverlayState((itemState) => ({
+      ...itemState,
+      mode: itemState.mode === "invert" ? "normal" : "invert"
     }));
-  }, [updateState]);
+  }, [updateSelectedOverlayState]);
   const setOverlayOffsetY = (0, import_react7.useCallback)((offsetY) => {
-    updateState((currentState) => ({
-      ...currentState,
-      imageStates: updateSelectedReviewFigmaImageOverlayItemState(
-        currentState,
-        (itemState) => ({
-          ...itemState,
-          offsetY: normalizeReviewFigmaImageOverlayOffsetY(offsetY)
-        })
-      )
+    updateSelectedOverlayState((itemState) => ({
+      ...itemState,
+      offsetY: normalizeReviewFigmaImageOverlayOffsetY(offsetY)
     }));
-  }, [updateState]);
+  }, [updateSelectedOverlayState]);
   const resetOverlay = (0, import_react7.useCallback)(() => {
     updateState((currentState) => ({
       ...currentState,
@@ -6583,160 +6724,29 @@ var useReviewFigmaImageOverlayController = ({
     toggleOverlayVisible
   };
 };
-function createReviewFigmaImageOverlayStorageKey(target) {
-  return `${REVIEW_FIGMA_IMAGE_OVERLAY_STORAGE_KEY_PREFIX}${createReviewFigmaImageTargetKey(target)}`;
+
+// src/react-shell/figma/image-panel.utils.ts
+var DEFAULT_FIGMA_IMAGE_LAYER_STATE = {
+  isLocked: false,
+  isVisible: false,
+  mode: "normal",
+  offsetY: 0,
+  opacity: DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY
+};
+function getFigmaImageLabel(image, index) {
+  return image.label?.trim() || `Image ${index + 1}`;
 }
-function readStoredReviewFigmaImageOverlayState(storageKey) {
-  if (typeof window === "undefined") {
-    return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
-  }
-  try {
-    const value = window.localStorage.getItem(storageKey);
-    if (!value) return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
-    return normalizeReviewFigmaImageOverlayState(JSON.parse(value));
-  } catch {
-    return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
-  }
+function getSnappedOpacityPercent(opacity) {
+  const opacityPercent = Math.round(opacity * 100);
+  if (!Number.isFinite(opacityPercent)) return 0;
+  return Math.max(0, Math.min(100, Math.round(opacityPercent / 10) * 10));
 }
-function writeStoredReviewFigmaImageOverlayState(storageKey, state) {
-  if (typeof window === "undefined") return;
-  if (isDefaultReviewFigmaImageOverlayState(state)) {
-    try {
-      window.localStorage.removeItem(storageKey);
-    } catch {
-      return;
-    }
-    return;
-  }
-  try {
-    window.localStorage.setItem(
-      storageKey,
-      JSON.stringify({
-        version: REVIEW_FIGMA_IMAGE_OVERLAY_STORAGE_VERSION,
-        ...state
-      })
-    );
-  } catch {
-    return;
-  }
-}
-var DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE = {
-  selectedImageId: null,
-  imageStates: {},
-  lastVisibleImageIds: []
-};
-var DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE = {
-  isVisible: false,
-  opacity: DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY,
-  isLocked: false,
-  mode: DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_MODE,
-  offsetY: 0
-};
-function normalizeReviewFigmaImageOverlayState(value) {
-  if (!value || typeof value !== "object") {
-    return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_STATE;
-  }
-  const state = value;
-  const selectedImageId = typeof state.selectedImageId === "string" ? state.selectedImageId : null;
-  const lastVisibleImageIds = Array.isArray(state.lastVisibleImageIds) ? state.lastVisibleImageIds.filter(
-    (imageId) => typeof imageId === "string"
-  ) : [];
-  const imageStates = normalizeReviewFigmaImageOverlayItemStateRecord(
-    state.imageStates
-  );
-  if (Object.keys(imageStates).length === 0 && selectedImageId) {
-    imageStates[selectedImageId] = normalizeReviewFigmaImageOverlayItemState(
-      state
-    );
-  }
-  return {
-    selectedImageId,
-    imageStates,
-    lastVisibleImageIds
-  };
-}
-function normalizeReviewFigmaImageOverlayItemStateRecord(value) {
-  if (!value || typeof value !== "object") return {};
-  return Object.fromEntries(
-    Object.entries(value).flatMap(([imageId, itemState]) => {
-      if (!imageId || typeof itemState !== "object") return [];
-      return [
-        [
-          imageId,
-          normalizeReviewFigmaImageOverlayItemState(
-            itemState
-          )
-        ]
-      ];
-    })
-  );
-}
-function normalizeReviewFigmaImageOverlayItemState(value) {
-  return {
-    isVisible: value.isVisible === true,
-    opacity: clampReviewFigmaImageOverlayOpacity(
-      typeof value.opacity === "number" ? value.opacity : DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY
-    ),
-    isLocked: value.isLocked === true,
-    mode: normalizeReviewFigmaImageOverlayMode(value.mode),
-    offsetY: normalizeReviewFigmaImageOverlayOffsetY(value.offsetY)
-  };
-}
-function normalizeReviewFigmaImageOverlayMode(value) {
-  return value === "invert" ? "invert" : DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_MODE;
-}
-function normalizeReviewFigmaImageOverlayOffsetY(value) {
-  if (typeof value !== "number" || !Number.isFinite(value)) return 0;
-  return Math.round(value);
-}
-function clampReviewFigmaImageOverlayOpacity(value) {
-  if (!Number.isFinite(value)) return DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY;
-  return Math.min(1, Math.max(0, value));
-}
-function isDefaultReviewFigmaImageOverlayState(state) {
-  return state.selectedImageId === null && Object.keys(state.imageStates).length === 0 && state.lastVisibleImageIds.length === 0;
-}
-function getReviewFigmaImageOverlayItemState(state, imageId) {
-  return imageId ? state.imageStates[imageId] ?? DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE : DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE;
-}
-function updateSelectedReviewFigmaImageOverlayItemState(state, updater) {
-  return state.selectedImageId ? updateReviewFigmaImageOverlayItemState(
-    state.imageStates,
-    state.selectedImageId,
-    updater
-  ) : state.imageStates;
-}
-function updateReviewFigmaImageOverlayItemState(imageStates, imageId, updater) {
-  return {
-    ...imageStates,
-    [imageId]: updater(
-      imageStates[imageId] ?? DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_ITEM_STATE
-    )
-  };
-}
-
-// src/react-shell/figma/image-panel.utils.ts
-var DEFAULT_FIGMA_IMAGE_LAYER_STATE = {
-  isLocked: false,
-  isVisible: false,
-  mode: "normal",
-  offsetY: 0,
-  opacity: DEFAULT_REVIEW_FIGMA_IMAGE_OVERLAY_OPACITY
-};
-function getFigmaImageLabel(image, index) {
-  return image.label?.trim() || `Image ${index + 1}`;
-}
-function getSnappedOpacityPercent(opacity) {
-  const opacityPercent = Math.round(opacity * 100);
-  if (!Number.isFinite(opacityPercent)) return 0;
-  return Math.max(0, Math.min(100, Math.round(opacityPercent / 10) * 10));
-}
-function getFigmaImageLayerStatusLabel(overlayState) {
-  return [
-    overlayState.isVisible ? "Visible" : "Hidden",
-    overlayState.mode === "invert" ? "Invert" : "",
-    overlayState.isLocked ? "Locked" : ""
-  ].filter(Boolean).join(" / ");
+function getFigmaImageLayerStatusLabel(overlayState) {
+  return [
+    overlayState.isVisible ? "Visible" : "Hidden",
+    overlayState.mode === "invert" ? "Invert" : "",
+    overlayState.isLocked ? "Locked" : ""
+  ].filter(Boolean).join(" / ");
 }
 function getReorderedFigmaImageIds(images, draggedImageId, dropTargetImageId) {
   const currentImageIds = images.map((image) => image.id);
@@ -7571,11 +7581,19 @@ var updateShellUrl = (target, size, source) => {
   }
   url.searchParams.delete("item");
   url.searchParams.delete("panel");
-  window.history.replaceState(null, "", `${url.pathname}${url.search}`);
+  window.history.replaceState(
+    null,
+    "",
+    `${url.pathname}${url.search}${url.hash}`
+  );
 };
 var updateShellUrlForItem = (target, size, itemId, source) => {
   const url = getShellUrlForItem(target, size, itemId, source);
-  window.history.replaceState(null, "", `${url.pathname}${url.search}`);
+  window.history.replaceState(
+    null,
+    "",
+    `${url.pathname}${url.search}${url.hash}`
+  );
 };
 var getShellUrlForItem = (target, size, itemId, source) => {
   const url = new URL(window.location.href);
@@ -9850,6 +9868,26 @@ var REVIEW_QA_STATUS_FILTER_VALUES = /* @__PURE__ */ new Set([
   "hold",
   "done"
 ]);
+var readStorage = (key) => {
+  if (typeof window === "undefined") return null;
+  try {
+    return window.localStorage.getItem(key);
+  } catch {
+    return null;
+  }
+};
+var writeStorage = (key, value) => {
+  if (typeof window === "undefined") return;
+  try {
+    if (value === null) {
+      window.localStorage.removeItem(key);
+    } else {
+      window.localStorage.setItem(key, value);
+    }
+  } catch {
+    return;
+  }
+};
 var normalizeReviewTheme = (value) => value === "light" || value === "system" || value === "dark" ? value : DEFAULT_REVIEW_THEME;
 var normalizeReviewSidePanel = (value) => {
   if (value === "qa" || value === "source" || value === "figma-images") {
@@ -9888,100 +9926,35 @@ var normalizeStoredSourceTreeMetaVisibility = (value) => {
     className: typeof metaVisibility.className === "boolean" ? metaVisibility.className : DEFAULT_SOURCE_TREE_META_VISIBILITY.className
   };
 };
-var getStoredFigmaToken = () => {
-  if (typeof window === "undefined") return "";
-  try {
-    return window.localStorage.getItem(FIGMA_TOKEN_STORAGE_KEY) ?? "";
-  } catch {
-    return "";
-  }
-};
+var getStoredFigmaToken = () => readStorage(FIGMA_TOKEN_STORAGE_KEY) ?? "";
 var writeStoredFigmaToken = (token) => {
-  if (typeof window === "undefined") return;
-  try {
-    if (token) {
-      window.localStorage.setItem(FIGMA_TOKEN_STORAGE_KEY, token);
-    } else {
-      window.localStorage.removeItem(FIGMA_TOKEN_STORAGE_KEY);
-    }
-  } catch {
-    return;
-  }
+  writeStorage(FIGMA_TOKEN_STORAGE_KEY, token || null);
 };
 var getStoredReviewUserId = (fallback = "") => {
   const normalizedFallback = fallback.trim();
-  if (typeof window === "undefined") return normalizedFallback;
-  try {
-    return window.localStorage.getItem(REVIEW_USER_ID_STORAGE_KEY)?.trim() || normalizedFallback;
-  } catch {
-    return normalizedFallback;
-  }
+  return readStorage(REVIEW_USER_ID_STORAGE_KEY)?.trim() || normalizedFallback;
 };
 var writeStoredReviewUserId = (userId) => {
-  if (typeof window === "undefined") return;
-  try {
-    if (userId) {
-      window.localStorage.setItem(REVIEW_USER_ID_STORAGE_KEY, userId);
-    } else {
-      window.localStorage.removeItem(REVIEW_USER_ID_STORAGE_KEY);
-    }
-  } catch {
-    return;
-  }
-};
-var getStoredReviewTheme = () => {
-  if (typeof window === "undefined") return DEFAULT_REVIEW_THEME;
-  try {
-    return normalizeReviewTheme(
-      window.localStorage.getItem(REVIEW_THEME_STORAGE_KEY)
-    );
-  } catch {
-    return DEFAULT_REVIEW_THEME;
-  }
+  writeStorage(REVIEW_USER_ID_STORAGE_KEY, userId || null);
 };
+var getStoredReviewTheme = () => normalizeReviewTheme(readStorage(REVIEW_THEME_STORAGE_KEY));
 var writeStoredReviewTheme = (theme) => {
-  if (typeof window === "undefined") return;
-  try {
-    if (theme === DEFAULT_REVIEW_THEME) {
-      window.localStorage.removeItem(REVIEW_THEME_STORAGE_KEY);
-    } else {
-      window.localStorage.setItem(REVIEW_THEME_STORAGE_KEY, theme);
-    }
-  } catch {
-    return;
-  }
+  writeStorage(
+    REVIEW_THEME_STORAGE_KEY,
+    theme === DEFAULT_REVIEW_THEME ? null : theme
+  );
 };
 var getStoredReviewTooltipsEnabled = () => {
-  if (typeof window === "undefined") return DEFAULT_REVIEW_TOOLTIPS_ENABLED;
-  try {
-    const value = window.localStorage.getItem(REVIEW_TOOLTIP_STORAGE_KEY);
-    return value === null ? DEFAULT_REVIEW_TOOLTIPS_ENABLED : value !== "false";
-  } catch {
-    return DEFAULT_REVIEW_TOOLTIPS_ENABLED;
-  }
+  const value = readStorage(REVIEW_TOOLTIP_STORAGE_KEY);
+  return value === null ? DEFAULT_REVIEW_TOOLTIPS_ENABLED : value !== "false";
 };
 var writeStoredReviewTooltipsEnabled = (isEnabled) => {
-  if (typeof window === "undefined") return;
-  try {
-    if (isEnabled === DEFAULT_REVIEW_TOOLTIPS_ENABLED) {
-      window.localStorage.removeItem(REVIEW_TOOLTIP_STORAGE_KEY);
-    } else {
-      window.localStorage.setItem(REVIEW_TOOLTIP_STORAGE_KEY, "false");
-    }
-  } catch {
-    return;
-  }
-};
-var getStoredReviewSidePanel = () => {
-  if (typeof window === "undefined") return "qa";
-  try {
-    return normalizeStoredReviewSidePanel(
-      window.localStorage.getItem(REVIEW_SIDE_PANEL_STORAGE_KEY)
-    );
-  } catch {
-    return "qa";
-  }
+  writeStorage(
+    REVIEW_TOOLTIP_STORAGE_KEY,
+    isEnabled === DEFAULT_REVIEW_TOOLTIPS_ENABLED ? null : "false"
+  );
 };
+var getStoredReviewSidePanel = () => normalizeStoredReviewSidePanel(readStorage(REVIEW_SIDE_PANEL_STORAGE_KEY));
 var getInitialReviewSidePanel = () => {
   if (typeof window === "undefined") return null;
   try {
@@ -9993,106 +9966,49 @@ var getInitialReviewSidePanel = () => {
   }
 };
 var writeStoredReviewSidePanel = (sidePanel) => {
-  if (typeof window === "undefined") return;
-  try {
-    window.localStorage.setItem(
-      REVIEW_SIDE_PANEL_STORAGE_KEY,
-      normalizeStoredReviewSidePanel(sidePanel)
-    );
-  } catch {
-    return;
-  }
+  writeStorage(
+    REVIEW_SIDE_PANEL_STORAGE_KEY,
+    normalizeStoredReviewSidePanel(sidePanel)
+  );
 };
 var getStoredReviewSidePanelVisible = () => {
-  if (typeof window === "undefined") return true;
-  try {
-    const value = window.localStorage.getItem(
-      REVIEW_SIDE_PANEL_VISIBLE_STORAGE_KEY
-    );
-    return value === null ? true : value === "true";
-  } catch {
-    return true;
-  }
+  const value = readStorage(REVIEW_SIDE_PANEL_VISIBLE_STORAGE_KEY);
+  return value === null ? true : value === "true";
 };
 var writeStoredReviewSidePanelVisible = (isVisible) => {
-  if (typeof window === "undefined") return;
-  try {
-    window.localStorage.setItem(
-      REVIEW_SIDE_PANEL_VISIBLE_STORAGE_KEY,
-      isVisible ? "true" : "false"
-    );
-  } catch {
-    return;
-  }
-};
-var getStoredReviewQaStatusFilters = () => {
-  if (typeof window === "undefined") return getDefaultReviewQaStatusFilters();
-  try {
-    return normalizeStoredReviewQaStatusFilters(
-      window.localStorage.getItem(REVIEW_QA_STATUS_FILTER_STORAGE_KEY)
-    );
-  } catch {
-    return getDefaultReviewQaStatusFilters();
-  }
+  writeStorage(
+    REVIEW_SIDE_PANEL_VISIBLE_STORAGE_KEY,
+    isVisible ? "true" : "false"
+  );
 };
+var getStoredReviewQaStatusFilters = () => normalizeStoredReviewQaStatusFilters(
+  readStorage(REVIEW_QA_STATUS_FILTER_STORAGE_KEY)
+);
 var writeStoredReviewQaStatusFilters = (filters) => {
-  if (typeof window === "undefined") return;
-  try {
-    const normalizedFilters = normalizeReviewQaStatusFilters(filters);
-    if (isDefaultReviewQaStatusFilters(normalizedFilters)) {
-      window.localStorage.removeItem(REVIEW_QA_STATUS_FILTER_STORAGE_KEY);
-    } else {
-      window.localStorage.setItem(
-        REVIEW_QA_STATUS_FILTER_STORAGE_KEY,
-        JSON.stringify(normalizedFilters)
-      );
-    }
-  } catch {
-    return;
-  }
-};
-var getStoredSourceTreeFilter = () => {
-  if (typeof window === "undefined") return "";
-  try {
-    return window.localStorage.getItem(REVIEW_SOURCE_TREE_FILTER_STORAGE_KEY) ?? "";
-  } catch {
-    return "";
-  }
+  const normalizedFilters = normalizeReviewQaStatusFilters(filters);
+  writeStorage(
+    REVIEW_QA_STATUS_FILTER_STORAGE_KEY,
+    isDefaultReviewQaStatusFilters(normalizedFilters) ? null : JSON.stringify(normalizedFilters)
+  );
 };
+var getStoredSourceTreeFilter = () => readStorage(REVIEW_SOURCE_TREE_FILTER_STORAGE_KEY) ?? "";
 var writeStoredSourceTreeFilter = (filter) => {
-  if (typeof window === "undefined") return;
-  try {
-    if (filter) {
-      window.localStorage.setItem(REVIEW_SOURCE_TREE_FILTER_STORAGE_KEY, filter);
-    } else {
-      window.localStorage.removeItem(REVIEW_SOURCE_TREE_FILTER_STORAGE_KEY);
-    }
-  } catch {
-    return;
-  }
+  writeStorage(REVIEW_SOURCE_TREE_FILTER_STORAGE_KEY, filter || null);
 };
 var getStoredSourceTreeMetaVisibility = () => {
-  if (typeof window === "undefined") return DEFAULT_SOURCE_TREE_META_VISIBILITY;
+  const value = readStorage(REVIEW_SOURCE_TREE_META_STORAGE_KEY);
+  if (!value) return DEFAULT_SOURCE_TREE_META_VISIBILITY;
   try {
-    const value = window.localStorage.getItem(
-      REVIEW_SOURCE_TREE_META_STORAGE_KEY
-    );
-    if (!value) return DEFAULT_SOURCE_TREE_META_VISIBILITY;
     return normalizeStoredSourceTreeMetaVisibility(JSON.parse(value));
   } catch {
     return DEFAULT_SOURCE_TREE_META_VISIBILITY;
   }
 };
 var writeStoredSourceTreeMetaVisibility = (metaVisibility) => {
-  if (typeof window === "undefined") return;
-  try {
-    window.localStorage.setItem(
-      REVIEW_SOURCE_TREE_META_STORAGE_KEY,
-      JSON.stringify(normalizeStoredSourceTreeMetaVisibility(metaVisibility))
-    );
-  } catch {
-    return;
-  }
+  writeStorage(
+    REVIEW_SOURCE_TREE_META_STORAGE_KEY,
+    JSON.stringify(normalizeStoredSourceTreeMetaVisibility(metaVisibility))
+  );
 };
 var getSystemReviewTheme = () => {
   if (typeof window === "undefined" || !window.matchMedia) return "dark";
@@ -11070,6 +10986,73 @@ function getAdjustedDraftSelection(selection, draft, presets) {
   };
 }
 
+// src/core/hotkey.ts
+var HOTKEY_KEY_ALIASES = {
+  q: ["\u3142", "\u3143"],
+  w: ["\u3148", "\u3149"],
+  e: ["\u3137", "\u3138"],
+  r: ["\u3131", "\u3132"],
+  t: ["\u3145", "\u3146"],
+  y: ["\u315B"],
+  u: ["\u3155"],
+  i: ["\u3151"],
+  o: ["\u3150", "\u3152"],
+  p: ["\u3154", "\u3156"],
+  a: ["\u3141"],
+  s: ["\u3134"],
+  d: ["\u3147"],
+  f: ["\u3139"],
+  g: ["\u314E"],
+  h: ["\u3157"],
+  j: ["\u3153"],
+  k: ["\u314F"],
+  l: ["\u3163"],
+  z: ["\u314B"],
+  x: ["\u314C"],
+  c: ["\u314A"],
+  v: ["\u314D"],
+  b: ["\u3160"],
+  n: ["\u315C"],
+  m: ["\u3161"]
+};
+function isEditableEventTarget(event) {
+  const path = event.composedPath?.() ?? [];
+  const element = path[0] ?? event.target;
+  if (!element || typeof element.tagName !== "string") return false;
+  const tag = element.tagName;
+  return tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT" || element.isContentEditable === true;
+}
+function isHotkey(event, hotkey) {
+  const parts = hotkey.split("+").map((part) => part.trim().toLowerCase()).filter(Boolean);
+  const key = parts.find(
+    (part) => !["shift", "ctrl", "control", "alt", "meta", "cmd"].includes(part)
+  );
+  if (!key) return false;
+  if (parts.includes("shift") !== event.shiftKey) return false;
+  if ((parts.includes("ctrl") || parts.includes("control")) !== event.ctrlKey) {
+    return false;
+  }
+  if (parts.includes("alt") !== event.altKey) return false;
+  if ((parts.includes("meta") || parts.includes("cmd")) !== event.metaKey) {
+    return false;
+  }
+  return isHotkeyKey(event, key);
+}
+function getHotkeyActionKey(event, keys) {
+  return keys.find((key) => isHotkeyKey(event, key));
+}
+function isHotkeyKey(event, key) {
+  const normalizedKey = key.toLowerCase();
+  if (event.key.toLowerCase() === normalizedKey) return true;
+  if (getHotkeyCode(normalizedKey) === event.code) return true;
+  return HOTKEY_KEY_ALIASES[normalizedKey]?.includes(event.key) ?? false;
+}
+function getHotkeyCode(key) {
+  if (/^[a-z]$/.test(key)) return `Key${key.toUpperCase()}`;
+  if (/^[0-9]$/.test(key)) return `Digit${key}`;
+  return void 0;
+}
+
 // src/react-shell/source.open.ts
 var getSourceCandidates = (target, options) => {
   const startElement = getEventElement(target);
@@ -11155,7 +11138,7 @@ function createSourceCandidate(element, source, depth, kind, context) {
   const column = getSourcePosition(source.column);
   const position = line ? `:${line}${column ? `:${column}` : ""}` : "";
   return {
-    id: `${kind}:${getSourceCandidateKey(source)}:${repeatInfo?.index ?? 0}:${depth}`,
+    id: `${kind}:${getSourceCandidateDedupeKey(source)}:${repeatInfo?.index ?? 0}:${depth}`,
     depth,
     element,
     filePath: getDisplaySourcePath(source.file) ?? fileName,
@@ -11185,16 +11168,6 @@ function takeVisibleSourceCandidates(candidates) {
   }
   return visible;
 }
-function getSourceCandidateKey(source) {
-  return [
-    source.file,
-    source.component,
-    source.line,
-    source.column,
-    source.sectionId,
-    source.sectionIndex
-  ].filter(Boolean).join("|");
-}
 function getSourceCandidateDedupeKey(source) {
   return [
     source.file,
@@ -11612,11 +11585,6 @@ var getSectionDomAdjustmentKeyDelta = (event) => {
   return null;
 };
 var isDomAdjustmentEmpty = (position) => position.x === 0 && position.y === 0;
-var isEditableKeyTarget = (target) => {
-  if (!(target instanceof HTMLElement)) return false;
-  const tagName = target.tagName;
-  return tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT" || target.isContentEditable;
-};
 var COMPONENT_SELECTION_ACTION_SELECTOR = [
   "a",
   "button",
@@ -11786,7 +11754,7 @@ function useReviewSectionOutline({
   (0, import_react18.useEffect)(() => {
     if (!activeDomAdjustmentEntryId) return void 0;
     const handleKeyDown = (event) => {
-      if (isEditableKeyTarget(event.target)) return;
+      if (isEditableEventTarget(event)) return;
       const delta = getSectionDomAdjustmentKeyDelta(event);
       if (!delta) return;
       const position = domAdjustmentManagerRef.current?.adjust(
@@ -13630,7 +13598,7 @@ var ReviewSettingsModal = ({
 // src/react-shell/sitemap/modal.tsx
 var import_react24 = require("react");
 
-// src/react-shell/sitemap/tree.ts
+// src/react-shell/sitemap/count.ts
 var WORKFLOW_STATUSES = [
   "todo",
   "doing",
@@ -13654,33 +13622,11 @@ var createEmptySitemapQaCount = () => ({
   viewport: {}
 });
 var createSitemapViewportColumn = (preset, index) => ({
+  // 크기가 같은 preset도 별도 열로 유지될 수 있게 순서를 key에 포함한다.
   key: `${index}:${preset.width}x${preset.height}`,
   label: preset.label,
   title: `${preset.label} ${preset.width}x${preset.height}`
 });
-var normalizeSitemapHref = (href) => {
-  const [path = "/"] = href.split(/[?#]/);
-  const normalizedPath = path.startsWith("/") ? path : `/${path}`;
-  return normalizedPath || "/";
-};
-var getSitemapSegments = (href) => normalizeSitemapHref(href).split("/").map((segment) => segment.trim()).filter(Boolean);
-var createSitemapNode = (href, label, isPage = false) => ({
-  href,
-  label,
-  isPage,
-  children: /* @__PURE__ */ new Map()
-});
-var mergeSitemapUsers = (users) => {
-  const userByKey = /* @__PURE__ */ new Map();
-  users.forEach((user) => {
-    const key = user.sessionId || user.userId;
-    const currentUser = userByKey.get(key);
-    if (!currentUser || Date.parse(user.updatedAt) >= Date.parse(currentUser.updatedAt)) {
-      userByKey.set(key, user);
-    }
-  });
-  return Array.from(userByKey.values());
-};
 var addSitemapQaCounts = (first, second) => ({
   total: first.total + second.total,
   remaining: first.remaining + second.remaining,
@@ -13718,9 +13664,37 @@ var addSitemapQaCounts = (first, second) => ({
     {}
   )
 });
+
+// src/react-shell/sitemap/tree.ts
+var SITEMAP_STATUS_FILTERS = ["todo", "review", "hold"];
+var normalizeSitemapHref = (href) => {
+  const [path = "/"] = href.split(/[?#]/);
+  const normalizedPath = path.startsWith("/") ? path : `/${path}`;
+  return normalizedPath || "/";
+};
+var getSitemapSegments = (href) => normalizeSitemapHref(href).split("/").map((segment) => segment.trim()).filter(Boolean);
+var createSitemapNode = (href, label, isPage = false) => ({
+  href,
+  label,
+  isPage,
+  children: /* @__PURE__ */ new Map()
+});
+var mergeSitemapUsers = (users) => {
+  const userByKey = /* @__PURE__ */ new Map();
+  users.forEach((user) => {
+    const key = user.sessionId || user.userId;
+    const currentUser = userByKey.get(key);
+    if (!currentUser || Date.parse(user.updatedAt) >= Date.parse(currentUser.updatedAt)) {
+      userByKey.set(key, user);
+    }
+  });
+  return Array.from(userByKey.values());
+};
 var createSitemapRows = (pages, activeRoute, pageQaCounts, pagePresenceUsers, getPageTarget, options = {}) => {
   const collapsedFolderHrefs = options.collapsedFolderHrefs ?? /* @__PURE__ */ new Set();
   const searchQuery = normalizeSitemapSearchQuery(options.searchQuery);
+  const statusFilters = options.statusFilters ?? /* @__PURE__ */ new Set();
+  const isStatusFiltering = statusFilters.size > 0;
   const sortKey = options.sortKey ?? "page";
   const sortDirection = options.sortDirection ?? "asc";
   const root = createSitemapNode("/", "/", false);
@@ -13774,23 +13748,25 @@ var createSitemapRows = (pages, activeRoute, pageQaCounts, pagePresenceUsers, ge
       node,
       directCount,
       directUsers,
+      // folder는 하위 page 합계, 실제 page는 자신의 수치를 별도로 보존한다.
       count: node.isPage ? addSitemapQaCounts(directCount, childAggregate.count) : childAggregate.count,
       users: mergeSitemapUsers([...directUsers, ...childAggregate.users]),
       children
     };
   };
-  const getSortValue = (summary) => {
-    if (sortKey === "page") return summary.node.label;
-    if (sortKey === "todo") return summary.count.status.todo;
-    if (sortKey === "review") return summary.count.status.review;
-    if (sortKey === "hold") return summary.count.status.hold;
-    if (sortKey === "online") return summary.users.length;
+  const getSortValueFor = (label, count, users) => {
+    if (sortKey === "page") return label;
+    if (sortKey === "todo") return count.status.todo;
+    if (sortKey === "review") return count.status.review;
+    if (sortKey === "hold") return count.status.hold;
+    if (sortKey === "online") return users.length;
     if (sortKey.startsWith("viewport:")) {
       const viewportKey = sortKey.slice("viewport:".length);
-      return summary.count.viewport[viewportKey]?.remaining ?? 0;
+      return count.viewport[viewportKey]?.remaining ?? 0;
     }
     return 0;
   };
+  const getSortValue = (summary) => getSortValueFor(summary.node.label, summary.count, summary.users);
   const sortSummaries = (summaries) => {
     return [...summaries].sort((a, b) => {
       const firstValue = getSortValue(a);
@@ -13811,6 +13787,53 @@ var createSitemapRows = (pages, activeRoute, pageQaCounts, pagePresenceUsers, ge
     }
     return summary.children.some(summaryMatchesSearch);
   };
+  const countMatchesStatusFilters = (count) => Array.from(statusFilters).some((status) => count.status[status] > 0);
+  if (isStatusFiltering) {
+    const flatEntries = [];
+    const collectMatchingPages = (node) => {
+      if (node.isPage) {
+        const directCount = getDirectCount(node);
+        if (countMatchesStatusFilters(directCount) && (!searchQuery || sitemapNodeMatchesSearch(node, searchQuery, getPageTarget))) {
+          flatEntries.push({
+            node,
+            count: directCount,
+            users: getDirectUsers(node)
+          });
+        }
+      }
+      node.children.forEach(collectMatchingPages);
+    };
+    collectMatchingPages(root);
+    return flatEntries.sort((a, b) => {
+      const firstValue = getSortValueFor(
+        normalizeSitemapHref(a.node.href),
+        a.count,
+        a.users
+      );
+      const secondValue = getSortValueFor(
+        normalizeSitemapHref(b.node.href),
+        b.count,
+        b.users
+      );
+      const valueDiff = typeof firstValue === "string" && typeof secondValue === "string" ? firstValue.localeCompare(secondValue) : Number(firstValue) - Number(secondValue);
+      if (valueDiff !== 0) {
+        return sortDirection === "asc" ? valueDiff : -valueDiff;
+      }
+      const remainingDiff = b.count.remaining - a.count.remaining;
+      if (remainingDiff !== 0) return remainingDiff;
+      return a.node.href.localeCompare(b.node.href);
+    }).map((entry) => ({
+      href: entry.node.href,
+      label: normalizeSitemapHref(entry.node.href),
+      depth: 0,
+      hasChildren: false,
+      isExpanded: false,
+      isPage: true,
+      isActive: getPageTarget(entry.node.href) === activeRoute,
+      qaCount: entry.count,
+      users: entry.users
+    }));
+  }
   const rows = [];
   const appendSummaryRows = (summary, depth) => {
     const { node } = summary;
@@ -13878,8 +13901,70 @@ function sitemapNodeMatchesSearch(node, searchQuery, getPageTarget) {
   ].join(" ").toLowerCase().includes(searchQuery);
 }
 
+// src/react-shell/sitemap/row.tsx
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var getCountCellClassName = (status, count) => [
+  "df-review-sitemap-cell",
+  `is-${status}`,
+  count === 0 ? "is-zero" : ""
+].filter(Boolean).join(" ");
+var SitemapRowContent = ({
+  depth,
+  hasChildren,
+  isExpanded,
+  isPage,
+  label,
+  qaCount,
+  users,
+  onToggleFolder
+}) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+    "span",
+    {
+      className: "df-review-sitemap-path",
+      style: { "--df-review-sitemap-depth": depth },
+      children: [
+        hasChildren ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          "button",
+          {
+            "aria-expanded": isExpanded,
+            "aria-label": `${isExpanded ? "Collapse" : "Expand"} ${label}`,
+            className: "df-review-sitemap-tree-toggle",
+            type: "button",
+            onClick: (event) => {
+              event.stopPropagation();
+              onToggleFolder?.();
+            },
+            children: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDown, { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronRight, { "aria-hidden": "true" })
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-tree-spacer", "aria-hidden": "true" }),
+        isPage ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-page-label", children: label }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-label", children: label })
+      ]
+    }
+  ),
+  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: getCountCellClassName("todo", qaCount.status.todo), children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("strong", { children: qaCount.status.todo }) }),
+  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: getCountCellClassName("review", qaCount.status.review), children: qaCount.status.review }),
+  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: getCountCellClassName("hold", qaCount.status.hold), children: qaCount.status.hold }),
+  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-cell is-online", children: users.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-users", children: users.map((user) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    "span",
+    {
+      className: "df-review-sitemap-user",
+      style: {
+        "--df-review-presence-color": user.color
+      },
+      children: user.userId
+    },
+    user.sessionId
+  )) }) : null })
+] });
+
 // src/react-shell/sitemap/modal.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
+var STATUS_FILTER_LABELS = {
+  todo: "Todo",
+  review: "Review",
+  hold: "Hold"
+};
 var getNextSortDirection = (current, key) => {
   if (current.key !== key) return key === "page" ? "asc" : "desc";
   return current.direction === "desc" ? "asc" : "desc";
@@ -13888,11 +13973,6 @@ var getSortIndicator = (sort, key) => {
   if (sort.key !== key) return "";
   return sort.direction === "desc" ? "\u2193" : "\u2191";
 };
-var getCountCellClassName = (status, count) => [
-  "df-review-sitemap-cell",
-  `is-${status}`,
-  count === 0 ? "is-zero" : ""
-].filter(Boolean).join(" ");
 var mergePresenceUsers = (users) => {
   const userByKey = /* @__PURE__ */ new Map();
   users.forEach((user) => {
@@ -13905,6 +13985,7 @@ var mergePresenceUsers = (users) => {
   return Array.from(userByKey.values());
 };
 var SitemapModal = ({
+  isOpen,
   pages,
   activeRoute,
   allQaCount,
@@ -13924,7 +14005,11 @@ var SitemapModal = ({
     () => /* @__PURE__ */ new Set()
   );
   const [searchQuery, setSearchQuery] = (0, import_react24.useState)("");
+  const [statusFilters, setStatusFilters] = (0, import_react24.useState)(
+    () => /* @__PURE__ */ new Set()
+  );
   const trimmedSearchQuery = searchQuery.trim();
+  const isFiltering = Boolean(trimmedSearchQuery) || statusFilters.size > 0;
   const allQaUsers = (0, import_react24.useMemo)(
     () => mergePresenceUsers(Array.from(pagePresenceUsers.values()).flat()),
     [pagePresenceUsers]
@@ -13939,7 +14024,8 @@ var SitemapModal = ({
       collapsedFolderHrefs,
       searchQuery: trimmedSearchQuery,
       sortKey: sort.key,
-      sortDirection: sort.direction
+      sortDirection: sort.direction,
+      statusFilters
     }
   );
   const matchingPageCount = sitemapRows.filter((row) => row.isPage).length;
@@ -13959,6 +14045,17 @@ var SitemapModal = ({
       direction: getNextSortDirection(current, key)
     }));
   };
+  const toggleStatusFilter = (status) => {
+    setStatusFilters((currentFilters) => {
+      const nextFilters = new Set(currentFilters);
+      if (nextFilters.has(status)) {
+        nextFilters.delete(status);
+      } else {
+        nextFilters.add(status);
+      }
+      return nextFilters;
+    });
+  };
   const toggleFolder = (href) => {
     setCollapsedFolderHrefs((currentHrefs) => {
       const nextHrefs = new Set(currentHrefs);
@@ -13970,15 +14067,15 @@ var SitemapModal = ({
       return nextHrefs;
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
     "div",
     {
       "aria-label": "Sitemap",
       "aria-modal": "true",
-      className: "df-review-sitemap-modal",
+      className: `df-review-sitemap-modal${isOpen ? "" : " is-hidden"}`,
       role: "dialog",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
           "button",
           {
             "aria-label": "Close sitemap",
@@ -13987,28 +14084,39 @@ var SitemapModal = ({
             onClick: onClose
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "df-review-sitemap-dialog", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "df-review-sitemap-header", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("strong", { children: "Sitemap" }),
-              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "df-review-sitemap-dialog", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "df-review-sitemap-header", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("strong", { children: "Sitemap" }),
+              /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { children: [
                 pages.length,
-                " pages \xB7 ",
-                allQaCount.status.todo,
-                " todo \xB7",
-                " ",
-                allQaCount.status.review,
-                " review \xB7 ",
-                allQaCount.status.hold,
-                " hold"
+                " pages",
+                SITEMAP_STATUS_FILTERS.map((status) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react24.Fragment, { children: [
+                  " \xB7 ",
+                  /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+                    "button",
+                    {
+                      "aria-pressed": statusFilters.has(status),
+                      className: `df-review-sitemap-summary-filter${statusFilters.has(status) ? " is-active" : ""}`,
+                      title: `Show pages with ${STATUS_FILTER_LABELS[status]} QA`,
+                      type: "button",
+                      onClick: () => toggleStatusFilter(status),
+                      children: [
+                        allQaCount.status[status],
+                        " ",
+                        status
+                      ]
+                    }
+                  )
+                ] }, status))
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("button", { "aria-label": "Close sitemap", type: "button", onClick: onClose, children: "x" })
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("button", { "aria-label": "Close sitemap", type: "button", onClick: onClose, children: "x" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "df-review-sitemap-controls", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("label", { className: "df-review-sitemap-search", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Search, { "aria-hidden": "true" }),
-              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "df-review-sitemap-controls", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("label", { className: "df-review-sitemap-search", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Search, { "aria-hidden": "true" }),
+              /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
                 "input",
                 {
                   "aria-label": "Search sitemap",
@@ -14020,20 +14128,20 @@ var SitemapModal = ({
                 }
               )
             ] }),
-            trimmedSearchQuery && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            trimmedSearchQuery && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
               "button",
               {
                 "aria-label": "Clear sitemap search",
                 className: "df-review-sitemap-search-clear",
                 type: "button",
                 onClick: () => setSearchQuery(""),
-                children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(X, { "aria-hidden": "true" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(X, { "aria-hidden": "true" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-search-count", children: trimmedSearchQuery ? `${matchingPageCount} matches` : `${pages.length} pages` })
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "df-review-sitemap-search-count", children: isFiltering ? `${matchingPageCount} matches` : `${pages.length} pages` })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "df-review-sitemap-list", style: gridStyle, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "df-review-sitemap-table-head", role: "row", children: sortHeaders.map((header) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "df-review-sitemap-list", style: gridStyle, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "df-review-sitemap-table-head", role: "row", children: sortHeaders.map((header) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
               "button",
               {
                 "aria-label": `Sort sitemap by ${header.title ?? header.label}`,
@@ -14046,7 +14154,7 @@ var SitemapModal = ({
                 type: "button",
                 onClick: () => setSortKey(header.key),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
                     "span",
                     {
                       "aria-hidden": "true",
@@ -14054,7 +14162,7 @@ var SitemapModal = ({
                       children: getSortIndicator(sort, header.key)
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-sort-label", children: header.label })
+                  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "df-review-sitemap-sort-label", children: header.label })
                 ]
               },
               header.key
@@ -14069,7 +14177,7 @@ var SitemapModal = ({
                 row.isActive ? "is-active" : "",
                 row.isPage ? "is-clickable" : ""
               ].filter(Boolean).join(" ");
-              const rowContent = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              const rowContent = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
                 SitemapRowContent,
                 {
                   depth: row.depth,
@@ -14082,7 +14190,7 @@ var SitemapModal = ({
                   onToggleFolder: () => toggleFolder(row.href)
                 }
               );
-              return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
                 "div",
                 {
                   "aria-label": row.isPage ? `${row.href} / ${row.qaCount.status.todo} todo / ${row.qaCount.status.review} review / ${row.qaCount.status.hold} hold / ${row.users.length} online` : `${row.href} group / ${row.qaCount.status.todo} todo / ${row.qaCount.status.review} review / ${row.qaCount.status.hold} hold / ${row.users.length} online`,
@@ -14101,15 +14209,15 @@ var SitemapModal = ({
                 row.href
               );
             }),
-            sitemapRows.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "df-review-sitemap-empty", role: "status", children: "No matching pages" }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            sitemapRows.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "df-review-sitemap-empty", role: "status", children: "No matching pages" }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
               "button",
               {
                 "aria-label": `All QA / ${allQaCount.status.todo} todo / ${allQaCount.status.review} review / ${allQaCount.status.hold} hold`,
                 className: `df-review-sitemap-row is-summary${isAllQaVisible ? " is-active" : ""}`,
                 type: "button",
                 onClick: onSelectAllQa,
-                children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
                   SitemapRowContent,
                   {
                     depth: 0,
@@ -14129,55 +14237,6 @@ var SitemapModal = ({
     }
   );
 };
-var SitemapRowContent = ({
-  depth,
-  hasChildren,
-  isExpanded,
-  isPage,
-  label,
-  qaCount,
-  users,
-  onToggleFolder
-}) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
-    "span",
-    {
-      className: "df-review-sitemap-path",
-      style: { "--df-review-sitemap-depth": depth },
-      children: [
-        hasChildren ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-          "button",
-          {
-            "aria-expanded": isExpanded,
-            "aria-label": `${isExpanded ? "Collapse" : "Expand"} ${label}`,
-            className: "df-review-sitemap-tree-toggle",
-            type: "button",
-            onClick: (event) => {
-              event.stopPropagation();
-              onToggleFolder?.();
-            },
-            children: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDown, { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronRight, { "aria-hidden": "true" })
-          }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-tree-spacer", "aria-hidden": "true" }),
-        isPage ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-page-label", children: label }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-label", children: label })
-      ]
-    }
-  ),
-  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: getCountCellClassName("todo", qaCount.status.todo), children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("strong", { children: qaCount.status.todo }) }),
-  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: getCountCellClassName("review", qaCount.status.review), children: qaCount.status.review }),
-  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: getCountCellClassName("hold", qaCount.status.hold), children: qaCount.status.hold }),
-  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-cell is-online", children: users.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "df-review-sitemap-users", children: users.map((user) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-    "span",
-    {
-      className: "df-review-sitemap-user",
-      style: {
-        "--df-review-presence-color": user.color
-      },
-      children: user.userId
-    },
-    user.sessionId
-  )) }) : null })
-] });
 
 // src/react-shell/hooks/use.review.shell.data.ts
 var import_react25 = require("react");
@@ -14334,7 +14393,7 @@ var useReviewShellData = () => {
 };
 
 // src/react-shell/review/shell.modals.container.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var ReviewShellModalsContainer = () => {
   const { initialPrompt, pages } = useReviewShellConfig();
   const {
@@ -14391,6 +14450,10 @@ var ReviewShellModalsContainer = () => {
     (state) => state.setIsSitemapOpen
   );
   const showToast = useReviewToast();
+  const [hasSitemapOpened, setHasSitemapOpened] = (0, import_react26.useState)(false);
+  (0, import_react26.useEffect)(() => {
+    if (isSitemapOpen) setHasSitemapOpened(true);
+  }, [isSitemapOpen]);
   const initialPromptText = initialPrompt.trim();
   const copyInitialPrompt = (0, import_react26.useCallback)(
     (value, key) => copyReviewPrompt({
@@ -14401,10 +14464,11 @@ var ReviewShellModalsContainer = () => {
     }),
     [setCopiedPromptKey, showToast]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
-    isSitemapOpen && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
+    hasSitemapOpened && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       SitemapModal,
       {
+        isOpen: isSitemapOpen,
         activeRoute,
         allQaCount,
         getPageTarget,
@@ -14417,7 +14481,7 @@ var ReviewShellModalsContainer = () => {
         onSelectPage: selectPage
       }
     ),
-    isFigmaSettingsOpen && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    isFigmaSettingsOpen && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       ReviewSettingsModal,
       {
         areTooltipsEnabledDraft,
@@ -14438,8 +14502,8 @@ var ReviewShellModalsContainer = () => {
         onToggleFigmaTokenVisible: () => setIsFigmaTokenVisible((current) => !current)
       }
     ),
-    isInitialPromptOpen && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(PromptModal, { onClose: () => setIsInitialPromptOpen(false) }),
-    isInitialPromptScriptOpen && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    isInitialPromptOpen && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(PromptModal, { onClose: () => setIsInitialPromptOpen(false) }),
+    isInitialPromptScriptOpen && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       InitialPromptModal,
       {
         copiedPromptKey,
@@ -14494,7 +14558,7 @@ var useReviewSourceInspectorState = () => {
 };
 
 // src/react-shell/review/shell.providers.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var ReviewShellProviders = ({
   actions,
   children,
@@ -14504,17 +14568,17 @@ var ReviewShellProviders = ({
   ruler,
   settings,
   sourceInspector
-}) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewShellActionsProvider, { value: actions, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewRulerProvider, { value: ruler, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewFigmaImagesProvider, { value: figmaImages, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewSourceInspectorProvider, { value: sourceInspector, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewSettingsProvider, { value: settings, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewPresenceProvider, { value: presence, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ReviewFigmaOverlayProvider, { value: figmaOverlay, children }) }) }) }) }) }) });
+}) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewShellActionsProvider, { value: actions, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewRulerProvider, { value: ruler, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewFigmaImagesProvider, { value: figmaImages, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewSourceInspectorProvider, { value: sourceInspector, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewSettingsProvider, { value: settings, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewPresenceProvider, { value: presence, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ReviewFigmaOverlayProvider, { value: figmaOverlay, children }) }) }) }) }) }) });
 
 // src/react-shell/review/source.inspector.overlay.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var SourceInspectorOverlay = ({
   componentSelectionState,
   state
 }) => {
   const hoverState = state?.targetElement === componentSelectionState?.targetElement ? null : state;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
-    componentSelectionState ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
+    componentSelectionState ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       "div",
       {
         className: "df-review-source-outline is-component-selection",
@@ -14526,7 +14590,7 @@ var SourceInspectorOverlay = ({
         }
       }
     ) : null,
-    hoverState ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    hoverState ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       "div",
       {
         className: "df-review-source-outline is-hover",
@@ -14542,10 +14606,10 @@ var SourceInspectorOverlay = ({
 };
 
 // src/react-shell/review/source.inspector.overlay.container.tsx
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var SourceInspectorOverlayContainer = () => {
   const { componentSelectionState, sourceInspectorState } = useReviewSourceInspectorState();
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     SourceInspectorOverlay,
     {
       componentSelectionState,
@@ -14558,7 +14622,7 @@ var SourceInspectorOverlayContainer = () => {
 var import_react32 = require("react");
 
 // src/react-shell/review/mode.toolbar.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var ReviewModeToolbar = ({
   canWriteArea,
   canWriteDom,
@@ -14566,8 +14630,8 @@ var ReviewModeToolbar = ({
   onSetReviewMode
 }) => {
   if (!canWriteDom && !canWriteArea) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "df-review-mode", "aria-label": "Add QA", children: [
-    canWriteDom && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "df-review-mode", "aria-label": "Add QA", children: [
+    canWriteDom && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       "button",
       {
         "aria-label": "Element",
@@ -14575,11 +14639,11 @@ var ReviewModeToolbar = ({
         "data-review-tooltip": "Element QA",
         type: "button",
         onClick: () => onSetReviewMode("element"),
-        children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(SquareMousePointer, { "aria-hidden": "true" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SquareMousePointer, { "aria-hidden": "true" })
       }
     ),
-    canWriteDom && canWriteArea && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "df-review-mode-divider", "aria-hidden": "true", children: "|" }),
-    canWriteArea && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    canWriteDom && canWriteArea && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "df-review-mode-divider", "aria-hidden": "true", children: "|" }),
+    canWriteArea && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       "button",
       {
         "aria-label": "Area",
@@ -14587,14 +14651,14 @@ var ReviewModeToolbar = ({
         "data-review-tooltip": "Area QA",
         type: "button",
         onClick: () => onSetReviewMode("area"),
-        children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Scan, { "aria-hidden": "true" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Scan, { "aria-hidden": "true" })
       }
     )
   ] });
 };
 
 // src/react-shell/ruler/gutters.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var RulerGutters = () => {
   const size = useReviewShellStore((state) => state.size);
   const {
@@ -14603,9 +14667,9 @@ var RulerGutters = () => {
     rulerScaleY,
     rulerUnit
   } = useReviewRulerState();
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "df-review-ruler-corner", "aria-hidden": "true" }),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "df-review-ruler-corner", "aria-hidden": "true" }),
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
       "div",
       {
         className: "df-review-ruler-gutter is-x",
@@ -14613,15 +14677,15 @@ var RulerGutters = () => {
           "--df-review-ruler-step-x": `${rulerScaleX * 20}px`
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "df-review-ruler-frame-label", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("strong", { children: size.label }),
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "df-review-ruler-frame-label", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("strong", { children: size.label }),
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { children: [
               size.designWidth,
               size.designHeight ? `x${size.designHeight}` : "",
               rulerUnit
             ] })
           ] }),
-          rulerHover && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+          rulerHover && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "div",
             {
               className: "df-review-ruler-coord is-x",
@@ -14632,14 +14696,14 @@ var RulerGutters = () => {
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       "div",
       {
         className: "df-review-ruler-gutter is-y",
         style: {
           "--df-review-ruler-step-y": `${rulerScaleY * 20}px`
         },
-        children: rulerHover && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+        children: rulerHover && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           "div",
           {
             className: "df-review-ruler-coord is-y",
@@ -14653,7 +14717,7 @@ var RulerGutters = () => {
 };
 
 // src/react-shell/ruler/overlay.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var RulerOverlay = () => {
   const { iframeRef } = useReviewShellRefs();
   const size = useReviewShellStore((state) => state.size);
@@ -14664,7 +14728,7 @@ var RulerOverlay = () => {
     rulerMeasureLabel,
     rulerOverlayRef
   } = useReviewRulerState();
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     "div",
     {
       ref: rulerOverlayRef,
@@ -14678,8 +14742,8 @@ var RulerOverlay = () => {
         );
       },
       children: [
-        rulerHover && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+        rulerHover && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             "div",
             {
               className: "df-review-ruler-guide is-x",
@@ -14687,7 +14751,7 @@ var RulerOverlay = () => {
               style: { top: `${rulerHover.y}px` }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             "div",
             {
               className: "df-review-ruler-guide is-y",
@@ -14696,8 +14760,8 @@ var RulerOverlay = () => {
             }
           )
         ] }),
-        rulerMeasure && (rulerMeasure.width > 0 || rulerMeasure.height > 0) && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+        rulerMeasure && (rulerMeasure.width > 0 || rulerMeasure.height > 0) && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             "div",
             {
               className: "df-review-ruler-selection",
@@ -14710,7 +14774,7 @@ var RulerOverlay = () => {
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             "div",
             {
               className: "df-review-ruler-label",
@@ -14836,13 +14900,6 @@ var setTargetFigmaSourceSelectLocked = (targetDocument, locked) => {
     locked
   );
 };
-var isEditableEventTarget = (event) => {
-  const path = event.composedPath?.() ?? [];
-  const element = path[0] ?? event.target;
-  if (!element || typeof element.tagName !== "string") return false;
-  const tag = element.tagName;
-  return tag === "INPUT" || tag === "TEXTAREA" || element.isContentEditable === true;
-};
 var TRUE_STORAGE_VALUES = /* @__PURE__ */ new Set([
   "1",
   "true",
@@ -15894,7 +15951,7 @@ function isDomReviewItem(item) {
 }
 
 // src/react-shell/target/outside.markers.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var OUTSIDE_MARKER_HEIGHT = 22;
 var OUTSIDE_MARKER_CONNECTOR_TOP = 10;
 var OUTSIDE_MARKER_GAP = 6;
@@ -16072,7 +16129,7 @@ var ReviewOutsideMarkers = () => {
     size
   ]);
   if (markers.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "df-review-outside-marker-layer", "aria-label": "QA markers", children: markers.map((marker) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "df-review-outside-marker-layer", "aria-label": "QA markers", children: markers.map((marker) => {
     const isActive = marker.item.id === selectedItemId;
     const style = {
       top: `${marker.top}px`,
@@ -16081,7 +16138,7 @@ var ReviewOutsideMarkers = () => {
       "--df-review-outside-marker-connector-stem-height": `${marker.connectorStemHeight}px`,
       "--df-review-outside-marker-z-index": isActive ? 2 : 1
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
       "button",
       {
         "aria-label": `Focus ${marker.label}`,
@@ -16103,7 +16160,7 @@ var ReviewOutsideMarkers = () => {
 };
 
 // src/react-shell/target/frame.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var ReviewTargetFrame = () => {
   const {
     figmaImageOverlays,
@@ -16138,15 +16195,15 @@ var ReviewTargetFrame = () => {
     syncTargetFigmaImageOverlays();
     window.requestAnimationFrame(syncTargetFigmaImageOverlays);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("main", { className: "df-review-stage", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "df-review-frame", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "df-review-frame-scroll", ref: frameScrollRef, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "df-review-frame-canvas", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "df-review-target-stack", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("main", { className: "df-review-stage", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "df-review-frame", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "df-review-frame-scroll", ref: frameScrollRef, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "df-review-frame-canvas", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "df-review-target-stack", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
       "div",
       {
         className: `df-review-device-frame${showRuler ? " is-ruler" : ""}`,
         children: [
-          showRuler && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(RulerGutters, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ReviewOutsideMarkers, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+          showRuler && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RulerGutters, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ReviewOutsideMarkers, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
             "div",
             {
               className: "df-review-device",
@@ -16157,7 +16214,7 @@ var ReviewTargetFrame = () => {
                 minHeight: `${size.height}px`
               },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
                   "iframe",
                   {
                     ref: iframeRef,
@@ -16169,14 +16226,14 @@ var ReviewTargetFrame = () => {
                   },
                   `${frameTargetSrc}:${frameNavigationVersion}`
                 ),
-                showRuler && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(RulerOverlay, {})
+                showRuler && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RulerOverlay, {})
               ]
             }
           )
         ]
       }
     ) }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "df-review-frame-actions", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "df-review-frame-actions", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
       ReviewModeToolbar,
       {
         canWriteArea,
@@ -16192,18 +16249,18 @@ var ReviewTargetFrame = () => {
 var import_react33 = require("react");
 
 // src/react-shell/topbar.tsx
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var ReviewScopeIcon2 = ({ scope }) => {
-  if (scope === "mobile") return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Smartphone, { "aria-hidden": "true" });
-  if (scope === "tablet") return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RectangleHorizontal, { "aria-hidden": "true" });
-  if (scope === "wide") return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Maximize2, { "aria-hidden": "true" });
-  if (scope === "dom") return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SquareMousePointer, { "aria-hidden": "true" });
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Monitor, { "aria-hidden": "true" });
+  if (scope === "mobile") return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Smartphone, { "aria-hidden": "true" });
+  if (scope === "tablet") return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(RectangleHorizontal, { "aria-hidden": "true" });
+  if (scope === "wide") return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Maximize2, { "aria-hidden": "true" });
+  if (scope === "dom") return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(SquareMousePointer, { "aria-hidden": "true" });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Monitor, { "aria-hidden": "true" });
 };
 var ViewportPresetIcon = ({
   preset
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ReviewScopeIcon2, { scope: getViewportPresetKind(preset) });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ReviewScopeIcon2, { scope: getViewportPresetKind(preset) });
 };
 var getPresetSelectValue = (preset) => `${preset.label}:${preset.width}x${preset.height}`;
 function getTargetOpenHref(targetSrc) {
@@ -16240,8 +16297,8 @@ var ReviewTopbar = ({
     );
     if (nextPreset) onSizeChange(nextPreset);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("header", { className: "df-review-topbar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("header", { className: "df-review-topbar", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
       "form",
       {
         className: "df-review-address",
@@ -16250,7 +16307,7 @@ var ReviewTopbar = ({
           onApplyTarget();
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
             "button",
             {
               "aria-label": "Open sitemap",
@@ -16259,10 +16316,10 @@ var ReviewTopbar = ({
               "data-review-tooltip-placement": "bottom",
               type: "button",
               onClick: onOpenSitemap,
-              children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Map2, { "aria-hidden": "true" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Map2, { "aria-hidden": "true" })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
             "input",
             {
               "aria-label": "Path",
@@ -16270,8 +16327,8 @@ var ReviewTopbar = ({
               onChange: (event) => onDraftTargetChange(event.target.value)
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "df-review-address-actions", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "df-review-address-actions", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
               "button",
               {
                 "aria-label": "Refresh target",
@@ -16280,10 +16337,10 @@ var ReviewTopbar = ({
                 "data-review-tooltip-placement": "bottom",
                 title: "Refresh target",
                 type: "submit",
-                children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RefreshCw, { "aria-hidden": "true" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(RefreshCw, { "aria-hidden": "true" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
               "button",
               {
                 "aria-label": copyLabel,
@@ -16293,10 +16350,10 @@ var ReviewTopbar = ({
                 title: copyLabel,
                 type: "button",
                 onClick: onCopyCurrentUrl,
-                children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Copy, { "aria-hidden": "true" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Copy, { "aria-hidden": "true" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
               "a",
               {
                 "aria-label": "Open target page",
@@ -16307,30 +16364,30 @@ var ReviewTopbar = ({
                 rel: "noreferrer",
                 target: "_blank",
                 title: "Open target page",
-                children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ExternalLink, { "aria-hidden": "true" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ExternalLink, { "aria-hidden": "true" })
               }
             )
           ] })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "df-review-tools", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "df-review-tool-controls", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "df-review-presets", "aria-label": "Viewport presets", children: viewportPresets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "df-review-tools", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "df-review-tool-controls", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "df-review-presets", "aria-label": "Viewport presets", children: viewportPresets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
           "button",
           {
             className: preset.label === size.label ? "is-active" : "",
             type: "button",
             onClick: () => onSizeChange(preset),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ViewportPresetIcon, { preset }),
-              /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "df-review-preset-copy", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("strong", { children: preset.label }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "df-review-preset-count", children: presetScopeCounts.get(getViewportPresetKind(preset)) ?? 0 })
+              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ViewportPresetIcon, { preset }),
+              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "df-review-preset-copy", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("strong", { children: preset.label }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "df-review-preset-count", children: presetScopeCounts.get(getViewportPresetKind(preset)) ?? 0 })
             ]
           },
           preset.label
         )) }),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "select",
           {
             "aria-label": "Viewport preset",
@@ -16340,7 +16397,7 @@ var ReviewTopbar = ({
             children: viewportPresets.map((preset) => {
               const scope = getViewportPresetKind(preset);
               const count = presetScopeCounts.get(scope) ?? 0;
-              return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
                 "option",
                 {
                   value: getPresetSelectValue(preset),
@@ -16351,15 +16408,15 @@ var ReviewTopbar = ({
             })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "df-review-tool-divider", "aria-hidden": "true", children: "|" }),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("span", { className: "df-review-active-size", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "df-review-tool-divider", "aria-hidden": "true", children: "|" }),
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("span", { className: "df-review-active-size", children: [
           size.width,
           "x",
           size.height
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "df-review-overlays", "aria-label": "Target overlays", children: [
-        isRulerAvailable && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "df-review-overlays", "aria-label": "Target overlays", children: [
+        isRulerAvailable && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "button",
           {
             "aria-label": "Toggle ruler",
@@ -16368,10 +16425,10 @@ var ReviewTopbar = ({
             "data-review-tooltip-placement": "bottom",
             type: "button",
             onClick: onToggleRuler,
-            children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Ruler, { "aria-hidden": "true" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Ruler, { "aria-hidden": "true" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "button",
           {
             "aria-label": "Toggle grid overlay",
@@ -16380,10 +16437,10 @@ var ReviewTopbar = ({
             "data-review-tooltip-placement": "bottom",
             type: "button",
             onClick: () => onToggleTargetOverlay("grid"),
-            children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(LayoutGrid, { "aria-hidden": "true" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(LayoutGrid, { "aria-hidden": "true" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "button",
           {
             "aria-disabled": !isFigmaOverlayAvailable,
@@ -16394,7 +16451,7 @@ var ReviewTopbar = ({
             disabled: !isFigmaOverlayAvailable,
             type: "button",
             onClick: onToggleFigmaOverlay,
-            children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(FigmaMarkIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FigmaMarkIcon, {})
           }
         )
       ] })
@@ -16403,7 +16460,7 @@ var ReviewTopbar = ({
 };
 
 // src/react-shell/topbar.container.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var TopbarContainer = () => {
   const {
     applyTarget,
@@ -16436,7 +16493,7 @@ var TopbarContainer = () => {
   const copyCurrentUrl = () => copyCurrentReviewUrl({
     onCopyLabelChange: setCopyLabel
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     ReviewTopbar,
     {
       draftTarget,
@@ -16463,11 +16520,11 @@ var TopbarContainer = () => {
 };
 
 // src/react-shell/review/toast.container.tsx
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var ReviewToastContainer = () => {
   const toastMessage = useReviewShellStore((state) => state.toastMessage);
   if (!toastMessage) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "df-review-copy-toast", role: "status", children: toastMessage });
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "df-review-copy-toast", role: "status", children: toastMessage });
 };
 
 // src/react-shell/hooks/use.review.shell.runtime.ts
@@ -16837,72 +16894,21 @@ function normalizeStoredReviewItem(value) {
   };
 }
 
+// src/core/error.ts
+function getErrorMessage(error, fallback) {
+  if (error instanceof Error) return error.message;
+  if (error && typeof error === "object" && "message" in error && typeof error.message === "string") {
+    return error.message;
+  }
+  return fallback;
+}
+
 // src/core/id.ts
 function createId() {
   if ("randomUUID" in crypto) return crypto.randomUUID();
   return `${Date.now().toString(36)}-${Math.random().toString(36).slice(2)}`;
 }
 
-// src/core/hotkey.ts
-var HOTKEY_KEY_ALIASES = {
-  q: ["\u3142", "\u3143"],
-  w: ["\u3148", "\u3149"],
-  e: ["\u3137", "\u3138"],
-  r: ["\u3131", "\u3132"],
-  t: ["\u3145", "\u3146"],
-  y: ["\u315B"],
-  u: ["\u3155"],
-  i: ["\u3151"],
-  o: ["\u3150", "\u3152"],
-  p: ["\u3154", "\u3156"],
-  a: ["\u3141"],
-  s: ["\u3134"],
-  d: ["\u3147"],
-  f: ["\u3139"],
-  g: ["\u314E"],
-  h: ["\u3157"],
-  j: ["\u3153"],
-  k: ["\u314F"],
-  l: ["\u3163"],
-  z: ["\u314B"],
-  x: ["\u314C"],
-  c: ["\u314A"],
-  v: ["\u314D"],
-  b: ["\u3160"],
-  n: ["\u315C"],
-  m: ["\u3161"]
-};
-function isHotkey(event, hotkey) {
-  const parts = hotkey.split("+").map((part) => part.trim().toLowerCase()).filter(Boolean);
-  const key = parts.find(
-    (part) => !["shift", "ctrl", "control", "alt", "meta", "cmd"].includes(part)
-  );
-  if (!key) return false;
-  if (parts.includes("shift") !== event.shiftKey) return false;
-  if ((parts.includes("ctrl") || parts.includes("control")) !== event.ctrlKey) {
-    return false;
-  }
-  if (parts.includes("alt") !== event.altKey) return false;
-  if ((parts.includes("meta") || parts.includes("cmd")) !== event.metaKey) {
-    return false;
-  }
-  return isHotkeyKey(event, key);
-}
-function getHotkeyActionKey(event, keys) {
-  return keys.find((key) => isHotkeyKey(event, key));
-}
-function isHotkeyKey(event, key) {
-  const normalizedKey = key.toLowerCase();
-  if (event.key.toLowerCase() === normalizedKey) return true;
-  if (getHotkeyCode(normalizedKey) === event.code) return true;
-  return HOTKEY_KEY_ALIASES[normalizedKey]?.includes(event.key) ?? false;
-}
-function getHotkeyCode(key) {
-  if (/^[a-z]$/.test(key)) return `Key${key.toUpperCase()}`;
-  if (/^[0-9]$/.test(key)) return `Digit${key}`;
-  return void 0;
-}
-
 // src/core/location.ts
 var INTERNAL_QUERY_PARAMS = ["__dfwr_target"];
 function getPageUrl(environment) {
@@ -20069,13 +20075,6 @@ var WebReviewKitView = class {
 // src/core/web.review.kit.app.ts
 var ROOT_ID = "df-web-review-kit-root";
 var VIEWPORT_SCROLL_OPTIONS = { capture: true, passive: true };
-function isEditableEventTarget2(event) {
-  const path = event.composedPath?.() ?? [];
-  const element = path[0] ?? event.target;
-  if (!element || typeof element.tagName !== "string") return false;
-  const tag = element.tagName;
-  return tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT" || element.isContentEditable === true;
-}
 function createWebReviewKit(options) {
   if (typeof window === "undefined" || typeof document === "undefined") {
     return createNoopController();
@@ -20120,7 +20119,7 @@ var WebReviewKitApp = class {
         event.stopPropagation();
         return;
       }
-      if (isEditableEventTarget2(event) || !isHotkey(event, this.hotkey)) return;
+      if (isEditableEventTarget(event) || !isHotkey(event, this.hotkey)) return;
       event.preventDefault();
       event.stopPropagation();
       this.toggle();
@@ -20630,46 +20629,28 @@ var WebReviewKitApp = class {
       this.root.style.display = previousDisplay;
     }
   }
-  async captureDomDraft(input) {
-    if (this.isCapturingViewport) return;
-    const environment = this.getEnvironment();
-    const draft = this.domDraft;
-    if (!draft) return;
-    if (!environment?.captureViewport) {
-      this.draftError = "Viewport capture helper is not available.";
-      this.render();
-      return;
-    }
-    const captureInput = this.createViewportCaptureInput(
-      environment,
+  captureDomDraft(input) {
+    return this.captureDraft(
       input,
-      input.selection?.viewport
+      () => this.domDraft,
+      (draft) => {
+        this.domDraft = draft;
+      }
+    );
+  }
+  captureAreaDraft(input) {
+    return this.captureDraft(
+      input,
+      () => this.areaDraft,
+      (draft) => {
+        this.areaDraft = draft;
+      }
     );
-    this.draftError = "";
-    this.isCapturingViewport = true;
-    this.render();
-    try {
-      const result = await environment.captureViewport(captureInput);
-      const attachment = this.createCaptureDraftAttachment(result, captureInput);
-      const currentDraft = this.domDraft ?? draft;
-      this.domDraft = {
-        ...currentDraft,
-        attachments: [...currentDraft.attachments ?? [], attachment]
-      };
-    } catch (error) {
-      this.draftError = this.getErrorMessage(
-        error,
-        "Failed to capture viewport."
-      );
-    } finally {
-      this.isCapturingViewport = false;
-      this.render();
-    }
   }
-  async captureAreaDraft(input) {
+  async captureDraft(input, getDraft, setDraft) {
     if (this.isCapturingViewport) return;
     const environment = this.getEnvironment();
-    const draft = this.areaDraft;
+    const draft = getDraft();
     if (!draft) return;
     if (!environment?.captureViewport) {
       this.draftError = "Viewport capture helper is not available.";
@@ -20687,16 +20668,13 @@ var WebReviewKitApp = class {
     try {
       const result = await environment.captureViewport(captureInput);
       const attachment = this.createCaptureDraftAttachment(result, captureInput);
-      const currentDraft = this.areaDraft ?? draft;
-      this.areaDraft = {
+      const currentDraft = getDraft() ?? draft;
+      setDraft({
         ...currentDraft,
         attachments: [...currentDraft.attachments ?? [], attachment]
-      };
+      });
     } catch (error) {
-      this.draftError = this.getErrorMessage(
-        error,
-        "Failed to capture viewport."
-      );
+      this.draftError = getErrorMessage(error, "Failed to capture viewport.");
     } finally {
       this.isCapturingViewport = false;
       this.render();
@@ -20835,17 +20813,10 @@ var WebReviewKitApp = class {
     );
   }
   getCreateItemErrorMessage(error, wasUploadingAttachments) {
-    const message = this.getErrorMessage(error, "Failed to save QA.");
+    const message = getErrorMessage(error, "Failed to save QA.");
     const reason = error && typeof error === "object" && "reason" in error && typeof error.reason === "string" ? ` (${error.reason})` : "";
     return wasUploadingAttachments && reason ? `Attachment upload failed${reason}: ${message}` : message;
   }
-  getErrorMessage(error, fallback) {
-    if (error instanceof Error) return error.message;
-    if (error && typeof error === "object" && "message" in error && typeof error.message === "string") {
-      return error.message;
-    }
-    return fallback;
-  }
   async restoreItem(item) {
     this.setModeState("idle");
     this.clearDrafts();
@@ -21020,7 +20991,7 @@ async function captureIframeViewport(frame, input) {
       );
     } catch (error) {
       throw new Error(
-        `Selected region capture failed: ${getUnknownErrorMessage(error)}`
+        `Selected region capture failed: ${getCaptureErrorMessage(error)}`
       );
     }
   }
@@ -21033,7 +21004,7 @@ async function captureIframeViewport(frame, input) {
       input
     );
   } catch (error) {
-    errors.push(`html2canvas: ${getUnknownErrorMessage(error)}`);
+    errors.push(`html2canvas: ${getCaptureErrorMessage(error)}`);
   }
   const svg = createViewportSvg(targetDocument, targetWindow, viewport, input);
   const svgFile = new Blob([svg], { type: "image/svg+xml;charset=utf-8" });
@@ -21047,7 +21018,7 @@ async function captureIframeViewport(frame, input) {
       input
     );
   } catch (error) {
-    errors.push(`svg-canvas: ${getUnknownErrorMessage(error)}`);
+    errors.push(`svg-canvas: ${getCaptureErrorMessage(error)}`);
   }
   return {
     file: svgFile,
@@ -21483,12 +21454,8 @@ function createMarkerSvg(x, y) {
 function formatCaptureTimestamp(timestamp) {
   return timestamp.replace(/[^0-9A-Za-z]+/g, "-").replace(/^-|-$/g, "");
 }
-function getUnknownErrorMessage(error) {
-  if (error instanceof Error) return error.message;
-  if (error && typeof error === "object" && "message" in error && typeof error.message === "string") {
-    return error.message;
-  }
-  return "Capture was saved as SVG fallback.";
+function getCaptureErrorMessage(error) {
+  return getErrorMessage(error, "Capture was saved as SVG fallback.");
 }
 
 // src/react-shell/hooks/review.kit.target.ts
@@ -24810,7 +24777,7 @@ var createReviewShellStore = (init) => (0, import_zustand2.createStore)()((...ar
 }));
 
 // src/react-shell/review/shell.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var ReviewShell = (props) => {
   const config = (0, import_react57.useMemo)(
     () => createReviewShellConfig(props),
@@ -24830,23 +24797,23 @@ var ReviewShell = (props) => {
     () => createReviewShellStore({ target: getInitialTargetSliceState(config) })
   );
   const [refs] = (0, import_react57.useState)(createReviewShellRefs);
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewShellConfigProvider, { value: config, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewShellStoreProvider, { value: store, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewShellRefsProvider, { value: refs, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewShellContent, { ...props }) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewShellConfigProvider, { value: config, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewShellStoreProvider, { value: store, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewShellRefsProvider, { value: refs, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewShellContent, { ...props }) }) }) });
 };
 var ReviewShellContent = (props) => {
   const runtime = useReviewShellRuntime(props);
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewShellProviders, { ...runtime, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewShellProviders, { ...runtime, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     ReviewShellFrameContainer,
     {
       slots: {
-        topbar: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TopbarContainer, {}),
-        modals: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewShellModalsContainer, {}),
-        toast: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewToastContainer, {}),
-        sideRail: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewSideRailContainer, {}),
-        qaPanel: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(QaPanelContainer, {}),
-        figmaImagesPanel: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FigmaImagesPanelContainer, {}),
-        sourceTreePanel: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SectionOutlineContainer, {}),
-        targetFrame: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ReviewTargetFrame, {}),
-        sourceInspector: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SourceInspectorOverlayContainer, {})
+        topbar: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(TopbarContainer, {}),
+        modals: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewShellModalsContainer, {}),
+        toast: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewToastContainer, {}),
+        sideRail: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewSideRailContainer, {}),
+        qaPanel: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(QaPanelContainer, {}),
+        figmaImagesPanel: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(FigmaImagesPanelContainer, {}),
+        sourceTreePanel: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SectionOutlineContainer, {}),
+        targetFrame: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ReviewTargetFrame, {}),
+        sourceInspector: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SourceInspectorOverlayContainer, {})
       }
     }
   ) });
@@ -24855,7 +24822,7 @@ var ReviewShellContent = (props) => {
 // src/react-shell/figma/dev-overlay.tsx
 var import_react58 = __toESM(require("react"), 1);
 var import_client = require("react-dom/client");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var FIGMA_DEV_OVERLAY_ROOT_ID = "df-review-figma-dev-overlay-root";
 var FIGMA_DEV_OVERLAY_MOUNT_ID = "df-review-figma-dev-overlay-mount";
 var mountFigmaDevOverlay = (options) => {
@@ -24876,7 +24843,7 @@ var mountFigmaDevOverlay = (options) => {
   document.body.appendChild(host);
   const root = (0, import_client.createRoot)(mountNode);
   root.render(
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react58.default.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(FigmaDevOverlayWidget, { ...options }) })
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react58.default.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(FigmaDevOverlayWidget, { ...options }) })
   );
   return {
     destroy() {
@@ -24967,7 +24934,7 @@ var FigmaDevOverlayWidget = ({
   );
   (0, import_react58.useEffect)(() => {
     const handleKeyDown = (event) => {
-      if (!isHotkey(event, "Shift+F") || isEditableFigmaDevOverlayEventTarget(event)) {
+      if (!isHotkey(event, "Shift+F") || isEditableEventTarget(event)) {
         return;
       }
       event.preventDefault();
@@ -24989,21 +24956,21 @@ var FigmaDevOverlayWidget = ({
       setImageOverlayOpacity(selectedImage.id, opacityPercent / 100);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
     "aside",
     {
       "aria-label": "Figma overlay",
       className: `df-review-figma-dev-widget${isPanelOpen ? " is-open" : ""}${isAnyImageOverlayVisible ? " is-active" : ""}`,
       children: [
-        isPanelOpen && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "df-review-figma-dev-panel", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "df-review-figma-dev-panel-header", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("strong", { children: "Figma" }),
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { children: matchedViewportMatch ? `${matchedViewportMatch.label} \xB7 ${matchedViewportMatch.rangeLabel}` : `${viewport.width}px` })
+        isPanelOpen && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "df-review-figma-dev-panel", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "df-review-figma-dev-panel-header", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("strong", { children: "Figma" }),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { children: matchedViewportMatch ? `${matchedViewportMatch.label} \xB7 ${matchedViewportMatch.rangeLabel}` : `${viewport.width}px` })
           ] }),
-          selectedImage && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "df-review-figma-dev-selected-controls", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("label", { className: "df-review-figma-dev-opacity-control", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { children: "Opacity" }),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+          selectedImage && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "df-review-figma-dev-selected-controls", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("label", { className: "df-review-figma-dev-opacity-control", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { children: "Opacity" }),
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 "input",
                 {
                   "aria-label": `${selectedImageLabel} overlay opacity`,
@@ -25016,11 +24983,11 @@ var FigmaDevOverlayWidget = ({
                   onInput: (event) => updateSelectedImageOpacity(event.currentTarget.value)
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("strong", { children: selectedOpacityPercent })
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("strong", { children: selectedOpacityPercent })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("label", { className: "df-review-figma-dev-y-control", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(MoveVertical, { "aria-hidden": "true" }),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("label", { className: "df-review-figma-dev-y-control", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(MoveVertical, { "aria-hidden": "true" }),
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 "input",
                 {
                   "aria-label": `${selectedImageLabel} overlay Y offset`,
@@ -25050,14 +25017,14 @@ var FigmaDevOverlayWidget = ({
               )
             ] })
           ] }),
-          error && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "df-review-figma-dev-status", children: error }),
-          !matchedViewport ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("p", { className: "df-review-figma-dev-empty", children: [
+          error && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "df-review-figma-dev-status", children: error }),
+          !matchedViewport ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("p", { className: "df-review-figma-dev-empty", children: [
             "No Figma layers for this viewport.",
             viewportBoundaries ? ` Mobile ${viewportBoundaries.mobileRangeLabel} / Full width ${viewportBoundaries.fullWidthRangeLabel}` : ""
-          ] }) : isLoading ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "df-review-figma-dev-status", children: "Loading..." }) : images.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "df-review-figma-dev-empty", children: "No Figma layers for this viewport." }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "df-review-figma-dev-list", children: images.map((image, index) => {
+          ] }) : isLoading ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "df-review-figma-dev-status", children: "Loading..." }) : images.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { className: "df-review-figma-dev-empty", children: "No Figma layers for this viewport." }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "df-review-figma-dev-list", children: images.map((image, index) => {
             const imageLabel = getFigmaImageLabel(image, index);
             const overlayState = imageOverlayStates[image.id] ?? DEFAULT_FIGMA_IMAGE_LAYER_STATE;
-            return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+            return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
               "article",
               {
                 className: `df-review-figma-dev-row${image.id === selectedImageId ? " is-active" : ""}`,
@@ -25070,7 +25037,7 @@ var FigmaDevOverlayWidget = ({
                   setSelectedImageId(image.id);
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                     FigmaImageLayerStateButtons,
                     {
                       imageLabel,
@@ -25082,9 +25049,9 @@ var FigmaDevOverlayWidget = ({
                       onToggleVisible: () => toggleImageOverlayVisible(image.id)
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "df-review-figma-dev-row-main", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("strong", { children: imageLabel }),
-                    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("small", { children: formatFigmaImageDate(image.updatedAt) })
+                  /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("span", { className: "df-review-figma-dev-row-main", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("strong", { children: imageLabel }),
+                    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("small", { children: formatFigmaImageDate(image.updatedAt) })
                   ] })
                 ]
               },
@@ -25092,7 +25059,7 @@ var FigmaDevOverlayWidget = ({
             );
           }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "df-review-figma-dev-bar", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "df-review-figma-dev-bar", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
           "button",
           {
             "aria-expanded": isPanelOpen,
@@ -25102,8 +25069,8 @@ var FigmaDevOverlayWidget = ({
             type: "button",
             onClick: () => setIsPanelOpen((isOpen) => !isOpen),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(FigmaMarkIcon, {}),
-              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "df-review-figma-dev-button-count", children: images.length })
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(FigmaMarkIcon, {}),
+              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "df-review-figma-dev-button-count", children: images.length })
             ]
           }
         ) })
@@ -25128,13 +25095,6 @@ function useCurrentPageUrl(pageUrl, reviewPathPrefix) {
   }, [pageUrl, reviewPathPrefix]);
   return currentPageUrl;
 }
-function isEditableFigmaDevOverlayEventTarget(event) {
-  const path = event.composedPath?.() ?? [];
-  const element = path[0] ?? event.target;
-  if (!element || typeof element.tagName !== "string") return false;
-  const tagName = element.tagName;
-  return tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT" || element.isContentEditable === true;
-}
 function useCurrentViewport() {
   const [viewport, setViewport] = (0, import_react58.useState)(getCurrentViewportSize);
   (0, import_react58.useEffect)(() => {
@@ -25694,7 +25654,7 @@ var createSupabasePresenceAdapter = ({
 });
 
 // src/react-shell.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var mountReviewShell = (options) => {
   if (typeof document === "undefined" || !document.head) return;
   const { rootId = "root", ...shellProps } = options;
@@ -25705,7 +25665,7 @@ var mountReviewShell = (options) => {
   root.style.height = "100%";
   root.style.margin = "0";
   (0, import_client2.createRoot)(root).render(
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react59.default.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ReviewShell, { ...shellProps }) })
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react59.default.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ReviewShell, { ...shellProps }) })
   );
 };
 // Annotate the CommonJS export names for ESM import in node: