Widget
Incorpore uma demonstração ao vivo do widget What's New na documentação com o componente MDX Widget, que abre seu changelog em um modal sem tag de script.
<Widget> adiciona um acionador do What's New ao vivo diretamente a uma página de documentação. Clique nele para abrir seu changelog no mesmo modal que seus clientes veem quando você incorpora o widget no seu app. A diferença: aqui, você escreve uma tag MDX em vez de uma tag <script>, e a página resolve seu site automaticamente.
Início rápido
<Widget />Isso renderiza um botão que abre /changelog (o caminho padrão) em um modal. Se o changelog estiver em outro local, defina page com a rota correspondente, caso contrário o modal abrirá um erro 404. (Por exemplo, o changelog do próprio Jamdesk está em /reference/changelog.)
<Widget page="/reference/changelog" label="What's new" /><Widget> resolve sozinho a origem canônica *.jamdesk.app, portanto funciona da mesma forma tanto quando sua documentação está em um subdomínio jamdesk.app quanto em um domínio personalizado. O modal sempre é carregado a partir do subdomínio, que é a única origem capaz de renderizar a visualização incorporada.
Propriedades
| Prop | Type | Default | Purpose |
|---|---|---|---|
page | string | /changelog | Caminho da documentação que o modal abre. |
label | string | What's new | Texto do botão acionador. |
theme | auto | light | dark | auto | Esquema de cores do modal. |
trigger | CSS selector | (none) | Vincula o widget ao seu próprio elemento em vez de renderizar um botão. |
width / height | CSS length | 560px / 680px | Tamanho do modal. |
radius | CSS length | 12px | Raio dos cantos do modal. |
unread | boolean | true | Mostra o ponto de não lido. Defina como false para ocultá-lo. |
unreadColor | hex / CSS color | #e5484d | Cor do ponto de não lido. |
project | string | derived | Substitui a chave armazenada de "visto". |
Ao definir trigger, verifique se o seletor corresponde a um elemento que já esteja na página. Se não corresponder a nada, o widget usará seu próprio acionador flutuante no canto em vez de não fazer nada.
O estado de "visto" do ponto de não lido é armazenado por navegador e por origem (a página em que o widget é executado), portanto o estado de visualização de um visitante na documentação e no seu app é controlado separadamente. Eles não são sincronizados. Para um botão de demonstração, defina unread={false} para remover o ponto completamente.
Exemplo ao vivo
Este botão abre o modal no site de documentação publicado, onde <Widget> se vincula à sua origem canônica *.jamdesk.app. Na visualização local de jamdesk dev, não há uma origem publicada de onde carregar o modal, portanto o acionador não pode abri-lo. Em vez disso, ele mostra a legenda "Live preview" ao lado do botão. Publique a página (ou abra-a no seu site ao vivo) para testar o recurso real.