ATLIconLabel

[IMAGEM]

Esta molécula é composta por um texto com um ícone à esquerda.

Para visitar a documentação de design desta molécula, clique aqui.

Exemplo de Uso:

import { ATLIconLabel } from '@appsimples/atlantica-react-native'
...
<ATLIconLabel 
    icon={myIcon} 
    text={'Esse é um label com ícone'}
/>

Props

• icon
• text
• complementary
• horizontalMargin
• horizontalPadding
• verticalMargin
• iconBaseProps
• labelBaseProps

---

icon

Ícone que aparece à esquerda do texto, na mesma linha.

Tipo	Obrigatório
ImageSourcePropType	Sim

---

text

Texto que aparece à direita do ícone.

Tipo	Obrigatório
string	Sim

---

complementary

Variação complementar da molécula a ser usada quando o fundo da tela é da cor ColorPrimary.

[IMAGEM]

Tipo	Obrigatório
boolean	Não

---

horizontalMargin

Essa propriedade deve ser modificada caso seja necessário alterar a margem horizontal externa aos elementos da molécula.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
horizontalMargin	SpacingMarginal	16

---

horizontalPadding

Essa propriedade deve ser modificada caso seja necessário alterar o espaçamento entre o ícone e o texto.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
horizontalPadding	SpacingBase	8

---

verticalMargin

Essa propriedade deve ser modificada caso seja necessário alterar a margem vertical externa aos elementos da molécula.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
verticalMargin	SpacingBase	8

---

iconBaseProps

Caso seja necessário mudar alguma propriedade base do átomo de ícone, é possível através da modificação das iconBaseProps.

Abaixo temos uma tabela com todas as props do ícone, os tokens aos quais estão relacionadas e o seu valor padrão.

Props	Token	Default Value
opacity	(fixed)	1
size	SizeLabelIcon	20
tintColor	ColorPrimary	#A94CC9

Para mais informações, acesse ATLIconBase.

---

labelBaseProps

Caso seja necessário mudar alguma propriedade base do átomo de label, é possível através da modificação das labelBaseProps.

Abaixo temos uma tabela com todas as props da label, os tokens aos quais estão relacionadas e o seu valor padrão.

Props	Token	Default Value
fontFamily	FontFamilyBase	undefined
fontSize	FontSizeBody	14
fontWeight	FontWeightNormal	Regular (400)
lineHeight	LineHeightBase	20
multilineLimit	MultilineLimitBody	undefined
opacity	(fixed)	1
textAlign	TextAlignmentBody	Left
textCase	TextCaseBody	None
textColor	ColorDarkNeutral	#212121

Para mais informações, acesse ATLLabelBase.