web-remarq 0.1.3 → 0.1.5

package/dist/core/index.cjs

@@ -283,6 +283,11 @@ function matchElement(fp, options) {
   return bestScore >= MATCH_THRESHOLD ? bestEl : null;
 }
 
+// src/core/viewport.ts
+function toBucket(width) {
+  return Math.floor(width / 100) * 100;
+}
+
 // src/core/storage.ts
 var STORAGE_KEY = "remarq:annotations";
 var AnnotationStorage = class {
@@ -325,8 +330,17 @@ var AnnotationStorage = class {
   }
   importJSON(data) {
     this.annotations = [...data.annotations];
+    this.migrateViewportBuckets();
     this.save();
   }
+  migrateViewportBuckets() {
+    for (const ann of this.annotations) {
+      if (ann.viewportBucket == null && ann.viewport) {
+        const width = parseInt(ann.viewport.split("x")[0], 10);
+        ann.viewportBucket = toBucket(width);
+      }
+    }
+  }
   load() {
     try {
       const raw = localStorage.getItem(STORAGE_KEY);
@@ -335,6 +349,7 @@ var AnnotationStorage = class {
         const _a = parsed, { version, annotations } = _a, rest = __objRest(_a, ["version", "annotations"]);
         this.annotations = annotations != null ? annotations : [];
         this.extraFields = rest;
+        this.migrateViewportBuckets();
       }
     } catch (e) {
       this.isMemoryOnly = true;

package/dist/core/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/index.ts","../../src/core/hash-detect.ts","../../src/core/fingerprint.ts","../../src/core/matcher.ts","../../src/core/storage.ts"],"sourcesContent":["export type { Annotation, AnnotationStore, ElementFingerprint } from './types'\nexport { createFingerprint } from './fingerprint'\nexport { matchElement } from './matcher'\nexport { AnnotationStorage } from './storage'\n","const CSS_MODULES_RE = /^(.+)__([a-zA-Z0-9]{3,})$/\nconst STYLED_COMPONENTS_RE = /^sc-/\nconst EMOTION_RE = /^css-[a-zA-Z0-9]+$/\nconst PURE_HASH_RE = /^(?=.*[a-zA-Z])(?=.*\\d)[a-zA-Z0-9]{8,}$/\n\nexport function isHashedClass(className: string): boolean {\n  if (STYLED_COMPONENTS_RE.test(className)) return true\n  if (EMOTION_RE.test(className)) return true\n  if (CSS_MODULES_RE.test(className)) return true\n  if (PURE_HASH_RE.test(className)) return true\n  return false\n}\n\nexport function stripHash(className: string): string {\n  const match = className.match(CSS_MODULES_RE)\n  if (match) {\n    const prefix = className.slice(0, className.lastIndexOf('__'))\n    return prefix\n  }\n  return className\n}\n\nexport function filterClasses(\n  classes: string[],\n  classFilter?: (className: string) => boolean,\n): string[] {\n  const result: string[] = []\n\n  for (const cls of classes) {\n    if (STYLED_COMPONENTS_RE.test(cls)) continue\n    if (EMOTION_RE.test(cls)) continue\n    if (PURE_HASH_RE.test(cls)) continue\n\n    let stable = stripHash(cls)\n\n    if (classFilter && !classFilter(stable)) continue\n\n    result.push(stable)\n  }\n\n  return result\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\nimport { filterClasses, isHashedClass } from './hash-detect'\n\nconst TEXT_MAX_LENGTH = 50\n\nexport function createFingerprint(\n  el: HTMLElement,\n  options?: Pick<WebRemarqOptions, 'classFilter' | 'dataAttribute'>,\n): ElementFingerprint {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  return {\n    dataAnnotate: el.getAttribute(dataAttr) ?? null,\n    dataTestId: el.getAttribute('data-testid')\n      ?? el.getAttribute('data-test')\n      ?? el.getAttribute('data-cy')\n      ?? null,\n    id: getStableId(el),\n    tagName: el.tagName.toLowerCase(),\n    textContent: getTextContent(el),\n    role: el.getAttribute('role') ?? null,\n    ariaLabel: el.getAttribute('aria-label') ?? null,\n    stableClasses: filterClasses(\n      Array.from(el.classList),\n      options?.classFilter,\n    ),\n    domPath: buildDomPath(el),\n    siblingIndex: getSiblingIndex(el),\n    parentAnchor: findParentAnchor(el, dataAttr),\n  }\n}\n\nfunction getStableId(el: HTMLElement): string | null {\n  const id = el.id\n  if (!id) return null\n  if (isHashedClass(id)) return null\n  return id\n}\n\nfunction getTextContent(el: HTMLElement): string | null {\n  // Use only direct text nodes, not nested children's text\n  let text = ''\n  for (const node of Array.from(el.childNodes)) {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent ?? ''\n    }\n  }\n  text = text.trim()\n\n  // If no direct text, try first meaningful child's text (for wrappers like <span><b>Text</b></span>)\n  if (!text && el.children.length <= 3) {\n    text = el.textContent?.trim() ?? ''\n  }\n\n  if (!text) return null\n  return text.length > TEXT_MAX_LENGTH ? text.slice(0, TEXT_MAX_LENGTH) : text\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n\n  return parts.join(' > ')\n}\n\nfunction getSiblingIndex(el: HTMLElement): number {\n  const parent = el.parentElement\n  if (!parent) return 0\n  const children = Array.from(parent.children)\n  return children.indexOf(el)\n}\n\nfunction findParentAnchor(el: HTMLElement, dataAttr: string): string | null {\n  let current = el.parentElement\n  while (current && current !== document.body) {\n    const value = current.getAttribute(dataAttr)\n    if (value) return value\n    current = current.parentElement\n  }\n  return null\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\n\nconst MATCH_THRESHOLD = 50\n\nexport function levenshteinSimilarity(a: string, b: string): number {\n  if (a === b) return 1\n  if (!a.length || !b.length) return 0\n\n  const matrix: number[][] = []\n  for (let i = 0; i <= a.length; i++) {\n    matrix[i] = [i]\n  }\n  for (let j = 0; j <= b.length; j++) {\n    matrix[0][j] = j\n  }\n\n  for (let i = 1; i <= a.length; i++) {\n    for (let j = 1; j <= b.length; j++) {\n      const cost = a[i - 1] === b[j - 1] ? 0 : 1\n      matrix[i][j] = Math.min(\n        matrix[i - 1][j] + 1,\n        matrix[i][j - 1] + 1,\n        matrix[i - 1][j - 1] + cost,\n      )\n    }\n  }\n\n  const distance = matrix[a.length][b.length]\n  return 1 - distance / Math.max(a.length, b.length)\n}\n\nfunction textSimilarity(a: string | null, b: string | null): number {\n  if (!a || !b) return 0\n  const na = a.trim().toLowerCase()\n  const nb = b.trim().toLowerCase()\n  if (na === nb) return 1\n  if (na.includes(nb) || nb.includes(na)) return 1\n  return levenshteinSimilarity(na, nb)\n}\n\nfunction jaccardSimilarity(a: string[], b: string[]): number {\n  if (!a.length && !b.length) return 0\n  const setA = new Set(a)\n  const setB = new Set(b)\n  let intersection = 0\n  for (const item of setA) {\n    if (setB.has(item)) intersection++\n  }\n  const union = new Set([...a, ...b]).size\n  return union === 0 ? 0 : intersection / union\n}\n\nfunction scoreCandidate(el: HTMLElement, fp: ElementFingerprint, dataAttr: string): number {\n  let score = 0\n\n  // dataAnnotate match (+100)\n  const elAnnotate = el.getAttribute(dataAttr)\n  if (fp.dataAnnotate && elAnnotate === fp.dataAnnotate) {\n    score += 100\n  }\n\n  // textContent match (+35 scaled)\n  const elText = el.textContent?.trim().slice(0, 50) ?? null\n  const textSim = textSimilarity(fp.textContent, elText)\n  if (textSim > 0.7) {\n    score += textSim * 35\n  }\n\n  // role + ariaLabel match (+30)\n  if (fp.role && el.getAttribute('role') === fp.role &&\n    fp.ariaLabel && el.getAttribute('aria-label') === fp.ariaLabel) {\n    score += 30\n  }\n\n  // parentAnchor match (+15)\n  if (fp.parentAnchor) {\n    let parent = el.parentElement\n    while (parent && parent !== document.body) {\n      if (parent.getAttribute(dataAttr) === fp.parentAnchor) {\n        score += 15\n        break\n      }\n      parent = parent.parentElement\n    }\n  }\n\n  // stableClasses overlap (+15 scaled)\n  if (fp.stableClasses.length > 0) {\n    const elClasses = Array.from(el.classList)\n    const jaccard = jaccardSimilarity(fp.stableClasses, elClasses)\n    score += jaccard * 15\n  }\n\n  // domPath match (+15 scaled)\n  if (fp.domPath) {\n    const elPath = buildDomPath(el)\n    const pathSim = levenshteinSimilarity(fp.domPath, elPath)\n    score += pathSim * 15\n  }\n\n  // siblingIndex match (+5)\n  const parent = el.parentElement\n  if (parent) {\n    const idx = Array.from(parent.children).indexOf(el)\n    if (idx === fp.siblingIndex) {\n      score += 5\n    }\n  }\n\n  return score\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n  return parts.join(' > ')\n}\n\nexport function matchElement(\n  fp: ElementFingerprint,\n  options?: Pick<WebRemarqOptions, 'dataAttribute'>,\n): HTMLElement | null {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  // 1. Exact match by data-annotate\n  if (fp.dataAnnotate) {\n    const el = document.querySelector<HTMLElement>(`[${dataAttr}=\"${fp.dataAnnotate}\"]`)\n    if (el) return el\n  }\n\n  // 2. Exact match by data-testid\n  if (fp.dataTestId) {\n    const el = document.querySelector<HTMLElement>(\n      `[data-testid=\"${fp.dataTestId}\"], [data-test=\"${fp.dataTestId}\"], [data-cy=\"${fp.dataTestId}\"]`,\n    )\n    if (el) return el\n  }\n\n  // 3. Exact match by id\n  if (fp.id) {\n    const el = document.getElementById(fp.id) as HTMLElement | null\n    if (el) return el\n  }\n\n  // 4. Fuzzy match by tagName + weighted scoring\n  const candidates = document.querySelectorAll<HTMLElement>(fp.tagName)\n  let bestEl: HTMLElement | null = null\n  let bestScore = 0\n\n  for (const candidate of candidates) {\n    const score = scoreCandidate(candidate, fp, dataAttr)\n    if (score > bestScore) {\n      bestScore = score\n      bestEl = candidate\n    }\n  }\n\n  return bestScore >= MATCH_THRESHOLD ? bestEl : null\n}\n","import type { Annotation, AnnotationStore } from './types'\n\nconst STORAGE_KEY = 'remarq:annotations'\n\nexport class AnnotationStorage {\n  private annotations: Annotation[] = []\n  private extraFields: Record<string, unknown> = {}\n  isMemoryOnly = false\n\n  constructor() {\n    this.load()\n  }\n\n  getAll(): Annotation[] {\n    return [...this.annotations]\n  }\n\n  getByRoute(route: string): Annotation[] {\n    return this.annotations.filter((a) => a.route === route)\n  }\n\n  add(annotation: Annotation): void {\n    this.annotations.push(annotation)\n    this.save()\n  }\n\n  remove(id: string): void {\n    this.annotations = this.annotations.filter((a) => a.id !== id)\n    this.save()\n  }\n\n  update(id: string, changes: Partial<Annotation>): void {\n    const idx = this.annotations.findIndex((a) => a.id === id)\n    if (idx !== -1) {\n      this.annotations[idx] = { ...this.annotations[idx], ...changes }\n      this.save()\n    }\n  }\n\n  clearAll(): void {\n    this.annotations = []\n    this.save()\n  }\n\n  exportJSON(): AnnotationStore {\n    return {\n      version: 1,\n      annotations: [...this.annotations],\n    }\n  }\n\n  importJSON(data: AnnotationStore): void {\n    this.annotations = [...data.annotations]\n    this.save()\n  }\n\n  private load(): void {\n    try {\n      const raw = localStorage.getItem(STORAGE_KEY)\n      if (raw) {\n        const parsed = JSON.parse(raw)\n        const { version, annotations, ...rest } = parsed\n        this.annotations = annotations ?? []\n        this.extraFields = rest\n      }\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n\n  private save(): void {\n    if (this.isMemoryOnly) return\n    try {\n      const data = {\n        version: 1,\n        ...this.extraFields,\n        annotations: this.annotations,\n      }\n      localStorage.setItem(STORAGE_KEY, JSON.stringify(data))\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n}\n"],"mappings":"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","names":["parent","buildDomPath"]}
+{"version":3,"sources":["../../src/core/index.ts","../../src/core/hash-detect.ts","../../src/core/fingerprint.ts","../../src/core/matcher.ts","../../src/core/viewport.ts","../../src/core/storage.ts"],"sourcesContent":["export type { Annotation, AnnotationStore, ElementFingerprint } from './types'\nexport { createFingerprint } from './fingerprint'\nexport { matchElement } from './matcher'\nexport { AnnotationStorage } from './storage'\n","const CSS_MODULES_RE = /^(.+)__([a-zA-Z0-9]{3,})$/\nconst STYLED_COMPONENTS_RE = /^sc-/\nconst EMOTION_RE = /^css-[a-zA-Z0-9]+$/\nconst PURE_HASH_RE = /^(?=.*[a-zA-Z])(?=.*\\d)[a-zA-Z0-9]{8,}$/\n\nexport function isHashedClass(className: string): boolean {\n  if (STYLED_COMPONENTS_RE.test(className)) return true\n  if (EMOTION_RE.test(className)) return true\n  if (CSS_MODULES_RE.test(className)) return true\n  if (PURE_HASH_RE.test(className)) return true\n  return false\n}\n\nexport function stripHash(className: string): string {\n  const match = className.match(CSS_MODULES_RE)\n  if (match) {\n    const prefix = className.slice(0, className.lastIndexOf('__'))\n    return prefix\n  }\n  return className\n}\n\nexport function filterClasses(\n  classes: string[],\n  classFilter?: (className: string) => boolean,\n): string[] {\n  const result: string[] = []\n\n  for (const cls of classes) {\n    if (STYLED_COMPONENTS_RE.test(cls)) continue\n    if (EMOTION_RE.test(cls)) continue\n    if (PURE_HASH_RE.test(cls)) continue\n\n    let stable = stripHash(cls)\n\n    if (classFilter && !classFilter(stable)) continue\n\n    result.push(stable)\n  }\n\n  return result\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\nimport { filterClasses, isHashedClass } from './hash-detect'\n\nconst TEXT_MAX_LENGTH = 50\n\nexport function createFingerprint(\n  el: HTMLElement,\n  options?: Pick<WebRemarqOptions, 'classFilter' | 'dataAttribute'>,\n): ElementFingerprint {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  return {\n    dataAnnotate: el.getAttribute(dataAttr) ?? null,\n    dataTestId: el.getAttribute('data-testid')\n      ?? el.getAttribute('data-test')\n      ?? el.getAttribute('data-cy')\n      ?? null,\n    id: getStableId(el),\n    tagName: el.tagName.toLowerCase(),\n    textContent: getTextContent(el),\n    role: el.getAttribute('role') ?? null,\n    ariaLabel: el.getAttribute('aria-label') ?? null,\n    stableClasses: filterClasses(\n      Array.from(el.classList),\n      options?.classFilter,\n    ),\n    domPath: buildDomPath(el),\n    siblingIndex: getSiblingIndex(el),\n    parentAnchor: findParentAnchor(el, dataAttr),\n  }\n}\n\nfunction getStableId(el: HTMLElement): string | null {\n  const id = el.id\n  if (!id) return null\n  if (isHashedClass(id)) return null\n  return id\n}\n\nfunction getTextContent(el: HTMLElement): string | null {\n  // Use only direct text nodes, not nested children's text\n  let text = ''\n  for (const node of Array.from(el.childNodes)) {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent ?? ''\n    }\n  }\n  text = text.trim()\n\n  // If no direct text, try first meaningful child's text (for wrappers like <span><b>Text</b></span>)\n  if (!text && el.children.length <= 3) {\n    text = el.textContent?.trim() ?? ''\n  }\n\n  if (!text) return null\n  return text.length > TEXT_MAX_LENGTH ? text.slice(0, TEXT_MAX_LENGTH) : text\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n\n  return parts.join(' > ')\n}\n\nfunction getSiblingIndex(el: HTMLElement): number {\n  const parent = el.parentElement\n  if (!parent) return 0\n  const children = Array.from(parent.children)\n  return children.indexOf(el)\n}\n\nfunction findParentAnchor(el: HTMLElement, dataAttr: string): string | null {\n  let current = el.parentElement\n  while (current && current !== document.body) {\n    const value = current.getAttribute(dataAttr)\n    if (value) return value\n    current = current.parentElement\n  }\n  return null\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\n\nconst MATCH_THRESHOLD = 50\n\nexport function levenshteinSimilarity(a: string, b: string): number {\n  if (a === b) return 1\n  if (!a.length || !b.length) return 0\n\n  const matrix: number[][] = []\n  for (let i = 0; i <= a.length; i++) {\n    matrix[i] = [i]\n  }\n  for (let j = 0; j <= b.length; j++) {\n    matrix[0][j] = j\n  }\n\n  for (let i = 1; i <= a.length; i++) {\n    for (let j = 1; j <= b.length; j++) {\n      const cost = a[i - 1] === b[j - 1] ? 0 : 1\n      matrix[i][j] = Math.min(\n        matrix[i - 1][j] + 1,\n        matrix[i][j - 1] + 1,\n        matrix[i - 1][j - 1] + cost,\n      )\n    }\n  }\n\n  const distance = matrix[a.length][b.length]\n  return 1 - distance / Math.max(a.length, b.length)\n}\n\nfunction textSimilarity(a: string | null, b: string | null): number {\n  if (!a || !b) return 0\n  const na = a.trim().toLowerCase()\n  const nb = b.trim().toLowerCase()\n  if (na === nb) return 1\n  if (na.includes(nb) || nb.includes(na)) return 1\n  return levenshteinSimilarity(na, nb)\n}\n\nfunction jaccardSimilarity(a: string[], b: string[]): number {\n  if (!a.length && !b.length) return 0\n  const setA = new Set(a)\n  const setB = new Set(b)\n  let intersection = 0\n  for (const item of setA) {\n    if (setB.has(item)) intersection++\n  }\n  const union = new Set([...a, ...b]).size\n  return union === 0 ? 0 : intersection / union\n}\n\nfunction scoreCandidate(el: HTMLElement, fp: ElementFingerprint, dataAttr: string): number {\n  let score = 0\n\n  // dataAnnotate match (+100)\n  const elAnnotate = el.getAttribute(dataAttr)\n  if (fp.dataAnnotate && elAnnotate === fp.dataAnnotate) {\n    score += 100\n  }\n\n  // textContent match (+35 scaled)\n  const elText = el.textContent?.trim().slice(0, 50) ?? null\n  const textSim = textSimilarity(fp.textContent, elText)\n  if (textSim > 0.7) {\n    score += textSim * 35\n  }\n\n  // role + ariaLabel match (+30)\n  if (fp.role && el.getAttribute('role') === fp.role &&\n    fp.ariaLabel && el.getAttribute('aria-label') === fp.ariaLabel) {\n    score += 30\n  }\n\n  // parentAnchor match (+15)\n  if (fp.parentAnchor) {\n    let parent = el.parentElement\n    while (parent && parent !== document.body) {\n      if (parent.getAttribute(dataAttr) === fp.parentAnchor) {\n        score += 15\n        break\n      }\n      parent = parent.parentElement\n    }\n  }\n\n  // stableClasses overlap (+15 scaled)\n  if (fp.stableClasses.length > 0) {\n    const elClasses = Array.from(el.classList)\n    const jaccard = jaccardSimilarity(fp.stableClasses, elClasses)\n    score += jaccard * 15\n  }\n\n  // domPath match (+15 scaled)\n  if (fp.domPath) {\n    const elPath = buildDomPath(el)\n    const pathSim = levenshteinSimilarity(fp.domPath, elPath)\n    score += pathSim * 15\n  }\n\n  // siblingIndex match (+5)\n  const parent = el.parentElement\n  if (parent) {\n    const idx = Array.from(parent.children).indexOf(el)\n    if (idx === fp.siblingIndex) {\n      score += 5\n    }\n  }\n\n  return score\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n  return parts.join(' > ')\n}\n\nexport function matchElement(\n  fp: ElementFingerprint,\n  options?: Pick<WebRemarqOptions, 'dataAttribute'>,\n): HTMLElement | null {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  // 1. Exact match by data-annotate\n  if (fp.dataAnnotate) {\n    const el = document.querySelector<HTMLElement>(`[${dataAttr}=\"${fp.dataAnnotate}\"]`)\n    if (el) return el\n  }\n\n  // 2. Exact match by data-testid\n  if (fp.dataTestId) {\n    const el = document.querySelector<HTMLElement>(\n      `[data-testid=\"${fp.dataTestId}\"], [data-test=\"${fp.dataTestId}\"], [data-cy=\"${fp.dataTestId}\"]`,\n    )\n    if (el) return el\n  }\n\n  // 3. Exact match by id\n  if (fp.id) {\n    const el = document.getElementById(fp.id) as HTMLElement | null\n    if (el) return el\n  }\n\n  // 4. Fuzzy match by tagName + weighted scoring\n  const candidates = document.querySelectorAll<HTMLElement>(fp.tagName)\n  let bestEl: HTMLElement | null = null\n  let bestScore = 0\n\n  for (const candidate of candidates) {\n    const score = scoreCandidate(candidate, fp, dataAttr)\n    if (score > bestScore) {\n      bestScore = score\n      bestEl = candidate\n    }\n  }\n\n  return bestScore >= MATCH_THRESHOLD ? bestEl : null\n}\n","type BucketChangeCallback = () => void\n\nlet currentBucket: number = 0\nlet onBucketChange: BucketChangeCallback | null = null\nlet resizeHandler: (() => void) | null = null\n\nexport function toBucket(width: number): number {\n  return Math.floor(width / 100) * 100\n}\n\nfunction debounce(fn: () => void, ms: number): () => void {\n  let timer: ReturnType<typeof setTimeout>\n  return () => {\n    clearTimeout(timer)\n    timer = setTimeout(fn, ms)\n  }\n}\n\nexport function initViewportListener(callback: BucketChangeCallback): void {\n  currentBucket = toBucket(window.innerWidth)\n  onBucketChange = callback\n\n  resizeHandler = debounce(() => {\n    const newBucket = toBucket(window.innerWidth)\n    if (newBucket !== currentBucket) {\n      currentBucket = newBucket\n      onBucketChange?.()\n    }\n  }, 300)\n\n  window.addEventListener('resize', resizeHandler)\n}\n\nexport function destroyViewportListener(): void {\n  if (resizeHandler) {\n    window.removeEventListener('resize', resizeHandler)\n    resizeHandler = null\n  }\n  onBucketChange = null\n}\n","import type { Annotation, AnnotationStore } from './types'\nimport { toBucket } from './viewport'\n\nconst STORAGE_KEY = 'remarq:annotations'\n\nexport class AnnotationStorage {\n  private annotations: Annotation[] = []\n  private extraFields: Record<string, unknown> = {}\n  isMemoryOnly = false\n\n  constructor() {\n    this.load()\n  }\n\n  getAll(): Annotation[] {\n    return [...this.annotations]\n  }\n\n  getByRoute(route: string): Annotation[] {\n    return this.annotations.filter((a) => a.route === route)\n  }\n\n  add(annotation: Annotation): void {\n    this.annotations.push(annotation)\n    this.save()\n  }\n\n  remove(id: string): void {\n    this.annotations = this.annotations.filter((a) => a.id !== id)\n    this.save()\n  }\n\n  update(id: string, changes: Partial<Annotation>): void {\n    const idx = this.annotations.findIndex((a) => a.id === id)\n    if (idx !== -1) {\n      this.annotations[idx] = { ...this.annotations[idx], ...changes }\n      this.save()\n    }\n  }\n\n  clearAll(): void {\n    this.annotations = []\n    this.save()\n  }\n\n  exportJSON(): AnnotationStore {\n    return {\n      version: 1,\n      annotations: [...this.annotations],\n    }\n  }\n\n  importJSON(data: AnnotationStore): void {\n    this.annotations = [...data.annotations]\n    this.migrateViewportBuckets()\n    this.save()\n  }\n\n  private migrateViewportBuckets(): void {\n    for (const ann of this.annotations) {\n      if (ann.viewportBucket == null && ann.viewport) {\n        const width = parseInt(ann.viewport.split('x')[0], 10)\n        ann.viewportBucket = toBucket(width)\n      }\n    }\n  }\n\n  private load(): void {\n    try {\n      const raw = localStorage.getItem(STORAGE_KEY)\n      if (raw) {\n        const parsed = JSON.parse(raw)\n        const { version, annotations, ...rest } = parsed\n        this.annotations = annotations ?? []\n        this.extraFields = rest\n        this.migrateViewportBuckets()\n      }\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n\n  private save(): void {\n    if (this.isMemoryOnly) return\n    try {\n      const data = {\n        version: 1,\n        ...this.extraFields,\n        annotations: this.annotations,\n      }\n      localStorage.setItem(STORAGE_KEY, JSON.stringify(data))\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n}\n"],"mappings":"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","names":["parent","buildDomPath"]}

package/dist/core/index.d.cts

@@ -16,6 +16,8 @@ interface Annotation {
     comment: string;
     fingerprint: ElementFingerprint;
     route: string;
+    viewport: string;
+    viewportBucket: number;
     timestamp: number;
     status: 'pending' | 'resolved';
 }
@@ -46,6 +48,7 @@ declare class AnnotationStorage {
     clearAll(): void;
     exportJSON(): AnnotationStore;
     importJSON(data: AnnotationStore): void;
+    private migrateViewportBuckets;
     private load;
     private save;
 }

package/dist/core/index.d.ts

@@ -16,6 +16,8 @@ interface Annotation {
     comment: string;
     fingerprint: ElementFingerprint;
     route: string;
+    viewport: string;
+    viewportBucket: number;
     timestamp: number;
     status: 'pending' | 'resolved';
 }
@@ -46,6 +48,7 @@ declare class AnnotationStorage {
     clearAll(): void;
     exportJSON(): AnnotationStore;
     importJSON(data: AnnotationStore): void;
+    private migrateViewportBuckets;
     private load;
     private save;
 }

package/dist/core/index.js

@@ -258,6 +258,11 @@ function matchElement(fp, options) {
   return bestScore >= MATCH_THRESHOLD ? bestEl : null;
 }
 
+// src/core/viewport.ts
+function toBucket(width) {
+  return Math.floor(width / 100) * 100;
+}
+
 // src/core/storage.ts
 var STORAGE_KEY = "remarq:annotations";
 var AnnotationStorage = class {
@@ -300,8 +305,17 @@ var AnnotationStorage = class {
   }
   importJSON(data) {
     this.annotations = [...data.annotations];
+    this.migrateViewportBuckets();
     this.save();
   }
+  migrateViewportBuckets() {
+    for (const ann of this.annotations) {
+      if (ann.viewportBucket == null && ann.viewport) {
+        const width = parseInt(ann.viewport.split("x")[0], 10);
+        ann.viewportBucket = toBucket(width);
+      }
+    }
+  }
   load() {
     try {
       const raw = localStorage.getItem(STORAGE_KEY);
@@ -310,6 +324,7 @@ var AnnotationStorage = class {
         const _a = parsed, { version, annotations } = _a, rest = __objRest(_a, ["version", "annotations"]);
         this.annotations = annotations != null ? annotations : [];
         this.extraFields = rest;
+        this.migrateViewportBuckets();
       }
     } catch (e) {
       this.isMemoryOnly = true;

package/dist/core/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/hash-detect.ts","../../src/core/fingerprint.ts","../../src/core/matcher.ts","../../src/core/storage.ts"],"sourcesContent":["const CSS_MODULES_RE = /^(.+)__([a-zA-Z0-9]{3,})$/\nconst STYLED_COMPONENTS_RE = /^sc-/\nconst EMOTION_RE = /^css-[a-zA-Z0-9]+$/\nconst PURE_HASH_RE = /^(?=.*[a-zA-Z])(?=.*\\d)[a-zA-Z0-9]{8,}$/\n\nexport function isHashedClass(className: string): boolean {\n  if (STYLED_COMPONENTS_RE.test(className)) return true\n  if (EMOTION_RE.test(className)) return true\n  if (CSS_MODULES_RE.test(className)) return true\n  if (PURE_HASH_RE.test(className)) return true\n  return false\n}\n\nexport function stripHash(className: string): string {\n  const match = className.match(CSS_MODULES_RE)\n  if (match) {\n    const prefix = className.slice(0, className.lastIndexOf('__'))\n    return prefix\n  }\n  return className\n}\n\nexport function filterClasses(\n  classes: string[],\n  classFilter?: (className: string) => boolean,\n): string[] {\n  const result: string[] = []\n\n  for (const cls of classes) {\n    if (STYLED_COMPONENTS_RE.test(cls)) continue\n    if (EMOTION_RE.test(cls)) continue\n    if (PURE_HASH_RE.test(cls)) continue\n\n    let stable = stripHash(cls)\n\n    if (classFilter && !classFilter(stable)) continue\n\n    result.push(stable)\n  }\n\n  return result\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\nimport { filterClasses, isHashedClass } from './hash-detect'\n\nconst TEXT_MAX_LENGTH = 50\n\nexport function createFingerprint(\n  el: HTMLElement,\n  options?: Pick<WebRemarqOptions, 'classFilter' | 'dataAttribute'>,\n): ElementFingerprint {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  return {\n    dataAnnotate: el.getAttribute(dataAttr) ?? null,\n    dataTestId: el.getAttribute('data-testid')\n      ?? el.getAttribute('data-test')\n      ?? el.getAttribute('data-cy')\n      ?? null,\n    id: getStableId(el),\n    tagName: el.tagName.toLowerCase(),\n    textContent: getTextContent(el),\n    role: el.getAttribute('role') ?? null,\n    ariaLabel: el.getAttribute('aria-label') ?? null,\n    stableClasses: filterClasses(\n      Array.from(el.classList),\n      options?.classFilter,\n    ),\n    domPath: buildDomPath(el),\n    siblingIndex: getSiblingIndex(el),\n    parentAnchor: findParentAnchor(el, dataAttr),\n  }\n}\n\nfunction getStableId(el: HTMLElement): string | null {\n  const id = el.id\n  if (!id) return null\n  if (isHashedClass(id)) return null\n  return id\n}\n\nfunction getTextContent(el: HTMLElement): string | null {\n  // Use only direct text nodes, not nested children's text\n  let text = ''\n  for (const node of Array.from(el.childNodes)) {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent ?? ''\n    }\n  }\n  text = text.trim()\n\n  // If no direct text, try first meaningful child's text (for wrappers like <span><b>Text</b></span>)\n  if (!text && el.children.length <= 3) {\n    text = el.textContent?.trim() ?? ''\n  }\n\n  if (!text) return null\n  return text.length > TEXT_MAX_LENGTH ? text.slice(0, TEXT_MAX_LENGTH) : text\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n\n  return parts.join(' > ')\n}\n\nfunction getSiblingIndex(el: HTMLElement): number {\n  const parent = el.parentElement\n  if (!parent) return 0\n  const children = Array.from(parent.children)\n  return children.indexOf(el)\n}\n\nfunction findParentAnchor(el: HTMLElement, dataAttr: string): string | null {\n  let current = el.parentElement\n  while (current && current !== document.body) {\n    const value = current.getAttribute(dataAttr)\n    if (value) return value\n    current = current.parentElement\n  }\n  return null\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\n\nconst MATCH_THRESHOLD = 50\n\nexport function levenshteinSimilarity(a: string, b: string): number {\n  if (a === b) return 1\n  if (!a.length || !b.length) return 0\n\n  const matrix: number[][] = []\n  for (let i = 0; i <= a.length; i++) {\n    matrix[i] = [i]\n  }\n  for (let j = 0; j <= b.length; j++) {\n    matrix[0][j] = j\n  }\n\n  for (let i = 1; i <= a.length; i++) {\n    for (let j = 1; j <= b.length; j++) {\n      const cost = a[i - 1] === b[j - 1] ? 0 : 1\n      matrix[i][j] = Math.min(\n        matrix[i - 1][j] + 1,\n        matrix[i][j - 1] + 1,\n        matrix[i - 1][j - 1] + cost,\n      )\n    }\n  }\n\n  const distance = matrix[a.length][b.length]\n  return 1 - distance / Math.max(a.length, b.length)\n}\n\nfunction textSimilarity(a: string | null, b: string | null): number {\n  if (!a || !b) return 0\n  const na = a.trim().toLowerCase()\n  const nb = b.trim().toLowerCase()\n  if (na === nb) return 1\n  if (na.includes(nb) || nb.includes(na)) return 1\n  return levenshteinSimilarity(na, nb)\n}\n\nfunction jaccardSimilarity(a: string[], b: string[]): number {\n  if (!a.length && !b.length) return 0\n  const setA = new Set(a)\n  const setB = new Set(b)\n  let intersection = 0\n  for (const item of setA) {\n    if (setB.has(item)) intersection++\n  }\n  const union = new Set([...a, ...b]).size\n  return union === 0 ? 0 : intersection / union\n}\n\nfunction scoreCandidate(el: HTMLElement, fp: ElementFingerprint, dataAttr: string): number {\n  let score = 0\n\n  // dataAnnotate match (+100)\n  const elAnnotate = el.getAttribute(dataAttr)\n  if (fp.dataAnnotate && elAnnotate === fp.dataAnnotate) {\n    score += 100\n  }\n\n  // textContent match (+35 scaled)\n  const elText = el.textContent?.trim().slice(0, 50) ?? null\n  const textSim = textSimilarity(fp.textContent, elText)\n  if (textSim > 0.7) {\n    score += textSim * 35\n  }\n\n  // role + ariaLabel match (+30)\n  if (fp.role && el.getAttribute('role') === fp.role &&\n    fp.ariaLabel && el.getAttribute('aria-label') === fp.ariaLabel) {\n    score += 30\n  }\n\n  // parentAnchor match (+15)\n  if (fp.parentAnchor) {\n    let parent = el.parentElement\n    while (parent && parent !== document.body) {\n      if (parent.getAttribute(dataAttr) === fp.parentAnchor) {\n        score += 15\n        break\n      }\n      parent = parent.parentElement\n    }\n  }\n\n  // stableClasses overlap (+15 scaled)\n  if (fp.stableClasses.length > 0) {\n    const elClasses = Array.from(el.classList)\n    const jaccard = jaccardSimilarity(fp.stableClasses, elClasses)\n    score += jaccard * 15\n  }\n\n  // domPath match (+15 scaled)\n  if (fp.domPath) {\n    const elPath = buildDomPath(el)\n    const pathSim = levenshteinSimilarity(fp.domPath, elPath)\n    score += pathSim * 15\n  }\n\n  // siblingIndex match (+5)\n  const parent = el.parentElement\n  if (parent) {\n    const idx = Array.from(parent.children).indexOf(el)\n    if (idx === fp.siblingIndex) {\n      score += 5\n    }\n  }\n\n  return score\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n  return parts.join(' > ')\n}\n\nexport function matchElement(\n  fp: ElementFingerprint,\n  options?: Pick<WebRemarqOptions, 'dataAttribute'>,\n): HTMLElement | null {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  // 1. Exact match by data-annotate\n  if (fp.dataAnnotate) {\n    const el = document.querySelector<HTMLElement>(`[${dataAttr}=\"${fp.dataAnnotate}\"]`)\n    if (el) return el\n  }\n\n  // 2. Exact match by data-testid\n  if (fp.dataTestId) {\n    const el = document.querySelector<HTMLElement>(\n      `[data-testid=\"${fp.dataTestId}\"], [data-test=\"${fp.dataTestId}\"], [data-cy=\"${fp.dataTestId}\"]`,\n    )\n    if (el) return el\n  }\n\n  // 3. Exact match by id\n  if (fp.id) {\n    const el = document.getElementById(fp.id) as HTMLElement | null\n    if (el) return el\n  }\n\n  // 4. Fuzzy match by tagName + weighted scoring\n  const candidates = document.querySelectorAll<HTMLElement>(fp.tagName)\n  let bestEl: HTMLElement | null = null\n  let bestScore = 0\n\n  for (const candidate of candidates) {\n    const score = scoreCandidate(candidate, fp, dataAttr)\n    if (score > bestScore) {\n      bestScore = score\n      bestEl = candidate\n    }\n  }\n\n  return bestScore >= MATCH_THRESHOLD ? bestEl : null\n}\n","import type { Annotation, AnnotationStore } from './types'\n\nconst STORAGE_KEY = 'remarq:annotations'\n\nexport class AnnotationStorage {\n  private annotations: Annotation[] = []\n  private extraFields: Record<string, unknown> = {}\n  isMemoryOnly = false\n\n  constructor() {\n    this.load()\n  }\n\n  getAll(): Annotation[] {\n    return [...this.annotations]\n  }\n\n  getByRoute(route: string): Annotation[] {\n    return this.annotations.filter((a) => a.route === route)\n  }\n\n  add(annotation: Annotation): void {\n    this.annotations.push(annotation)\n    this.save()\n  }\n\n  remove(id: string): void {\n    this.annotations = this.annotations.filter((a) => a.id !== id)\n    this.save()\n  }\n\n  update(id: string, changes: Partial<Annotation>): void {\n    const idx = this.annotations.findIndex((a) => a.id === id)\n    if (idx !== -1) {\n      this.annotations[idx] = { ...this.annotations[idx], ...changes }\n      this.save()\n    }\n  }\n\n  clearAll(): void {\n    this.annotations = []\n    this.save()\n  }\n\n  exportJSON(): AnnotationStore {\n    return {\n      version: 1,\n      annotations: [...this.annotations],\n    }\n  }\n\n  importJSON(data: AnnotationStore): void {\n    this.annotations = [...data.annotations]\n    this.save()\n  }\n\n  private load(): void {\n    try {\n      const raw = localStorage.getItem(STORAGE_KEY)\n      if (raw) {\n        const parsed = JSON.parse(raw)\n        const { version, annotations, ...rest } = parsed\n        this.annotations = annotations ?? []\n        this.extraFields = rest\n      }\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n\n  private save(): void {\n    if (this.isMemoryOnly) return\n    try {\n      const data = {\n        version: 1,\n        ...this.extraFields,\n        annotations: this.annotations,\n      }\n      localStorage.setItem(STORAGE_KEY, JSON.stringify(data))\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n}\n"],"mappings":"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","names":["parent","buildDomPath"]}
+{"version":3,"sources":["../../src/core/hash-detect.ts","../../src/core/fingerprint.ts","../../src/core/matcher.ts","../../src/core/viewport.ts","../../src/core/storage.ts"],"sourcesContent":["const CSS_MODULES_RE = /^(.+)__([a-zA-Z0-9]{3,})$/\nconst STYLED_COMPONENTS_RE = /^sc-/\nconst EMOTION_RE = /^css-[a-zA-Z0-9]+$/\nconst PURE_HASH_RE = /^(?=.*[a-zA-Z])(?=.*\\d)[a-zA-Z0-9]{8,}$/\n\nexport function isHashedClass(className: string): boolean {\n  if (STYLED_COMPONENTS_RE.test(className)) return true\n  if (EMOTION_RE.test(className)) return true\n  if (CSS_MODULES_RE.test(className)) return true\n  if (PURE_HASH_RE.test(className)) return true\n  return false\n}\n\nexport function stripHash(className: string): string {\n  const match = className.match(CSS_MODULES_RE)\n  if (match) {\n    const prefix = className.slice(0, className.lastIndexOf('__'))\n    return prefix\n  }\n  return className\n}\n\nexport function filterClasses(\n  classes: string[],\n  classFilter?: (className: string) => boolean,\n): string[] {\n  const result: string[] = []\n\n  for (const cls of classes) {\n    if (STYLED_COMPONENTS_RE.test(cls)) continue\n    if (EMOTION_RE.test(cls)) continue\n    if (PURE_HASH_RE.test(cls)) continue\n\n    let stable = stripHash(cls)\n\n    if (classFilter && !classFilter(stable)) continue\n\n    result.push(stable)\n  }\n\n  return result\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\nimport { filterClasses, isHashedClass } from './hash-detect'\n\nconst TEXT_MAX_LENGTH = 50\n\nexport function createFingerprint(\n  el: HTMLElement,\n  options?: Pick<WebRemarqOptions, 'classFilter' | 'dataAttribute'>,\n): ElementFingerprint {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  return {\n    dataAnnotate: el.getAttribute(dataAttr) ?? null,\n    dataTestId: el.getAttribute('data-testid')\n      ?? el.getAttribute('data-test')\n      ?? el.getAttribute('data-cy')\n      ?? null,\n    id: getStableId(el),\n    tagName: el.tagName.toLowerCase(),\n    textContent: getTextContent(el),\n    role: el.getAttribute('role') ?? null,\n    ariaLabel: el.getAttribute('aria-label') ?? null,\n    stableClasses: filterClasses(\n      Array.from(el.classList),\n      options?.classFilter,\n    ),\n    domPath: buildDomPath(el),\n    siblingIndex: getSiblingIndex(el),\n    parentAnchor: findParentAnchor(el, dataAttr),\n  }\n}\n\nfunction getStableId(el: HTMLElement): string | null {\n  const id = el.id\n  if (!id) return null\n  if (isHashedClass(id)) return null\n  return id\n}\n\nfunction getTextContent(el: HTMLElement): string | null {\n  // Use only direct text nodes, not nested children's text\n  let text = ''\n  for (const node of Array.from(el.childNodes)) {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent ?? ''\n    }\n  }\n  text = text.trim()\n\n  // If no direct text, try first meaningful child's text (for wrappers like <span><b>Text</b></span>)\n  if (!text && el.children.length <= 3) {\n    text = el.textContent?.trim() ?? ''\n  }\n\n  if (!text) return null\n  return text.length > TEXT_MAX_LENGTH ? text.slice(0, TEXT_MAX_LENGTH) : text\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n\n  return parts.join(' > ')\n}\n\nfunction getSiblingIndex(el: HTMLElement): number {\n  const parent = el.parentElement\n  if (!parent) return 0\n  const children = Array.from(parent.children)\n  return children.indexOf(el)\n}\n\nfunction findParentAnchor(el: HTMLElement, dataAttr: string): string | null {\n  let current = el.parentElement\n  while (current && current !== document.body) {\n    const value = current.getAttribute(dataAttr)\n    if (value) return value\n    current = current.parentElement\n  }\n  return null\n}\n","import type { ElementFingerprint, WebRemarqOptions } from './types'\n\nconst MATCH_THRESHOLD = 50\n\nexport function levenshteinSimilarity(a: string, b: string): number {\n  if (a === b) return 1\n  if (!a.length || !b.length) return 0\n\n  const matrix: number[][] = []\n  for (let i = 0; i <= a.length; i++) {\n    matrix[i] = [i]\n  }\n  for (let j = 0; j <= b.length; j++) {\n    matrix[0][j] = j\n  }\n\n  for (let i = 1; i <= a.length; i++) {\n    for (let j = 1; j <= b.length; j++) {\n      const cost = a[i - 1] === b[j - 1] ? 0 : 1\n      matrix[i][j] = Math.min(\n        matrix[i - 1][j] + 1,\n        matrix[i][j - 1] + 1,\n        matrix[i - 1][j - 1] + cost,\n      )\n    }\n  }\n\n  const distance = matrix[a.length][b.length]\n  return 1 - distance / Math.max(a.length, b.length)\n}\n\nfunction textSimilarity(a: string | null, b: string | null): number {\n  if (!a || !b) return 0\n  const na = a.trim().toLowerCase()\n  const nb = b.trim().toLowerCase()\n  if (na === nb) return 1\n  if (na.includes(nb) || nb.includes(na)) return 1\n  return levenshteinSimilarity(na, nb)\n}\n\nfunction jaccardSimilarity(a: string[], b: string[]): number {\n  if (!a.length && !b.length) return 0\n  const setA = new Set(a)\n  const setB = new Set(b)\n  let intersection = 0\n  for (const item of setA) {\n    if (setB.has(item)) intersection++\n  }\n  const union = new Set([...a, ...b]).size\n  return union === 0 ? 0 : intersection / union\n}\n\nfunction scoreCandidate(el: HTMLElement, fp: ElementFingerprint, dataAttr: string): number {\n  let score = 0\n\n  // dataAnnotate match (+100)\n  const elAnnotate = el.getAttribute(dataAttr)\n  if (fp.dataAnnotate && elAnnotate === fp.dataAnnotate) {\n    score += 100\n  }\n\n  // textContent match (+35 scaled)\n  const elText = el.textContent?.trim().slice(0, 50) ?? null\n  const textSim = textSimilarity(fp.textContent, elText)\n  if (textSim > 0.7) {\n    score += textSim * 35\n  }\n\n  // role + ariaLabel match (+30)\n  if (fp.role && el.getAttribute('role') === fp.role &&\n    fp.ariaLabel && el.getAttribute('aria-label') === fp.ariaLabel) {\n    score += 30\n  }\n\n  // parentAnchor match (+15)\n  if (fp.parentAnchor) {\n    let parent = el.parentElement\n    while (parent && parent !== document.body) {\n      if (parent.getAttribute(dataAttr) === fp.parentAnchor) {\n        score += 15\n        break\n      }\n      parent = parent.parentElement\n    }\n  }\n\n  // stableClasses overlap (+15 scaled)\n  if (fp.stableClasses.length > 0) {\n    const elClasses = Array.from(el.classList)\n    const jaccard = jaccardSimilarity(fp.stableClasses, elClasses)\n    score += jaccard * 15\n  }\n\n  // domPath match (+15 scaled)\n  if (fp.domPath) {\n    const elPath = buildDomPath(el)\n    const pathSim = levenshteinSimilarity(fp.domPath, elPath)\n    score += pathSim * 15\n  }\n\n  // siblingIndex match (+5)\n  const parent = el.parentElement\n  if (parent) {\n    const idx = Array.from(parent.children).indexOf(el)\n    if (idx === fp.siblingIndex) {\n      score += 5\n    }\n  }\n\n  return score\n}\n\nfunction buildDomPath(el: HTMLElement): string {\n  const parts: string[] = []\n  let current: HTMLElement | null = el\n  while (current && current !== document.body && parts.length < 5) {\n    parts.unshift(current.tagName.toLowerCase())\n    current = current.parentElement\n  }\n  return parts.join(' > ')\n}\n\nexport function matchElement(\n  fp: ElementFingerprint,\n  options?: Pick<WebRemarqOptions, 'dataAttribute'>,\n): HTMLElement | null {\n  const dataAttr = options?.dataAttribute ?? 'data-annotate'\n\n  // 1. Exact match by data-annotate\n  if (fp.dataAnnotate) {\n    const el = document.querySelector<HTMLElement>(`[${dataAttr}=\"${fp.dataAnnotate}\"]`)\n    if (el) return el\n  }\n\n  // 2. Exact match by data-testid\n  if (fp.dataTestId) {\n    const el = document.querySelector<HTMLElement>(\n      `[data-testid=\"${fp.dataTestId}\"], [data-test=\"${fp.dataTestId}\"], [data-cy=\"${fp.dataTestId}\"]`,\n    )\n    if (el) return el\n  }\n\n  // 3. Exact match by id\n  if (fp.id) {\n    const el = document.getElementById(fp.id) as HTMLElement | null\n    if (el) return el\n  }\n\n  // 4. Fuzzy match by tagName + weighted scoring\n  const candidates = document.querySelectorAll<HTMLElement>(fp.tagName)\n  let bestEl: HTMLElement | null = null\n  let bestScore = 0\n\n  for (const candidate of candidates) {\n    const score = scoreCandidate(candidate, fp, dataAttr)\n    if (score > bestScore) {\n      bestScore = score\n      bestEl = candidate\n    }\n  }\n\n  return bestScore >= MATCH_THRESHOLD ? bestEl : null\n}\n","type BucketChangeCallback = () => void\n\nlet currentBucket: number = 0\nlet onBucketChange: BucketChangeCallback | null = null\nlet resizeHandler: (() => void) | null = null\n\nexport function toBucket(width: number): number {\n  return Math.floor(width / 100) * 100\n}\n\nfunction debounce(fn: () => void, ms: number): () => void {\n  let timer: ReturnType<typeof setTimeout>\n  return () => {\n    clearTimeout(timer)\n    timer = setTimeout(fn, ms)\n  }\n}\n\nexport function initViewportListener(callback: BucketChangeCallback): void {\n  currentBucket = toBucket(window.innerWidth)\n  onBucketChange = callback\n\n  resizeHandler = debounce(() => {\n    const newBucket = toBucket(window.innerWidth)\n    if (newBucket !== currentBucket) {\n      currentBucket = newBucket\n      onBucketChange?.()\n    }\n  }, 300)\n\n  window.addEventListener('resize', resizeHandler)\n}\n\nexport function destroyViewportListener(): void {\n  if (resizeHandler) {\n    window.removeEventListener('resize', resizeHandler)\n    resizeHandler = null\n  }\n  onBucketChange = null\n}\n","import type { Annotation, AnnotationStore } from './types'\nimport { toBucket } from './viewport'\n\nconst STORAGE_KEY = 'remarq:annotations'\n\nexport class AnnotationStorage {\n  private annotations: Annotation[] = []\n  private extraFields: Record<string, unknown> = {}\n  isMemoryOnly = false\n\n  constructor() {\n    this.load()\n  }\n\n  getAll(): Annotation[] {\n    return [...this.annotations]\n  }\n\n  getByRoute(route: string): Annotation[] {\n    return this.annotations.filter((a) => a.route === route)\n  }\n\n  add(annotation: Annotation): void {\n    this.annotations.push(annotation)\n    this.save()\n  }\n\n  remove(id: string): void {\n    this.annotations = this.annotations.filter((a) => a.id !== id)\n    this.save()\n  }\n\n  update(id: string, changes: Partial<Annotation>): void {\n    const idx = this.annotations.findIndex((a) => a.id === id)\n    if (idx !== -1) {\n      this.annotations[idx] = { ...this.annotations[idx], ...changes }\n      this.save()\n    }\n  }\n\n  clearAll(): void {\n    this.annotations = []\n    this.save()\n  }\n\n  exportJSON(): AnnotationStore {\n    return {\n      version: 1,\n      annotations: [...this.annotations],\n    }\n  }\n\n  importJSON(data: AnnotationStore): void {\n    this.annotations = [...data.annotations]\n    this.migrateViewportBuckets()\n    this.save()\n  }\n\n  private migrateViewportBuckets(): void {\n    for (const ann of this.annotations) {\n      if (ann.viewportBucket == null && ann.viewport) {\n        const width = parseInt(ann.viewport.split('x')[0], 10)\n        ann.viewportBucket = toBucket(width)\n      }\n    }\n  }\n\n  private load(): void {\n    try {\n      const raw = localStorage.getItem(STORAGE_KEY)\n      if (raw) {\n        const parsed = JSON.parse(raw)\n        const { version, annotations, ...rest } = parsed\n        this.annotations = annotations ?? []\n        this.extraFields = rest\n        this.migrateViewportBuckets()\n      }\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n\n  private save(): void {\n    if (this.isMemoryOnly) return\n    try {\n      const data = {\n        version: 1,\n        ...this.extraFields,\n        annotations: this.annotations,\n      }\n      localStorage.setItem(STORAGE_KEY, JSON.stringify(data))\n    } catch {\n      this.isMemoryOnly = true\n    }\n  }\n}\n"],"mappings":"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","names":["parent","buildDomPath"]}

package/dist/index.cjs

@@ -53,6 +53,40 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 
+// src/core/viewport.ts
+var currentBucket = 0;
+var onBucketChange = null;
+var resizeHandler = null;
+function toBucket(width) {
+  return Math.floor(width / 100) * 100;
+}
+function debounce(fn, ms) {
+  let timer;
+  return () => {
+    clearTimeout(timer);
+    timer = setTimeout(fn, ms);
+  };
+}
+function initViewportListener(callback) {
+  currentBucket = toBucket(window.innerWidth);
+  onBucketChange = callback;
+  resizeHandler = debounce(() => {
+    const newBucket = toBucket(window.innerWidth);
+    if (newBucket !== currentBucket) {
+      currentBucket = newBucket;
+      onBucketChange == null ? void 0 : onBucketChange();
+    }
+  }, 300);
+  window.addEventListener("resize", resizeHandler);
+}
+function destroyViewportListener() {
+  if (resizeHandler) {
+    window.removeEventListener("resize", resizeHandler);
+    resizeHandler = null;
+  }
+  onBucketChange = null;
+}
+
 // src/core/storage.ts
 var STORAGE_KEY = "remarq:annotations";
 var AnnotationStorage = class {
@@ -95,8 +129,17 @@ var AnnotationStorage = class {
   }
   importJSON(data) {
     this.annotations = [...data.annotations];
+    this.migrateViewportBuckets();
     this.save();
   }
+  migrateViewportBuckets() {
+    for (const ann of this.annotations) {
+      if (ann.viewportBucket == null && ann.viewport) {
+        const width = parseInt(ann.viewport.split("x")[0], 10);
+        ann.viewportBucket = toBucket(width);
+      }
+    }
+  }
   load() {
     try {
       const raw = localStorage.getItem(STORAGE_KEY);
@@ -105,6 +148,7 @@ var AnnotationStorage = class {
         const _a = parsed, { version, annotations } = _a, rest = __objRest(_a, ["version", "annotations"]);
         this.annotations = annotations != null ? annotations : [];
         this.extraFields = rest;
+        this.migrateViewportBuckets();
       }
     } catch (e) {
       this.isMemoryOnly = true;
@@ -635,6 +679,35 @@ var CSS = `
 }
 
 .remarq-export-menu button:hover { background: var(--remarq-bg-secondary); }
+
+.remarq-detached-header + .remarq-detached-header {
+  border-top: 2px solid var(--remarq-border);
+}
+
+.remarq-detached-item[style*="cursor"]:hover {
+  background: var(--remarq-bg-secondary);
+}
+
+.remarq-toast {
+  position: fixed;
+  bottom: 60px;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 2147483647;
+  padding: 8px 16px;
+  background: var(--remarq-bg);
+  border: 1px solid var(--remarq-border);
+  border-radius: 6px;
+  box-shadow: var(--remarq-shadow);
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  font-size: 13px;
+  color: var(--remarq-text);
+  transition: opacity 0.3s ease;
+}
+
+.remarq-toast-fade {
+  opacity: 0;
+}
 `;
 function injectStyles() {
   if (document.querySelector(`style[${STYLES_ID}]`)) return;
@@ -789,13 +862,13 @@ var Toolbar = class {
     this.exportMenu = document.createElement("div");
     this.exportMenu.className = "remarq-export-menu";
     const mdBtn = document.createElement("button");
-    mdBtn.textContent = "Markdown (clipboard)";
+    mdBtn.textContent = "Markdown (file)";
     mdBtn.addEventListener("click", () => {
       this.callbacks.onExportMd();
       this.closeExportMenu();
     });
     const jsonBtn = document.createElement("button");
-    jsonBtn.textContent = "JSON (file)";
+    jsonBtn.textContent = "JSON (clipboard)";
     jsonBtn.addEventListener("click", () => {
       this.callbacks.onExportJson();
       this.closeExportMenu();
@@ -1126,15 +1199,31 @@ var DetachedPanel = class {
     this.container = container;
     this.onDelete = onDelete;
     this.panelEl = null;
+    this.toastEl = null;
+    this.toastTimer = null;
   }
-  update(annotations) {
+  update(otherBreakpoint, detached) {
     this.remove();
-    if (annotations.length === 0) return;
+    if (otherBreakpoint.length === 0 && detached.length === 0) return;
     const panel = document.createElement("div");
     panel.className = "remarq-detached-panel";
+    if (otherBreakpoint.length > 0) {
+      this.renderSection(panel, `Other viewport (${otherBreakpoint.length})`, otherBreakpoint, "other");
+    }
+    if (detached.length > 0) {
+      this.renderSection(panel, `Detached (${detached.length})`, detached, "detached");
+    }
+    this.container.appendChild(panel);
+    this.panelEl = panel;
+  }
+  destroy() {
+    this.remove();
+    this.hideToast();
+  }
+  renderSection(panel, title, annotations, type) {
     const header = document.createElement("div");
     header.className = "remarq-detached-header";
-    header.textContent = `Detached (${annotations.length})`;
+    header.textContent = title;
     panel.appendChild(header);
     for (const ann of annotations) {
       const item = document.createElement("div");
@@ -1150,25 +1239,52 @@ var DetachedPanel = class {
       let desc = `<${fp.tagName}>`;
       if (fp.textContent) desc += ` "${fp.textContent}"`;
       if (fp.dataAnnotate) desc += ` [${fp.dataAnnotate}]`;
+      if (type === "other") desc += ` \u2014 ${ann.viewportBucket}px`;
       elDesc.textContent = desc;
       info.appendChild(comment);
       info.appendChild(elDesc);
-      const deleteBtn = document.createElement("button");
-      deleteBtn.className = "remarq-detached-delete";
-      deleteBtn.textContent = "\xD7";
-      deleteBtn.addEventListener("click", () => {
-        var _a;
-        (_a = this.onDelete) == null ? void 0 : _a.call(this, ann.id);
-      });
       item.appendChild(info);
-      item.appendChild(deleteBtn);
+      if (type === "other") {
+        item.style.cursor = "pointer";
+        item.addEventListener("click", () => {
+          this.showToast(`Annotation created at ${ann.viewportBucket}px width. Resize viewport to view.`);
+        });
+      } else {
+        const deleteBtn = document.createElement("button");
+        deleteBtn.className = "remarq-detached-delete";
+        deleteBtn.textContent = "\xD7";
+        deleteBtn.addEventListener("click", () => {
+          var _a;
+          (_a = this.onDelete) == null ? void 0 : _a.call(this, ann.id);
+        });
+        item.appendChild(deleteBtn);
+      }
       panel.appendChild(item);
     }
-    this.container.appendChild(panel);
-    this.panelEl = panel;
   }
-  destroy() {
-    this.remove();
+  showToast(message) {
+    this.hideToast();
+    const toast = document.createElement("div");
+    toast.className = "remarq-toast";
+    toast.textContent = message;
+    this.container.appendChild(toast);
+    this.toastEl = toast;
+    this.toastTimer = setTimeout(() => {
+      if (this.toastEl) {
+        this.toastEl.classList.add("remarq-toast-fade");
+        setTimeout(() => this.hideToast(), 300);
+      }
+    }, 3e3);
+  }
+  hideToast() {
+    if (this.toastTimer) {
+      clearTimeout(this.toastTimer);
+      this.toastTimer = null;
+    }
+    if (this.toastEl) {
+      this.toastEl.remove();
+      this.toastEl = null;
+    }
   }
   remove() {
     if (this.panelEl) {
@@ -1293,18 +1409,26 @@ function resolveElement(ann) {
 }
 function refreshMarkers() {
   markers.clear();
+  const attached = [];
+  const otherBreakpoint = [];
   const detached = [];
   const route = currentRoute();
   const anns = storage.getByRoute(route);
+  const bucket = toBucket(window.innerWidth);
   for (const ann of anns) {
     const el = resolveElement(ann);
     if (el) {
-      markers.addMarker(ann, el);
+      attached.push({ ann, el });
+    } else if (bucket !== ann.viewportBucket) {
+      otherBreakpoint.push(ann);
     } else {
       detached.push(ann);
     }
   }
-  detachedPanel.update(detached);
+  for (const { ann, el } of attached) {
+    markers.addMarker(ann, el);
+  }
+  detachedPanel.update(otherBreakpoint, detached);
   const pendingCount = anns.filter((a) => a.status === "pending").length;
   toolbar.setBadgeCount(pendingCount);
 }
@@ -1345,6 +1469,8 @@ function handleInspectClick(e) {
         comment,
         fingerprint: fp,
         route: currentRoute(),
+        viewport: `${window.innerWidth}x${window.innerHeight}`,
+        viewportBucket: toBucket(window.innerWidth),
         timestamp: Date.now(),
         status: "pending"
       };
@@ -1419,26 +1545,27 @@ function exportMarkdown() {
     if (fp.textContent) desc += ` "${fp.textContent}"`;
     if (fp.parentAnchor) desc += ` (${fp.parentAnchor})`;
     if (fp.dataAnnotate) desc += fp.parentAnchor ? ` > ${fp.dataAnnotate}` : ` (${fp.dataAnnotate})`;
-    lines.push(`${i + 1}. [${ann.status}] ${desc}: "${ann.comment}"`);
+    const viewport = ann.viewport ? ` @${ann.viewport}` : "";
+    lines.push(`${i + 1}. [${ann.status}]${viewport} ${desc}: "${ann.comment}"`);
   });
   const text = lines.join("\n");
-  try {
-    navigator.clipboard.writeText(text);
-  } catch (e) {
-    console.warn("[web-remarq] Clipboard write failed");
-  }
-}
-function exportJSON() {
-  const data = storage.exportJSON();
-  const json = JSON.stringify(data, null, 2);
-  const blob = new Blob([json], { type: "application/json" });
+  const blob = new Blob([text], { type: "text/markdown" });
   const url = URL.createObjectURL(blob);
   const a = document.createElement("a");
   a.href = url;
-  a.download = `remarq-annotations-${Date.now()}.json`;
+  a.download = `remarq-annotations-${Date.now()}.md`;
   a.click();
   URL.revokeObjectURL(url);
 }
+function exportJSON() {
+  const data = storage.exportJSON();
+  const json = JSON.stringify(data, null, 2);
+  try {
+    navigator.clipboard.writeText(json);
+  } catch (e) {
+    console.warn("[web-remarq] Clipboard write failed");
+  }
+}
 function setupMutationObserver() {
   mutationObserver = new MutationObserver((mutations) => {
     for (const m of mutations) {
@@ -1496,6 +1623,7 @@ var WebRemarq = {
       document.addEventListener("mousemove", handleInspectHover);
       document.addEventListener("keydown", handleInspectKeydown);
       setupMutationObserver();
+      initViewportListener(() => refreshMarkers());
       console.debug(`[web-remarq] Initialized on route: ${currentRoute()}`);
       refreshMarkers();
       initialized = true;
@@ -1511,6 +1639,7 @@ var WebRemarq = {
       document.removeEventListener("keydown", handleInspectKeydown);
       mutationObserver == null ? void 0 : mutationObserver.disconnect();
       mutationObserver = null;
+      destroyViewportListener();
       unsubRoute == null ? void 0 : unsubRoute();
       routeObserver == null ? void 0 : routeObserver.destroy();
       markers == null ? void 0 : markers.destroy();
@@ -1540,16 +1669,20 @@ var WebRemarq = {
     storage.importJSON(data);
     refreshMarkers();
     const allAnns = storage.getAll();
+    const bucket = toBucket(window.innerWidth);
     let matched = 0;
+    let otherBreakpoint = 0;
     let detached = 0;
     for (const ann of allAnns) {
       if (resolveElement(ann)) {
         matched++;
+      } else if (bucket !== ann.viewportBucket) {
+        otherBreakpoint++;
       } else {
         detached++;
       }
     }
-    return { total: allAnns.length, matched, detached };
+    return { total: allAnns.length, matched, otherBreakpoint, detached };
   },
   getAnnotations(route) {
     if (!storage) return [];