diff --git a/NAMESPACE b/NAMESPACE index 11ac648..e382770 100644 --- a/NAMESPACE +++ b/NAMESPACE @@ -2,6 +2,7 @@ export(accordion) export(accordion_item) +export(actionButton) export(action_button) export(autocomplete) export(autocomplete_item) @@ -76,6 +77,7 @@ export(text_input) export(textarea_input) export(theme_switcher) export(tooltip) +export(updateActionButton) export(update_accordion) export(update_action_button) export(update_autocomplete) diff --git a/R/aliases.R b/R/aliases.R new file mode 100644 index 0000000..55b3d18 --- /dev/null +++ b/R/aliases.R @@ -0,0 +1,46 @@ +#' Action button +#' +#' This is a higher level wrapper of \link{action_button} to match +#' vanilla's Shiny syntax and parameters. +#' +#' @inheritParams shiny::actionButton +#' @param width Not used with NextUI but left for compatibility. +#' @export +#' +#' @example inst/examples/button/app.R +#' @seealso See \url{https://nextui.org/docs/components/button} +#' and \link{action_button} to get the list of possible parameters. +#' @rdname button +actionButton <- function(inputId, label, icon = NULL, width = NULL, ...) { + action_button( + inputId, + ..., + children = label, + startContent = icon, + width = width + ) +} + +#' Update an action button +#' +#' This is a higher level wrapper of \link{update_action_button} to match +#' vanilla's Shiny syntax and parameters. +#' +#' @inheritParams shiny::updateActionButton +#' @export +#' +#' @example inst/examples/button/app.R +#' @rdname button +updateActionButton <- function( + session = getDefaultReactiveDomain(), + inputId, + label = NULL, + icon = NULL +) { + update_action_button( + session, + inputId, + children = label, + startContent = icon + ) +} diff --git a/README.md b/README.md index d009321..8fef633 100644 --- a/README.md +++ b/README.md @@ -10,6 +10,20 @@ NextUI React [library](https://nextui.org/). ![](./man/figures/pkmn.png) +The app corresponding to the above screenshot is located [here](https://github.com/RinteRface/shinyNextUI/tree/main/inst/showcase). + +## Notes + +`{shinyNextUI}` is currently in alpha. Please carefully look at the current [issues](https://github.com/RinteRface/shinyNextUI/issues). + +The current roadmap: + +- Provide more aliases to match Shiny's vanilla notations like `selectInput`, ... +- Refine the navbar template. +- Allow to dynamically create [themes](https://nextui.org/docs/customization/theme). + +`{shinyNextUI}` leverages tailwind css. + ## Installation You can install the development version of `{shinyNextUI}` from [GitHub](https://github.com/) with: @@ -33,6 +47,8 @@ run_example("card") ## Developer +`{shinyNextUI}` leverages [tailwind](https://tailwindcss.com/) for the CSS management and [webpack](https://webpack.js.org/) as JS bundler. + Within the `js` folder, run `npm install`. Then, for each change: ```shell diff --git a/man/button.Rd b/man/button.Rd index 255710e..8a6a025 100644 --- a/man/button.Rd +++ b/man/button.Rd @@ -1,11 +1,22 @@ % Generated by roxygen2: do not edit by hand -% Please edit documentation in R/components.R, R/doc.R, R/inputs.R -\name{button} +% Please edit documentation in R/aliases.R, R/components.R, R/doc.R, R/inputs.R +\name{actionButton} +\alias{actionButton} +\alias{updateActionButton} \alias{button} \alias{action_button} \alias{update_action_button} -\title{button} +\title{Action button} \usage{ +actionButton(inputId, label, icon = NULL, width = NULL, ...) + +updateActionButton( + session = getDefaultReactiveDomain(), + inputId, + label = NULL, + icon = NULL +) + button(...) action_button(inputId, ..., value = default_value) @@ -13,19 +24,32 @@ action_button(inputId, ..., value = default_value) update_action_button(session = shiny::getDefaultReactiveDomain(), inputId, ...) } \arguments{ -\item{...}{Props to pass to the component. -The allowed props are listed below in the \bold{Details} section.} +\item{inputId}{The \code{input} slot that will be used to access the value.} -\item{inputId}{ID of the component.} +\item{label}{The contents of the button or link--usually a text label, but +you could also use any other HTML, like an image.} -\item{value}{Starting value.} +\item{icon}{An optional \code{\link[shiny:icon]{icon()}} to appear on the button.} + +\item{width}{Not used with NextUI but left for compatibility.} -\item{session}{Object passed as the \code{session} argument to Shiny server.} +\item{...}{Named attributes to be applied to the button or link.} + +\item{session}{The \code{session} object passed to function given to +\code{shinyServer}. Default is \code{getDefaultReactiveDomain()}.} + +\item{value}{Starting value.} } \value{ Object with \code{shiny.tag} class suitable for use in the UI of a Shiny app. } \description{ +This is a higher level wrapper of \link{action_button} to match +vanilla's Shiny syntax and parameters. + +This is a higher level wrapper of \link{update_action_button} to match +vanilla's Shiny syntax and parameters. + Buttons allow users to perform actions and choose with a single tap. } \details{ @@ -96,8 +120,71 @@ server <- function(input, output, session) { exportTestValues(n_click = n_click()) } +if (interactive() || is_testing()) shinyApp(ui, server) +library(shiny) +library(shinyNextUI) +library(shiny.react) + +ui <- nextui_page( + reactOutput("button") +) + +server <- function(input, output, session) { + n_click <- reactiveVal(0) + observeEvent(input$clicked, { + n_click(n_click() + 1) + }) + + output$button <- renderReact({ + action_button( + inputId = "clicked", + color = "primary", + shadow = TRUE, + sprintf( + "Test Button. You clicked: \%s times.", + n_click() + ) + ) + }) + + exportTestValues(n_click = n_click()) +} + +if (interactive() || is_testing()) shinyApp(ui, server) +library(shiny) +library(shinyNextUI) +library(shiny.react) + +ui <- nextui_page( + reactOutput("button") +) + +server <- function(input, output, session) { + n_click <- reactiveVal(0) + observeEvent(input$clicked, { + n_click(n_click() + 1) + }) + + output$button <- renderReact({ + action_button( + inputId = "clicked", + color = "primary", + shadow = TRUE, + sprintf( + "Test Button. You clicked: \%s times.", + n_click() + ) + ) + }) + + exportTestValues(n_click = n_click()) +} + if (interactive() || is_testing()) shinyApp(ui, server) } \seealso{ +See \url{https://nextui.org/docs/components/button} +and \link{action_button} to get the list of possible parameters. + See \url{https://nextui.org/docs/components/button}. }