withStates: Chakra component with states or hooks
In shinyChakraUI: A Wrapper of the 'React' Library 'Chakra UI' for 'Shiny'

Description Usage Arguments Value Examples

Create a Chakra component with React states and/or hooks.

1	withStates(component, states)

`component`	a React component
`states`	named list of states; a state value can be an R object serializable to JSON, a React component (`Tag$Component(...)`), a Shiny widget, some HTML code defined by the `HTML` function, a JSX element defined by the `jsx` function, a JavaScript value defined by the `jseval` function, or a hook such as `useDisclosure()` (see `useDisclosure`).

A component to use in chakraComponent.

library(shiny)
library(shinyChakraUI)

ui <- chakraPage(

  br(),

  chakraComponent(
    "mycomponent",

    withStates(

      Tag$Fragment(

        Tag$Container(
          maxW = "xl",
          centerContent = TRUE,
          bg = "orange.50",
          Tag$Heading(
            getState("heading")
          ),
          Tag$Text(
            "I'm just some text."
          )
        ),

        br(),
        Tag$Divider(),
        br(),

        Tag$Button(
          colorScheme = "twitter",
          display = "block",
          onClick = jseval(
            "() => setState('heading', 'I am the new heading.')"
          ),
          "Click me to change the heading"
        )

      ),

      states = list(heading = "I am the heading.")

    )

  )

)

server <- function(input, output, session){}

if(interactive()){
  shinyApp(ui, server)
}