Tipos de campo / Field types

Reference for every field type the editor renders

Cada campo no config.json tem um type que determina como o editor o renderiza. Esta pagina lista todos os 15 tipos atualmente implementados, com exemplo, propriedades e formato do parametro na querystring.

Each field in config.json has a type that tells the editor how to render it. This page lists all 15 currently implemented types, with example, properties, and querystring format.

text textarea boolean dropdown color file url date number slider normalized counter radio colorBinding table roadmap

text

Linha unica de texto. Use para titulos, nomes, codigos curtos.

Single-line text. Use for titles, names, short codes.

{
  "key": "t",
  "name": "title",
  "label": "Title",
  "type": "text",
  "maxChars": 40,
  "default": "Breaking News",
  "tip": "Main headline"
}

Property	Description
`maxChars`	Limite de caracteres / Character limit (optional)

Querystring: ?t=Hello%20World

textarea

Texto multilinha. Use para corpos longos, citacoes, descricoes.

Multi-line text. Use for long bodies, quotes, descriptions.

{
  "key": "txt",
  "name": "text",
  "label": "Body",
  "type": "textarea",
  "maxChars": 500,
  "rows": 4,
  "default": "",
  "tip": "Main content"
}

Property	Description
`maxChars`	Limite de caracteres / Character limit
`rows`	Linhas visiveis / Visible rows (default: `3`)

Querystring: ?txt=Linha1%0ALinha2 — use %0A para quebrar linha / use %0A for newlines.

boolean

Toggle ON/OFF. Renderizado como switch.

ON/OFF toggle. Rendered as a switch.

{
  "key": "show",
  "name": "showHeader",
  "label": "Show header",
  "type": "boolean",
  "default": true,
  "tip": "Display the top header bar"
}

Querystring: ?show=1 ou / or ?show=0

Selecao unica de uma lista. Use quando ha muitas opcoes (5+).

Single selection from a list. Use when there are many options (5+).

{
  "key": "cond",
  "name": "condition",
  "label": "Weather",
  "type": "dropdown",
  "options": [
    { "value": "sol",     "text": "Sunny" },
    { "value": "parcial", "text": "Partly cloudy" },
    { "value": "nublado", "text": "Cloudy" },
    { "value": "chuva",   "text": "Rain" }
  ],
  "default": "sol"
}

Property	Description
`options`	Array de `{ value, text }` / Array of `{ value, text }`

Querystring: ?cond=parcial

color

Cor livre, com seletor (color picker). Aceita HEX, RGB ou nomes CSS.

Free color, picker. Accepts HEX, RGB, or CSS names.

{
  "key": "bg",
  "name": "bgColor",
  "label": "Background",
  "type": "color",
  "default": "#1a1a2e"
}

Querystring: ?bg=%231a1a2e — o # precisa ser percent-encoded como %23 / the # must be percent-encoded as %23.

file

Selecao de asset do MAM (sistema de midia da Insyde). Aceita imagens, videos, PDFs, audio.

Pick an asset from the MAM (Insyde media system). Accepts images, videos, PDFs, audio.

{
  "key": "img",
  "name": "image",
  "label": "Image",
  "type": "file",
  "accept": "image",
  "default": "img/default.avif",
  "tip": "Pick from MAM"
}

Property	Description
`accept`	`image`, `video`, `pdf`, `audio` ou MIME / or MIME (e.g. `image/,video/`)

Aceitos / Accepted values:

image — JPG, PNG, AVIF, WebP, GIF
video — MP4, WebM, MOV
pdf — PDF documents
audio — MP3, WAV, OGG
Custom: image/*,video/* ou .jpg,.png

Querystring: ?img=assets/photo.avif — o valor e o caminho relativo do asset / the value is the asset relative path.

url

URL externa. Validada (deve comecar com http:// ou https://).

External URL. Validated (must start with http:// or https://).

{
  "key": "link",
  "name": "sourceUrl",
  "label": "Source URL",
  "type": "url",
  "maxChars": 500,
  "default": ""
}

Property	Description
`maxChars`	Limite do tamanho da URL / URL length limit

Querystring: ?link=https%3A%2F%2Fexample.com

date

Data com seletor de calendario. O valor armazenado segue o formato declarado.

Date with a calendar picker. Stored value follows the declared format.

{
  "key": "dt",
  "name": "date",
  "label": "Date",
  "type": "date",
  "format": "DD/MM/YYYY",
  "default": "01/01/2026"
}

Property	Description
`format`	Formato de exibicao / Display format (e.g. `DD/MM/YYYY`, `YYYY-MM-DD`)

Querystring: ?dt=07/01/2026

number

Numero (inteiro ou decimal). Renderizado como input numerico com setas.

Number (integer or decimal). Rendered as a numeric input with arrows.

{
  "key": "pts",
  "name": "points",
  "label": "Points",
  "type": "number",
  "min": 0,
  "max": 1000,
  "step": 1,
  "default": 0
}

Property	Description
`min`	Valor minimo / Minimum value
`max`	Valor maximo / Maximum value
`step`	Incremento / Increment

Querystring: ?pts=423

slider

Numero renderizado como slider visual com min/max/step. Use quando o controle visual ajuda mais que digitar.

Number rendered as a visual slider with min/max/step. Use when a visual control helps more than typing.

{
  "key": "vol",
  "name": "volume",
  "label": "Volume",
  "type": "slider",
  "min": 0,
  "max": 100,
  "step": 1,
  "default": 50
}

Property	Description
`min`	Default: `0`
`max`	Default: `100`
`step`	Default: `1`

Querystring: ?vol=75

normalized

Valor de ponto flutuante limitado entre 0 e 100 com precisao de 0.1. Use para porcentagens, progresso, intensidade.

Floating-point value clamped to 0–100 with 0.1 precision. Use for percentages, progress, intensity.

{
  "key": "pct",
  "name": "progress",
  "label": "Progress %",
  "type": "normalized",
  "default": 25.5
}

Range e step sao fixos (0–100, 0.1) e nao podem ser configurados.
Range and step are fixed (0–100, 0.1) and not configurable.

Querystring: ?pct=87.3

counter

Inteiro com botoes explicitos de + e −. Limitado por min/max se fornecidos; caso contrario, ilimitado.

Integer with explicit + and − buttons. Bounded by min/max if provided; otherwise unbounded.

{
  "key": "qty",
  "name": "quantity",
  "label": "Quantity",
  "type": "counter",
  "min": 0,
  "max": 99,
  "step": 1,
  "default": 1
}

Property	Description
`min`	Default: ilimitado / unbounded
`max`	Default: ilimitado / unbounded
`step`	Default: `1`

Querystring: ?qty=12

radio

Selecao unica de um conjunto pequeno (2 a 5 opcoes), renderizada como radio group. Mais escaneavel que dropdown quando ha poucas opcoes.

Single selection from a small set (2–5 options), rendered as a radio group. More scannable than a dropdown when there are few options.

{
  "key": "size",
  "name": "size",
  "label": "Size",
  "type": "radio",
  "options": [
    { "value": "sm", "text": "Small" },
    { "value": "md", "text": "Medium" },
    { "value": "lg", "text": "Large" }
  ],
  "default": "md"
}

Property	Description
`options`	Array de `{ value, text }` / Array of `{ value, text }`

Querystring: ?size=lg

colorBinding

Selecao de cor a partir de uma paleta nomeada declarada em meta.palettes. Mantem o design dentro da identidade da marca; o template recebe o hex resolvido.

Color picker bound to a named palette declared under meta.palettes. Keeps designs on-brand; the template receives the resolved hex.

{
  "key": "acc",
  "name": "accent",
  "label": "Accent",
  "type": "colorBinding",
  "palette": "brand",
  "default": "#0066ff"
}

Property	Description
`palette`	Nome da paleta em `meta.palettes` / Name of the palette in `meta.palettes`

Paleta declarada no nivel do schema:

Palette declared at schema level:

{
  "fields": [ /* ... */ ],
  "meta": {
    "palettes": {
      "brand":   ["#0066ff", "#00aa44", "#ff6600", "#cc0033"],
      "neutral": ["#111111", "#444444", "#888888", "#cccccc"]
    }
  }
}

Querystring: ?acc=%230066ff

table

Linhas repetidas de celulas tipadas. Use para classificacoes, escalas, comparacoes — qualquer estrutura tabular com poucas/medias linhas.

Repeating rows of typed cells. Use for standings, lineups, comparisons — any tabular structure with a small/medium row count.

{
  "key": "rows",
  "name": "standings",
  "label": "Standings",
  "type": "table",
  "minRows": 1,
  "maxRows": 20,
  "columns": [
    { "key": "pos",  "label": "#",      "type": "number", "width": 40,  "default": 1 },
    { "key": "code", "label": "Code",   "type": "text",   "width": 60 },
    { "key": "team", "label": "Team",   "type": "text",   "width": 200, "required": true },
    { "key": "logo", "label": "Logo",   "type": "image",  "accept": "image" },
    { "key": "pts",  "label": "Points", "type": "number", "min": 0, "default": 0 }
  ],
  "default": []
}

Property	Description
`columns`	Array de `TableColumnDef` (abaixo) / Array of `TableColumnDef` (below)
`minRows`	Linhas minimas / Minimum row count
`maxRows`	Linhas maximas / Maximum row count

TableColumnDef:

Property	Description
`key`	Sigla curta na querystring / Short prefix in the querystring
`label`	Cabecalho da coluna / Column header
`type`	`text`, `number`, `boolean`, `image`, `url`, `color`, `dropdown`, `omo`
`width`	Largura em px / Width in px
`required`	Marca celula como obrigatoria / Mark cell as required
`options`	`{ value, text }[]` — para `dropdown` e `omo`
`accept`	MIME hint — para `image` (abre o picker do MAM)
`min` / `max` / `step`	Limites numericos — para `number`
`default`	Valor inicial em novas linhas / Per-cell default for new rows
`tip`	Texto de ajuda por celula / Per-cell help text

Imagens em coluna de tabela: uma coluna image abre o mesmo MAM picker do campo file. O valor armazenado por linha e o caminho do asset (string).
Image columns: a column with type: "image" opens the same MAM picker as the top-level file field. The stored per-row value is the asset path string.

Querystring: as linhas sao achatadas usando key + index por celula. Para o schema acima, com 2 linhas:

Querystring: rows flatten as key + index per cell. For the schema above, with 2 rows:

?rows=2&pos1=1&code1=BRA&team1=Brasil&pts1=42&pos2=2&code2=ARG&team2=Argentina&pts2=39

O parametro lider rows=N indica a quantidade de linhas. / The leading rows=N indicates the row count.

Roadmap

Os tipos abaixo estao declarados na uniao de tipos do editor mas ainda nao tem renderer. Um schema pode declara-los hoje — o editor ignora a renderizacao, mas valores definidos manualmente na URL ainda chegam ao template.

The types below are declared in the editor type union but don't yet have a renderer. A schema may declare one of these today — the editor skips rendering, but a value set manually in the URL still reaches the template.

repeater chartData presetSelection variant timer overlayRegions actionButton dataConnector map video richtext

← Overview · Schema metadata →