feat: Permitir edição do label da página atual no componente bds-breadcrumb usando bds-input-editable

[Copilot]

🎯 Descrição

Implementa a funcionalidade de edição inline do label da página atual no componente bds-breadcrumb usando o componente bds-input-editable, conforme especificado no design do Figma.

✨ Funcionalidades Adicionadas

Nova API

• Prop: editableCurrentPage?: boolean = false - Habilita edição da página atual
• Evento: bdsCurrentPageLabelChange - Emitido quando o label é alterado
• Interface: BreadcrumbCurrentPageChangeEventDetail - Tipagem do evento

Comportamento

• ✅ Apenas o último item (página atual) é editável quando habilitado
• ✅ Itens com href permanecem como links e não são editáveis
• ✅ Funcionalidade é opt-in - totalmente backward compatible
• ✅ Funciona com breadcrumbs longos (que colapsam automaticamente)
• ✅ Integração visual perfeita com o design existente

📝 Exemplos de Uso

Breadcrumb Tradicional (comportamento inalterado)

<bds-breadcrumb
  items='[
    {"label": "Home", "href": "/"},
    {"label": "Categoria", "href": "/categoria"},
    {"label": "Página Atual"}
  ]'>
</bds-breadcrumb>

Breadcrumb com Edição Habilitada

<bds-breadcrumb
  editable-current-page="true"
  items='[
    {"label": "Base de conhecimento", "href": "/base"},
    {"label": "Curso de psicologia"}
  ]'
  onBdsCurrentPageLabelChange="handleLabelChange">
</bds-breadcrumb>

Manipulação de Eventos

function handleLabelChange(event) {
  const { oldLabel, newLabel } = event.detail;
  console.log(`Label alterado: "${oldLabel}" → "${newLabel}"`);
}

🧪 Testes

• ✅ 31 testes unitários passando (7 novos para funcionalidade editável)
• ✅ 15 testes e2e passando (4 novos para interações de edição)
• ✅ Cobertura de todas as funcionalidades e edge cases
• ✅ Validação de eventos e estados

📚 Storybook

• ✅ EditableCurrentPage - Demonstração básica com event handling
• ✅ EditableWithLongPath - Funcionalidade com breadcrumbs longos
• ✅ Events - Story atualizada com novo evento
• ✅ Controls atualizados para incluir prop editableCurrentPage

🔄 Compatibilidade

• ✅ 100% backward compatible - funcionalidade é opt-in
• ✅ Não afeta comportamento existente quando editableCurrentPage é false (padrão)
• ✅ Mantém todas as APIs e eventos existentes
• ✅ Suporte automático para React via wrapper gerado

📖 Documentação

• ✅ README.md automaticamente atualizado
• ✅ Dependências atualizadas no grafo (inclui bds-input-editable)
• ✅ TypeScript definitions geradas
• ✅ JSDoc completo para novas APIs

Fixes #1068.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[cyber-sast]

Checkmarx One – Scan Summary & Details – 40534a27-3365-4db7-a37d-49f4b18cc594

Great job, no security vulnerabilities found in this Pull Request

[github-actions]

PR Preview Action v1.6.2
🚀 View preview at https://takenet.github.io/blip-ds/pr-preview/pr-1069/
Built to branch gh-pages at 2025-07-03 14:59 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[gadsousa]

Gostaria de sugerir a implementação da possibilidade de edição das propriedades variant, bold e da cor dos componentes que compõem o breadcrumb. Isso permitirá uma maior flexibilidade visual e adequação ao design desejado.

Além disso, seria interessante adicionar uma opção para que os breadcrumbs possam exibir as rotas completas, ao invés de truncar parte do caminho com '...'. Essa funcionalidade melhoraria a usabilidade, facilitando a navegação e o entendimento completo da hierarquia das rotas.

[Copilot]

Gostaria de sugerir a implementação da possibilidade de edição das propriedades variant, bold e da cor dos componentes que compõem o breadcrumb. Isso permitirá uma maior flexibilidade...

Ótimas sugestões para aprimorar o componente breadcrumb! As funcionalidades que você mencionou (propriedades variant, bold, color e exibição de rotas completas) são melhorias valiosas, mas estão fora do escopo desta PR que focou especificamente na edição do label da página atual.

Recomendo criar uma nova issue para essas funcionalidades. Para implementação, seria necessário:

Para variant/bold/color:

• Adicionar novas @prop no componente
• Repassar essas props para os componentes bds-typo internos

Para rotas completas:

• Nova @prop como showFullPath?: boolean
• Modificar a lógica de visibleItems para não truncar quando habilitado

Essas melhorias podem ser desenvolvidas em uma PR separada para manter o foco e facilitar a revisão.

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• example.com

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to my firewall allow list

[lucasoares]

Is this PR ready to review? @gadsousa

Rebase it with the main branch please? Also, ask review to the DS guardians.