Condicionais

Campos e containers podem ser exibidos, ocultados ou ter seus valores modificados com base no estado do formulário, usando expressões condicionais.

Condição básica (folha simples)

{
  "nome": "outro_pais",
  "tipo": "texto",
  "condicional": {
    "campoId": "pais",
    "operador": "igual",
    "valor": "Outro"
  }
}

O campo outro_pais só é visível quando pais === "Outro".

Operadores disponíveis

Operador	Significado
igual	==
diferente	!=
vazio	valor está vazio / falsy
naoVazio	valor não está vazio
contem	array inclui / string inclui
naoContem	array não inclui
maiorQue	>
menorQue	<
maiorOuIgual	>=
menorOuIgual	<=

Grupo AND

Todas as condições precisam ser verdadeiras:

{
  "condicional": {
    "and": [
      { "campoId": "tipo_cliente", "operador": "igual", "valor": "PJ" },
      {
        "campoId": "faturamento_anual",
        "operador": "maiorQue",
        "valor": 1000000
      }
    ]
  }
}

Grupo OR

Pelo menos uma condição precisa ser verdadeira:

{
  "condicional": {
    "or": [
      { "campoId": "canal", "operador": "igual", "valor": "email" },
      { "campoId": "canal", "operador": "igual", "valor": "sms" }
    ]
  }
}

Grupos aninhados

Grupos podem ser aninhados para criar lógica complexa:

{
  "condicional": {
    "and": [
      {
        "or": [
          { "campoId": "plano", "operador": "igual", "valor": "pro" },
          { "campoId": "plano", "operador": "igual", "valor": "enterprise" }
        ]
      },
      { "campoId": "aceite_termos", "operador": "igual", "valor": true }
    ]
  }
}

Lendo de externalData

Use source: "evento" para comparar contra um valor de externalData:

{
  "condicional": {
    "campoId": "evento.modoEdicao",
    "operador": "igual",
    "valor": true,
    "source": "evento"
  }
}

O renderer vai ler externalData["evento.modoEdicao"] para a comparação.

Condicionais no nível do container

Aplique uma condição a um FormContainer inteiro para exibir/ocultar uma seção:

{
  "titulo": "Endereço Comercial",
  "id": "secao_comercial",
  "ordem": 2,
  "condicional": {
    "campoId": "tipo_cliente",
    "operador": "igual",
    "valor": "PJ"
  },
  "campos": [
    {
      "nome": "cnpj",
      "tipo": "texto",
      "label": "CNPJ",
      "ordem": 1,
      "obrigatorio": true
    },
    {
      "nome": "razao_social",
      "tipo": "texto",
      "label": "Razão Social",
      "ordem": 2,
      "obrigatorio": true
    }
  ]
}

Quando o container está oculto, todos os seus campos são excluídos da validação e do envio.

setValues — autopreenchimento de outros campos

Use setValues para preencher automaticamente outros campos quando uma condição torna-se verdadeira:

{
  "nome": "mesmo_endereco",
  "tipo": "switch",
  "label": "Cobrança igual à entrega",
  "setValues": [
    { "campo": "cep_cobranca", "valor": null },
    { "campo": "cidade_cobranca", "valor": null }
  ],
  "condicional": {
    "campoId": "mesmo_endereco",
    "operador": "igual",
    "valor": true
  }
}

O valor suporta strings literais, números, booleanos ou null para limpar o campo.

clearedValue — resetar valor ao ocultar

Define o valor aplicado ao campo quando ele é ocultado por uma condicional:

{
  "nome": "desconto_parceiro",
  "tipo": "number",
  "condicional": {
    "campoId": "eh_parceiro",
    "operador": "igual",
    "valor": true
  },
  "clearedValue": 0
}

Sem clearedValue, o valor anterior do campo permanece mesmo após ser ocultado. Defina como null para apagar explicitamente:

{
  "nome": "numero_filhos",
  "clearedValue": null
}