Dropdown

Como utilizar

import { Dropdown } from '@superlogica/design-system-mobile'

import React, { useState } from 'react';
import { View } from 'react-native';
import { Dropdown } from '@superlogica/design-system-mobile';

const YourApp = () => {
  const [value, setValue] = useState(null)

  const items = [
    {
      id: 1,
      label: 'Example 1'
    },
    {
      id: 2,
      label: 'Example 2'
    }
  ]

  return (
    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
      <Dropdown
        label="Selecione uma opção"
        value={value}
        onChange={(item) => setValue(item)}
        items={items}
        listId="id"
        listLabel="label"
        message="É obrigatório selecionar uma opção"
        size="lg"
        status="danger"
      />
    </View>
  )
}

export default YourApp;

Props

Prop	Tipo	Default	Descrição
label	`string`	`" "`	Label do componente
value	`object`	`null`	Value do componente
onChange	`func`	`() => {}`	Função chamada quando houver mudança no value no componente
items	`array`	`[ ]`	Lista de itens do componente
listId	`string`	`id`	Nome do campo que será o identificador do Json. Ex: `{"id": 1, "label": "Example"}` - o identificador será o id
listLabel	`string`	`label`	Nome do campo que será exibido no value e nos itens da lista. Ex: `{"id": 1, "label": "Example"}` - o campo a ser mostrado será o label
message	`string`	`" "`	Exibe uma mensagem abaixo do componente
size	`string`	`md`	Define o tamanho do componente (md ou lg)
status	`string`	`default`	Define o status do componente (default, danger ou disabled)