{"id":13732916,"url":"https://github.com/feddelegrand7/Rnightly","last_synced_at":"2025-05-08T09:31:15.055Z","repository":{"id":56142946,"uuid":"273803070","full_name":"feddelegrand7/Rnightly","owner":"feddelegrand7","description":"An R Wrapper of the JavaScript Library Nightly","archived":false,"fork":false,"pushed_at":"2020-12-12T11:26:22.000Z","size":4873,"stargazers_count":22,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-30T04:04:08.482Z","etag":null,"topics":["javascript","rstats","shiny"],"latest_commit_sha":null,"homepage":"","language":"R","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/feddelegrand7.png","metadata":{"files":{"readme":"README.Rmd","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"custom":["https://www.buymeacoffee.com/Fodil"]}},"created_at":"2020-06-20T23:53:49.000Z","updated_at":"2024-02-02T17:34:20.000Z","dependencies_parsed_at":"2022-08-15T13:31:02.978Z","dependency_job_id":null,"html_url":"https://github.com/feddelegrand7/Rnightly","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/feddelegrand7%2FRnightly","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/feddelegrand7%2FRnightly/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/feddelegrand7%2FRnightly/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/feddelegrand7%2FRnightly/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/feddelegrand7","download_url":"https://codeload.github.com/feddelegrand7/Rnightly/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253036412,"owners_count":21844211,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","rstats","shiny"],"created_at":"2024-08-03T03:00:35.502Z","updated_at":"2025-05-08T09:31:14.579Z","avatar_url":"https://github.com/feddelegrand7.png","language":"R","funding_links":["https://www.buymeacoffee.com/Fodil"],"categories":["Theming","R"],"sub_categories":["Theme Customization"],"readme":"---\noutput: github_document\n---\n\n\u003c!-- README.md is generated from README.Rmd. Please edit that file --\u003e\n\n```{r, include = FALSE}\nknitr::opts_chunk$set(\n  collapse = TRUE,\n  comment = \"#\u003e\",\n  fig.path = \"man/figures/README-\",\n  out.width = \"100%\"\n)\n```\n\n# Rnightly\n\n\u003c!-- badges: start --\u003e\n\n[![CRAN_Status_Badge](https://www.r-pkg.org/badges/version/Rnightly)](https://cran.r-project.org/package=Rnightly)\n\n[![CRAN_time_from_release](https://www.r-pkg.org/badges/ago/Rnightly)](https://cran.r-project.org/package=Rnightly)\n\n[![metacran downloads](https://cranlogs.r-pkg.org/badges/Rnightly)](https://cran.r-project.org/package=Rnightly)\n\n[![metacran downloads](https://cranlogs.r-pkg.org/badges/grand-total/Rnightly)](https://cran.r-project.org/package=Rnightly)\n\n[![license](https://img.shields.io/github/license/mashape/apistatus.svg)](https://choosealicense.com/licenses/mit/)\n\n\n[![Travis build status](https://travis-ci.com/feddelegrand7/Rnightly.svg?branch=master)](https://travis-ci.com/feddelegrand7/Rnightly)\n\n[![R badge](https://img.shields.io/badge/Build%20with-♥%20and%20R-red)](https://github.com/feddelegrand7/Rnightly)\n\n\n\u003c!-- badges: end --\u003e\n\nThe goal of `Rnightly` is to implement a Dark/Light toggle mode in your Shiny and RMarkdown user interface. You can also change the default behavior by specifying other colors. \n\n\n![](https://media.giphy.com/media/xUOwV2E6HhngCpYpWw/giphy.gif)\n\n\n\n\n## Installation\n\n\nYou can install the `Rnightly` package from [CRAN](https://CRAN.R-project.org/package=Rnightly) with: \n\n\n```{r, eval=FALSE}\n\ninstall.packages(\"Rnightly\")\n\n```\n\n\nYou can install the development version of `Rnightly` from Github with : \n\n```{r, eval=FALSE}\n# install.packages(\"remotes\")\n\nremotes::install_github(\"feddelegrand7/Rnightly\")\n\n\n```\n\n\nThe `Rnightly` package has two functions: \n\n+ `use_nightly()`: set this function anywhere within your ui. It activates the [nightly](https://github.com/Fcmam5/nightly.js?utm_campaign=The%20Stash\u0026utm_medium=email\u0026utm_source=Revue%20newsletter) JavaScript library. The function must be run only once. \n\n+ `nightly()`: activates the dark/light toggle mode. Look below for examples on how to use it. \n\n\n\n## Examples \n\n## 1.Shiny\n\n\nLet's create a basic shiny app that demonstrates the features of `Rnightly`. Here the `trigElement` will determine which shiny element will trigger the Dark/Light mode. Note that it's the only mandatory argument: \n\n\n\n\n```{r, eval=FALSE}\n\nlibrary(shiny)\nlibrary(Rnightly)\n\n\n\nui \u003c- fluidPage(\n  \n  use_nightly(), # Activating nightlyjs\n  \n  h3(\"Click on the button below to toggle between a Dark/Light mode\"), \n  \n  actionButton(inputId = \"btn\", label = \"Button\"), \n  \n  nightly(trigElement = \"btn\") # Make sure to provide the same id\n\n)\n\n\n\nserver \u003c- function(input, output){}\n\n\nshinyApp(ui, server)\n\n```\n\n![](man/figures/Rnightlyexample1.gif)\n\n\nYou can specify any Shiny element to toggle your Dark/Light mode, maybe a plot  ? \n\n\n```{r, eval=FALSE}\n\nlibrary(shiny)\nlibrary(Rnightly)\n\n\n\nui \u003c- fluidPage(\n  \n  use_nightly(), # Activating nightlyjs\n  \n  h3(\"Click on the Plot to toggle between a Dark/Light mode\"), \n  \n  plotOutput(outputId = \"plt\"), \n  \n  nightly(trigElement = \"plt\") \n\n)\n\n\n\nserver \u003c- function(input, output){\n  \n  \noutput$plt \u003c- renderPlot({\n  \n  \n  plot(mtcars)\n  \n})  \n  \n  \n}\n\n\nshinyApp(ui, server)\n\n```\n\n![](man/figures/Rnightlyexample2.gif)\n\n\nNow the cool part. Instead of Dark, using the `bodyColor` argument you can change the color that will be displayed when toggling: \n\n\n```{r, eval=FALSE}\n\nlibrary(shiny)\nlibrary(Rnightly)\n\n\n\nui \u003c- fluidPage(\n  \n  use_nightly(), \n  \n  h3(\"Click on the button below to toggle between a Purple/Light mode\"), \n  \n  actionButton(inputId = \"btn\", label = \"Button\"), \n  \n  nightly(trigElement = \"btn\", bodyColor = \"#6d6875\") \n  \n)\n\n\n\nserver \u003c- function(input, output){}\n\n\nshinyApp(ui, server)\n\n```\n\n\n![](man/figures/Rnightlyexample3.gif)\n\n\n\nYou can also change the text color when toggling : \n\n\n\n\n```{r, eval=FALSE}\n\nlibrary(shiny)\nlibrary(Rnightly)\n\n\n\nui \u003c- fluidPage(\n  \n  use_nightly(), \n  \n  h3(\"Click on the button below to toggle between a Purple/Light mode\"), \n  \n  actionButton(inputId = \"btn\", label = \"Button\"), \n  \n  nightly(trigElement = \"btn\", bodyColor = \"#6d6875\", txtColor = \"#fb5607\") \n  \n)\n\n\n\nserver \u003c- function(input, output){}\n\n\nshinyApp(ui, server)\n\n```\n\n![](man/figures/Rnightlyexample4.gif)\n\nFurther, you can set the Shiny inputs' text color that will be displayed after toggling : \n\n\n\n```{r, eval=FALSE}\n\nlibrary(shiny)\nlibrary(Rnightly)\n\n\n\nui \u003c- fluidPage(\n  \n  use_nightly(), \n  \n  h3(\"Click on the button below to toggle between a Purple/Light mode\"), \n  \n  actionButton(inputId = \"btn\", label = \"Button\"),\n  \n  br(), br(), br(), \n  \n  textInput(inputId = \"txt1\", label = \"Type some text here\"),\n  \n  nightly(trigElement = \"btn\", \n          bodyColor = \"#6d6875\", \n          txtColor = \"#fb5607\", \n          inpTxtColor = \"lightblue\") \n  \n)\n\n\n\nserver \u003c- function(input, output){}\n\n\nshinyApp(ui, server)\n\n```\n\n![](man/figures/Rnightlyexample5.gif)\n\nFinally, you can change the background color of Shiny inputs: \n\n\n```{r, eval=FALSE}\n\nlibrary(shiny)\nlibrary(Rnightly)\n\n\n\nui \u003c- fluidPage(\n  \n  use_nightly(), \n  \n  h3(\"Click on the button below to toggle between a Purple/Light mode\"), \n  \n  actionButton(inputId = \"btn\", label = \"Button\"),\n  \n  br(), br(), br(), \n  \n  textInput(inputId = \"txt1\", label = \"Type some text here\"),\n  \n  nightly(trigElement = \"btn\", \n          bodyColor = \"#6d6875\", \n          txtColor = \"#fb5607\", \n          inpTxtColor = \"lightblue\", \n          inpBgColor = \"#f07167\") \n\n)\n\n\n\nserver \u003c- function(input, output){}\n\n\nshinyApp(ui, server)\n\n```\n\n![](man/figures/Rnightlyexample6.gif)\n\n\n2. RMarkdown\n\n\nSimilarly, you can implement `Rnightly` in RMarkdown: \n\n![](man/figures/RN_example_Rmd.gif)\n\n\n## Code of Conduct\n\nPlease note that the Rnightly project is released with a [Contributor Code of Conduct](https://contributor-covenant.org/version/2/0/CODE_OF_CONDUCT.html). By contributing to this project, you agree to abide by its terms.\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffeddelegrand7%2FRnightly","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffeddelegrand7%2FRnightly","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffeddelegrand7%2FRnightly/lists"}