acai-ui 1.65.5

package/src/components/code/acai-ui-code.vue

@@ -0,0 +1,595 @@
+<template>
+  <!-- `tabindex` no container: o Ctrl+F é ESCOPADO neste bloco, não global.
+       O modal de erro registra o atalho em `document` — ali existe um viewer por
+       vez; aqui uma tela de Swagger monta dezenas, e um listener global faria
+       todos abrirem o filtro juntos. -->
+  <div
+    ref="raizRef"
+    class="acai-code"
+    :class="{
+      'acai-code--enquadrado': !flat,
+      'acai-code--editor': editavel,
+      'acai-code--buscando': buscaVisivel,
+    }"
+    :style="estiloCalha"
+    :tabindex="editavel ? undefined : 0"
+    @keydown="aoTeclar"
+  >
+    <div v-if="titulo || copiavel || buscavel" class="acai-code__topo">
+      <span v-if="titulo" class="acai-code__titulo">{{ titulo }}</span>
+      <div class="acai-code__acoes">
+        <acai-ui-button
+          v-if="buscavel"
+          flat
+          dense
+          size="sm"
+          class="acai-code__acao"
+          icon="search"
+          aria-label="Buscar no conteúdo (Ctrl+F)"
+          tooltip="Buscar (Ctrl+F)"
+          @click="abrirBusca"
+        />
+        <acai-ui-button
+          v-if="copiavel"
+          flat
+          dense
+          size="sm"
+          class="acai-code__acao"
+          label="Copiar"
+          icon="content_copy"
+          @click="copiar"
+        />
+      </div>
+    </div>
+
+    <div v-if="buscaVisivel" class="acai-code__busca">
+      <acai-ui-icon name="search" size="14px" decorative />
+      <input
+        ref="buscaRef"
+        v-model="termoBusca"
+        class="acai-code__busca-campo"
+        placeholder="Filtrar por chave ou valor..."
+        aria-label="Filtrar conteúdo"
+        @keydown.esc.prevent="fecharBusca"
+        @keydown.enter.exact.prevent="irParaProximo"
+        @keydown.shift.enter.prevent="irParaAnterior"
+      />
+      <span v-if="termoBusca" class="acai-code__busca-info">
+        {{ totalOcorrencias ? `${ocorrenciaAtual + 1} de ${totalOcorrencias}` : 'Sem resultados' }}
+      </span>
+      <acai-ui-button
+        flat
+        dense
+        size="sm"
+        icon="keyboard_arrow_up"
+        aria-label="Ocorrência anterior"
+        class="acai-code__acao"
+        :disable="totalOcorrencias < 2"
+        @click="irParaAnterior"
+      />
+      <acai-ui-button
+        flat
+        dense
+        size="sm"
+        icon="keyboard_arrow_down"
+        aria-label="Próxima ocorrência"
+        class="acai-code__acao"
+        :disable="totalOcorrencias < 2"
+        @click="irParaProximo"
+      />
+      <acai-ui-button
+        flat
+        dense
+        size="sm"
+        icon="close"
+        aria-label="Fechar busca"
+        class="acai-code__acao"
+        @click="fecharBusca"
+      />
+    </div>
+
+    <!-- Uma linha por elemento (e não um <pre> só), pra numeração e dobra terem em
+         que se ancorar. É a MESMA lista nos dois modos; no editor ela vira o
+         espelho colorido e o <textarea> transparente entra por cima. As métricas
+         têm que bater entre os dois, senão o cursor descola do texto: a calha
+         vira recuo à esquerda no textarea, do tamanho exato dela. -->
+    <div
+      class="acai-code__corpo"
+      :class="{
+        'acai-code__editor': editavel,
+        'acai-code__corpo--travado': travadoPorDobra,
+      }"
+    >
+      <div
+        ref="caixaRef"
+        class="acai-code__bloco acai-code__linhas"
+        :style="editavel ? undefined : estiloAltura"
+        @click="aoClicarNoCodigo"
+      >
+        <div
+          v-for="linha in linhasVisiveis"
+          :key="linha.numero"
+          class="acai-code__linha"
+          :class="{ 'acai-code__linha--dobrada': estaDobrada(linha.numero) }"
+        >
+          <button
+            v-if="dobravel && linha.fecha"
+            type="button"
+            class="acai-code__dobra"
+            :aria-expanded="!estaDobrada(linha.numero)"
+            :aria-label="`${estaDobrada(linha.numero) ? 'Abrir' : 'Fechar'} o bloco da linha ${linha.numero}`"
+            @click.stop="alternarDobra(linha.numero)"
+          >
+            <acai-ui-icon
+              :name="estaDobrada(linha.numero) ? 'chevron_right' : 'expand_more'"
+              size="14px"
+              decorative
+            />
+          </button>
+          <span v-else-if="dobravel" class="acai-code__dobra acai-code__dobra--vazia" />
+
+          <span v-if="numerado" class="acai-code__num" aria-hidden="true">{{ linha.numero }}</span>
+
+          <!-- No editor o conteúdo é decorativo: quem o leitor de tela lê é o
+               <textarea> de cima, com o texto de verdade. -->
+          <span class="acai-code__conteudo" :aria-hidden="editavel ? 'true' : undefined">
+            <span v-html="linha.html" />
+            <button
+              v-if="estaDobrada(linha.numero)"
+              type="button"
+              class="acai-code__resumo"
+              :aria-label="`Abrir o bloco da linha ${linha.numero}`"
+              @click.stop="alternarDobra(linha.numero)"
+            >
+              ⋯ {{ linhasOcultas(linha.numero) }} linhas
+            </button>
+          </span>
+        </div>
+
+        <!-- Linha fantasma do editor: um `\n` final não gera linha visível, e sem
+             ela o textarea rolaria um passo além do realce. -->
+        <div v-if="editavel" class="acai-code__linha" aria-hidden="true">
+          <span v-if="dobravel" class="acai-code__dobra acai-code__dobra--vazia" />
+          <span v-if="numerado" class="acai-code__num" />
+          <span class="acai-code__conteudo">&nbsp;</span>
+        </div>
+      </div>
+
+      <textarea
+        v-if="editavel"
+        ref="entradaRef"
+        :value="modelValue"
+        class="acai-code__bloco acai-code__entrada"
+        spellcheck="false"
+        :aria-label="ariaLabel || 'Editor de código'"
+        :tabindex="travadoPorDobra ? -1 : undefined"
+        @input="aoDigitar"
+        @scroll="espelharRolagem"
+      />
+    </div>
+
+    <!-- Enquanto houver bloco fechado o texto some de baixo do cursor, então a
+         edição pausa — e isso precisa estar dito na tela, não só implícito. -->
+    <p v-if="travadoPorDobra" class="acai-code__aviso">
+      <acai-ui-icon name="visibility" size="14px" decorative />
+      Bloco fechado: leitura. Clique no código para abrir tudo e voltar a editar.
+    </p>
+
+    <q-menu v-if="!editavel" touch-position context-menu>
+      <q-list dense class="acai-code__ctx">
+        <q-item v-close-popup clickable @click="copiar">
+          <q-item-section side><acai-ui-icon name="data_object" size="xs" /></q-item-section>
+          <q-item-section>Copiar tudo</q-item-section>
+        </q-item>
+        <q-item v-close-popup clickable @click="copiarSelecao">
+          <q-item-section side><acai-ui-icon name="content_copy" size="xs" /></q-item-section>
+          <q-item-section>Copiar seleção</q-item-section>
+        </q-item>
+        <q-item v-if="buscavel" v-close-popup clickable @click="abrirBusca">
+          <q-item-section side><acai-ui-icon name="search" size="xs" /></q-item-section>
+          <q-item-section>Buscar (Ctrl+F)</q-item-section>
+        </q-item>
+      </q-list>
+    </q-menu>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, nextTick, ref, watch } from 'vue'
+import { copyToClipboard } from 'quasar'
+import AcaiUiButton from '../button/acai-ui-button.vue'
+import AcaiUiIcon from '../icon/acai-ui-icon.vue'
+import { notificacao } from '../../hooks/notify'
+import { mapearDobras } from './dobras-json'
+import type { CodeProps } from './acai-ui-code-interface'
+
+// Todo default booleano precisa estar AQUI: prop booleana declarada e não
+// informada vira `false` no Vue (boolean casting), então `props.x !== false` não
+// serve de default — nasceria tudo desligado.
+const props = withDefaults(defineProps<CodeProps>(), {
+  copiavel: true,
+  flat: false,
+  buscavel: true,
+  numeros: true,
+  dobravel: true,
+})
+
+const emit = defineEmits<{ 'update:modelValue': [valor: string] }>()
+
+/** Com `v-model` o componente vira editor; sem ele, é só visualização. */
+const editavel = computed(() => props.modelValue !== undefined)
+
+const raizRef = ref<HTMLElement | null>(null)
+/** A lista de linhas: sozinha na leitura, espelho do textarea no editor. */
+const caixaRef = ref<HTMLElement | null>(null)
+const entradaRef = ref<HTMLTextAreaElement | null>(null)
+const buscaRef = ref<HTMLInputElement | null>(null)
+
+/** Texto final: objeto vira JSON indentado; string já formatada passa direto. */
+const texto = computed<string>(() => {
+  if (editavel.value) return props.modelValue ?? ''
+  const valor = props.value
+  if (valor === null || valor === undefined) return ''
+  if (typeof valor === 'string') return valor
+  try {
+    return JSON.stringify(valor, null, 2)
+  } catch {
+    // Referência circular — acontece com schema recursivo (`Pessoa.chefe: Pessoa`).
+    return String(valor)
+  }
+})
+
+const estiloAltura = computed(() => (props.maxHeight ? { maxHeight: props.maxHeight } : {}))
+
+function escapar(bruto: string): string {
+  return bruto
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+}
+
+function escaparRegex(bruto: string): string {
+  return bruto.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+}
+
+/**
+ * Realce de JSON sem dependência externa.
+ *
+ * Roda sobre o texto JÁ ESCAPADO, por isso procura `&quot;` no lugar de aspas.
+ * A ordem importa: a chave (string seguida de `:`) precisa ser testada antes da
+ * string comum, senão toda chave seria pintada como valor.
+ */
+function destacarSintaxe(bruto: string): string {
+  const escapado = escapar(bruto)
+  if (props.language && props.language !== 'json') return escapado
+
+  return escapado.replace(
+    /(&quot;(?:[^&]|&(?!quot;))*&quot;)(\s*:)?|(\b-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?\b)|(\b(?:true|false)\b)|(\bnull\b)/g,
+    (trecho, cadeia, doisPontos, numero, booleano, nulo) => {
+      if (cadeia) {
+        const classe = doisPontos ? 'chave' : 'texto'
+        return `<span class="acai-code__${classe}">${cadeia}</span>${doisPontos ?? ''}`
+      }
+      if (numero) return `<span class="acai-code__numero">${numero}</span>`
+      if (booleano) return `<span class="acai-code__booleano">${booleano}</span>`
+      if (nulo) return `<span class="acai-code__nulo">${nulo}</span>`
+      return trecho
+    },
+  )
+}
+
+/**
+ * Aplica os `<mark>` da busca SOBRE o HTML já realçado de UMA linha.
+ *
+ * Fatia por tags e só mexe nos pedaços de texto — casar o termo no HTML inteiro
+ * acertaria nomes de classe (`acai-code__chave` casa com "chave") e cortaria as
+ * tags ao meio, quebrando o bloco.
+ *
+ * O contador de ocorrências é global (vem de fora e volta atualizado): a
+ * numeração precisa correr o documento todo, não recomeçar a cada linha.
+ */
+function marcarLinha(html: string, contador: number): { html: string; contador: number } {
+  const termo = termoBusca.value.trim()
+  if (!termo) return { html, contador }
+
+  const alvo = escaparRegex(escapar(termo))
+  const padrao = new RegExp(`(${alvo})`, 'gi')
+  let indice = contador
+
+  const marcado = html
+    .split(/(<[^>]+>)/)
+    .map((pedaco) => {
+      if (pedaco.startsWith('<')) return pedaco
+      return pedaco.replace(padrao, (achado) => {
+        const atual = indice
+        indice += 1
+        const ativo = atual === ocorrenciaAtual.value ? ' acai-code__marca--ativa' : ''
+        return `<mark class="acai-code__marca${ativo}" data-ocorrencia="${atual}">${achado}</mark>`
+      })
+    })
+    .join('')
+
+  return { html: marcado, contador: indice }
+}
+
+// ===================== Linhas, numeração e dobra =====================
+interface LinhaCodigo {
+  numero: number
+  html: string
+  /** Linha do fechamento quando esta linha ABRE um bloco de várias linhas. */
+  fecha: number | null
+}
+
+const numerado = computed(() => props.numeros)
+const dobravel = computed(() => props.dobravel)
+
+const dobras = computed(() => mapearDobras(texto.value.split('\n')))
+
+/** Linhas de abertura atualmente fechadas. */
+const dobradas = ref<Set<number>>(new Set())
+
+// Conteúdo novo invalida qualquer dobra: as linhas mudaram de lugar.
+watch(texto, () => {
+  dobradas.value = new Set()
+})
+
+function estaDobrada(numero: number): boolean {
+  return dobradas.value.has(numero)
+}
+
+function linhasOcultas(numero: number): number {
+  const fecha = dobras.value.get(numero)
+  return fecha ? fecha - numero : 0
+}
+
+function alternarDobra(numero: number): void {
+  const proximas = new Set(dobradas.value)
+  if (proximas.has(numero)) proximas.delete(numero)
+  else proximas.add(numero)
+  dobradas.value = proximas
+}
+
+/**
+ * Com bloco fechado o editor vira leitura.
+ *
+ * O texto real está no `<textarea>` transparente por cima, e ele não tem como
+ * esconder linha nenhuma: se o espelho dobra e o textarea não, o cursor cai a
+ * dezenas de linhas de onde o realce mostra. Em vez de proibir a dobra no
+ * editor (era assim), a edição pausa enquanto houver bloco fechado — e um
+ * clique no código abre tudo e devolve o cursor.
+ */
+const travadoPorDobra = computed(() => editavel.value && dobradas.value.size > 0)
+
+function abrirTudo(): void {
+  dobradas.value = new Set()
+}
+
+function aoClicarNoCodigo(): void {
+  if (!travadoPorDobra.value) return
+  abrirTudo()
+  void nextTick(() => entradaRef.value?.focus())
+}
+
+/** Todas as linhas, já realçadas e marcadas — a base de tudo que é renderizado. */
+const linhas = computed<LinhaCodigo[]>(() => {
+  const brutas = texto.value.split('\n')
+  let contador = 0
+
+  if (!editavel.value && !texto.value) {
+    return [{ numero: 1, html: '<span class="acai-code__nulo">(vazio)</span>', fecha: null }]
+  }
+
+  return brutas.map((bruta, indice) => {
+    const base = destacarSintaxe(bruta)
+    const { html, contador: proximo } = marcarLinha(base, contador)
+    contador = proximo
+    return {
+      numero: indice + 1,
+      html: html || '&nbsp;',
+      fecha: dobras.value.get(indice + 1) ?? null,
+    }
+  })
+})
+
+/** Em que linha caiu cada ocorrência — usado pra abrir a dobra ao navegar. */
+const linhaDaOcorrencia = computed<number[]>(() => {
+  const mapa: number[] = []
+  for (const linha of linhas.value) {
+    for (const achado of linha.html.matchAll(/data-ocorrencia="(\d+)"/g)) {
+      mapa[Number(achado[1])] = linha.numero
+    }
+  }
+  return mapa
+})
+
+/** O que sobra depois de esconder o miolo dos blocos fechados. */
+const linhasVisiveis = computed<LinhaCodigo[]>(() => {
+  if (!dobradas.value.size) return linhas.value
+
+  const ocultas = new Set<number>()
+  for (const abertura of dobradas.value) {
+    const fecha = dobras.value.get(abertura)
+    if (!fecha) continue
+    for (let n = abertura + 1; n <= fecha; n += 1) ocultas.add(n)
+  }
+
+  return linhas.value.filter((linha) => !ocultas.has(linha.numero))
+})
+
+/** Abre o que for preciso pra uma linha escondida voltar a aparecer. */
+function revelarLinha(numero: number): void {
+  const proximas = new Set(dobradas.value)
+  let mudou = false
+  for (const abertura of dobradas.value) {
+    const fecha = dobras.value.get(abertura)
+    if (fecha && numero > abertura && numero <= fecha) {
+      proximas.delete(abertura)
+      mudou = true
+    }
+  }
+  if (mudou) dobradas.value = proximas
+}
+
+/**
+ * Largura da calha em `ch`, pelo maior número de linha — sem número mágico.
+ *
+ * O `recuo` é o mesmo valor somado ao espaço até o código, e é o que o textarea
+ * do editor usa de `padding-left`: é ele que faz as duas camadas quebrarem a
+ * linha na MESMA largura. Sem numeração, vale zero.
+ */
+const estiloCalha = computed(() => {
+  const calha = `${String(linhas.value.length).length}ch`
+  // Tudo que vem ANTES do código na linha entra na conta: a coluna da seta de
+  // dobra (16px + 2px de respiro) e a calha dos números (largura + 12px).
+  const partes: string[] = []
+  if (dobravel.value) partes.push('18px')
+  if (numerado.value) partes.push(`${calha} + 12px`)
+
+  return {
+    '--acai-code-calha': calha,
+    '--acai-code-recuo': partes.length ? `calc(${partes.join(' + ')})` : '0px',
+  }
+})
+
+// ===================== Busca =====================
+// Vale nos DOIS modos: o corpo de um POST é onde mais se procura chave (é o
+// maior JSON da tela), e ali o Ctrl+F do navegador não acha nada — o texto vive
+// dentro de um <textarea>, que a busca nativa não varre.
+const buscavel = computed(() => props.buscavel)
+const buscaVisivel = ref(false)
+const termoBusca = ref('')
+const ocorrenciaAtual = ref(0)
+
+// Conta as MARCAS de fato coladas nas linhas, não o texto cru: um termo com `<`
+// ou `"` é escapado antes de virar HTML, e a conta em cima do cru divergiria do
+// que está destacado na tela.
+const totalOcorrencias = computed(() =>
+  termoBusca.value.trim() ? linhaDaOcorrencia.value.length : 0,
+)
+
+watch(termoBusca, () => {
+  ocorrenciaAtual.value = 0
+  void rolarAteOcorrencia()
+})
+
+function aoTeclar(evento: KeyboardEvent): void {
+  if ((evento.ctrlKey || evento.metaKey) && evento.key.toLowerCase() === 'f' && buscavel.value) {
+    // `preventDefault` só aqui dentro: fora do bloco, o Ctrl+F do navegador
+    // continua funcionando normalmente.
+    evento.preventDefault()
+    abrirBusca()
+  }
+}
+
+function abrirBusca(): void {
+  if (!buscavel.value) return
+  buscaVisivel.value = true
+  void nextTick(() => buscaRef.value?.focus())
+}
+
+function fecharBusca(): void {
+  buscaVisivel.value = false
+  termoBusca.value = ''
+  // No editor o foco volta pro texto (o container nem é focável ali); na leitura,
+  // pro container, que é quem escuta o Ctrl+F.
+  if (editavel.value) entradaRef.value?.focus()
+  else raizRef.value?.focus()
+}
+
+/**
+ * Rolagem SUAVE até a ocorrência, feita na mão dentro do bloco.
+ *
+ * `scrollIntoView` foi descartado: ele rola o ancestral rolável mais próximo e
+ * arrasta a PÁGINA inteira junto — é o salto brusco. Aqui a conta é relativa ao
+ * próprio `<pre>`, então nada fora dele se mexe.
+ *
+ * `behavior: 'smooth'` em `scrollTo` é suportado por Chrome, Edge e Firefox; o
+ * `?? ` cobre o caso de o navegador ignorar o objeto de opções.
+ */
+async function rolarAteOcorrencia(): Promise<void> {
+  // Achado dentro de bloco fechado: abre antes de tentar rolar até ele, senão a
+  // busca diria "3 de 7" apontando pra nada.
+  const linha = linhaDaOcorrencia.value[ocorrenciaAtual.value]
+  if (linha) revelarLinha(linha)
+
+  await nextTick()
+  // No editor quem tem as marcas é o espelho, mas quem MANDA na rolagem é o
+  // textarea por cima — rolar só o espelho descolaria o cursor do texto.
+  const caixa = caixaRef.value
+  if (!caixa) return
+  const marca = caixa.querySelector<HTMLElement>(
+    `[data-ocorrencia="${ocorrenciaAtual.value}"]`,
+  )
+  if (!marca) return
+
+  // Medida por retângulo, não por `offsetTop`: com as linhas em elementos
+  // próprios o pai posicionado mais próximo é a raiz do componente, e o
+  // `offsetTop` passaria a contar a partir dela, não da caixa que rola.
+  const deslocamento =
+    marca.getBoundingClientRect().top - caixa.getBoundingClientRect().top + caixa.scrollTop
+  const destino = deslocamento - caixa.clientHeight / 2 + marca.offsetHeight / 2
+  const topo = Math.max(0, destino)
+  const alvo = editavel.value ? entradaRef.value : caixa
+  if (!alvo) return
+
+  try {
+    alvo.scrollTo({ top: topo, behavior: 'smooth' })
+  } catch {
+    alvo.scrollTop = topo
+  }
+  // O `scroll` do textarea só dispara depois da animação; sincroniza o espelho
+  // agora pra marca não ficar fora de vista no meio do caminho.
+  if (editavel.value) caixa.scrollTop = topo
+}
+
+function irParaProximo(): void {
+  if (!totalOcorrencias.value) return
+  ocorrenciaAtual.value = (ocorrenciaAtual.value + 1) % totalOcorrencias.value
+  void rolarAteOcorrencia()
+}
+
+function irParaAnterior(): void {
+  if (!totalOcorrencias.value) return
+  ocorrenciaAtual.value =
+    (ocorrenciaAtual.value - 1 + totalOcorrencias.value) % totalOcorrencias.value
+  void rolarAteOcorrencia()
+}
+
+// ===================== Edição =====================
+function aoDigitar(evento: Event): void {
+  emit('update:modelValue', (evento.target as HTMLTextAreaElement).value)
+}
+
+function espelharRolagem(): void {
+  const espelho = caixaRef.value
+  const entrada = entradaRef.value
+  if (!espelho || !entrada) return
+  espelho.scrollTop = entrada.scrollTop
+  espelho.scrollLeft = entrada.scrollLeft
+}
+
+// ===================== Cópia =====================
+async function copiar(): Promise<void> {
+  await copyToClipboard(texto.value)
+  notificacao({ color: 'positive', message: 'Conteúdo copiado.' })
+}
+
+async function copiarSelecao(): Promise<void> {
+  const selecionado = window.getSelection()?.toString() ?? ''
+  if (!selecionado) {
+    notificacao({ color: 'warning', message: 'Nada selecionado.' })
+    return
+  }
+  await copyToClipboard(selecionado)
+  notificacao({ color: 'positive', message: 'Seleção copiada.' })
+}
+</script>
+
+<!-- SEM `scoped`, de propósito: o realce é injetado por `v-html` e esse HTML
+     não recebe o atributo `data-v-*` do scoped — as classes de sintaxe ficariam
+     sem nenhuma regra e o bloco sairia todo cinza. Toda a folha vive sob
+     `.acai-code`, então não vaza. -->
+<style lang="scss">
+@import './acai-ui-code-styles.scss';
+</style>

package/src/components/code/dobras-json.ts

@@ -0,0 +1,52 @@
+/**
+ * Casa `{`/`[` com o fechamento correspondente, por linha.
+ *
+ * Fora do `.vue` de propósito: é a única peça do bloco de código com estado de
+ * verdade (profundidade, string aberta, escape) e a que quebra em silêncio — um
+ * `}` dentro de um valor fecharia o bloco errado e a dobra esconderia o pedaço
+ * errado do JSON.
+ *
+ * @param linhas conteúdo já quebrado por `\n`
+ * @returns mapa `linha que abre → linha que fecha`, só para blocos que ocupam
+ *   mais de uma linha (dobrar `{ }` na mesma linha não esconderia nada)
+ */
+export function mapearDobras(linhas: string[]): Map<number, number> {
+  const pares = new Map<number, number>()
+  const pilha: number[] = []
+  let dentroDeTexto = false
+  let escapando = false
+
+  linhas.forEach((linha, indice) => {
+    const numero = indice + 1
+
+    for (const caractere of linha) {
+      if (escapando) {
+        escapando = false
+        continue
+      }
+      if (caractere === '\\' && dentroDeTexto) {
+        escapando = true
+        continue
+      }
+      if (caractere === '"') {
+        dentroDeTexto = !dentroDeTexto
+        continue
+      }
+      if (dentroDeTexto) continue
+
+      if (caractere === '{' || caractere === '[') {
+        pilha.push(numero)
+      } else if (caractere === '}' || caractere === ']') {
+        const abertura = pilha.pop()
+        if (abertura !== undefined && numero > abertura) pares.set(abertura, numero)
+      }
+    }
+
+    // String não fechada é JSON quebrado (resposta crua de API acontece): zera o
+    // estado na quebra de linha pra um erro não contaminar o arquivo inteiro.
+    dentroDeTexto = false
+    escapando = false
+  })
+
+  return pares
+}