https://github.com/RinteRface/shinyNextUI
NextUI Design Kit for Shiny
https://github.com/RinteRface/shinyNextUI
nextui r react shiny tailwind
Last synced: 26 days ago
JSON representation
NextUI Design Kit for Shiny
- Host: GitHub
- URL: https://github.com/RinteRface/shinyNextUI
- Owner: RinteRface
- License: other
- Created: 2023-05-14T10:57:13.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2025-03-17T16:48:55.000Z (3 months ago)
- Last Synced: 2025-04-29T21:39:36.637Z (about 1 month ago)
- Topics: nextui, r, react, shiny, tailwind
- Language: CSS
- Homepage: https://rinterface.github.io/shinyNextUI/
- Size: 21.1 MB
- Stars: 37
- Watchers: 3
- Forks: 4
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Changelog: NEWS.md
- License: LICENSE
Awesome Lists containing this project
- awesome-nextui - shinyNextUI - NextUI Design Kit for Shiny (Uncategorized / Uncategorized)
- awesome-shiny-extensions - shinyNextUI - NextUI for Shiny. (Theming / Generic Theming)
- jimsghstars - RinteRface/shinyNextUI - NextUI Design Kit for Shiny (R)
README
# shinyNextUI
[](https://github.com/RinteRface/shinyNextUI/actions/workflows/R-CMD-check.yaml)
[](https://CRAN.R-project.org/package=shinyNextUI)
The goal of `{shinyNextUI}` is to provide a wrapper around the
HeroUI React [library](https://www.heroui.com/).
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://heroui.com/docs/customization/theme).
`{shinyNextUI}` leverages tailwind css and some [rules](https://github.com/RinteRface/shinyNextUI/blob/main/js/src/output.css) have already been pre-compiled to use in the various [examples](https://github.com/RinteRface/shinyNextUI/tree/main/inst/examples). If you need custom styles, you can use the [`{windy}`](https://github.com/devOpifex/windy) package.
## Installation
You can install the development version of `{shinyNextUI}` from [GitHub](https://github.com/) with:
``` r
# install.packages("devtools")
devtools::install_github("RinteRface/shinyNextUI")
```
## Example
To quickly get started with any example:
``` r
library(shinyNextUI)
# Get all examples
get_examples()
# Select an example and run the app
run_example("card")
```
## Developer
`{shinyNextUI}` leverages [tailwind](https://tailwindcss.com/) for the CSS management and [webpack](https://webpack.js.org/) as JS bundler and a mix between `{shiny.react}` and `{reactR}` for components and input management.
Within the `js` folder, run `npm install`. Then, for each change:
```shell
# Update CSS
npx tailwindcss -i ./src/input.css -o ./src/output.css --watch
# Change JS files
yarn webpack
```