You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I want to customize the editor in the ways that are made possible via the properties supplied to the svelte-jsoneditor.
Details
Not all the properties are relevant or easy to implement, for example the onWhatever callbacks would need to add some kind of custom javascript (at which point the end user should override the template themself) but there's a subset that are straightforward and will meet most people's needs.
The other easily added props are as follows:
mode: 'tree' | 'text' | 'table'. Open the editor in 'tree' mode (default), 'table' mode, or 'text' mode (formerly: code mode).
mainMenuBar: boolean Show the main menu bar. Default value is true.
navigationBar: boolean Show the navigation bar with, where you can see the selected path and navigate through your document from there. Default value is true.
statusBar: boolean Show a status bar at the bottom of the 'text' editor, showing information about the cursor location and selected contents. Default value is true.
askToFormat: boolean When true (default), the user will be asked whether he/she wants to format the JSON document when a compact document is loaded or pasted in 'text' mode. Only applicable to 'text' mode.
readOnly: boolean The readonly property is dealt with in Editor remains editable in readonly mode #14 because that should be determined by the admin itself. In read-only mode: no changes can be made, non-relevant buttons are hidden from the menu, and the context menu is not enabled. Default value is false.
indentation: number | string Number of spaces use for indentation when stringifying JSON, or a string to be used as indentation like '\t' to use a tab as indentation, or ' ' to use 4 spaces (which is equivalent to configuring indentation: 4). See also property tabSize.
tabSize: number When indentation is configured as a tab character (indentation: '\t'), tabSize configures how large a tab character is rendered. Default value is 4. Only applicable to text mode.
escapeControlCharacters: boolean. False by default. When true, control characters like newline and tab are rendered as escaped characters \n and \t. Only applicable for 'tree' mode, in 'text' mode control characters are always escaped.
escapeUnicodeCharacters: boolean. False by default. When true, unicode characters like ☎ and 😀 are rendered escaped like \u260e and \ud83d\ude00.
flattenColumns: boolean. True by default. Only applicable to 'table' mode. When true, nested object properties will be displayed each in their own column, with the nested path as column name. When false, nested objects will be rendered inline, and double-clicking them will open them in a popup.
The text was updated successfully, but these errors were encountered:
Feature request
Use Case
I want to customize the editor in the ways that are made possible via the properties supplied to the svelte-jsoneditor.
Details
Not all the properties are relevant or easy to implement, for example the
onWhatever
callbacks would need to add some kind of custom javascript (at which point the end user should override the template themself) but there's a subset that are straightforward and will meet most people's needs.The other easily added props are as follows:
mode: 'tree' | 'text' | 'table'
. Open the editor in 'tree' mode (default), 'table' mode, or 'text' mode (formerly: code mode).mainMenuBar: boolean
Show the main menu bar. Default value is true.navigationBar: boolean
Show the navigation bar with, where you can see the selected path and navigate through your document from there. Default value is true.statusBar: boolean
Show a status bar at the bottom of the 'text' editor, showing information about the cursor location and selected contents. Default value is true.askToFormat: boolean
When true (default), the user will be asked whether he/she wants to format the JSON document when a compact document is loaded or pasted in 'text' mode. Only applicable to 'text' mode.readOnly: boolean
Thereadonly
property is dealt with in Editor remains editable in readonly mode #14 because that should be determined by the admin itself. In read-only mode: no changes can be made, non-relevant buttons are hidden from the menu, and the context menu is not enabled. Default value is false.indentation: number | string
Number of spaces use for indentation when stringifying JSON, or a string to be used as indentation like '\t' to use a tab as indentation, or ' ' to use 4 spaces (which is equivalent to configuring indentation: 4). See also property tabSize.tabSize: number
When indentation is configured as a tab character (indentation: '\t'), tabSize configures how large a tab character is rendered. Default value is 4. Only applicable to text mode.escapeControlCharacters: boolean
. False by default. When true, control characters like newline and tab are rendered as escaped characters \n and \t. Only applicable for 'tree' mode, in 'text' mode control characters are always escaped.escapeUnicodeCharacters: boolean
. False by default. When true, unicode characters like ☎ and 😀 are rendered escaped like \u260e and \ud83d\ude00.flattenColumns: boolean
. True by default. Only applicable to 'table' mode. When true, nested object properties will be displayed each in their own column, with the nested path as column name. When false, nested objects will be rendered inline, and double-clicking them will open them in a popup.The text was updated successfully, but these errors were encountered: