---
name: EdgePy Component
description: Criar ou modificar painéis, renderizadores, resolvedores de assets e componentes de análise do EdgePy Viewer pelos contratos públicos.
---

# Extensões do EdgePy Viewer

## 1. Localize a fronteira

Localize a raiz do workspace: pode ser a raiz do repositório ou `edgepy-viewer/`.
Todos os caminhos abaixo são relativos a essa raiz, não à pasta desta skill.
Leia as instruções locais e o diff antes de editar.

Leia `apps/viewer-demo/src/App.tsx` e `packages/react-viewer/src/index.tsx`.
Classifique a tarefa e leia seu contrato:

- Painel: leia `packages/react-viewer/src/components/ViewerDrawers.tsx` e use `ViewerCustomPanel` e `customPanels`.
- Renderer ou assets: leia `packages/react-viewer/src/ports/viewportRenderer.ts` e use `ClinicalViewportRenderer` ou `ClinicalViewportAssetResolver`.
- Análise de pixels: o mesmo arquivo de portas, mais `packages/core/src/index.ts` para o snapshot.
- Python: leia a documentação local do PyScript e o pacote `pyodide-agents` antes de escolher o fluxo.

Conclua esta etapa identificando contrato, ponto de registro e comportamento observável esperado. Se o contrato não atender à tarefa, descreva a lacuna e contabilize a alteração arquitetural necessária.

## 2. Implemente uma extensão pequena

Mantenha o core independente de React, DOM, Cornerstone e Pyodide.
Registre dependências na aplicação e preserve painéis e callbacks existentes.
Separe cálculo puro da interface. Prefira imports públicos aos detalhes internos do renderizador.

Para pixels, trate método opcional, resposta vazia, erro e resposta assíncrona obsoleta.
Invalide ROI e resultado ao trocar estudo, série, corte ou handle.
Documente limites dos intervalos, valores não finitos e unidades efetivamente conhecidas.
Um renderer é responsável pela limpeza dos recursos que criou em `destroy()`. O painel consumidor não destrói o handle do viewer.

## 3. Verifique o comportamento

Consulte os scripts disponíveis no `package.json` atual e rode tipagem, testes relevantes e build.
Para cálculo, use uma entrada determinística com saída conhecida.
Para interface, verifique abertura, interação, fechamento e reabertura no viewer real.
Para renderer, verifique montagem, mudança de contexto, leitura de pixels quando suportada e limpeza.

Conclua com arquivos alterados, contratos utilizados, comandos e resultados observados, além das verificações ainda pendentes. Diferencie a demonstração sintética de compatibilidade DICOM e uso clínico. Mantenha a entrega local até que seja solicitada publicação.