The JSON editor

The JSON view of Syntope Tokens edits the selected token set as text. Switch to it with the code icon beside the list icon at the top of the tokens tab.

It shows one set’s DTCG Format document, not the whole project. To get the whole project as a file, export it.

Editing	Line numbers, code folding, bracket colours, find and replace
Linting	JSON errors appear in the gutter as you type
Colours	Follow your operating system, not the appearance setting

discard changes and save json become active once you change something, and an unsaved changes badge appears. If you leave with a draft open, unsaved JSON changes offers cancel, discard and continue and save and continue.

What only this view can do

• Add $extensions and $deprecated, and set a group’s $type, $description or $extends.
• Write JSON Pointer references.
• Rename or restructure a whole group with find and replace.
• Paste a token tree from another tool.
• Delete many tokens at once.

The document shape

{
  "color": {
    "$type": "color",
    "primary": {
      "$value": { "colorSpace": "srgb", "components": [0.23, 0.51, 0.96] },
      "$description": "Primary action colour"
    },
    "action": { "$value": "{color.primary}" }
  }
}

A token path becomes the nesting: color.primary is two levels. The set’s location is not in the document. Text tokens sit under $extensions in eu.syntope.stringTokens, because DTCG has no such type.

Saving

save json replaces this set’s document and no other. A token you remove from the text is deleted. Undo takes back the whole save.

A save is refused, with the reason under the editor, and nothing changes in these cases:

Cause	Do instead
Invalid JSON, or a document that is not valid DTCG	Fix what the message names
A reference to a name no set defines	Fix the reference, or create the token first
A token removed or renamed while others still refer to it, and no other set defines it	Update those references in the same save, or delete it from the list, which offers force delete

A changed path is a new token

A token keeps its identity here only while its path stays the same. If you change a path in the text, layers bound to the old token lose their link. To keep them, rename in the token dialog.

In a comparison, only the selected set’s column can be edited. Click another column to select it.