Skip to content

use reactR shiny inputs without a package #97

@timelyportfolio

Description

@timelyportfolio

Just hacking around here, and I wondered if anyone would have interest in seeing how we might use reactR with Shiny inputs not housed in a package. Here is an ugly quick example:

library(shiny)
library(reactR)

ui <- tagList(
  tags$script(HTML(
"
  const CounterInput = ({ configuration, value, setValue }) => {
    return React.createElement(
      'div',
      configuration,
      // bad idea since not accessible, but add some span to decrement/increment counter
      [
        React.createElement('span',{style: {backgroundColor: 'red'}, onClick: (evt) => {setValue(value - 1)}},'-'),
        value,
        React.createElement('span',{style: {backgroundColor: 'green'},onClick: (evt) => {setValue(value + 1)}},'+')
      ]
    )
  };
  reactR.reactShinyInput('.counter', 'counter', CounterInput); 
"    
  )),
  createReactShinyInput(
    inputId = "testcounter",
    class = "counter",
    dependencies = list(list()), # fake dependency since we will define in script
    configuration = list(),
    default = 0
  )
)

server <- function(input, output, session) {
  # # if we wanted to make a counter we could uncomment below
  # observe({
  #   invalidateLater(1000, session)
  #   session$sendInputMessage(
  #     'testcounter',
  #     list(
  #       value = isolate(input$testcounter) + 1,
  #       # for fun make the font size bigger as we count up
  #       configuration = list(style = list(fontSize = paste0(isolate(input$testcounter) + 1, "em")))
  #     )
  #   )
  # })
}

shinyApp(ui, server)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions