@mamba/collection

Collection

O módulo Collection é composto por dois componentes: Collection e Row, que juntos ajudam a organizar itens em listas. Collection é um conjunto de Row de um assunto comum, semelhante a uma tabela com apenas uma coluna e diversas linhas.

<Collection ...props />

Propriedades	Descrição	Tipo	Padrão
title	Título da coleção	string	undefined

<Row ...props />

Propriedades	Descrição	Tipo	Padrão
label	Texto da linha	string	''
leftLabel	Igual a prop label	string	''
rightLabel	Texto que é exibido no canto direito da linha	string	undefined
description	Texto de descrição abaixo do título	string	undefined
href	Link acionado quando a <Row/> é clicada	string	undefined
showExtra	Mostra o conteúdo extra	boolean	false
shortcut	Tecla de atalho para a ação da <Row/>: 0..9,enter,shortcuts,help	string (keyname)	undefined
bgColor	Cor de fundo da linha	string	undefined
primaryColor	Cor primária da linha	string	undefined
secondaryColor	Cor secundária da linha	string	undefined

Eventos

<Row ... on:event="..."/>

Eventos	Disparado quando ...	Tipo
click	Uma Row é clicada	function()
showExtra	O conteúdo extra é exibido	function()
hideExtra	O conteúdo extra é escondido	function()

Exemplos:

Quando o componente Row for clicado o roteador retorna para a página home.

<Row on:click="root.router.go('/')" />

Quando o conteúdo em extra for exbidio digita no console a mensagem.

<Row on:showExtra="console.log('extra extra')" />

Quando o conteúdo em extra for escondido, executa o método myMethod().

<Row on:click="myMethod()" />

Slots

<Row ... />

Slot	Descrição
right-sign	Adiciona html customizado ao lado esquerdo da label
left-sign	Adiciona html customizado ao lado direito da rightLabel
description	Adiciona uma descrição à Row
extra	Adiciona conteúdo adicional após o contéudo da Row