bslib (version 0.10.0)

input_code_editor: Code editor input

Description

Creates an interactive light-weight code editor input that can be used in Shiny applications. The editor provides syntax highlighting, line numbers, and other basic code editing features powered by Prism Code Editor. For a complete example, run shiny::runExample("code-editor", package = "bslib").

The editor value is not sent to R on every keystroke. Instead, updates are reflected on the server when the user moves away from the editor or when they press Ctrl/Cmd + Enter.

Note that this input is not designed for editing or rendering large files. Displaying files with 1,000 lines or more may lead to performance issues.

Usage

input_code_editor(
  id,
  label = NULL,
  value = "",
  ...,
  language = "plain",
  height = "auto",
  width = "100%",
  theme_light = "github-light",
  theme_dark = "github-dark",
  read_only = FALSE,
  line_numbers = NULL,
  word_wrap = NULL,
  tab_size = 2,
  indentation = c("space", "tab"),
  fill = TRUE
)
update_code_editor(
  id,
  ...,
  value = NULL,
  label = NULL,
  language = NULL,
  theme_light = NULL,
  theme_dark = NULL,
  read_only = NULL,
  line_numbers = NULL,
  word_wrap = NULL,
  tab_size = NULL,
  indentation = NULL,
  session = get_current_session()
)

Value

An HTML tag object that can be included in a Shiny UI.

Arguments

id

Input ID. Access the current value with input$<id>.

label

Display label for the input. Default is NULL for no label.

value

Code content. Default is an empty string.

...

Named arguments, e.g. class and style, that will be added to the outer container of the input.

language

Programming language for syntax highlighting. Supported languages include "r", "python", "julia", "sql", "javascript", "typescript", "html", "css", "scss", "sass", "json", "markdown", "yaml", "xml", "toml", "ini", "bash", "docker", "latex", "cpp", "rust", "diff", and "plain". Default is "plain".

height

CSS height of the editor. Default is "300px".

width

CSS width of the editor. Default is "100%".

theme_light, theme_dark

Theme to use in light or dark mode. Defaults to "github-light" and "github-dark", respectively. See the Theme section for more details.

read_only

Whether the editor should be read-only. Default is FALSE.

line_numbers

Whether to show line numbers. Default is TRUE, except for markdown and plain text.

word_wrap

Whether to wrap long lines, by default disabled when line_numbers is FALSE.

tab_size

Number of spaces per tab. Default is 2.

indentation

Type of indentation: "space" or "tab". Default is "space".

fill

Whether or not to allow the card to grow/shrink to fit a fillable container with an opinionated height (e.g., page_fillable()).

session

a shiny session object (the default should almost always be used).

Keyboard shortcuts

The editor supports the following keyboard shortcuts:

• Ctrl/Cmd+Enter: Submit the current code to R

• Ctrl/Cmd+Z: Undo

• Ctrl/Cmd+Shift+Z: Redo

• Tab: Indent selection

• Shift+Tab: Dedent selection

Themes

The editor automatically switches between theme_light and theme_dark when used with input_dark_mode(). Otherwise, the editor will use theme_light by default.

A variety of themes are available for use. The full list of bundled themes is: "atom-one-dark", "dracula", "github-dark-dimmed", "github-dark", "github-light", "night-owl-light", "night-owl", "prism-okaidia", "prism-solarized-light", "prism-tomorrow", "prism-twilight", "prism", "vs-code-dark", "vs-code-light".

See Also

Other input controls: input_dark_mode(), input_switch()

Examples

if (FALSE) { # rlang::is_interactive()
library(shiny)
library(bslib)

ui <- page_fluid(
  input_code_editor(
    "sql_query",
    value = "SELECT * FROM table",
    language = "sql"
  ),
  verbatimTextOutput("code_output")
)

server <- function(input, output, session) {
  output$code_output <- renderPrint({
    input$sql_query
  })
}

shinyApp(ui, server)
}