Showing preview only (620K chars total). Download the full file or copy to clipboard to get everything.
Repository: react-R/reactR
Branch: master
Commit: 808b21f4f2e5
Files: 107
Total size: 585.6 KB
Directory structure:
gitextract_1rmdkxph/
├── .Rbuildignore
├── .gitattributes
├── .github/
│ ├── .gitignore
│ └── workflows/
│ └── R-CMD-check.yaml
├── .gitignore
├── CONDUCT.md
├── DESCRIPTION
├── LICENSE
├── NAMESPACE
├── NEWS.md
├── R/
│ ├── babel.R
│ ├── dependencies.R
│ ├── meta.R
│ ├── reacttools.R
│ ├── scaffold_input.R
│ ├── scaffold_utils.R
│ └── scaffold_widget.R
├── README.Rmd
├── README.md
├── buildupdate/
│ └── getreact.R
├── cran-comments.md
├── docs/
│ ├── 404.html
│ ├── CONDUCT.html
│ ├── LICENSE-text.html
│ ├── articles/
│ │ ├── index.html
│ │ ├── intro_htmlwidgets.html
│ │ ├── intro_htmlwidgets_files/
│ │ │ └── accessible-code-block-0.0.1/
│ │ │ └── empty-anchor.js
│ │ ├── intro_inputs.html
│ │ ├── intro_inputs_files/
│ │ │ └── accessible-code-block-0.0.1/
│ │ │ └── empty-anchor.js
│ │ ├── intro_reactR.html
│ │ └── intro_reactR_files/
│ │ ├── accessible-code-block-0.0.1/
│ │ │ └── empty-anchor.js
│ │ ├── react-16.12.0/
│ │ │ ├── AUTHORS
│ │ │ └── LICENSE.txt
│ │ ├── react-16.7.0/
│ │ │ ├── AUTHORS
│ │ │ └── LICENSE.txt
│ │ ├── react-16.8.1/
│ │ │ ├── AUTHORS
│ │ │ └── LICENSE.txt
│ │ ├── react-16.8.6/
│ │ │ ├── AUTHORS
│ │ │ └── LICENSE.txt
│ │ ├── react-17.0.0/
│ │ │ ├── AUTHORS
│ │ │ └── LICENSE.txt
│ │ └── react-18.2.0/
│ │ ├── AUTHORS
│ │ └── LICENSE.txt
│ ├── authors.html
│ ├── bootstrap-toc.css
│ ├── bootstrap-toc.js
│ ├── docsearch.css
│ ├── docsearch.js
│ ├── index.html
│ ├── news/
│ │ └── index.html
│ ├── pkgdown.css
│ ├── pkgdown.js
│ ├── pkgdown.yml
│ ├── reference/
│ │ ├── React.html
│ │ ├── babel_transform.html
│ │ ├── component.html
│ │ ├── createReactShinyInput.html
│ │ ├── html_dependency_corejs.html
│ │ ├── html_dependency_mobx.html
│ │ ├── html_dependency_react.html
│ │ ├── html_dependency_reacttools.html
│ │ ├── index.html
│ │ ├── reactMarkup.html
│ │ ├── scaffoldReactShinyInput.html
│ │ └── scaffoldReactWidget.html
│ └── sitemap.xml
├── inst/
│ ├── examples/
│ │ ├── antd.R
│ │ └── office-fabric.R
│ ├── templates/
│ │ ├── input_app.R.txt
│ │ ├── input_js.txt
│ │ ├── input_r.txt
│ │ ├── package.json.txt
│ │ ├── webpack.config.js.txt
│ │ ├── widget_app.R.txt
│ │ ├── widget_js.txt
│ │ ├── widget_r.txt
│ │ └── widget_yaml.txt
│ └── www/
│ ├── core-js/
│ │ ├── LICENSE
│ │ └── package.json
│ ├── mobx/
│ │ ├── LICENSE
│ │ ├── mobx-react-lite.js
│ │ ├── mobx-react.umd.js
│ │ └── package.json
│ ├── react/
│ │ ├── AUTHORS
│ │ └── LICENSE.txt
│ └── react-tools/
│ └── react-tools.js
├── js-tests/
│ └── react-tools.test.jsx
├── man/
│ ├── React.Rd
│ ├── babel_transform.Rd
│ ├── component.Rd
│ ├── createReactShinyInput.Rd
│ ├── html_dependency_corejs.Rd
│ ├── html_dependency_mobx.Rd
│ ├── html_dependency_react.Rd
│ ├── html_dependency_reacttools.Rd
│ ├── reactMarkup.Rd
│ ├── scaffoldReactShinyInput.Rd
│ └── scaffoldReactWidget.Rd
├── package.json
├── reactR.Rproj
├── srcjs/
│ ├── input.js
│ ├── react-tools.js
│ └── widget.js
├── vignettes/
│ ├── intro_htmlwidgets.Rmd
│ ├── intro_inputs.Rmd
│ └── intro_reactR.Rmd
└── vite.config.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .Rbuildignore
================================================
^CRAN-RELEASE$
^node_modules$
^js-tests$
^srcjs$
^pkgdown$
^assets$
^.*\.Rproj$
^CONDUCT\.md$
^README\.Rmd$
^\.Rproj\.user$
^buildupdate$
^docs$
^cran-comments\.md$
^logo.svg$
^package\.json$
^vite\.config\.js$
^package-lock\.json$
^logo\.svg$
^\.github$
^CRAN-SUBMISSION$
================================================
FILE: .gitattributes
================================================
/inst/www/react-tools/react-tools.js binary
/inst/www/react-tools/react-tools.js.map binary
================================================
FILE: .github/.gitignore
================================================
*.html
================================================
FILE: .github/workflows/R-CMD-check.yaml
================================================
# Workflow derived from https://github.com/r-lib/actions/tree/v2/examples
# Need help debugging build failures? Start at https://github.com/r-lib/actions#where-to-find-help
on:
push:
branches: [main, master]
pull_request:
branches: [main, master]
name: R-CMD-check
jobs:
R-CMD-check:
runs-on: ${{ matrix.config.os }}
name: ${{ matrix.config.os }} (${{ matrix.config.r }})
strategy:
fail-fast: false
matrix:
config:
- {os: macos-latest, r: 'release'}
- {os: windows-latest, r: 'release'}
- {os: ubuntu-latest, r: 'devel', http-user-agent: 'release'}
- {os: ubuntu-latest, r: 'release'}
- {os: ubuntu-latest, r: 'oldrel-1'}
env:
GITHUB_PAT: ${{ secrets.GITHUB_TOKEN }}
R_KEEP_PKG_SOURCE: yes
steps:
- uses: actions/checkout@v3
- uses: r-lib/actions/setup-pandoc@v2
- uses: r-lib/actions/setup-r@v2
with:
r-version: ${{ matrix.config.r }}
http-user-agent: ${{ matrix.config.http-user-agent }}
use-public-rspm: true
- uses: r-lib/actions/setup-r-dependencies@v2
with:
extra-packages: any::rcmdcheck
needs: check
- uses: r-lib/actions/check-r-package@v2
with:
upload-snapshots: true
================================================
FILE: .gitignore
================================================
Meta
doc
.Rproj.user
.Rhistory
.RData
.Ruserdata
inst/doc
node_modules
reactR.Rcheck
reactR_*.tar.gz
*.swp
.DS_Store
================================================
FILE: CONDUCT.md
================================================
# Contributor Code of Conduct
As contributors and maintainers of this project, we pledge to respect all people who
contribute through reporting issues, posting feature requests, updating documentation,
submitting pull requests or patches, and other activities.
We are committed to making participation in this project a harassment-free experience for
everyone, regardless of level of experience, gender, gender identity and expression,
sexual orientation, disability, personal appearance, body size, race, ethnicity, age, or religion.
Examples of unacceptable behavior by participants include the use of sexual language or
imagery, derogatory comments or personal attacks, trolling, public or private harassment,
insults, or other unprofessional conduct.
Project maintainers have the right and responsibility to remove, edit, or reject comments,
commits, code, wiki edits, issues, and other contributions that are not aligned to this
Code of Conduct. Project maintainers who do not follow the Code of Conduct may be removed
from the project team.
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by
opening an issue or contacting one or more of the project maintainers.
This Code of Conduct is adapted from the Contributor Covenant
(http:contributor-covenant.org), version 1.0.0, available at
http://contributor-covenant.org/version/1/0/0/
================================================
FILE: DESCRIPTION
================================================
Package: reactR
Type: Package
Title: React Helpers
Version: 0.6.1
Date: 2024-09-14
Authors@R: c(
person(
"Facebook", "Inc"
, role = c("aut", "cph")
, comment = "React library in lib, https://reactjs.org/; see AUTHORS for full list of contributors"
),
person(
"Michel","Weststrate",
, role = c("aut", "cph")
, comment = "mobx library in lib, https://github.com/mobxjs"
),
person(
"Kent", "Russell"
, role = c("aut", "cre")
, comment = "R interface"
, email = "kent.russell@timelyportfolio.com"
),
person(
"Alan", "Dipert"
, role = c("aut")
, comment = "R interface"
, email = "alan@rstudio.com"
),
person(
"Greg", "Lin"
, role = c("aut")
, comment = "R interface"
, email = "glin@glin.io"
)
)
Maintainer: Kent Russell <kent.russell@timelyportfolio.com>
Description: Make it easy to use 'React' in R with 'htmlwidget' scaffolds,
helper dependency functions, an embedded 'Babel' 'transpiler',
and examples.
URL: https://github.com/react-R/reactR
BugReports: https://github.com/react-R/reactR/issues
License: MIT + file LICENSE
LazyData: TRUE
Encoding: UTF-8
Imports:
htmltools
Suggests:
htmlwidgets (>= 1.5.3),
rmarkdown,
shiny,
V8,
knitr,
usethis,
jsonlite
RoxygenNote: 7.3.2
VignetteBuilder: knitr
================================================
FILE: LICENSE
================================================
YEAR: 2018
COPYRIGHT HOLDER: Kent Russell
================================================
FILE: NAMESPACE
================================================
# Generated by roxygen2: do not edit by hand
S3method("$",react_component_builder)
S3method("$<-",react_component_builder)
S3method("[[",react_component_builder)
S3method("[[<-",react_component_builder)
export(React)
export(babel_transform)
export(component)
export(createReactShinyInput)
export(html_dependency_corejs)
export(html_dependency_mobx)
export(html_dependency_react)
export(html_dependency_reacttools)
export(reactMarkup)
export(scaffoldReactShinyInput)
export(scaffoldReactWidget)
importFrom(htmltools,htmlDependency)
================================================
FILE: NEWS.md
================================================
# reactR 0.6.1
* Fix issue where the `react-tools.umd.cjs` script could be blocked by the browser in some cases, such as apps deployed on shinyapps.io [#86](https://github.com/react-R/reactR/issues/86)
# reactR 0.6.0
* retain `list` in `reactR::component` classes [#82](https://github.com/react-R/reactR/issues/82)
* hydrate props/attribs that are tags assuming tag-like props/attribs should be slots[#67](https://github.com/react-R/reactR/issues/67) [#61](https://github.com/react-R/reactR/issues/61)
* update build tools to `vite` from `webpack`
* update js testing library from `karma` to `vitest`
# reactR 0.5.0
* Update react to `18.2.0`
# reactR 0.4.4
* Update react to `16.12.0`
* Add `style-loader` and `css-loader` to webpack config [pull 50](https://github.com/react-R/reactR/pull/50)
* Update to `PACKAGE::widget_html.WIDGETNAME` for new `htmlwidgets` convention [pull 49](https://github.com/react-R/reactR/pull/49)
* Clean up template [pull 45](https://github.com/react-R/reactR/pull/45)
# reactR 0.4.3
* Add element to Shiny input [pull 41](https://github.com/react-R/reactR/pull/41)
* Upgrade npm dependencies
# reactR 0.4.2
* Update react to `16.12.0`
* Update core-js to `2.6.11`
# reactR 0.4.1
* Add support for `shiny::registerInputHandler` in Shiny inputs; [pull 28](https://github.com/react-R/reactR/pull/28)
* Add support for Shiny rate limit [pull 29](https://github.com/react-R/reactR/pull/29)
* Update react to `16.8.6`
* Add `mobx` dependencies available through `html_dependency_mobx()`
# reactR 0.4.0
* Add Shiny input scaffold and functionality; [tutorial](https://react-r.github.io/reactR/articles/intro_inputs.html) and [pull 22](https://github.com/react-R/reactR/pull/22) thanks @alandipert
# reactR 0.3.1
* Update react and react-dom to 16.8.1
* Add `usethis` R dependency
* Ignore node_modules in `.Rbuildignore` and `.gitignore`
* Set `{modules:false}` in `babel_transform` to avoid `"use strict"`; [pull 15](https://github.com/react-R/reactR/pull/15)
* Use webpack to build `react-tools.js`; [pull 16](https://github.com/react-R/reactR/pull/16)
* Attach component to the htmlwidget
# reactR 0.3.0
* Add htmlwidget scaffold and helpers (see [tutorial](https://react-r.github.io/reactR/articles/intro_htmlwidgets.html))
* Update react and react-dom to 16.6.7
# reactR 0.2.1
* Update react and react-dom to 16.6.0
# reactR 0.2.0
* Update react and react-dom to 16.2.0
* Add core-js shim so that React will show up in RStudio Viewer
# reactR 0.1.4
* Update react and react-dom to 16.1.1
# reactR 0.1.3
* Update react and react-dom to 16.0.0
* Update babel to 6.26.0
# reactR 0.1.2
* Update to react `15.5.0`
* Update to babel `6.24.0`
* Add fluent-ui(fabric) example
* Build doc site with `pkgdown`
# reactR 0.1.1
* Added a `NEWS.md` file to track changes to the package.
* Provide offline babel-standalone for babel_transform
# reactR 0.1.0
* Initial release
================================================
FILE: R/babel.R
================================================
#' Transform Code with Babel
#'
#' Helper function to use \code{V8} with \code{Babel} so we can
#' avoid a JSX transformer with using \code{reactR}.
#'
#' @param code \code{character}
#'
#' @return transformed \code{character}
#' @export
#'
#' @examples
#' \dontrun{
#' library(reactR)
#' babel_transform('<div>react div</div>')
#' }
babel_transform <- function(code=""){
stopifnot(requireNamespace("V8"), is.character(code))
ctx <- V8::v8()
ctx$source(
system.file(
"www/babel/babel.min.js",
package = "reactR"
)
)
ctx$assign('code', code)
ctx$get('Babel.transform(code,{ presets: [["es2015", {modules: false}],"react"] }).code')
}
================================================
FILE: R/dependencies.R
================================================
#' Dependencies for React
#'
#' Add JavaScript 'React' dependency. For this to work in RStudio Viewer, also include
#' \code{\link{html_dependency_corejs}}.
#'
#' @param offline \code{logical} to use local file dependencies. If \code{FALSE},
#' then the dependencies use the Facebook cdn as its \code{src}.
#' To use with \code{JSX} see \code{\link{babel_transform}}.
#'
#' @return \code{\link[htmltools]{htmlDependency}}
#' @importFrom htmltools htmlDependency
#' @export
#'
#' @examples
#' library(reactR)
#' library(htmltools)
#'
#' tagList(
#' tags$script(
#' "
#' ReactDOM.render(
#' React.createElement(
#' 'h1',
#' null,
#' 'Powered by React'
#' ),
#' document.body
#' )
#' "
#' ),
#' #add core-js first to work in RStudio Viewer
#' html_dependency_corejs(),
#' html_dependency_react() #offline=FALSE for CDN
#' )
html_dependency_react <- function(offline=TRUE){
hd <- htmltools::htmlDependency(
name = "react",
version = react_version(),
src = system.file("www/react",package="reactR"),
script = c("react.min.js", "react-dom.min.js")
)
if(!offline) {
hd$src <- list(href="//unpkg.com")
hd$script <- c(
"react/umd/react.production.min.js",
"react-dom/umd/react-dom.production.min.js"
)
}
hd
}
#' Shim Dependency for React in RStudio Viewer
#'
#' Add this first for 'React' to work in RStudio Viewer.
#'
#' @return \code{\link[htmltools]{htmlDependency}}
#' @importFrom htmltools htmlDependency
#' @export
html_dependency_corejs <- function() {
#shim/polyfill for ES5 and ES6 so react will show up in RStudio Viewer
#https://unpkg.com/core-js@2.5.3/
htmltools::htmlDependency(
name = "core-js",
version = "2.5.3",
src = c(file=system.file("www/core-js/", package="reactR")),
script = "shim.min.js"
)
}
#' Adds window.reactR.exposeComponents and window.reactR.hydrate
#'
#' @return \code{\link[htmltools]{htmlDependency}}
#' @importFrom htmltools htmlDependency
#' @export
html_dependency_reacttools <- function(){
htmltools::htmlDependency(
name = "reactwidget",
src = "www/react-tools",
version = "2.0.0",
package = "reactR",
script = c("react-tools.js")
)
}
#' Dependencies for 'mobx'
#'
#' Add JavaScript 'mobx' and 'mobx-react' dependency. When using with 'react', the order
#' of the dependencies is important, so please add \code{html_dependency_react()} before
#' \code{html_dependency_mobx()}.
#'
#' @param react \code{logical} to add react 'mobx' dependencies.
#'
#' @return \code{\link[htmltools]{htmlDependency}}
#' @importFrom htmltools htmlDependency
#' @export
#'
#' @examples
#' if(interactive()) {
#'
#' library(htmltools)
#' library(reactR)
#'
#' browsable(
#' tagList(
#' html_dependency_mobx(react = FALSE),
#' div(id="test"),
#' tags$script(HTML(
#' "
#' var obs = mobx.observable({val: null})
#' mobx.autorun(function() {
#' document.querySelector('#test').innerText = obs.val
#' })
#' setInterval(
#' function() {obs.val++},
#' 1000
#' )
#' "
#' ))
#' )
#' )
#' }
#'
#' \dontrun{
#' # use with react
#' library(htmltools)
#' library(reactR)
#'
#' browsable(
#' tagList(
#' html_dependency_react(),
#' html_dependency_mobx(),
#' div(id="test"),
#' tags$script(HTML(babel_transform(
#' "
#' var obs = mobx.observable({val: null})
#' var App = mobxReact.observer((props) => <div>{props.obs.val}</div>)
#'
#' ReactDOM.render(<App obs = {obs}/>, document.querySelector('#test'))
#'
#' setInterval(
#' function() {obs.val++},
#' 1000
#' )
#' "
#' )))
#' )
#' )
#' }
html_dependency_mobx <- function(react = TRUE){
hd <- htmltools::htmlDependency(
name = "mobx",
version = "4.11.0",
src = system.file("www/mobx",package="reactR"),
script = c("mobx.umd.min.js")
)
if(react) {
hd$script <- c(hd$script,"mobx-react-lite.js", "mobx-react.umd.js")
}
hd
}
================================================
FILE: R/meta.R
================================================
#'@keywords internal
react_version <- function(){'18.2.0'}
babel_version <- function(){'6.26.0'}
================================================
FILE: R/reacttools.R
================================================
# A robust name string is a valid
# - CSS class
# - JavaScript variable name
# - R variable name
robustName <- "^[[:alpha:]_][[:alnum:]_]*$"
isUpper <- function(s) {
grepl("^[[:upper:]]+$", s)
}
#' Create a React component
#'
#' @param name Name of the React component, which must start with an upper-case
#' character.
#' @param varArgs Attributes and children of the element to pass along to
#' \code{\link[htmltools]{tag}} as \code{varArgs}.
#'
#' @return An htmltools \code{\link[htmltools]{tag}} object
#' @export
#'
#' @examples
#' component("ParentComponent",
#' list(
#' x = 1,
#' y = 2,
#' component("ChildComponent"),
#' component("OtherChildComponent")
#' )
#' )
component <- function(name, varArgs = list()) {
if (length(name) == 0 || !isUpper(substring(name, 1, 1))) {
stop("Component name must be specified and start with an upper case character")
}
component <- htmltools::tag(name, varArgs)
structure(component, class = c("reactR_component", oldClass(component), "list"))
}
#' React component builder.
#'
#' \code{React} is a syntactically-convenient way to create instances of React
#' components that can be sent to the browser for display. It is a list for
#' which \link[=InternalMethods]{extract methods} are defined, allowing
#' object creation syntax like \code{React$MyComponent(x = 1)} where
#' \code{MyComponent} is a React component you have exposed to Shiny in
#' JavaScript.
#'
#' Internally, the \code{\link{component}} function is used to create the
#' component instance.
#'
#' @examples
#' # Create an instance of ParentComponent with two children,
#' # ChildComponent and OtherChildComponent.
#' React$ParentComponent(
#' x = 1,
#' y = 2,
#' React$ChildComponent(),
#' React$OtherChildComponent()
#' )
#' @export
React <- structure(
list(),
class = "react_component_builder"
)
#' @export
`$.react_component_builder` <- function(x, name) {
function(...) {
component(name, list(...))
}
}
#' @export
`[[.react_component_builder` <- `$.react_component_builder`
#' @export
`$<-.react_component_builder` <- function(x, name, value) {
stop("Assigning to a component constructor is not allowed")
}
#' @export
`[[<-.react_component_builder` <- `$<-.react_component_builder`
#' Prepare data that represents a single-element character vector, a React
#' component, or an htmltools tag for sending to the client.
#'
#' Tag lists as returned by \code{htmltools tagList} are not currently
#' supported.
#'
#' @param tag character vector or React component or
#' \code{\link[htmltools]{tag}}
#'
#' @return A reactR markup object suitable for being passed to
#' \code{\link[htmlwidgets]{createWidget}} as widget instance data.
#' @export
reactMarkup <- function(tag) {
stopifnot(inherits(tag, "shiny.tag")
|| (is.character(tag) && length(tag) == 1))
list(tag = tag, class = "reactR_markup")
}
#' Create a React-based input
#'
#' @param inputId The \code{input} slot that will be used to access the value.
#' @param class Space-delimited list of CSS class names that should identify
#' this input type in the browser.
#' @param dependencies HTML dependencies to include in addition to those
#' supporting React. Must contain at least one dependency, that of the input's
#' implementation.
#' @param default Initial value.
#' @param configuration Static configuration data.
#' @param container Function to generate an HTML element to contain the input.
#'
#' @return Shiny input suitable for inclusion in a UI.
#' @export
#'
#' @examples
#' myInput <- function(inputId, default = "") {
#' # The value of createReactShinyInput should be returned from input constructor functions.
#' createReactShinyInput(
#' inputId,
#' "myinput",
#' # At least one htmlDependency must be provided -- the JavaScript implementation of the input.
#' htmlDependency(
#' name = "my-input",
#' version = "1.0.0",
#' src = "www/mypackage/myinput",
#' package = "mypackage",
#' script = "myinput.js"
#' ),
#' default
#' )
#' }
createReactShinyInput <- function(inputId,
class,
dependencies,
default = NULL,
configuration = list(),
container = htmltools::tags$div) {
if(length(dependencies) < 1) stop("Must include at least one HTML dependency.")
value <- shiny::restoreInput(id = inputId, default = default)
htmltools::tagList(
html_dependency_corejs(),
html_dependency_react(),
html_dependency_reacttools(),
container(id = inputId, class = class),
htmltools::tags$script(id = sprintf("%s_value", inputId),
type = "application/json",
jsonlite::toJSON(value, auto_unbox = TRUE, null = "null", force = TRUE)),
htmltools::tags$script(id = sprintf("%s_configuration", inputId),
type = "application/json",
jsonlite::toJSON(configuration, auto_unbox = TRUE, null = "null", force = TRUE)),
dependencies
)
}
================================================
FILE: R/scaffold_input.R
================================================
#' Create implementation scaffolding for a React.js-based Shiny input.
#'
#' Add the minimal code required to implement a React.js-based Shiny input to an
#' R package.
#'
#' @param name Name of input
#' @param npmPkgs Optional \href{https://www.npmjs.com/}{NPM} packages upon which
#' this input is based which will be used to populate \code{package.json}.
#' Should be a named list of names to
#' \href{https://docs.npmjs.com/files/package.json/}{versions}.
#' @param edit Automatically open the input's source files after creating the
#' scaffolding.
#'
#' @note This function must be executed from the root directory of the package
#' you wish to add the input to.
#'
#' @export
scaffoldReactShinyInput <- function(name, npmPkgs = NULL, edit = interactive()) {
assertNameValid(name)
package <- getPackage()
file <- renderFile(
sprintf("R/%s.R", name),
"templates/input_r.txt",
"boilerplate for input constructor",
list(
name = name,
capName = capitalize(name),
package = package
)
)
if (edit) fileEdit(file)
renderFile(
'package.json',
'templates/package.json.txt',
'project metadata',
list(npmPkgs = toDepJSON(npmPkgs))
)
renderFile(
'webpack.config.js',
'templates/webpack.config.js.txt',
'webpack configuration',
list(
name = name,
outputPath = sprintf("inst/www/%s/%s", package, name)
)
)
renderFile(
sprintf('srcjs/%s.jsx', name),
'templates/input_js.txt',
'JavaScript implementation',
list(
name = name,
package = package
)
)
renderFile(
'app.R',
'templates/input_app.R.txt',
'example app',
list(
name = name,
package = package
)
)
usethis::use_build_ignore(c("node_modules", "srcjs", "app.R", "package.json", "webpack.config.js", "yarn.lock"))
usethis::use_git_ignore(c("node_modules"))
lapply(c("htmltools", "shiny", "reactR"), usethis::use_package)
message("To install dependencies from npm run: yarn install")
message("To build JavaScript run: yarn run webpack --mode=development")
}
================================================
FILE: R/scaffold_utils.R
================================================
slurp <- function(file) {
paste(readLines(
system.file(file, package = 'reactR')
), collapse = "\n")
}
# invoke file.edit in a way that will bind to the RStudio editor
# when running inside RStudio
fileEdit <- function(file) {
fileEditFunc <- eval(parse(text = "file.edit"), envir = globalenv())
fileEditFunc(file)
}
# Perform a series of pattern replacements on str.
# Example: renderTemplate("foo ${x} bar ${y} baz ${x}", list(x = 1, y = 2))
# Produces: "foo 1 bar 2 baz 1"
renderTemplate <- function(str, substitutions) {
Reduce(function(str, name) {
gsub(paste0("\\$\\{", name, "\\}"), substitutions[[name]], str)
}, names(substitutions), str)
}
capitalize <- function(s) {
gsub("^(.)", perl = TRUE, replacement = '\\U\\1', s)
}
toDepJSON <- function(npmPkgs) {
if (is.null(npmPkgs)) {
""
} else if (!length(names(npmPkgs))) {
stop("Must specify npm package names in the names attributes of npmPkgs")
} else {
paste0(sprintf('"%s": "%s"', names(npmPkgs), npmPkgs), collapse = ",\n")
}
}
# Wraps renderTemplate for convenient use from scaffold functions.
renderFile <- function(outputFile, templateFile, description = '', substitutions = list()) {
if (!file.exists(outputFile)) {
dir.create(dirname(outputFile), recursive = TRUE, showWarnings = FALSE)
cat(renderTemplate(slurp(templateFile), substitutions), file = outputFile)
message("Created ", description, " ", outputFile)
} else {
message(outputFile, " already exists")
}
outputFile
}
getPackage <- function() {
if (!file.exists('DESCRIPTION')) {
stop("The current directory doesn't contain a package. You're either in the wrong directory, or need to create a package to house your widget.", call. = FALSE)
}
read.dcf('DESCRIPTION')[[1,"Package"]]
}
# Constraining names prevents the user from encountering obscure CSS problems
# and JavaScript errors after scaffolding.
assertNameValid <- function(name) {
if (!grepl(robustName, name)) {
msg <- sprintf("Name '%s' is invalid, names must begin with an alphabetic character and must contain only alphabetic and numeric characters", name)
stop(msg, call. = FALSE)
}
}
================================================
FILE: R/scaffold_widget.R
================================================
#' Create implementation scaffolding for a React.js-based HTML widget
#'
#' Add the minimal code required to implement a React.js-based HTML widget to an
#' R package.
#'
#' @param name Name of widget
#' @param npmPkgs Optional \href{https://www.npmjs.com/}{NPM} packages upon which
#' this widget is based which will be used to populate \code{package.json}.
#' Should be a named list of names to
#' \href{https://docs.npmjs.com/files/package.json/}{versions}.
#' @param edit Automatically open the widget's JavaScript source file after
#' creating the scaffolding.
#'
#' @note This function must be executed from the root directory of the package
#' you wish to add the widget to.
#'
#' @export
scaffoldReactWidget <- function(name, npmPkgs = NULL, edit = interactive()){
assertNameValid(name)
package <- getPackage()
addWidgetConstructor(name, package, edit)
addWidgetYAML(name, edit)
addPackageJSON(toDepJSON(npmPkgs))
addWebpackConfig(name)
addWidgetJS(name, edit)
addExampleApp(name)
usethis::use_build_ignore(c("node_modules", "srcjs", "app.R", "package.json", "webpack.config.js", "yarn.lock"))
usethis::use_git_ignore(c("node_modules"))
lapply(c("htmltools", "htmlwidgets", "reactR"), usethis::use_package)
message("To install dependencies from npm run: yarn install")
message("To build JavaScript run: yarn run webpack --mode=development")
}
addWidgetConstructor <- function(name, package, edit){
file <- renderFile(
sprintf("R/%s.R", name),
"templates/widget_r.txt",
"boilerplate for widget constructor",
list(
name = name,
package = package,
capName = capitalize(name)
)
)
if (edit) fileEdit(file)
}
addWidgetYAML <- function(name, edit){
file <- renderFile(
sprintf('inst/htmlwidgets/%s.yaml', name),
"templates/widget_yaml.txt",
"boilerplate for widget dependencies"
)
if (edit) fileEdit(file)
}
addPackageJSON <- function(npmPkgs) {
renderFile(
'package.json',
'templates/package.json.txt',
'project metadata',
list(npmPkgs = npmPkgs)
)
}
addWebpackConfig <- function(name) {
renderFile(
'webpack.config.js',
'templates/webpack.config.js.txt',
'webpack configuration',
list(
name = name,
outputPath = 'inst/htmlwidgets'
)
)
}
addWidgetJS <- function(name, edit){
file <- renderFile(
sprintf('srcjs/%s.jsx', name),
'templates/widget_js.txt',
'boilerplate for widget JavaScript bindings',
list(name = name)
)
if (edit) fileEdit(file)
}
addExampleApp <- function(name) {
renderFile(
'app.R',
'templates/widget_app.R.txt',
'example app',
list(
name = name,
capName = capitalize(name)
)
)
}
================================================
FILE: README.Rmd
================================================
---
output: github_document
---
# reactR <img src="vignettes/logo.svg" alt="reactR logo" width="100px" />
<!-- README.md is generated from README.Rmd. Please edit that file -->
```{r setup, include = FALSE}
knitr::opts_chunk$set(
collapse = TRUE,
comment = "#>",
fig.path = "man/figures/README-",
out.width = "100%"
)
```
[](https://cran.r-project.org/package=reactR)
[](https://github.com/react-R/reactR/actions/workflows/R-CMD-check.yaml)
`reactR` provides a set of convenience functions for using [`React`](https://reactjs.org/) in `R` with `htmlwidget` constructor templates and local JavaScript dependencies. The `React` ecosystem is rich with components that can enhance `R` web and Shiny apps. `scaffoldReactWidget()` helps build `htmlwidgets` to integrate these `React` components as `R` `htmlwidgets`. `scaffoldReactShinyInput()` does the same for `Shiny` inputs. The local dependency functions are modeled after the `html_dependency_*` functions from RStudio's [`rmarkdown`](https://github.com/rstudio/rmarkdown) package.
## Installation
You can install reactR from CRAN with `install.packages("reactR")`. For the development version, please use `devtools` as shown below.
```R
# install.packages("devtools")
devtools::install_github("react-R/reactR")
```
## Creating htmlwidgets with React Components
To wrap a `React` component as an `htmlwidget`, please see the tutorial [htmlwidgets with reactR](https://react-r.github.io/reactR/articles/intro_htmlwidgets.html). Also, there are a variety of examples in the [react-R Github organization](https://github.com/react-R).
[`reactable`](https://github.com/glin/reactable) is a very well-built `htmlwidget` leveraging this functionality.
## Shiny Outputs and Inputs
`htmlwidgets` built with `reactR` work well in Shiny as outputs. In version `0.4.0` Alan Dipert has added the ability to easily create React-based official `Shiny` inputs with helpers and scaffolds. Please see the [tutorial](https://react-r.github.io/reactR/articles/intro_inputs.html) for more details.
## Examples
Below are examples of using `reactR` directly.
```R
library(reactR)
library(htmltools)
browsable(tagList(
tags$div(id = "app"),
tags$script(
"
ReactDOM.render(
React.createElement(
'h1',
null,
'Powered by React'
),
document.getElementById('app')
)
"
),
#add core-js first to work in RStudio Viewer
html_dependency_corejs(),
html_dependency_react()
))
```
`reactR` uses the `V8` package if available to transform `JSX` and `ES2015` code with `babel`.
```R
library(reactR)
library(htmltools)
browsable(
tagList(
tags$div(id = "app"),
tags$script(
babel_transform('ReactDOM.render(<h1>Powered By React/JSX</h1>,document.getElementById("app"))')
),
# add core-js shim first for React in older versions of RStudio Viewer
#html_dependency_corejs(),
html_dependency_react()
)
)
```
## Contributing and Code of Conduct
We welcome contributors and would love your participation. Please note that this project is released with a [Contributor Code of Conduct](https://github.com/react-R/reactR/blob/master/CONDUCT.md). By participating in this project you agree to abide by the terms.
================================================
FILE: README.md
================================================
# reactR <img src="vignettes/logo.svg" alt="reactR logo" width="100px" />
<!-- README.md is generated from README.Rmd. Please edit that file -->
[](https://cran.r-project.org/package=reactR)
[](https://github.com/react-R/reactR/actions/workflows/R-CMD-check.yaml)
`reactR` provides a set of convenience functions for using
[`React`](https://reactjs.org/) in `R` with `htmlwidget` constructor
templates and local JavaScript dependencies. The `React` ecosystem is
rich with components that can enhance `R` web and Shiny apps.
`scaffoldReactWidget()` helps build `htmlwidgets` to integrate these
`React` components as `R` `htmlwidgets`. `scaffoldReactShinyInput()`
does the same for `Shiny` inputs. The local dependency functions are
modeled after the `html_dependency_*` functions from RStudio’s
[`rmarkdown`](https://github.com/rstudio/rmarkdown) package.
## Installation
You can install reactR from CRAN with `install.packages("reactR")`. For
the development version, please use `devtools` as shown below.
``` r
# install.packages("devtools")
devtools::install_github("react-R/reactR")
```
## Creating htmlwidgets with React Components
To wrap a `React` component as an `htmlwidget`, please see the tutorial
[htmlwidgets with
reactR](https://react-r.github.io/reactR/articles/intro_htmlwidgets.html).
Also, there are a variety of examples in the [react-R Github
organization](https://github.com/react-R).
[`reactable`](https://github.com/glin/reactable) is a very well-built
`htmlwidget` leveraging this functionality.
## Shiny Outputs and Inputs
`htmlwidgets` built with `reactR` work well in Shiny as outputs. In
version `0.4.0` Alan Dipert has added the ability to easily create
React-based official `Shiny` inputs with helpers and scaffolds. Please
see the
[tutorial](https://react-r.github.io/reactR/articles/intro_inputs.html)
for more details.
## Examples
Below are examples of using `reactR` directly.
``` r
library(reactR)
library(htmltools)
browsable(tagList(
tags$div(id = "app"),
tags$script(
"
ReactDOM.render(
React.createElement(
'h1',
null,
'Powered by React'
),
document.getElementById('app')
)
"
),
#add core-js first to work in RStudio Viewer
html_dependency_corejs(),
html_dependency_react()
))
```
`reactR` uses the `V8` package if available to transform `JSX` and
`ES2015` code with `babel`.
``` r
library(reactR)
library(htmltools)
browsable(
tagList(
tags$div(id = "app"),
tags$script(
babel_transform('ReactDOM.render(<h1>Powered By React/JSX</h1>,document.getElementById("app"))')
),
# add core-js shim first for React in older versions of RStudio Viewer
#html_dependency_corejs(),
html_dependency_react()
)
)
```
## Contributing and Code of Conduct
We welcome contributors and would love your participation. Please note
that this project is released with a [Contributor Code of
Conduct](https://github.com/react-R/reactR/blob/master/CONDUCT.md). By
participating in this project you agree to abide by the terms.
================================================
FILE: buildupdate/getreact.R
================================================
# use the very nice rgithub
# devtools::install_github("cscheid/rgithub")
get_react_latest <- function(){
gsub(
x=github::get.latest.release("facebook", "react")$content$tag_name,
pattern="v",
replacement=""
)
}
get_babel_latest <- function(){
gsub(
x=github::get.latest.release("babel", "babel-standalone")$content$tag_name,
pattern="release-",
replacement=""
)
}
# get newest react
download.file(
url=sprintf(
"https://unpkg.com/react@%s/umd/react.production.min.js",
get_react_latest()
),
destfile="./inst/www/react/react.min.js"
)
# get newest react dom
download.file(
url=sprintf(
"https://unpkg.com/react-dom@%s/umd/react-dom.production.min.js",
get_react_latest()
),
destfile="./inst/www/react/react-dom.min.js"
)
# get newest babel
download.file(
url=sprintf(
"https://unpkg.com/babel-standalone@%s/babel.min.js",
get_babel_latest()
),
destfile="./inst/www/babel/babel.min.js"
)
# write function with newest version
# for use when creating dependencies
cat(
sprintf(
"#'@keywords internal\nreact_version <- function(){'%s'}\nbabel_version <- function(){'%s'}",
get_react_latest(),
get_babel_latest()
),
file = "./R/meta.R"
)
================================================
FILE: cran-comments.md
================================================
## Test environments
* local Windows 10 install, R 4.3.1
* rhub check_for_cran
* winbuilder
* github actions check for cran - ubuntu, mac, windows
## R CMD check results
0 errors | 0 warnings | 0 note
## Reverse dependencies
reactable - consulted with author who has tested and approved the changes
================================================
FILE: docs/404.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page not found (404) • reactR</title>
<!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="apple-touch-icon.png">
<link rel="apple-touch-icon" type="image/png" sizes="120x120" href="apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" type="image/png" sizes="76x76" href="apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" type="image/png" sizes="60x60" href="apple-touch-icon-60x60.png">
<!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="bootstrap-toc.css">
<script src="bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous">
<!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="pkgdown.css" rel="stylesheet">
<script src="pkgdown.js"></script><meta property="og:title" content="Page not found (404)">
<!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target="#toc">
<div class="container template-title-body">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>
<a href="reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul>
</li>
<li>
<a href="news/index.html">Changelog</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
<!--/.container -->
</div>
<!--/.navbar -->
</header><div class="row">
<div class="contents col-md-9">
<div class="page-header">
<h1>Page not found (404)</h1>
</div>
Content not found. Please use links in the navbar.
</div>
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
<nav id="toc" data-toggle="toc" class="sticky-top"><h2 data-toc-skip>Contents</h2>
</nav>
</div>
</div>
<footer><div class="copyright">
<p></p>
<p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p>
<p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer>
</div>
</body>
</html>
================================================
FILE: docs/CONDUCT.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Contributor Code of Conduct • reactR</title><!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="apple-touch-icon.png"><link rel="apple-touch-icon" type="image/png" sizes="120x120" href="apple-touch-icon-120x120.png"><link rel="apple-touch-icon" type="image/png" sizes="76x76" href="apple-touch-icon-76x76.png"><link rel="apple-touch-icon" type="image/png" sizes="60x60" href="apple-touch-icon-60x60.png"><!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous"><script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="bootstrap-toc.css"><script src="bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous"><!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="pkgdown.css" rel="stylesheet"><script src="pkgdown.js"></script><meta property="og:title" content="Contributor Code of Conduct"><!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]--></head><body data-spy="scroll" data-target="#toc">
<div class="container template-title-body">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav"><li>
<a href="reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu"><li>
<a href="articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul></li>
<li>
<a href="news/index.html">Changelog</a>
</li>
</ul><ul class="nav navbar-nav navbar-right"><li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul></div><!--/.nav-collapse -->
</div><!--/.container -->
</div><!--/.navbar -->
</header><div class="row">
<div class="contents col-md-9">
<div class="page-header">
<h1>Contributor Code of Conduct</h1>
</div>
<div id="contributor-code-of-conduct" class="section level1">
<p>As contributors and maintainers of this project, we pledge to respect all people who contribute through reporting issues, posting feature requests, updating documentation, submitting pull requests or patches, and other activities.</p>
<p>We are committed to making participation in this project a harassment-free experience for everyone, regardless of level of experience, gender, gender identity and expression, sexual orientation, disability, personal appearance, body size, race, ethnicity, age, or religion.</p>
<p>Examples of unacceptable behavior by participants include the use of sexual language or imagery, derogatory comments or personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct.</p>
<p>Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct. Project maintainers who do not follow the Code of Conduct may be removed from the project team.</p>
<p>Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by opening an issue or contacting one or more of the project maintainers.</p>
<p>This Code of Conduct is adapted from the Contributor Covenant (<a href="http:contributor-covenant.org" class="uri">http:contributor-covenant.org</a>), version 1.0.0, available at <a href="http://contributor-covenant.org/version/1/0/0/" class="external-link uri">http://contributor-covenant.org/version/1/0/0/</a></p>
</div>
</div>
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
<nav id="toc" data-toggle="toc" class="sticky-top"><h2 data-toc-skip>Contents</h2>
</nav></div>
</div>
<footer><div class="copyright">
<p></p><p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p><p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer></div>
</body></html>
================================================
FILE: docs/LICENSE-text.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>License • reactR</title><!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="apple-touch-icon.png"><link rel="apple-touch-icon" type="image/png" sizes="120x120" href="apple-touch-icon-120x120.png"><link rel="apple-touch-icon" type="image/png" sizes="76x76" href="apple-touch-icon-76x76.png"><link rel="apple-touch-icon" type="image/png" sizes="60x60" href="apple-touch-icon-60x60.png"><!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous"><script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="bootstrap-toc.css"><script src="bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous"><!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="pkgdown.css" rel="stylesheet"><script src="pkgdown.js"></script><meta property="og:title" content="License"><!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]--></head><body data-spy="scroll" data-target="#toc">
<div class="container template-title-body">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav"><li>
<a href="reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu"><li>
<a href="articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul></li>
<li>
<a href="news/index.html">Changelog</a>
</li>
</ul><ul class="nav navbar-nav navbar-right"><li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul></div><!--/.nav-collapse -->
</div><!--/.container -->
</div><!--/.navbar -->
</header><div class="row">
<div class="contents col-md-9">
<div class="page-header">
<h1>License</h1>
</div>
<pre>YEAR: 2018
COPYRIGHT HOLDER: Kent Russell
</pre>
</div>
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
<nav id="toc" data-toggle="toc" class="sticky-top"><h2 data-toc-skip>Contents</h2>
</nav></div>
</div>
<footer><div class="copyright">
<p></p><p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p><p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer></div>
</body></html>
================================================
FILE: docs/articles/index.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Articles • reactR</title><!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="../favicon-16x16.png"><link rel="icon" type="image/png" sizes="32x32" href="../favicon-32x32.png"><link rel="apple-touch-icon" type="image/png" sizes="180x180" href="../apple-touch-icon.png"><link rel="apple-touch-icon" type="image/png" sizes="120x120" href="../apple-touch-icon-120x120.png"><link rel="apple-touch-icon" type="image/png" sizes="76x76" href="../apple-touch-icon-76x76.png"><link rel="apple-touch-icon" type="image/png" sizes="60x60" href="../apple-touch-icon-60x60.png"><!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous"><script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="../bootstrap-toc.css"><script src="../bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous"><!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet"><script src="../pkgdown.js"></script><meta property="og:title" content="Articles"><!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]--></head><body data-spy="scroll" data-target="#toc">
<div class="container template-article-index">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="../index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav"><li>
<a href="../reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu"><li>
<a href="../articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul></li>
<li>
<a href="../news/index.html">Changelog</a>
</li>
</ul><ul class="nav navbar-nav navbar-right"><li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul></div><!--/.nav-collapse -->
</div><!--/.container -->
</div><!--/.navbar -->
</header><div class="row">
<div class="col-md-9 contents">
<div class="page-header">
<h1>Articles</h1>
</div>
<div class="section ">
<h3>All vignettes</h3>
<p class="section-desc"></p>
<dl><dt><a href="intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a></dt>
<dd>
</dd><dt><a href="intro_inputs.html">Authoring inputs powered by React with reactR</a></dt>
<dd>
</dd><dt><a href="intro_reactR.html">Intro to reactR</a></dt>
<dd>
</dd></dl></div>
</div>
</div>
<footer><div class="copyright">
<p></p><p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p><p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer></div>
</body></html>
================================================
FILE: docs/articles/intro_htmlwidgets.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Authoring htmlwidgets powered by React with reactR • reactR</title>
<!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="../favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicon-32x32.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="../apple-touch-icon.png">
<link rel="apple-touch-icon" type="image/png" sizes="120x120" href="../apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" type="image/png" sizes="76x76" href="../apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" type="image/png" sizes="60x60" href="../apple-touch-icon-60x60.png">
<!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="../bootstrap-toc.css">
<script src="../bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous">
<!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet">
<script src="../pkgdown.js"></script><meta property="og:title" content="Authoring htmlwidgets powered by React with reactR">
<meta property="og:description" content="reactR">
<!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target="#toc">
<div class="container template-article">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="../index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>
<a href="../reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="../articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul>
</li>
<li>
<a href="../news/index.html">Changelog</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
<!--/.container -->
</div>
<!--/.navbar -->
</header><div class="row">
<div class="col-md-9 contents">
<div class="page-header toc-ignore">
<h1 data-toc-skip>Authoring htmlwidgets powered by React with
reactR</h1>
<h4 data-toc-skip class="author">Alan
Dipert</h4>
<h4 data-toc-skip class="author">Carson
Sievert</h4>
<h4 data-toc-skip class="date">2024-09-14</h4>
<small class="dont-index">Source: <a href="https://github.com/react-R/reactR/blob/HEAD/vignettes/intro_htmlwidgets.Rmd" class="external-link"><code>vignettes/intro_htmlwidgets.Rmd</code></a></small>
<div class="hidden name"><code>intro_htmlwidgets.Rmd</code></div>
</div>
<p>The <a href="https://www.htmlwidgets.org" class="external-link">htmlwidgets</a> package
provides a framework for creating R bindings to JavaScript libraries.
Using the <strong>htmlwidgets</strong> package alone, it’s not
necessarily straight-forward to create an R binding to a <a href="https://reactjs.org/" class="external-link">React</a>-powered JavaScript library. The
<strong>reactR</strong> package builds on the
<strong>htmlwidgets</strong> framework to make it much easier to author
<strong>htmlwidgets</strong> that are powered by React. This vignette
will show you how to effectively leverage <strong>reactR</strong> to
build an <strong>htmlwidgets</strong> package that interfaces with <a href="https://github.com/borisyankov/react-sparklines" class="external-link">react-sparklines</a>
React JavaScript library.</p>
<div class="section level2">
<h2 id="software-pre-requisites">Software pre-requisites<a class="anchor" aria-label="anchor" href="#software-pre-requisites"></a>
</h2>
<p>In order to develop a <strong>reactR</strong> widget, you’ll need to
install R and optionally RStudio. If you’re on Windows, you should also
install <a href="https://cran.r-project.org/bin/windows/Rtools/" class="external-link">Rtools</a>.</p>
<blockquote>
<p>For an excellent general introduction to R package concepts, check
out the <a href="https://r-pkgs.org/" class="external-link">R packages</a> online book.</p>
</blockquote>
<p>In addition, you’ll need to install the following JavaScript tools on
your machine:</p>
<ul>
<li>
<a href="https://nodejs.org" class="external-link">Node.js</a>: JavaScript engine and
runtime for development outside of browsers. Provides the
<code>node</code> and <code>npm</code> commands.</li>
<li>
<a href="https://classic.yarnpkg.com/en/" class="external-link">Yarn</a>: Command-line
dependency management tool, provides the <code>yarn</code> command.</li>
</ul>
<p>To follow along in this vignette, you’ll also need the following R
packages:</p>
<div class="sourceCode" id="cb1"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu"><a href="https://rdrr.io/r/utils/install.packages.html" class="external-link">install.packages</a></span><span class="op">(</span><span class="fu"><a href="https://rdrr.io/r/base/c.html" class="external-link">c</a></span><span class="op">(</span><span class="st">"shiny"</span>, <span class="st">"devtools"</span>, <span class="st">"usethis"</span>, <span class="st">"htmlwidgets"</span>, <span class="st">"reactR"</span><span class="op">)</span><span class="op">)</span></span></code></pre></div>
</div>
<div class="section level2">
<h2 id="scaffolding">Scaffolding<a class="anchor" aria-label="anchor" href="#scaffolding"></a>
</h2>
<p>To create a new widget you can call <code>scaffoldReactWidget</code>
to generate the basic structure and build configuration. This function
will:</p>
<ul>
<li>Create the .R, .js, .yaml, and .json files required by your
widget;</li>
<li>If provided, take an <a href="https://www.npmjs.com/" class="external-link">npm</a>
package name and version as a named list with <code>name</code> and
<code>version</code> elements. For example, the npm package
<code>foo</code> at version <code>^1.2.0</code> would be expressed as
<code>list(name = "foo", version = "^1.2.0")</code>. The package, if
provided, will be added to the new widget’s <code>package.json</code> as
a build dependency.</li>
</ul>
<p>The following R code will create an R package named
<strong>sparklines</strong>, then provide the templating for creating an
htmlwidget powered by the <code>react-sparklines</code> npm package:</p>
<div class="sourceCode" id="cb2"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="co"># Create the R package</span></span>
<span><span class="fu">usethis</span><span class="fu">::</span><span class="fu"><a href="https://usethis.r-lib.org/reference/create_package.html" class="external-link">create_package</a></span><span class="op">(</span><span class="st">"~/sparklines"</span><span class="op">)</span></span>
<span><span class="co"># Inject the widget templating</span></span>
<span><span class="fu">withr</span><span class="fu">::</span><span class="fu"><a href="https://withr.r-lib.org/reference/with_dir.html" class="external-link">with_dir</a></span><span class="op">(</span></span>
<span> <span class="st">"~/sparklines"</span>, </span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/scaffoldReactWidget.html">scaffoldReactWidget</a></span><span class="op">(</span><span class="st">"sparklines"</span>, <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span><span class="st">"react-sparklines"</span> <span class="op">=</span> <span class="st">"^1.7.0"</span><span class="op">)</span>, edit <span class="op">=</span> <span class="cn">FALSE</span><span class="op">)</span></span>
<span><span class="op">)</span></span></code></pre></div>
</div>
<div class="section level2">
<h2 id="building-and-installing">Building and installing<a class="anchor" aria-label="anchor" href="#building-and-installing"></a>
</h2>
<div class="section level3">
<h3 id="building-the-javascript">Building the JavaScript<a class="anchor" aria-label="anchor" href="#building-the-javascript"></a>
</h3>
<p>The next step is to navigate to the newly-created
<code>sparklines</code> project and run the following R commands:</p>
<div class="sourceCode" id="cb3"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu"><a href="https://rdrr.io/r/base/system.html" class="external-link">system</a></span><span class="op">(</span><span class="st">"yarn install"</span><span class="op">)</span></span>
<span><span class="fu"><a href="https://rdrr.io/r/base/system.html" class="external-link">system</a></span><span class="op">(</span><span class="st">"yarn run webpack"</span><span class="op">)</span></span></code></pre></div>
<ul>
<li><p><code>yarn install</code> downloads all of the dependencies
listed in <code>package.json</code> and creates a new file,
<code>yarn.lock</code>. You should add this file to revision control. It
will be updated whenever you change dependencies and run
<code>yarn install</code>. <strong>Note: you only need to run it after
modifying package.json</strong>. For further documentation on
<code>yarn install</code>, see the <a href="https://classic.yarnpkg.com/en/docs/cli/install/" class="external-link">yarn
documentation</a>.</p></li>
<li><p><code>yarn run webpack</code> compiles the <a href="https://babeljs.io/docs/en/learn/" class="external-link">ES2015</a> JavaScript source
file at <code>srcjs/sparklines.js</code> into
<code>inst/htmlwidgets/sparklines.js</code>. The later file is one
actually used by the R package and includes all the relevant JavaScript
dependencies in a version of JavaScript that most browsers understand.
Note that, if you add <code>--mode=development</code> to the end of this
command, it will include a <a href="https://firefox-source-docs.mozilla.org/devtools-user/debugger/how_to/use_a_source_map/index.html" class="external-link">source
map</a> is included with the compiled JavaScript, which makes JavaScript
debugging much easier, but hopefully you won’t need to do much of any
JavaScript debugging.</p></li>
</ul>
<p><code>yarn run webpack</code> is not strictly a <code>yarn</code>
command. In fact, <code>yarn run</code> simply delegates to the <a href="https://webpack.js.org/" class="external-link">webpack</a> program. Webpack’s
configuration is generated by <code>scaffoldReactWidget</code> in the
file <code>webpack.config.js</code>, but you can always change this
configuration and/or modify the <code>yarn run webpack</code> command to
suit your needs.</p>
</div>
<div class="section level3">
<h3 id="installing-the-r-package">Installing the R package<a class="anchor" aria-label="anchor" href="#installing-the-r-package"></a>
</h3>
<p>Now that the widget’s JavaScript is compiled, go ahead and install
the R package:</p>
<div class="sourceCode" id="cb4"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu">devtools</span><span class="fu">::</span><span class="fu"><a href="https://devtools.r-lib.org/reference/document.html" class="external-link">document</a></span><span class="op">(</span><span class="op">)</span></span>
<span><span class="fu">devtools</span><span class="fu">::</span><span class="fu"><a href="https://devtools.r-lib.org/reference/install.html" class="external-link">install</a></span><span class="op">(</span>quick <span class="op">=</span> <span class="cn">TRUE</span><span class="op">)</span></span></code></pre></div>
<p>Alternatively, in RStudio, you can use the keyboard shortcuts
<code>Ctrl+Shift+D</code> and <code>Ctrl-Shift-B</code> to document and
build the package. (On macOS, the shortcuts are <code>Cmd+Shift+D</code>
and <code>Cmd+Shift+B</code>)</p>
</div>
</div>
<div class="section level2">
<h2 id="run-the-included-demo">Run the included demo<a class="anchor" aria-label="anchor" href="#run-the-included-demo"></a>
</h2>
<p>Now that the widget’s JavaScript is compiled, and the R package is
installed, run <code>app.R</code> to see a demo in action:</p>
<div class="sourceCode" id="cb5"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu">shiny</span><span class="fu">::</span><span class="fu"><a href="https://rdrr.io/pkg/shiny/man/runApp.html" class="external-link">runApp</a></span><span class="op">(</span><span class="op">)</span></span></code></pre></div>
<p>Alternatively, in RStudio, you can open <code>app.R</code> and press
<code>Ctrl-Shift-Enter</code> (<code>Cmd-Shift-Enter</code> on macOS).
You should see something like the following appear in the Viewer
pane:</p>
<p><img src="widget_app.jpg"></p>
</div>
<div class="section level2">
<h2 id="authoring-a-react-binding">Authoring a React binding<a class="anchor" aria-label="anchor" href="#authoring-a-react-binding"></a>
</h2>
<p>At this point, we’ve built some scaffolding for an htmlwidget powered
by React. Let’s modify it to create an interface to the
<code>react-sparklines</code> library. Authoring the interface requires
some changes on both the JavaScript and R side, but most of the hard
thinking will be in figuring how best to design your interface. To give
you an example of how this could work, let’s build an interface to the
<code>Sparklines</code> component of the react-sparklines library.</p>
<div class="section level3">
<h3 id="first-outline-an-interface">First, outline an interface<a class="anchor" aria-label="anchor" href="#first-outline-an-interface"></a>
</h3>
<blockquote>
<p>Note that the examples in this section are just to demonstrate API
possibilities and need not be pasted into any file.</p>
</blockquote>
<p>Consider the following example taken from the <a href="http://borisyankov.github.io/react-sparklines/" class="external-link">react-sparklines
documentation</a>.</p>
<div class="sourceCode" id="cb6"><pre class="sourceCode js"><code class="sourceCode javascript"><span id="cb6-1"><a href="#cb6-1" tabindex="-1"></a><span class="im">import</span> React <span class="im">from</span> <span class="st">'react'</span><span class="op">;</span></span>
<span id="cb6-2"><a href="#cb6-2" tabindex="-1"></a><span class="im">import</span> { Sparklines } <span class="im">from</span> <span class="st">'react-sparklines'</span><span class="op">;</span></span>
<span id="cb6-3"><a href="#cb6-3" tabindex="-1"></a></span>
<span id="cb6-4"><a href="#cb6-4" tabindex="-1"></a><span class="op"><</span>Sparklines data<span class="op">=</span>{sampleData}<span class="op">></span></span>
<span id="cb6-5"><a href="#cb6-5" tabindex="-1"></a> <span class="op"><</span>SparklinesLine color<span class="op">=</span><span class="st">"#56b45d"</span> <span class="op">/></span></span>
<span id="cb6-6"><a href="#cb6-6" tabindex="-1"></a> <span class="op"><</span>SparklinesSpots style<span class="op">=</span>{{ <span class="dt">fill</span><span class="op">:</span> <span class="st">"#56b45d"</span> }} <span class="op">/></span></span>
<span id="cb6-7"><a href="#cb6-7" tabindex="-1"></a><span class="op"></</span>Sparklines<span class="op">></span></span></code></pre></div>
<p>You have some choice in terms of how to design an R interface to this
sort of React library, but usually it makes sense to have one function
per component and have the arguments to that function feed into the
properties of that React component. In other words, our goal is to
create an R function that allows users of our package to recreate this
example with the following code:</p>
<div class="sourceCode" id="cb7"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="kw"><a href="https://rdrr.io/r/base/library.html" class="external-link">library</a></span><span class="op">(</span><span class="va">sparklines</span><span class="op">)</span></span>
<span><span class="fu">sparklines</span><span class="op">(</span></span>
<span> data <span class="op">=</span> <span class="va">sampleData</span>,</span>
<span> <span class="fu">sparklinesLine</span><span class="op">(</span>color <span class="op">=</span> <span class="st">"#56b45d"</span><span class="op">)</span>,</span>
<span> <span class="fu">sparklinesSpots</span><span class="op">(</span>style <span class="op">=</span> <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span>fill <span class="op">=</span> <span class="st">"#56b45d"</span><span class="op">)</span><span class="op">)</span></span>
<span><span class="op">)</span></span></code></pre></div>
<p>The following sections show how to implement this R interface from
our scaffolded widget.</p>
</div>
<div class="section level3">
<h3 id="r-implementation">R implementation<a class="anchor" aria-label="anchor" href="#r-implementation"></a>
</h3>
<p>Consider the template that <code><a href="../reference/scaffoldReactWidget.html">reactR::scaffoldReactWidget()</a></code>
provided for us:</p>
<div class="sourceCode" id="cb8"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="va">sparklines</span> <span class="op"><-</span> <span class="kw">function</span><span class="op">(</span><span class="va">message</span>, <span class="va">width</span> <span class="op">=</span> <span class="cn">NULL</span>, <span class="va">height</span> <span class="op">=</span> <span class="cn">NULL</span>, <span class="va">elementId</span> <span class="op">=</span> <span class="cn">NULL</span><span class="op">)</span> <span class="op">{</span></span>
<span> </span>
<span> <span class="co"># describe a React component to send to the browser for rendering.</span></span>
<span> <span class="va">content</span> <span class="op"><-</span> <span class="fu">htmltools</span><span class="fu">::</span><span class="fu"><a href="https://rstudio.github.io/htmltools/reference/builder.html" class="external-link">tag</a></span><span class="op">(</span><span class="st">"div"</span>, <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span><span class="va">message</span><span class="op">)</span><span class="op">)</span></span>
<span> </span>
<span> <span class="co"># create widget</span></span>
<span> <span class="fu">htmlwidgets</span><span class="fu">::</span><span class="fu"><a href="https://rdrr.io/pkg/htmlwidgets/man/createWidget.html" class="external-link">createWidget</a></span><span class="op">(</span></span>
<span> name <span class="op">=</span> <span class="st">'sparklines'</span>,</span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/reactMarkup.html">reactMarkup</a></span><span class="op">(</span><span class="va">content</span><span class="op">)</span>,</span>
<span> width <span class="op">=</span> <span class="va">width</span>,</span>
<span> height <span class="op">=</span> <span class="va">height</span>,</span>
<span> package <span class="op">=</span> <span class="st">'sparklines'</span>,</span>
<span> elementId <span class="op">=</span> <span class="va">elementId</span></span>
<span> <span class="op">)</span></span>
<span><span class="op">}</span></span></code></pre></div>
<p>This function is designed to simply display a message within an HTML
div using <strong>reactR</strong> and <strong>htmlwidgets</strong>. The
critical piece here that makes it all work is
<code><a href="../reference/reactMarkup.html">reactR::reactMarkup()</a></code>. This function can prepare a payload
containing a mix of HTML tags (constructed via
<code><a href="https://rstudio.github.io/htmltools/reference/builder.html" class="external-link">htmltools::tag()</a></code>), React components (constructed via
<code><a href="../reference/component.html">reactR::component()</a></code>), or character vectors in a such way
that the <strong>reactR</strong> and <strong>htmlwidgets</strong>
toolchain will understand and know how to render in the browser
(assuming we’ve imported our React component appropriately, as we cover
later). Thus, to send a <code><Sparklines></code> react component
instead of an HTML <code><div></code>, we could simply change:</p>
<div class="sourceCode" id="cb9"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="va">content</span> <span class="op"><-</span> <span class="fu">htmltools</span><span class="fu">::</span><span class="fu"><a href="https://rstudio.github.io/htmltools/reference/builder.html" class="external-link">tag</a></span><span class="op">(</span><span class="st">"div"</span>, <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span><span class="va">message</span><span class="op">)</span><span class="op">)</span></span></code></pre></div>
<p>to</p>
<div class="sourceCode" id="cb10"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/component.html">component</a></span><span class="op">(</span><span class="st">"Sparklines"</span>, <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span><span class="va">message</span><span class="op">)</span><span class="op">)</span></span></code></pre></div>
<p>Remember, though, that we’d like <code><Sparklines></code> to
consume a <code>data</code> property and also accept other valid
components (e.g., <code><SparklinesLine></code>,
<code><SparklinesSpot></code>, etc) from this library as children.
So, we could change the body and signature of <code>sparklines()</code>
in the following way:</p>
<div class="sourceCode" id="cb11"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="va">sparklines</span> <span class="op"><-</span> <span class="kw">function</span><span class="op">(</span><span class="va">data</span>, <span class="va">...</span>, <span class="va">width</span> <span class="op">=</span> <span class="cn">NULL</span>, <span class="va">height</span> <span class="op">=</span> <span class="cn">NULL</span><span class="op">)</span> <span class="op">{</span></span>
<span> </span>
<span> <span class="co"># describe a React component to send to the browser for rendering.</span></span>
<span> <span class="va">content</span> <span class="op"><-</span> <span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/component.html">component</a></span><span class="op">(</span></span>
<span> <span class="st">"Sparklines"</span>,</span>
<span> <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span>data <span class="op">=</span> <span class="va">data</span>, <span class="va">...</span><span class="op">)</span></span>
<span> <span class="op">)</span></span>
<span> </span>
<span> <span class="co"># create widget</span></span>
<span> <span class="fu">htmlwidgets</span><span class="fu">::</span><span class="fu"><a href="https://rdrr.io/pkg/htmlwidgets/man/createWidget.html" class="external-link">createWidget</a></span><span class="op">(</span></span>
<span> name <span class="op">=</span> <span class="st">'sparklines'</span>,</span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/reactMarkup.html">reactMarkup</a></span><span class="op">(</span><span class="va">content</span><span class="op">)</span>,</span>
<span> width <span class="op">=</span> <span class="va">width</span>,</span>
<span> height <span class="op">=</span> <span class="va">height</span>,</span>
<span> package <span class="op">=</span> <span class="st">'sparklines'</span></span>
<span> <span class="op">)</span></span>
<span><span class="op">}</span></span></code></pre></div>
<p>At this point, we define functions that make it easy for the user to
create the other components by adding these to
<code>R/sparklines.R</code></p>
<div class="sourceCode" id="cb12"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="co">#' @export</span></span>
<span><span class="va">sparklinesLine</span> <span class="op"><-</span> <span class="kw">function</span><span class="op">(</span><span class="va">...</span><span class="op">)</span> <span class="op">{</span></span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="va"><a href="../reference/React.html">React</a></span><span class="op">$</span><span class="fu">SparklinesLine</span><span class="op">(</span><span class="va">...</span><span class="op">)</span></span>
<span><span class="op">}</span></span>
<span></span>
<span><span class="co">#' @export</span></span>
<span><span class="va">sparklinesSpots</span> <span class="op"><-</span> <span class="kw">function</span><span class="op">(</span><span class="va">...</span><span class="op">)</span> <span class="op">{</span></span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="va"><a href="../reference/React.html">React</a></span><span class="op">$</span><span class="fu">SparklinesSpots</span><span class="op">(</span><span class="va">...</span><span class="op">)</span></span>
<span><span class="op">}</span></span></code></pre></div>
</div>
<div class="section level3">
<h3 id="javascript-changes">JavaScript changes<a class="anchor" aria-label="anchor" href="#javascript-changes"></a>
</h3>
<p>In order for the <strong>reactR</strong> toolchain to know how to
render components from the ‘react-sparklines’ library, we need to
register the React components on the JavaScript side. This can be done
in the <code>srcjs/sparklines.js</code> file which currently looks like
this:</p>
<div class="sourceCode" id="cb13"><pre class="sourceCode js"><code class="sourceCode javascript"><span id="cb13-1"><a href="#cb13-1" tabindex="-1"></a><span class="im">import</span> { reactWidget } <span class="im">from</span> <span class="st">'reactR'</span><span class="op">;</span></span>
<span id="cb13-2"><a href="#cb13-2" tabindex="-1"></a></span>
<span id="cb13-3"><a href="#cb13-3" tabindex="-1"></a><span class="fu">reactWidget</span>(<span class="st">'sparklines'</span><span class="op">,</span> <span class="st">'output'</span><span class="op">,</span> {})<span class="op">;</span></span></code></pre></div>
<p>First, <code>reactWidget</code> is <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import" class="external-link">imported</a>
from the <code>'reactR'</code> JavaScript module. This function will
register the React components we want within the <strong>reactR</strong>
and <strong>htmlwidgets</strong> toolchain. Note that the
<code>'reactR'</code> JavaScript is an html dependency, but webpack is
configured in <code>webpack.config.js</code> to consider it a module, so
it’s available to us here via <code>import</code> syntax.</p>
<p>Then, there’s a call to <code>reactWidget</code>, and we pass it
three arguments:</p>
<ol style="list-style-type: decimal">
<li>The name of the widget (<code>'sparklines'</code>)</li>
<li>The type of the widget (<code>'output'</code>)</li>
<li>The React components that should be exposed to the widget. In this
template, we didn’t have to include any because it’s just rendering an
HTML div.</li>
</ol>
<p>Instead of passing an empty object (<code><a href="https://rdrr.io/r/base/Paren.html" class="external-link">{}</a></code>) as the React
components, we provide an object with all the components we need from
the ‘react-sparklines’ module:</p>
<div class="sourceCode" id="cb14"><pre class="sourceCode js"><code class="sourceCode javascript"><span id="cb14-1"><a href="#cb14-1" tabindex="-1"></a><span class="im">import</span> { Sparklines<span class="op">,</span> SparklinesLine<span class="op">,</span> SparklinesSpots } <span class="im">from</span> <span class="st">'react-sparklines'</span><span class="op">;</span></span>
<span id="cb14-2"><a href="#cb14-2" tabindex="-1"></a><span class="im">import</span> { reactWidget } <span class="im">from</span> <span class="st">'reactR'</span><span class="op">;</span></span>
<span id="cb14-3"><a href="#cb14-3" tabindex="-1"></a></span>
<span id="cb14-4"><a href="#cb14-4" tabindex="-1"></a><span class="fu">reactWidget</span>(<span class="st">'sparklines'</span><span class="op">,</span> <span class="st">'output'</span><span class="op">,</span> {</span>
<span id="cb14-5"><a href="#cb14-5" tabindex="-1"></a> <span class="dt">Sparklines</span><span class="op">:</span> Sparklines<span class="op">,</span></span>
<span id="cb14-6"><a href="#cb14-6" tabindex="-1"></a> <span class="dt">SparklinesLine</span><span class="op">:</span> SparklinesLine<span class="op">,</span></span>
<span id="cb14-7"><a href="#cb14-7" tabindex="-1"></a> <span class="dt">SparklinesSpots</span><span class="op">:</span> SparklinesSpots</span>
<span id="cb14-8"><a href="#cb14-8" tabindex="-1"></a>})<span class="op">;</span></span></code></pre></div>
</div>
<div class="section level3">
<h3 id="go-for-a-spin">Go for a spin<a class="anchor" aria-label="anchor" href="#go-for-a-spin"></a>
</h3>
<p>Now that we’ve made the necessary changes to the JavaScript and R
source code, it’s time to compile the JavaScript and install the R
package:</p>
<div class="sourceCode" id="cb15"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu"><a href="https://rdrr.io/r/base/system.html" class="external-link">system</a></span><span class="op">(</span><span class="st">"yarn install"</span><span class="op">)</span></span>
<span><span class="fu"><a href="https://rdrr.io/r/base/system.html" class="external-link">system</a></span><span class="op">(</span><span class="st">"yarn run webpack"</span><span class="op">)</span></span>
<span><span class="fu">devtools</span><span class="fu">::</span><span class="fu"><a href="https://devtools.r-lib.org/reference/document.html" class="external-link">document</a></span><span class="op">(</span><span class="op">)</span></span>
<span><span class="fu">devtools</span><span class="fu">::</span><span class="fu"><a href="https://devtools.r-lib.org/reference/install.html" class="external-link">install</a></span><span class="op">(</span><span class="op">)</span></span>
<span><span class="kw"><a href="https://rdrr.io/r/base/library.html" class="external-link">library</a></span><span class="op">(</span><span class="va">sparklines</span><span class="op">)</span></span>
<span><span class="fu">sparklines</span><span class="op">(</span><span class="fu"><a href="https://rdrr.io/r/stats/Normal.html" class="external-link">rnorm</a></span><span class="op">(</span><span class="fl">10</span><span class="op">)</span>, <span class="fu">sparklinesLine</span><span class="op">(</span><span class="op">)</span><span class="op">)</span></span></code></pre></div>
<p>This should open up the <code>sparklines()</code> widget in your
browser. If it does, congratulations, you created a React-based
htmlwidget!</p>
</div>
<div class="section level3">
<h3 id="shiny-integration">Shiny integration<a class="anchor" aria-label="anchor" href="#shiny-integration"></a>
</h3>
<p>The scaffolding template already provides the glue you need to get
your <strong>reactR</strong> widget to render in <strong>Shiny</strong>.
The two relevant functions are <code>renderSparklines()</code> and
<code>sparklinesOutput()</code>. You shouldn’t need to modify these
functions — they should work out of the box. You will, however, want to
modify the example <strong>Shiny</strong> app in the <code>app.R</code>
file:</p>
<div class="sourceCode" id="cb16"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="kw"><a href="https://rdrr.io/r/base/library.html" class="external-link">library</a></span><span class="op">(</span><span class="va"><a href="https://shiny.posit.co/" class="external-link">shiny</a></span><span class="op">)</span></span>
<span><span class="kw"><a href="https://rdrr.io/r/base/library.html" class="external-link">library</a></span><span class="op">(</span><span class="va">sparklines</span><span class="op">)</span></span>
<span></span>
<span><span class="va">ui</span> <span class="op"><-</span> <span class="fu"><a href="https://rdrr.io/pkg/shiny/man/fluidPage.html" class="external-link">fluidPage</a></span><span class="op">(</span></span>
<span> <span class="fu"><a href="https://rdrr.io/pkg/shiny/man/titlePanel.html" class="external-link">titlePanel</a></span><span class="op">(</span><span class="st">"Sparklines library"</span><span class="op">)</span>,</span>
<span> <span class="fu"><a href="https://rdrr.io/pkg/shiny/man/sliderInput.html" class="external-link">sliderInput</a></span><span class="op">(</span><span class="st">"n"</span>, label <span class="op">=</span> <span class="st">"Number of samples"</span>, min <span class="op">=</span> <span class="fl">2</span>, max <span class="op">=</span> <span class="fl">1000</span>, value <span class="op">=</span> <span class="fl">100</span><span class="op">)</span>,</span>
<span> <span class="fu">sparklinesOutput</span><span class="op">(</span><span class="st">"myWidget"</span><span class="op">)</span></span>
<span><span class="op">)</span></span>
<span></span>
<span><span class="va">server</span> <span class="op"><-</span> <span class="kw">function</span><span class="op">(</span><span class="va">input</span>, <span class="va">output</span>, <span class="va">session</span><span class="op">)</span> <span class="op">{</span></span>
<span> <span class="va">output</span><span class="op">$</span><span class="va">myWidget</span> <span class="op"><-</span> <span class="fu">renderSparklines</span><span class="op">(</span><span class="op">{</span></span>
<span> <span class="fu">sparklines</span><span class="op">(</span></span>
<span> <span class="fu"><a href="https://rdrr.io/r/stats/Normal.html" class="external-link">rnorm</a></span><span class="op">(</span><span class="va">input</span><span class="op">$</span><span class="va">n</span><span class="op">)</span>,</span>
<span> <span class="fu">sparklinesLine</span><span class="op">(</span><span class="op">)</span></span>
<span> <span class="op">)</span></span>
<span> <span class="op">}</span><span class="op">)</span></span>
<span><span class="op">}</span></span>
<span></span>
<span><span class="fu"><a href="https://rdrr.io/pkg/shiny/man/shinyApp.html" class="external-link">shinyApp</a></span><span class="op">(</span><span class="va">ui</span>, <span class="va">server</span><span class="op">)</span></span></code></pre></div>
<p>Now, when you run <code><a href="https://rdrr.io/pkg/shiny/man/runApp.html" class="external-link">shiny::runApp()</a></code>, you should see your
react-based htmlwidget rendering in <strong>shiny</strong> app!</p>
<p><img src="widget_app_improved.jpg"></p>
</div>
</div>
<div class="section level2">
<h2 id="further-learning">Further learning<a class="anchor" aria-label="anchor" href="#further-learning"></a>
</h2>
<p>This tutorial walked you through the steps taken you create an R
interface to the react-sparklines library. The full example package is
accessible at <a href="https://github.com/react-R/sparklines-example" class="external-link uri">https://github.com/react-R/sparklines-example</a>. Our
intention is keep creating example packages under the <a href="https://github.com/react-R" class="external-link uri">https://github.com/react-R</a> organization, so head there
if you’d like to see other examples of interfacing with React.</p>
</div>
</div>
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
<nav id="toc" data-toggle="toc"><h2 data-toc-skip>Contents</h2>
</nav>
</div>
</div>
<footer><div class="copyright">
<p></p>
<p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p>
<p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer>
</div>
</body>
</html>
================================================
FILE: docs/articles/intro_htmlwidgets_files/accessible-code-block-0.0.1/empty-anchor.js
================================================
// Hide empty <a> tag within highlighted CodeBlock for screen reader accessibility (see https://github.com/jgm/pandoc/issues/6352#issuecomment-626106786) -->
// v0.0.1
// Written by JooYoung Seo (jooyoung@psu.edu) and Atsushi Yasumoto on June 1st, 2020.
document.addEventListener('DOMContentLoaded', function() {
const codeList = document.getElementsByClassName("sourceCode");
for (var i = 0; i < codeList.length; i++) {
var linkList = codeList[i].getElementsByTagName('a');
for (var j = 0; j < linkList.length; j++) {
if (linkList[j].innerHTML === "") {
linkList[j].setAttribute('aria-hidden', 'true');
}
}
}
});
================================================
FILE: docs/articles/intro_inputs.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Authoring inputs powered by React with reactR • reactR</title>
<!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="../favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicon-32x32.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="../apple-touch-icon.png">
<link rel="apple-touch-icon" type="image/png" sizes="120x120" href="../apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" type="image/png" sizes="76x76" href="../apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" type="image/png" sizes="60x60" href="../apple-touch-icon-60x60.png">
<!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="../bootstrap-toc.css">
<script src="../bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous">
<!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet">
<script src="../pkgdown.js"></script><meta property="og:title" content="Authoring inputs powered by React with reactR">
<meta property="og:description" content="reactR">
<!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target="#toc">
<div class="container template-article">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="../index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>
<a href="../reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="../articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul>
</li>
<li>
<a href="../news/index.html">Changelog</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
<!--/.container -->
</div>
<!--/.navbar -->
</header><div class="row">
<div class="col-md-9 contents">
<div class="page-header toc-ignore">
<h1 data-toc-skip>Authoring inputs powered by React with
reactR</h1>
<h4 data-toc-skip class="author">Alan Dipert and
Carson Sievert</h4>
<h4 data-toc-skip class="date">2024-09-14</h4>
<small class="dont-index">Source: <a href="https://github.com/react-R/reactR/blob/HEAD/vignettes/intro_inputs.Rmd" class="external-link"><code>vignettes/intro_inputs.Rmd</code></a></small>
<div class="hidden name"><code>intro_inputs.Rmd</code></div>
</div>
<p><a href="https://shiny.posit.co/" class="external-link">Shiny</a> comes with a large
library of input <a href="https://shiny.posit.co/r/gallery/widgets/widget-gallery/" class="external-link">widgets</a>
for collecting input from the user and conveying input data to R.</p>
<p>If you want a kind of input <em>not</em> provided by Shiny — like a
color picker, or a different kind of slider — you’ve always been able to
build your own. Shiny’s input system is <a href="https://shiny.rstudio.com/articles/building-inputs.html" class="external-link">extensible</a>.
All that’s required is an understanding of certain conventions and a
little custom JavaScript.</p>
<p>reactR provides additional tools to ease the creation of new Shiny
inputs implemented using React. In the following tutorial, we will
demonstrate these tools by implementing a new Shiny color picker input
that wraps the <a href="https://github.com/casesandberg/react-color" class="external-link">react-color</a>
library.</p>
<div class="section level2">
<h2 id="software-pre-requisites">Software pre-requisites<a class="anchor" aria-label="anchor" href="#software-pre-requisites"></a>
</h2>
<p>In order to develop a <strong>reactR</strong> Shiny input, you’ll
need to install R and optionally RStudio. If you’re on Windows, you
should also install <a href="https://cran.r-project.org/bin/windows/Rtools/" class="external-link">Rtools</a>.</p>
<blockquote>
<p>For an excellent general introduction to R package concepts, check
out the <a href="https://r-pkgs.org/" class="external-link">R packages</a> online book.</p>
</blockquote>
<p>In addition, you’ll need to install the following JavaScript tools on
your machine:</p>
<ul>
<li>
<a href="https://nodejs.org" class="external-link">Node.js</a>: JavaScript engine and
runtime for development outside of browsers. Provides the
<code>node</code> and <code>npm</code> commands.</li>
<li>
<a href="https://classic.yarnpkg.com/en/" class="external-link">Yarn</a>: Command-line
dependency management tool, provides the <code>yarn</code> command.</li>
</ul>
<p>To follow along in this vignette, you’ll also need the following R
packages:</p>
<div class="sourceCode" id="cb1"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu"><a href="https://rdrr.io/r/utils/install.packages.html" class="external-link">install.packages</a></span><span class="op">(</span><span class="fu"><a href="https://rdrr.io/r/base/c.html" class="external-link">c</a></span><span class="op">(</span><span class="st">"shiny"</span>, <span class="st">"devtools"</span>, <span class="st">"usethis"</span>, <span class="st">"reactR"</span><span class="op">)</span><span class="op">)</span></span></code></pre></div>
</div>
<div class="section level2">
<h2 id="scaffolding">Scaffolding<a class="anchor" aria-label="anchor" href="#scaffolding"></a>
</h2>
<p>To create a new widget you can call
<code>scaffoldReactShinyInput</code> to generate the basic structure and
build configuration. This function will:</p>
<ul>
<li>Create the .R, .js, and .json files required by your input;</li>
<li>If provided, take an <a href="https://www.npmjs.com/" class="external-link">npm</a>
package name and version as a named list with <code>name</code> and
<code>version</code> elements. For example, the npm package
<code>foo</code> at version <code>^1.2.0</code> would be expressed as
<code>list(name = "foo", version = "^1.2.0")</code>. The package, if
provided, will be added to the new widget’s <code>package.json</code> as
a build dependency.</li>
</ul>
<p>The following R code will create an R package named
<strong>colorpicker</strong>, then provide the templating for creating
an input powered by the <code>react-color</code> library on npm:</p>
<div class="sourceCode" id="cb2"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="co"># Create the R package (rstudio=TRUE is recommended if you're not already comfortable with your terminal)</span></span>
<span><span class="fu">usethis</span><span class="fu">::</span><span class="fu"><a href="https://usethis.r-lib.org/reference/create_package.html" class="external-link">create_package</a></span><span class="op">(</span><span class="st">"~/colorpicker"</span>, rstudio <span class="op">=</span> <span class="cn">TRUE</span><span class="op">)</span></span>
<span><span class="co"># Scaffold initial input implementation files</span></span>
<span><span class="fu">withr</span><span class="fu">::</span><span class="fu"><a href="https://withr.r-lib.org/reference/with_dir.html" class="external-link">with_dir</a></span><span class="op">(</span></span>
<span> <span class="st">"~/colorpicker"</span>,</span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/scaffoldReactShinyInput.html">scaffoldReactShinyInput</a></span><span class="op">(</span><span class="st">"colorpicker"</span>, <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span><span class="st">"react-color"</span> <span class="op">=</span> <span class="st">"^2.17.0"</span><span class="op">)</span>, edit <span class="op">=</span> <span class="cn">FALSE</span><span class="op">)</span></span>
<span><span class="op">)</span></span></code></pre></div>
</div>
<div class="section level2">
<h2 id="building-and-installing">Building and installing<a class="anchor" aria-label="anchor" href="#building-and-installing"></a>
</h2>
<div class="section level3">
<h3 id="building-the-javascript">Building the JavaScript<a class="anchor" aria-label="anchor" href="#building-the-javascript"></a>
</h3>
<p>The next step is to navigate to the newly-created
<code>colorpicker</code> project and run the following commands in the
terminal. If you’re new the terminal, we recommend opening your newly
created RStudio <code>~/colorpicker/colorpicker.Rproj</code> project
file, then running the following in the RStudio terminal tab:</p>
<pre><code>yarn install
yarn run webpack</code></pre>
<ul>
<li><p><code>yarn install</code> downloads all of the dependencies
listed in <code>package.json</code> and creates a new file,
<code>yarn.lock</code>. You should add this file to revision control. It
will be updated whenever you change dependencies and run
<code>yarn install</code>. <strong>Note: you only need to run it after
modifying package.json</strong>. For further documentation on
<code>yarn install</code>, see the <a href="https://classic.yarnpkg.com/en/docs/cli/install/" class="external-link">yarn
documentation</a>.</p></li>
<li><p><code>yarn run webpack</code> compiles the <a href="https://babeljs.io/docs/en/babel-preset-env" class="external-link">modern JavaScript</a>
with <a href="https://babeljs.io/docs/en/babel-preset-react" class="external-link">JSX</a>
source file at <code>srcjs/colorpicker.jsx</code> into
<code>www/colorpicker/colorpicker/colorpicker.js</code>. The latter file
is the one actually used by the R package and includes all the relevant
JavaScript dependencies in a dialect of JavaScript that most browsers
understand.</p></li>
</ul>
<p><code>yarn run webpack</code> is not strictly a <code>yarn</code>
command. In fact, <code>yarn run</code> simply delegates to the <a href="https://webpack.js.org/" class="external-link">webpack</a> program. Webpack’s
configuration is generated by <code>scaffoldReactShinyInput</code> in
the file <code>webpack.config.js</code>, but you can always change this
configuration and/or modify the <code>yarn run webpack</code> command to
suit your needs.</p>
</div>
<div class="section level3">
<h3 id="installing-the-r-package">Installing the R package<a class="anchor" aria-label="anchor" href="#installing-the-r-package"></a>
</h3>
<p>Now that the input’s JavaScript is compiled, go ahead and install the
R package:</p>
<div class="sourceCode" id="cb4"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu">devtools</span><span class="fu">::</span><span class="fu"><a href="https://devtools.r-lib.org/reference/document.html" class="external-link">document</a></span><span class="op">(</span><span class="op">)</span></span>
<span><span class="fu">devtools</span><span class="fu">::</span><span class="fu"><a href="https://devtools.r-lib.org/reference/install.html" class="external-link">install</a></span><span class="op">(</span>quick <span class="op">=</span> <span class="cn">TRUE</span><span class="op">)</span></span></code></pre></div>
<p>In RStudio, you can use the keyboard shortcuts
<code>Ctrl-Shift-D</code> and <code>Ctrl-Shift-B</code> to document and
build the package. (On macOS, the shortcuts are <code>Cmd-Shift-D</code>
and <code>Cmd-Shift-B</code>)</p>
</div>
</div>
<div class="section level2">
<h2 id="run-the-included-demo">Run the included demo<a class="anchor" aria-label="anchor" href="#run-the-included-demo"></a>
</h2>
<p>Now that the input’s JavaScript is compiled, and the R package is
installed, run <code>app.R</code> to see a demo in action:</p>
<div class="sourceCode" id="cb5"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu">shiny</span><span class="fu">::</span><span class="fu"><a href="https://rdrr.io/pkg/shiny/man/runApp.html" class="external-link">runApp</a></span><span class="op">(</span><span class="op">)</span></span></code></pre></div>
<p>In RStudio, you can open <code>app.R</code> and press
<code>Ctrl-Shift-Enter</code> (<code>Cmd-Shift-Enter</code> on macOS).
You should see something like the following appear in the Viewer
pane:</p>
<p><img src="input_app.jpg"></p>
</div>
<div class="section level2">
<h2 id="authoring-a-react-input">Authoring a React input<a class="anchor" aria-label="anchor" href="#authoring-a-react-input"></a>
</h2>
<p>At this point, we have a working (if simple) React-powered text
input. Let’s modify it to create an interface to the
<code>react-color</code> library.</p>
<div class="section level3">
<h3 id="connecting-shiny-with-react">Connecting Shiny with React<a class="anchor" aria-label="anchor" href="#connecting-shiny-with-react"></a>
</h3>
<p>Consider the following example taken from the <a href="http://casesandberg.github.io/react-color/" class="external-link">react-color
documentation</a>.</p>
<div class="sourceCode" id="cb6"><pre class="sourceCode js"><code class="sourceCode javascript"><span id="cb6-1"><a href="#cb6-1" tabindex="-1"></a><span class="im">import</span> React <span class="im">from</span> <span class="st">'react'</span><span class="op">;</span></span>
<span id="cb6-2"><a href="#cb6-2" tabindex="-1"></a><span class="im">import</span> { SketchPicker } <span class="im">from</span> <span class="st">'react-color'</span><span class="op">;</span></span>
<span id="cb6-3"><a href="#cb6-3" tabindex="-1"></a></span>
<span id="cb6-4"><a href="#cb6-4" tabindex="-1"></a><span class="kw">class</span> Component <span class="kw">extends</span> React<span class="op">.</span><span class="at">Component</span> {</span>
<span id="cb6-5"><a href="#cb6-5" tabindex="-1"></a></span>
<span id="cb6-6"><a href="#cb6-6" tabindex="-1"></a> <span class="fu">render</span>() {</span>
<span id="cb6-7"><a href="#cb6-7" tabindex="-1"></a> <span class="cf">return</span> <span class="op"><</span>SketchPicker <span class="op">/>;</span></span>
<span id="cb6-8"><a href="#cb6-8" tabindex="-1"></a> }</span>
<span id="cb6-9"><a href="#cb6-9" tabindex="-1"></a>}</span></code></pre></div>
<p>That JavaScript code produces a <code>SketchPicker</code>-type
interface that looks like this:</p>
<p><img src="input_sketchpicker.jpg"></p>
<p>However, that example doesn’t demonstrate a way to default to a
particular color, or a way to cause something to happen when the color
changes. To accomplish these, <code>react-color</code> components can <a href="http://casesandberg.github.io/react-color/#api" class="external-link">optionally
take</a> the following <a href="https://reactjs.org/docs/components-and-props.html" class="external-link">props</a>:</p>
<ul>
<li>
<a href="http://casesandberg.github.io/react-color/#api-color" class="external-link"><code>color</code></a>:
accepts a string of a hex color like <code>'#333'</code>
</li>
<li>
<a href="http://casesandberg.github.io/react-color/#api-onChangeComplete" class="external-link"><code>onChangeComplete</code></a>:
accepts a JavaScript function taking a single argument, the new
<code>color</code>, that will be called when the new color is
selected</li>
</ul>
<p>Since this React component calls a configurable function (i.e.,
<code>onChangeComplete</code>) when the input (i.e., color) value
changes, we can supply a function to inform Shiny about these changes.
You could, in theory, do this by writing your own custom Shiny input
wrapper around this component, but <code>reactR</code> provides some
conventions to make it much easier. These conventions have two main
parts (R and JavaScript):</p>
<ol style="list-style-type: decimal">
<li>Use <code><a href="../reference/createReactShinyInput.html">reactR::createReactShinyInput()</a></code> to construct the
user-facing R input and route any user-supplied options (e.g., the
<code>default</code> input value and other <code>configuration</code>)
to the React component. This part was already done for us in the
<code>R/colorpicker.R</code> file of our colorpicker project:</li>
</ol>
<div class="sourceCode" id="cb7"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="va">colorpickerInput</span> <span class="op"><-</span> <span class="kw">function</span><span class="op">(</span><span class="va">inputId</span>, <span class="va">default</span> <span class="op">=</span> <span class="st">""</span><span class="op">)</span> <span class="op">{</span></span>
<span> <span class="fu">reactR</span><span class="fu">::</span><span class="fu"><a href="../reference/createReactShinyInput.html">createReactShinyInput</a></span><span class="op">(</span></span>
<span> inputId <span class="op">=</span> <span class="va">inputId</span>,</span>
<span> class <span class="op">=</span> <span class="st">"colorpicker"</span>,</span>
<span> dependencies <span class="op">=</span> <span class="fu">htmltools</span><span class="fu">::</span><span class="fu"><a href="https://rstudio.github.io/htmltools/reference/htmlDependency.html" class="external-link">htmlDependency</a></span><span class="op">(</span></span>
<span> name <span class="op">=</span> <span class="st">"colorpicker-input"</span>,</span>
<span> version <span class="op">=</span> <span class="st">"1.0.0"</span>,</span>
<span> src <span class="op">=</span> <span class="st">"www/colorpicker/colorpicker"</span>,</span>
<span> package <span class="op">=</span> <span class="st">"colorpicker"</span>,</span>
<span> script <span class="op">=</span> <span class="st">"colorpicker.js"</span></span>
<span> <span class="op">)</span>,</span>
<span> default <span class="op">=</span> <span class="va">default</span>,</span>
<span> configuration <span class="op">=</span> <span class="fu"><a href="https://rdrr.io/r/base/list.html" class="external-link">list</a></span><span class="op">(</span><span class="op">)</span>,</span>
<span> container <span class="op">=</span> <span class="fu">htmltools</span><span class="fu">::</span><span class="va"><a href="https://rstudio.github.io/htmltools/reference/builder.html" class="external-link">tags</a></span><span class="op">$</span><span class="va">span</span></span>
<span> <span class="op">)</span></span>
<span><span class="op">}</span></span></code></pre></div>
<ol start="2" style="list-style-type: decimal">
<li>Design an <em>intermediate</em> React component that routes
information from <code>colorpickerInput()</code> to the
<code><SketchPicker></code> component and also inform Shiny when a
new color is chosen. This intermediate component should be a <a href="https://reactjs.org/docs/components-and-props.html#function-and-class-components" class="external-link">functional
component</a> with three arguments:</li>
</ol>
<ul>
<li>
<code>configuration</code>: The JSON equivalent of the
<code>configuration</code> argument from
<code><a href="../reference/createReactShinyInput.html">reactR::createReactShinyInput()</a></code>. In this particular
example, <code>configuration</code> isn’t used.</li>
<li>
<code>value</code>: The input’s values over time, beginning with the
<code>default</code> supplied from
<code><a href="../reference/createReactShinyInput.html">reactR::createReactShinyInput()</a></code>.</li>
<li>
<code>setValue</code>: A JavaScript function to call with the
input’s new value when one is created. This function is not user
supplied, but rather an internal hook for informing Shiny about changes
to the component’s current state (i.e. value).</li>
</ul>
<p>Consider the following intermediate component,
<code>PickerInput</code>. Note how this intermediate component allows
one to set the default <code>value</code> from R and also calls
<code>setValue()</code> inside <code>onChangeComplete</code> in order to
inform Shiny about new color values. Finally,
<code>reactR.reactShinyInput()</code> registers this intermediate
component as a custom Shiny input binding named
<code>colorpicker</code>.</p>
<div class="sourceCode" id="cb8"><pre class="sourceCode js"><code class="sourceCode javascript"><span id="cb8-1"><a href="#cb8-1" tabindex="-1"></a><span class="im">import</span> { reactShinyInput } <span class="im">from</span> <span class="st">'reactR'</span><span class="op">;</span></span>
<span id="cb8-2"><a href="#cb8-2" tabindex="-1"></a><span class="im">import</span> { SketchPicker } <span class="im">from</span> <span class="st">'react-color'</span><span class="op">;</span></span>
<span id="cb8-3"><a href="#cb8-3" tabindex="-1"></a></span>
<span id="cb8-4"><a href="#cb8-4" tabindex="-1"></a><span class="kw">const</span> PickerInput <span class="op">=</span> ({ configuration<span class="op">,</span> value<span class="op">,</span> setValue }) <span class="kw">=></span> {</span>
<span id="cb8-5"><a href="#cb8-5" tabindex="-1"></a> <span class="cf">return</span> (</span>
<span id="cb8-6"><a href="#cb8-6" tabindex="-1"></a> <span class="op"><</span>SketchPicker</span>
<span id="cb8-7"><a href="#cb8-7" tabindex="-1"></a> color<span class="op">=</span>{ value }</span>
<span id="cb8-8"><a href="#cb8-8" tabindex="-1"></a> onChangeComplete<span class="op">=</span>{ color <span class="kw">=></span> <span class="fu">setValue</span>(color<span class="op">.</span><span class="at">hex</span>) }</span>
<span id="cb8-9"><a href="#cb8-9" tabindex="-1"></a> <span class="op">/></span></span>
<span id="cb8-10"><a href="#cb8-10" tabindex="-1"></a> )<span class="op">;</span></span>
<span id="cb8-11"><a href="#cb8-11" tabindex="-1"></a>}<span class="op">;</span></span>
<span id="cb8-12"><a href="#cb8-12" tabindex="-1"></a></span>
<span id="cb8-13"><a href="#cb8-13" tabindex="-1"></a><span class="co">// Note the first argument here should match the `class` </span></span>
<span id="cb8-14"><a href="#cb8-14" tabindex="-1"></a><span class="co">// argument of the reactR::createReactShinyInput() from step 1</span></span>
<span id="cb8-15"><a href="#cb8-15" tabindex="-1"></a><span class="fu">reactShinyInput</span>(<span class="st">'.colorpicker'</span><span class="op">,</span> <span class="st">'colorpicker'</span><span class="op">,</span> PickerInput)<span class="op">;</span></span></code></pre></div>
<p>Open the <code>srcjs/colorpicker.jsx</code> file in your colorpicker
project and paste this code into it. After saving the file, run
<code>yarn run webpack</code> in the terminal, re-install the package,
then run <code><a href="https://rdrr.io/pkg/shiny/man/runApp.html" class="external-link">shiny::runApp()</a></code> again</p>
<video autoplay muted><source src="./input_sketchpicker.mp4"></source></video><p>When you select new colors, you should see the
<code>textOutput</code> update accordingly.</p>
<p>You might have noticed that the input showed up initially without a
color selected. That’s because in <code>app.R</code> we didn’t supply a
<code>default</code> argument to the <code>colorpickerInput</code>
function inside our <code>ui</code>.</p>
<p>Try replacing the call to <code>colorpickerInput</code> with this:
<code>colorpickerInput("textInput", default = "#a76161")</code></p>
<p>Now when you run the app, the color should start as a shade of
red.</p>
</div>
</div>
<div class="section level2">
<h2 id="further-learning">Further learning<a class="anchor" aria-label="anchor" href="#further-learning"></a>
</h2>
<p>This tutorial walked you through the steps taken to wrap the
<code>react-color</code> library in a Shiny input. The full example
package is accessible at <a href="https://github.com/react-R/colorpicker-example" class="external-link uri">https://github.com/react-R/colorpicker-example</a>. Our
intention is keep creating example packages under the <a href="https://github.com/react-R" class="external-link uri">https://github.com/react-R</a> organization, so head there
if you’d like to see other examples of interfacing with React.</p>
</div>
</div>
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
<nav id="toc" data-toggle="toc"><h2 data-toc-skip>Contents</h2>
</nav>
</div>
</div>
<footer><div class="copyright">
<p></p>
<p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p>
<p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer>
</div>
</body>
</html>
================================================
FILE: docs/articles/intro_inputs_files/accessible-code-block-0.0.1/empty-anchor.js
================================================
// Hide empty <a> tag within highlighted CodeBlock for screen reader accessibility (see https://github.com/jgm/pandoc/issues/6352#issuecomment-626106786) -->
// v0.0.1
// Written by JooYoung Seo (jooyoung@psu.edu) and Atsushi Yasumoto on June 1st, 2020.
document.addEventListener('DOMContentLoaded', function() {
const codeList = document.getElementsByClassName("sourceCode");
for (var i = 0; i < codeList.length; i++) {
var linkList = codeList[i].getElementsByTagName('a');
for (var j = 0; j < linkList.length; j++) {
if (linkList[j].innerHTML === "") {
linkList[j].setAttribute('aria-hidden', 'true');
}
}
}
});
================================================
FILE: docs/articles/intro_reactR.html
================================================
<!DOCTYPE html>
<!-- Generated by pkgdown: do not edit by hand --><html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Intro to reactR • reactR</title>
<!-- favicons --><link rel="icon" type="image/png" sizes="16x16" href="../favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicon-32x32.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="../apple-touch-icon.png">
<link rel="apple-touch-icon" type="image/png" sizes="120x120" href="../apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" type="image/png" sizes="76x76" href="../apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" type="image/png" sizes="60x60" href="../apple-touch-icon-60x60.png">
<!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="../bootstrap-toc.css">
<script src="../bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous">
<!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet">
<script src="../pkgdown.js"></script><meta property="og:title" content="Intro to reactR">
<meta property="og:description" content="reactR">
<!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target="#toc">
<div class="container template-article">
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand">
<a class="navbar-link" href="../index.html">reactR</a>
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">0.6.1</span>
</span>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>
<a href="../reference/index.html">Reference</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Articles
<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="../articles/intro_htmlwidgets.html">Authoring htmlwidgets powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_inputs.html">Authoring inputs powered by React with reactR</a>
</li>
<li>
<a href="../articles/intro_reactR.html">Intro to reactR</a>
</li>
</ul>
</li>
<li>
<a href="../news/index.html">Changelog</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="https://github.com/react-R/reactR/" class="external-link">
<span class="fab fa-github fa-lg"></span>
</a>
</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
<!--/.container -->
</div>
<!--/.navbar -->
</header><script src="intro_reactR_files/react-18.2.0/react.min.js"></script><script src="intro_reactR_files/react-18.2.0/react-dom.min.js"></script><div class="row">
<div class="col-md-9 contents">
<div class="page-header toc-ignore">
<h1 data-toc-skip>Intro to reactR</h1>
<h4 data-toc-skip class="author">Kent
Russell</h4>
<h4 data-toc-skip class="date">2024-09-14</h4>
<small class="dont-index">Source: <a href="https://github.com/react-R/reactR/blob/HEAD/vignettes/intro_reactR.Rmd" class="external-link"><code>vignettes/intro_reactR.Rmd</code></a></small>
<div class="hidden name"><code>intro_reactR.Rmd</code></div>
</div>
<div class="section level2">
<h2 id="why-reactr">Why reactR?<a class="anchor" aria-label="anchor" href="#why-reactr"></a>
</h2>
<p><a href="https://reactjs.org/" class="external-link"><code>react</code></a> has become
incredibly popular, and the ecosystem around <code>react</code> is
robust. <code>reactR</code> aims to allow <code>R</code> users to more
easily incorporate <code>react</code> and <code>JSX</code>.</p>
</div>
<div class="section level2">
<h2 id="install">Install<a class="anchor" aria-label="anchor" href="#install"></a>
</h2>
<pre><code><span><span class="fu"><a href="https://rdrr.io/r/utils/install.packages.html" class="external-link">install.packages</a></span><span class="op">(</span><span class="st">"reactR"</span><span class="op">)</span></span>
<span></span>
<span><span class="co"># for the latest development version</span></span>
<span><span class="co"># install from Github</span></span>
<span><span class="co"># devtools::install_github("timelyportfolio/reactR")</span></span></code></pre>
</div>
<div class="section level2">
<h2 id="quick-example">Quick Example<a class="anchor" aria-label="anchor" href="#quick-example"></a>
</h2>
<p>Let’s use <code>react</code> to render a simple <code>h1</code> HTML
element below.</p>
<div id="react-heading-here">
</div>
<div class="sourceCode" id="cb2"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="kw"><a href="https://rdrr.io/r/base/library.html" class="external-link">library</a></span><span class="op">(</span><span class="va"><a href="https://github.com/react-R/reactR" class="external-link">reactR</a></span><span class="op">)</span></span>
<span><span class="kw"><a href="https://rdrr.io/r/base/library.html" class="external-link">library</a></span><span class="op">(</span><span class="va"><a href="https://github.com/rstudio/htmltools" class="external-link">htmltools</a></span><span class="op">)</span></span></code></pre></div>
<pre><code><span><span class="co">## Warning: package 'htmltools' was built under R version 4.3.3</span></span></code></pre>
<div class="sourceCode" id="cb4"><pre class="downlit sourceCode r">
<code class="sourceCode R"><span><span class="fu"><a href="https://rstudio.github.io/htmltools/reference/htmlDependencies.html" class="external-link">attachDependencies</a></span><span class="op">(</span></span>
<span> <span class="va">tags</span><span class="op">$</span><span class="fu">script</span><span class="op">(</span></span>
<span> <span class="st">"</span></span>
<span><span class="st"> ReactDOM.render(</span></span>
<span><span class="st"> React.createElement(</span></span>
<span><span class="st"> 'h1',</span></span>
<span><span class="st"> null,</span></span>
<span><span class="st"> 'Powered by React'</span></span>
<span><span class="st"> ),</span></span>
<span><span class="st"> document.getElementById('react-heading-here')</span></span>
<span><span class="st"> )</span></span>
<span><span class="st"> "</span></span>
<span> <span class="op">)</span>,</span>
<span> <span class="fu"><a href="../reference/html_dependency_react.html">html_dependency_react</a></span><span class="op">(</span><span class="op">)</span></span>
<span><span class="op">)</span></span></code></pre></div>
<script>
ReactDOM.render(
React.createElement(
'h1',
null,
'Powered by React'
),
document.getElementById('react-heading-here')
)
</script>
</div>
<div class="section level2">
<h2 id="blog-post">Blog Post<a class="anchor" aria-label="anchor" href="#blog-post"></a>
</h2>
<p>For more on how we can use R and React, see the blog post <a href="https://www.jsinr.me/2017/11/19/react-in-r/" class="external-link">React in R</a>. Also,
there are many more examples in the Github repo at <a href="https://github.com/react-R/reactR/tree/master/inst/examples" class="external-link">inst/examples</a>.</p>
</div>
<div class="section level2">
<h2 id="using-jsx">Using JSX<a class="anchor" aria-label="anchor" href="#using-jsx"></a>
</h2>
<p><a href="https://reactjs.org/docs/jsx-in-depth.html" class="external-link"><code>JSX</code></a>
helps ease some of the burden caused by
<code>React.createElement</code>. <code>reactR</code> provides a
<code><a href="../reference/babel_transform.html">babel_transform()</a></code> function to use <code>JSX</code>.
Hopefully, in the future, we can convince RStudio to modify
<code>htmltools</code> to work directly with <code>JSX</code> (see <a href="https://github.com/rstudio/htmltools/pull/72" class="external-link">issue</a>).</p>
</div>
</div>
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
<nav id="toc" data-toggle="toc"><h2 data-toc-skip>Contents</h2>
</nav>
</div>
</div>
<footer><div class="copyright">
<p></p>
<p>Developed by Facebook Inc, Michel Weststrate, Kent Russell, Alan Dipert, Greg Lin.</p>
</div>
<div class="pkgdown">
<p></p>
<p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.0.7.</p>
</div>
</footer>
</div>
</body>
</html>
================================================
FILE: docs/articles/intro_reactR_files/accessible-code-block-0.0.1/empty-anchor.js
================================================
// Hide empty <a> tag within highlighted CodeBlock for screen reader accessibility (see https://github.com/jgm/pandoc/issues/6352#issuecomment-626106786) -->
// v0.0.1
// Written by JooYoung Seo (jooyoung@psu.edu) and Atsushi Yasumoto on June 1st, 2020.
document.addEventListener('DOMContentLoaded', function() {
const codeList = document.getElementsByClassName("sourceCode");
for (var i = 0; i < codeList.length; i++) {
var linkList = codeList[i].getElementsByTagName('a');
for (var j = 0; j < linkList.length; j++) {
if (linkList[j].innerHTML === "") {
linkList[j].setAttribute('aria-hidden', 'true');
}
}
}
});
================================================
FILE: docs/articles/intro_reactR_files/react-16.12.0/AUTHORS
================================================
39 <8398a7@gmail.com>
Aaron Franks <aaron.franks@gmail.com>
Aaron Gelter <aaron.gelter@harman.com>
Adam Bloomston <adam@glitterfram.es>
Adam Krebs <amk528@cs.nyu.edu>
Adam Mark <adammark75@gmail.com>
Adam Solove <asolove@gmail.com>
Adam Timberlake <adam.timberlake@gmail.com>
Adam Zapletal <adamzap@gmail.com>
Ahmad Wali Sidiqi <wali-s@users.noreply.github.com>
Alan Plum <me@pluma.io>
Alan Souza <alansouzati@gmail.com>
Alan deLevie <adelevie@gmail.com>
Alastair Hole <afhole@gmail.com>
Alex <ultrafez@users.noreply.github.com>
Alex Boatwright <drdelambre@gmail.com>
Alex Boyd <alex@opengroove.org>
Alex Dajani <xelad1@gmail.com>
Alex Lopatin <alex@alexlopatin.com>
Alex Mykyta <dancingwithcows@gmail.com>
Alex Pien <alexpien@gmail.com>
Alex Smith <iqwz@ya.ru>
Alex Zelenskiy <azelenskiy@fb.com>
Alexander Shtuchkin <ashtuchkin@gmail.com>
Alexander Solovyov <alexander@solovyov.net>
Alexander Tseung <alextsg@gmail.com>
Alexandre Gaudencio <shahor@shahor.fr>
Alexey Raspopov <avenger7x13@gmail.com>
Alexey Shamrin <shamrin@gmail.com>
Ali Ukani <ali.ukani@gmail.com>
Andre Z Sanchez <andrezacsanchez@gmail.com>
Andreas Savvides <asavvides@twitter.com>
Andreas Svensson <andreas@syranide.com>
Andres Kalle <mjomble@gmail.com>
Andres Suarez <zertosh@gmail.com>
Andrew Clark <acdlite@me.com>
Andrew Cobby <cobbweb@users.noreply.github.com>
Andrew Davey <andrew@equin.co.uk>
Andrew Henderson <andrew.m.henderson@gmail.com>
Andrew Kulakov <avk@8xx8.ru>
Andrew Rasmussen <andras@fb.com>
Andrew Sokolov <asokolov@atlassian.com>
Andrew Zich <azich@fb.com>
Andrey Popp <8mayday@gmail.com>
Anthony van der Hoorn <anthony.vanderhoorn@gmail.com>
Anto Aravinth <anto.aravinth.cse@gmail.com>
Antonio Ruberto <anto.ruberto@gmail.com>
Antti Ahti <antti.ahti@gmail.com>
Anuj Tomar <ankuto@gmail.com>
AoDev <AoDev@users.noreply.github.com>
April Arcus <april.arcus@gmail.com>
Areeb Malik <areeb.malik91@gmail.com>
Aria Buckles <aria@khanacademy.org>
Aria Stewart <aredridel@dinhe.net>
Arian Faurtosh <arian@icloud.com>
Artem Nezvigin <artem@artnez.com>
Austin Wright <aaa@bzfx.net>
Ayman Osman <aymano.osman@gmail.com>
Baraa Hamodi <bhamodi@uwaterloo.ca>
Bartosz Kaszubowski <gosimek@gmail.com>
Basarat Ali Syed <basaratali@gmail.com>
Battaile Fauber <battaile@gmail.com>
Beau Smith <beau@beausmith.com>
Ben Alpert <ben@benalpert.com>
Ben Anderson <banderson@constantcontact.com>
Ben Brooks <ben@benbrooks.net>
Ben Foxall <benfoxall@gmail.com>
Ben Halpern <bendhalpern@gmail.com>
Ben Jaffe <jaffe.ben@gmail.com>
Ben Moss <ben@mossity.com>
Ben Newman <bn@cs.stanford.edu>
Ben Ripkens <bripkens.dev@gmail.com>
Benjamin Keen <ben.keen@gmail.com>
Benjamin Leiken <benleiken@gmail.com>
Benjamin Woodruff <github@benjam.info>
Benjy Cui <benjytrys@gmail.com>
Bill Blanchard <bill@plumbdev.com>
Bill Fisher <fisherwebdev@gmail.com>
Blaine Hatab <jbhatab@gmail.com>
Blaine Kasten <blainekasten@gmail.com>
Bob Eagan <bob@synapsestudios.com>
Bob Ralian <bob.ralian@gmail.com>
Bob Renwick <bob.renwick@gmail.com>
Bobby <puppybytes@gmail.com>
Bojan Mihelac <bmihelac@mihelac.org>
Bradley Spaulding <brad.spaulding@gmail.com>
Brandon Bloom <brandon@brandonbloom.name>
Brandon Tilley <brandon@brandontilley.com>
Brenard Cubacub <bcbcb@users.noreply.github.com>
Brian Cooke <bri@bricooke.com>
Brian Holt <btholt@gmail.com>
Brian Hsu <brianhsu@Brians-MacBook-Pro.local>
Brian Kim <briankimpossible@gmail.com>
Brian Kung <brian@callmekung.com>
Brian Reavis <brian@thirdroute.com>
Brian Rue <brian@rollbar.com>
Bruno Škvorc <bruno@skvorc.me>
Cam Song <neosoyn@gmail.com>
Cam Spiers <camspiers@gmail.com>
Cameron Chamberlain <git@camjc.com>
Cameron Matheson <cameron@instructure.com>
Carter Chung <carterchung@users.noreply.github.com>
Cassus Adam Banko <banko.adam@gmail.com>
Cat Chen <catchen@fb.com>
Cedric Sohrauer <cedric.sohrauer@infopark.de>
Cesar William Alvarenga <cesarwbr@gmail.com>
Changsoon Bok <winmain@gmail.com>
Charles Marsh <charlie@khanacademy.org>
Chase Adams <realchaseadams@gmail.com>
Cheng Lou <chenglou92@gmail.com>
Chitharanjan Das <das.chitharanjan@gmail.com>
Chris Bolin <bolin.chris@gmail.com>
Chris Grovers <chrisgrovers@users.noreply.github.com>
Chris Ha <chriskevinha@gmail.com>
Chris Rebert <github@rebertia.com>
Chris Sciolla <csciolla1@gmail.com>
Christian Alfoni <christianalfoni@gmail.com>
Christian Oliff <christianoliff@yahoo.com>
Christian Roman <chroman16@gmail.com>
Christoffer Sawicki <christoffer.sawicki@gmail.com>
Christoph Pojer <christoph.pojer@gmail.com>
Christopher Monsanto <chris@monsan.to>
Clay Allsopp <clay.allsopp@gmail.com>
Connor McSheffrey <c@conr.me>
Conor Hastings <hastings.conorm@gmail.com>
Cory House <housecor@gmail.com>
Cotton Hou <himcotton@gmail.com>
Craig Akimoto <strawbrary@users.noreply.github.com>
Cristovao Verstraeten <cristovao@apleasantview.com>
Damien Pellier <dpellier@leadformance.com>
Dan Abramov <dan.abramov@gmail.com>
Dan Fox <iamdanfox@gmail.com>
Dan Schafer <dschafer@fb.com>
Daniel Carlsson <daniel.carlsson.1987@gmail.com>
Daniel Cousens <dcousens@users.noreply.github.com>
Daniel Friesen <daniel@nadir-seen-fire.com>
Daniel Gasienica <daniel@gasienica.ch>
Daniel Hejl <daniel.hejl@hotmail.com>
Daniel Hejl <hejldaniel@gmail.com>
Daniel Lo Nigro <daniel@dan.cx>
Daniel Mané <danmane@gmail.com>
Daniel Miladinov <dmiladinov@wingspan.com>
Daniel Rodgers-Pryor <djrodgerspryor@gmail.com>
Daniel Schonfeld <daniel@schonfeld.org>
Danny Ben-David <dannybd@fb.com>
Darcy <smadad@me.com>
Daryl Lau <daryl@weak.io>
Darío Javier Cravero <dario@uxtemple.com>
Dave Galbraith <dave@jut.io>
David Baker <djbaker2@gmail.com>
David Ed Mellum <david@edmellum.com>
David Goldberg <gberg1@users.noreply.github.com>
David Granado <davidjgranado@gmail.com>
David Greenspan <dgreenspan@alum.mit.edu>
David Hellsing <david@aino.se>
David Hu <davidhu91@gmail.com>
David Khourshid <davidkpiano@gmail.com>
David Mininger <dmininger@gmail.com>
David Neubauer <davidneub@gmail.com>
David Percy <davetp425@gmail.com>
Dean Shi <dnshi@users.noreply.github.com>
Denis Sokolov <denis@sokolov.cc>
Deniss Jacenko <deniss.jacenko+github@gmail.com>
Dennis Johnson <djohnson@rallydev.com>
Devon Blandin <dblandin@gmail.com>
Devon Harvey <devonharvey@gmail.com>
Dmitrii Abramov <dmitrii@rheia.us>
Dmitriy Rozhkov <dmitriy.rozhkov@xing.com>
Dmitry Blues <dmitri.blyus@gmail.com>
Dmitry Mazuro <dmitry.mazuro@icloud.com>
Domenico Matteo <matteo.domenico@gmail.com>
Don Abrams <donabrams@gmail.com>
Dongsheng Liu <bellanchor@gmail.com>
Dustan Kasten <dustan.kasten@gmail.com>
Dustin Getz <dgetz@wingspan.com>
Dylan Harrington <dylanharrington@gmail.com>
Eduardo Garcia <emumaniacx@gmail.com>
Edvin Erikson <edvin@rocketblast.com>
Elaine Fang <elainefang@Elaines-MacBook-Pro.local>
Enguerran <engcolson@gmail.com>
Eric Clemmons <eric@smarterspam.com>
Eric Eastwood <contact@ericeastwood.com>
Eric Florenzano <floguy@gmail.com>
Eric O'Connell <eric.oconnell@idealist.org>
Eric Schoffstall <contra@wearefractal.com>
Erik Harper <eharper@mixpo.com>
Espen Hovlandsdal <rexxars@gmail.com>
Evan Coonrod <evan@paloalto.com>
Evan Vosberg <evanvosberg@urban.to>
Fabio M. Costa <fabiomcosta@gmail.com>
Federico Rampazzo <frampone@gmail.com>
Felipe Oliveira Carvalho <felipekde@gmail.com>
Felix Gnass <fgnass@gmail.com>
Felix Kling <felix.kling@gmx.net>
Fernando Correia <fernando@servicero.com>
Frankie Bagnardi <f.bagnardi@gmail.com>
François-Xavier Bois <fxbois@gmail.com>
Fred Zhao <fredz@fb.com>
Freddy Rangel <frederick.rangel@gmail.com>
Fyodor Ivanishchev <cbrwizard@gmail.com>
G Scott Olson <gscottolson@gmail.com>
G. Kay Lee <balancetraveller+github@gmail.com>
Gabe Levi <gabelevi@gmail.com>
Gajus Kuizinas <g.kuizinas@anuary.com>
Gareth Nicholson <gareth.nic@gmail.com>
Garren Smith <garren.smith@gmail.com>
Gavin McQuistin <gavin@kickfiredesign.com>
Geert Pasteels <geert.pasteels@gmail.com>
Geert-Jan Brits <gbrits@gmail.com>
George A Sisco III <george.sisco@gmail.com>
Georgii Dolzhykov <thorn.mailbox@gmail.com>
Gilbert <gilbertbgarza@gmail.com>
Glen Mailer <glenjamin@gmail.com>
Grant Timmerman <granttimmerman@gmail.com>
Greg Hurrell <glh@fb.com>
Greg Perkins <gregrperkins@fb.com>
Greg Roodt <groodt@gmail.com>
Gregory <g.marcilhacy@gmail.com>
Guangqiang Dong <gqdong@fb.com>
Guido Bouman <m@guido.vc>
Harry Hull <harry.hull1@gmail.com>
Harry Marr <harry.marr@gmail.com>
Harry Moreno <morenoh149@gmail.com>
Harshad Sabne <harshadsabne@users.noreply.github.com>
Hekar Khani <hekark@gmail.com>
Hendrik Swanepoel <hendrik.swanepoel@gmail.com>
Henrik Nyh <henrik@nyh.se>
Henry Wong <henryw4k@gmail.com>
Henry Zhu <hi@henryzoo.com>
Hideo Matsumoto <hideo-m@pekeq.com>
Hou Chia <kchia87@gmail.com>
Huang-Wei Chang <chang.huangwei.01@gmail.com>
Hugo Agbonon <hugo@agbonon.fr>
Hugo Jobling <me@thisishugo.com>
Hyeock Kwon <doublus@gmail.com>
Héliton Nordt <hnordt@hnordt.com>
Ian Obermiller <ian@obermillers.com>
Ignacio Carbajo <icarbajop@gmail.com>
Igor Scekic <igorscekic2@gmail.com>
Ilia Pavlenkov <dortonway@gmail.com>
Ilya Shuklin <ilya.shuklin@gmail.com>
Ilyá Belsky <gelias.gbelsky@gmail.com>
Ingvar Stepanyan <me@rreverser.com>
Irae Carvalho <irae@irae.pro.br>
Isaac Salier-Hellendag <isaac@fb.com>
Iurii Kucherov <yuyokk@gmail.com>
Ivan Kozik <ivan@ludios.org>
Ivan Krechetov <ikr@ikr.su>
Ivan Vergiliev <ivan.vergiliev@gmail.com>
J. Andrew Brassington <jabbrass@zoho.com>
J. Renée Beach <splendidnoise@gmail.com>
JD Isaacks <jd@jisaacks.com>
JJ Weber <jj.weber@gmail.com>
JW <JW00000@gmail.com>
Jack Zhang <jzhang31191@gmail.com>
Jackie Wung <jacquelinewung@gmail.com>
Jacob Gable <jacob.gable@gmail.com>
Jacob Greenleaf <jake@imgur.com>
Jae Hun Ro <jhr24@duke.edu>
Jaeho Lee <me@jaeholee.org>
Jaime Mingo <j.mingov@3boll.com>
Jake Worth <jakeworth82@gmail.com>
Jakub Malinowski <jakubmal@gmail.com>
James <james@mystrata.com>
James Brantly <james@jbrantly.com>
James Burnett <jtburnett@tribune.com>
James Friend <james@jsdf.co>
James Ide <ide@fb.com>
James Long <longster@gmail.com>
James Pearce <jpearce@fb.com>
James Seppi <james.seppi@gmail.com>
James South <james_south@hotmail.com>
James Wen <jrw2175@columbia.edu>
Jamie Wong <jamie.lf.wong@gmail.com>
Jamis Charles <jacharles@paypal.com>
Jamison Dance <jergason@gmail.com>
Jan Hancic <jan.hancic@gmail.com>
Jan Kassens <jan@kassens.net>
Jan Raasch <jan@janraasch.com>
Jared Forsyth <jared@jaredforsyth.com>
Jason <usaman2010us@gmail.com>
Jason Bonta <jbonta@gmail.com>
Jason Ly <jason.ly@gmail.com>
Jason Miller <aidenn0@geocities.com>
Jason Quense <monastic.panic@gmail.com>
Jason Trill <jason@jasontrill.com>
Jason Webster <jason@metalabdesign.com>
Jay Jaeho Lee <jay@spoqa.com>
Jean Lauliac <lauliacj@gmail.com>
Jed Watson <jed.watson@me.com>
Jeff Barczewski <jeff.barczewski@gmail.com>
Jeff Carpenter <gcarpenterv@gmail.com>
Jeff Chan <jefftchan@gmail.com>
Jeff Hicken <jhicken@gmail.com>
Jeff Kolesky <github@kolesky.com>
Jeff Morrison <jeff@anafx.com>
Jeff Welch <whatthejeff@gmail.com>
Jeffrey Lin <lin.jeffrey@gmail.com>
Jeremy Fairbank <elpapapollo@gmail.com>
Jesse Skinner <jesse@thefutureoftheweb.com>
Jignesh Kakadiya <jigneshhk1992@gmail.com>
Jim OBrien <jimobrien930@gmail.com>
Jim Sproch <jsproch@fb.com>
Jimmy Jea <jimjea@gmail.com>
Jing Chen <jingc@fb.com>
Jinwoo Oh <arkist@gmail.com>
Jinxiu Lee <lee.jinxiu@gmail.com>
Jiyeon Seo <zzzeons@gmail.com>
Jody McIntyre <scjody@modernduck.com>
Joe Critchley <joecritch@gmail.com>
Joe Stein <joeaarons@gmail.com>
Joel Auterson <joel.auterson@googlemail.com>
Johannes Baiter <johannes.baiter@gmail.com>
Johannes Emerich <johannes@emerich.de>
Johannes Lumpe <johannes@johanneslumpe.de>
John Heroy <johnheroy@users.noreply.github.com>
John Ryan <tjfryan@fb.com>
John Watson <jwatson@fb.com>
John-David Dalton <john.david.dalton@gmail.com>
Jon Beebe <jon.beebe@daveramsey.com>
Jon Chester <jonchester@fb.com>
Jon Hester <jon.d.hester@gmail.com>
Jon Madison <jon@tfftech.com>
Jon Scott Clark <jonscottclark@gmail.com>
Jon Tewksbury <jontewks@gmail.com>
Jonas Enlund <jonas.enlund@gmail.com>
Jonas Gebhardt <jonas@instagram.com>
Jonathan Hsu <jhiswin@gmail.com>
Jonathan Persson <persson.jonathan@gmail.com>
Jordan Harband <ljharb@gmail.com>
Jordan Walke <jordojw@gmail.com>
Jorrit Schippers <jorrit@ncode.nl>
Joseph Nudell <joenudell@gmail.com>
Joseph Savona <joesavona@fb.com>
Josh Bassett <josh.bassett@gmail.com>
Josh Duck <josh@fb.com>
Josh Perez <josh.perez@airbnb.com>
Josh Yudaken <yud@instagram.com>
Joshua Evans <joshua.evans@quantified.co>
Joshua Go <joshuago@gmail.com>
Joshua Goldberg <jsgoldberg90@gmail.com>
Joshua Ma <me@joshma.com>
João Valente <filipevalente@gmail.com>
Juan Serrano <germ13@users.noreply.github.com>
Julen Ruiz Aizpuru <julenx@gmail.com>
Julian Viereck <julian.viereck@gmail.com>
Julien Bordellier <git@julienbordellier.com>
Julio Lopez <ljuliom@gmail.com>
Jun Wu <quark@lihdd.net>
Juraj Dudak <jdudak@fb.com>
Justas Brazauskas <brazauskasjustas@gmail.com>
Justin Jaffray <justinjaffray@khanacademy.org>
Justin Robison <jrobison151@gmail.com>
Justin Woo <moomoowoo@gmail.com>
Kale <krydrogen@gmail.com>
Kamron Batman <kamronbatman@users.noreply.github.com>
Karl Mikkelsen <karl@kingkarl.com>
Karpich Dmitry <karpich@gollard.ru>
Keito Uchiyama <projects@keito.me>
Ken Powers <ken@kenpowers.net>
Kent C. Dodds <kent@doddsfamily.us>
Kevin Cheng <09chengk@gmail.com>
Kevin Coughlin <kevintcoughlin@gmail.com>
Kevin Huang <huang.kev@gmail.com>
Kevin Lau <thekevlau@gmail.com>
Kevin Old <kevin@kevinold.com>
Kevin Robinson <krobinson@twitter.com>
Kewei Jiang <jkewei328@hotmail.com>
Kier Borromeo <seraphipod@gmail.com>
KimCoding <jeokrang@hanmail.net>
Kirk Steven Hansen <hanski07@kirk-hansens-macbook.local>
Kit Randel <kit@nocturne.net.nz>
Kohei TAKATA <kt.koheitakata@gmail.com>
Koo Youngmin <youngmin@youngminz.kr>
Krystian Karczewski <karcz.k@gmail.com>
Kunal Mehta <k.mehta@berkeley.edu>
Kurt Ruppel <me@kurtruppel.com>
Kyle Kelley <rgbkrk@gmail.com>
Kyle Mathews <mathews.kyle@gmail.com>
Laurence Rowe <l@lrowe.co.uk>
Laurent Etiemble <laurent.etiemble@monobjc.net>
Lee Byron <lee@leebyron.com>
Lee Jaeyoung <jaeyoung@monodiary.net>
Lei <tendant@gmail.com>
Leland Richardson <leland.m.richardson@gmail.com>
Leon Fedotov <LeonFedotov@users.noreply.github.com>
Leon Yip <lyip1992@users.noreply.github.com>
Leonardo YongUk Kim <dalinaum@gmail.com>
Levi Buzolic <levibuzolic@gmail.com>
Levi McCallum <levi@levimccallum.com>
Lily <qvang.j@gmail.com>
Logan Allen <loganfynne@gmail.com>
Lovisa Svallingson <lovisasvallingson@gmail.com>
Ludovico Fischer <livrerie@gmail.com>
Luigy Leon <luichi.19@gmail.com>
Luke Horvat <lukehorvat@gmail.com>
MIKAMI Yoshiyuki <yoshuki@saikyoline.jp>
Maher Beg <maherbeg@gmail.com>
Manas <prometheansacrifice@gmail.com>
Marcin K. <katzoo@github.mail>
Marcin Kwiatkowski <marcin.kwiatkowski@hotmail.com>
Marcin Szczepanski <marcins@gmail.com>
Mariano Desanze <protronm@gmail.com>
Marjan <marjan.georgiev@gmail.com>
Mark Anderson <undernewmanagement@users.noreply.github.com>
Mark Funk <mfunk86@gmail.com>
Mark Hintz <markohintz@gmail.com>
Mark IJbema <markijbema@gmail.com>
Mark Murphy <murphy.mark@live.ca>
Mark Richardson <echo@fb.com>
Mark Rushakoff <mark@influxdb.com>
Mark Sun <sunmark14@gmail.com>
Marlon Landaverde <milanlandaverde@gmail.com>
Marshall Roch <mroch@fb.com>
Martin Andert <mandert@gmail.com>
Martin Hujer <mhujer@gmail.com>
Martin Jul <martin@mjul.com>
Martin Konicek <mkonicek@fb.com>
Martin Mihaylov <martomi@users.noreply.github.com>
Masaki KOBAYASHI <makky.4d6b.3f5@gmail.com>
Mathieu M-Gosselin <mathieumg@gmail.com>
Mathieu Savy <savy.mathieu@gmail.com>
Matias Singers <mail@matiassingers.com>
Matsunoki <himkt@klis.tsukuba.ac.jp>
Matt Brookes <matt@brookes.net>
Matt Dunn-Rankin <mdunnrankin@gmail.com>
Matt Harrison <mt.harrison86@gmail.com>
Matt Huggins <matt.huggins@gmail.com>
Matt Stow <matt.stow@foxsports.com.au>
Matt Zabriskie <mzabriskie@gmail.com>
Matthew Dapena-Tretter <m@tthewwithanm.com>
Matthew Herbst <mherbst@chegg.com>
Matthew Hodgson <matthew@matrix.org>
Matthew Johnston <matthewjohnston4@outlook.com>
Matthew King <mking@users.noreply.github.com>
Matthew Looi <looi.matthew@gmail.com>
Matthew Miner <matthew@matthewminer.com>
Matthias Le Brun <mlbli@me.com>
Matti Nelimarkka <matti.nelimarkka@hiit.fi>
Mattijs Kneppers <mattijs@arttech.nl>
Max F. Albrecht <1@178.is>
Max Heiber <max.heiber@gmail.com>
Max Stoiber <contact@mstoiber.com>
Maxi Ferreira <charca@gmail.com>
Maxim Abramchuk <MaximAbramchuck@gmail.com>
Merrick Christensen <merrick.christensen@gmail.com>
Mert Kahyaoğlu <mertkahyaoglu93@gmail.com>
Michael Chan <mijoch@gmail.com>
Michael McDermott <michael@mgmcdermott.com>
Michael Randers-Pehrson <michael.rp@gmail.com>
Michael Ridgway <mridgway@yahoo-inc.com>
Michael Warner <MichaelJWarner@hotmail.com>
Michael Wiencek <mwtuea@gmail.com>
Michael Ziwisky <mikezx@gmail.com>
Michal Srb <xixixao@seznam.cz>
Michelle Todd <himichelletodd@gmail.com>
Mihai Parparita <mihai.parparita@gmail.com>
Mike D Pilsbury <mike.pilsbury@gmail.com>
Mike Groseclose <mike.groseclose@gmail.com>
Mike Nordick <mnordick>
Mikolaj Dadela <mikolaj.dadela@hgv-online.de>
Miles Johnson <mileswjohnson@gmail.com>
Minwe LUO <minwe@yunshipei.com>
Miorel Palii <miorel@fb.com>
Morhaus <alexandre.kirszenberg@gmail.com>
Moshe Kolodny <kolodny.github@gmail.com>
Mouad Debbar <mdebbar@fb.com>
Murad <rogozhnikoff@users.noreply.github.com>
Murray M. Moss <murray@mmoss.name>
Nadeesha Cabral <nadeesha.cabral@gmail.com>
Naman Goel <naman34@gmail.com>
Nate Hunzaker <nate.hunzaker@gmail.com>
Nate Lee <nathaniel.jy.lee88@gmail.com>
Nathan Smith <NogsMPLS@users.noreply.github.com>
Nathan White <nw@nwhite.net>
Nee <944316342@qq.com>
Neri Marschik <marschik_neri@cyberagent.co.jp>
Nguyen Truong Duy <truongduy134@yahoo.com>
Nicholas Bergson-Shilcock <me@nicholasbs.net>
Nicholas Clawson <nickclaw@users.noreply.github.com>
Nick Balestra <nickbalestra@users.noreply.github.com>
Nick Fitzgerald <fitzgen@gmail.com>
Nick Gavalas <njg57@cornell.edu>
Nick Merwin <nick@lemurheavy.com>
Nick Presta <nick@nickpresta.ca>
Nick Raienko <enaqxx@gmail.com>
Nick Thompson <ncthom91@gmail.com>
Nick Williams <WickyNilliams@users.noreply.github.com>
Niklas Boström <nbostrom@gmail.com>
Ning Xia <ning-github@users.noreply.github.com>
Niole Nelson <niolenelson@gmail.com>
Oiva Eskola <oiva.eskola@gmail.com>
Oleg <o.yanchinskiy@gmail.com>
Oleksii Markhovskyi <olexiy.markhovsky@gmail.com>
Oliver Zeigermann <oliver.zeigermann@gmail.com>
Olivier Tassinari <Olivier.tassinari@gmail.com>
Owen Coutts <owenc@fb.com>
Pablo Lacerda de Miranda <pablolm@yahoo-inc.com>
Paolo Moretti <moretti@users.noreply.github.com>
Pascal Hartig <passy@twitter.com>
Patrick <info@telepark.de>
Patrick Laughlin <patrick@laughl.info>
Patrick Stapleton <github@gdi2290.com>
Paul Benigeri <me@benigeri.com>
Paul Harper <benekastah@gmail.com>
Paul O’Shannessy <paul@oshannessy.com>
Paul Seiffert <paul.seiffert@gmail.com>
Paul Shen <paul@mnml0.com>
Pedro Nauck <pedronauck@gmail.com>
Pete Hunt <floydophone@gmail.com>
Peter Blazejewicz <peter.blazejewicz@gmail.com>
Peter Cottle <pcottle@fb.com>
Peter Jaros <peter.a.jaros@gmail.com>
Peter Newnham <peter.newnham@appsbroker.com>
Petri Lehtinen <petri@digip.org>
Petri Lievonen <plievone@cc.hut.fi>
Pieter Vanderwerff <me@pieter.io>
Pouja Nikray <poujanik@gmail.com>
Prathamesh Sonpatki <csonpatki@gmail.com>
Prayag Verma <prayag.verma@gmail.com>
Preston Parry <ClimbsRocks@users.noreply.github.com>
Rafael <rafael.garcia@clever.com>
Rafal Dittwald <rafal.dittwald@gmail.com>
Rainer Oviir <roviir@gmail.com>
Rajat Sehgal <rajatsehgal1988@gmail.com>
Rajiv Tirumalareddy <rajivtreddy@gmail.com>
Ram Kaniyur <quadrupleslap@users.noreply.github.com>
Randall Randall <randall@randallsquared.com>
Ray <ray@tomo.im>
Raymond Ha <raymond@shraymonks.com>
Reed Loden <reed@reedloden.com>
Remko Tronçon <git@el-tramo.be>
Richard D. Worth <rdworth@gmail.com>
Richard Feldman <richard.t.feldman@gmail.com>
Richard Kho <hello@richardkho.com>
Richard Littauer <richard.littauer@gmail.com>
Richard Livesey <Livesey7@hotmail.co.uk>
Richard Wood <rwoodnz@gmail.com>
Rick Beerendonk <rick@beerendonk.com>
Rick Ford <rickfordrick@gmail.com>
Riley Tomasek <riley.tomasek@gmail.com>
Rob Arnold <robarnold@cs.cmu.edu>
Robert Binna <rbinna@gmail.com>
Robert Knight <robert.knight@mendeley.com>
Robert Sedovsek <robert.sedovsek@gmail.com>
Robin Berjon <robin@berjon.com>
Robin Frischmann <robin@rofrischmann.de>
Roman Pominov <rpominov+github@gmail.com>
Roman Vanesyan <roman.vanesyan@gmail.com>
Russ <russwirtz@gmail.com>
Ryan Seddon <seddon.ryan@gmail.com>
Sahat Yalkabov <sakhat@gmail.com>
Saif Hakim <saif@benchling.com>
Saiichi Hashimoto <saiichihashimoto@gmail.com>
Sam Beveridge <sbeveridge@saltstack.com>
Sam Saccone <samccone@gmail.com>
Sam Selikoff <sam.selikoff@gmail.com>
Samy Al Zahrani <samy@sadeem.net>
Sander Spies <sandermail@gmail.com>
Scott Burch <scott@bulldoginfo.com>
Scott Feeney <scott@oceanbase.org>
Sean Kinsey <oyvind@fb.com>
Sebastian Markbåge <sebastian@calyptus.eu>
Sebastian McKenzie <sebmck@gmail.com>
Seoh Char <devthewild@gmail.com>
Sercan Eraslan <sercan.eraslan@sahibinden.com>
Serg <undrdog@yandex.ru>
Sergey Generalov <sergey@genbit.ru>
Sergey Rubanov <chi187@gmail.com>
Seyi Adebajo <hello@seyinanigans.com>
Shane O'Sullivan <shaneosullivan1@gmail.com>
Shaun Trennery <shaun.trennery@gmail.com>
ShihChi Huang <hhuang@netflix.com>
Shim Won <marocchino@gmail.com>
Shinnosuke Watanabe <snnskwtnb@gmail.com>
Shogun Sea <shogunsea08@gmail.com>
Shota Kubota <kubosho@users.noreply.github.com>
Shripad K <assortmentofsorts@gmail.com>
Sibi <psibi2000@gmail.com>
Simen Bekkhus <sbekkhus91@gmail.com>
Simon Højberg <r.hackr@gmail.com>
Simon Welsh <simon@simon.geek.nz>
Simone Vittori <hello@simonewebdesign.it>
Soichiro Kawamura <mail@w-st.com>
Sophia Westwood <sophia@quip.com>
Sota Ohara <ohrst.18@gmail.com>
Spencer Handley <spencerhandley@gmail.com>
Stefan Dombrowski <sdo451@gmail.com>
Stephen Murphy <smurphy3@apple.com>
Sterling Cobb <sterlingcobb@gmail.com>
Steve Baker <_steve_@outlook.com>
Steven Luscher <react@steveluscher.com>
Steven Vachon <contact@svachon.com>
Stoyan Stefanov <ssttoo@ymail.com>
Sundeep Malladi <sundeep.malladi@gmail.com>
Sunny Juneja <me@sunnyjuneja.com>
Sven Helmberger <fforw@gmx.de>
Sverre Johansen <sverre.johansen@gmail.com>
Sébastien Lorber <lorber.sebastien@gmail.com>
Sławomir Laskowski <laskowski.box@gmail.com>
Taeho Kim <dittos@gmail.com>
Tay Yang Shun <tay.yang.shun@gmail.com>
Ted Kim <ted@vcnc.co.kr>
Tengfei Guo <terryr3rd@yeah.net>
Teodor Szente <teodor98sz@gmail.com>
Thomas Aylott <oblivious@subtlegradient.com>
Thomas Boyt <thomas.boyt@venmo.com>
Thomas Broadley <buriedunderbooks@hotmail.com>
Thomas Reggi <socialtr@gmail.com>
Thomas Röggla <t.roggla@cwi.nl>
Thomas Shaddox <thomas@heyzap.com>
Thomas Shafer <thomasjshafer@gmail.com>
ThomasCrvsr <crevoisier.thomas@gmail.com>
Tienchai Wirojsaksaree <tienchai@fb.com>
Tim Routowicz <troutowicz@gmail.com>
Tim Schaub <tschaub@users.noreply.github.com>
Timothy Yung <yungsters@gmail.com>
Timur Carpeev <timuric@users.noreply.github.com>
Tobias Reiss <tag+github@basecode.de>
Tom Duncalf <tom@tomduncalf.com>
Tom Haggie <thaggie@gmail.com>
Tom Hauburger <thauburger@gmail.com>
Tom MacWright <tom@macwright.org>
Tom Occhino <tomocchino@gmail.com>
Tomasz Kołodziejski <tkolodziejski@gmail.com>
Tomoya Suzuki <tmysz.dev@gmail.com>
Tony Spiro <tspiro@tonyspiro.com>
Toru Kobayashi <koba0004@gmail.com>
Trinh Hoang Nhu <trinhhoangnhu@gmail.com>
Tsung Hung <thung@me.com>
Tyler Brock <tyler.brock@gmail.com>
Ustin Zarubin <ustin.zarubin@campusbellhops.com>
Vadim Chernysh <chernysh.vadim@gmail.com>
Varun Rau <varunrau@gmail.com>
Vasiliy Loginevskiy <Yeti.or@gmail.com>
Victor Alvarez <v.alvarez312@gmail.com>
Victor Homyakov <vkhomyackov@gmail.com>
Victor Koenders <victor.koenders@gmail.com>
Ville Immonen <ville.immonen@iki.fi>
Vincent Riemer <vincentriemer@gmail.com>
Vincent Siao <vincent@asana.com>
Vipul A M <vipulnsward@gmail.com>
Vitaly Kramskikh <vkramskikh@gmail.com>
Vitor Balocco <vitorbal@gmail.com>
Vjeux <vjeuxx@gmail.com>
Volkan Unsal <spocksplanet@gmail.com>
Wander Wang <wander.wang@ismole.com>
Wayne Larsen <wayne@larsen.st>
WickyNilliams <WickyNilliams@MBA>
Wincent Colaiuta <win@wincent.com>
Wout Mertens <Wout.Mertens@gmail.com>
Xavier Morel <xmo-odoo@users.noreply.github.com>
XuefengWu <benewu@gmail.com>
Yakov Dalinchuk <murashki@users.noreply.github.com>
Yasar icli <hello@yasaricli.com>
YouBao Nong <noyobo@gmail.com>
Yuichi Hagio <yhagio87@gmail.com>
Yuriy Dybskiy <yuriy@dybskiy.com>
Yutaka Nakajima <nakazye@gmail.com>
Yuval Dekel <thedekel@fb.com>
Zach Bruggeman <mail@bruggie.com>
Zach Ramaekers <zramaekers@gmail.com>
Zacharias <zachasme@users.noreply.github.com>
Zeke Sikelianos <zeke@sikelianos.com>
Zhangjd <zhang.jd@qq.com>
adraeth <jerzy.mirecki@gmail.com>
arush <arush@ilovebrands.net>
brafdlog <brafdlog@gmail.com>
chen <kikyous@163.com>
clariroid <clarinette.uranus@gmail.com>
claudiopro <claudio.procida@gmail.com>
cutbko <kutsenko.eugene@hotmail.com>
davidxi <davidgraycn@gmail.com>
dongmeng.ldm <dongmeng.ldm@alibaba-inc.com>
iamchenxin <iamchenxin@gmail.com>
iamdoron <doronpagot@gmail.com>
iawia002 <z2d@jifangcheng.com>
imagentleman <imagentlemail@gmail.com>
koh-taka <koh-taka@users.noreply.github.com>
kohashi85 <hako584@gmail.com>
laiso <laiso@lai.so>
leeyoungalias <leeyoungalias@qq.com>
li.li <li.li@ele.me>
maxprafferty <maxprafferty@gmail.com>
rgarifullin <ringarifullin@gmail.com>
songawee <dennis@songawee.com>
sugarshin <shinsugar@gmail.com>
wali-s <ahmad3y2k@hotmail.com>
yiminghe <yiminghe@gmail.com>
youmoo <youmoolee@gmail.com>
zhangjg <jinguozhang@qq.com>
zwhitchcox <zwhitchcox@gmail.com>
Árni Hermann Reynisson <arnihr@gmail.com>
元彦 <yuanyan@users.noreply.github.com>
凌恒 <jiakun.dujk@alibaba-inc.com>
张敏 <cookfront@gmail.com>
================================================
FILE: docs/articles/intro_reactR_files/react-16.12.0/LICENSE.txt
================================================
MIT License
Copyright (c) 2013-present, Facebook, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: docs/articles/intro_reactR_files/react-16.7.0/AUTHORS
================================================
39 <8398a7@gmail.com>
Aaron Franks <aaron.franks@gmail.com>
Aaron Gelter <aaron.gelter@harman.com>
Adam Bloomston <adam@glitterfram.es>
Adam Krebs <amk528@cs.nyu.edu>
Adam Mark <adammark75@gmail.com>
Adam Solove <asolove@gmail.com>
Adam Timberlake <adam.timberlake@gmail.com>
Adam Zapletal <adamzap@gmail.com>
Ahmad Wali Sidiqi <wali-s@users.noreply.github.com>
Alan Plum <me@pluma.io>
Alan Souza <alansouzati@gmail.com>
Alan deLevie <adelevie@gmail.com>
Alastair Hole <afhole@gmail.com>
Alex <ultrafez@users.noreply.github.com>
Alex Boatwright <drdelambre@gmail.com>
Alex Boyd <alex@opengroove.org>
Alex Dajani <xelad1@gmail.com>
Alex Lopatin <alex@alexlopatin.com>
Alex Mykyta <dancingwithcows@gmail.com>
Alex Pien <alexpien@gmail.com>
Alex Smith <iqwz@ya.ru>
Alex Zelenskiy <azelenskiy@fb.com>
Alexander Shtuchkin <ashtuchkin@gmail.com>
Alexander Solovyov <alexander@solovyov.net>
Alexander Tseung <alextsg@gmail.com>
Alexandre Gaudencio <shahor@shahor.fr>
Alexey Raspopov <avenger7x13@gmail.com>
Alexey Shamrin <shamrin@gmail.com>
Ali Ukani <ali.ukani@gmail.com>
Andre Z Sanchez <andrezacsanchez@gmail.com>
Andreas Savvides <asavvides@twitter.com>
Andreas Svensson <andreas@syranide.com>
Andres Kalle <mjomble@gmail.com>
Andres Suarez <zertosh@gmail.com>
Andrew Clark <acdlite@me.com>
Andrew Cobby <cobbweb@users.noreply.github.com>
Andrew Davey <andrew@equin.co.uk>
Andrew Henderson <andrew.m.henderson@gmail.com>
Andrew Kulakov <avk@8xx8.ru>
Andrew Rasmussen <andras@fb.com>
Andrew Sokolov <asokolov@atlassian.com>
Andrew Zich <azich@fb.com>
Andrey Popp <8mayday@gmail.com>
Anthony van der Hoorn <anthony.vanderhoorn@gmail.com>
Anto Aravinth <anto.aravinth.cse@gmail.com>
Antonio Ruberto <anto.ruberto@gmail.com>
Antti Ahti <antti.ahti@gmail.com>
Anuj Tomar <ankuto@gmail.com>
AoDev <AoDev@users.noreply.github.com>
April Arcus <april.arcus@gmail.com>
Areeb Malik <areeb.malik91@gmail.com>
Aria Buckles <aria@khanacademy.org>
Aria Stewart <aredridel@dinhe.net>
Arian Faurtosh <arian@icloud.com>
Artem Nezvigin <artem@artnez.com>
Austin Wright <aaa@bzfx.net>
Ayman Osman <aymano.osman@gmail.com>
Baraa Hamodi <bhamodi@uwaterloo.ca>
Bartosz Kaszubowski <gosimek@gmail.com>
Basarat Ali Syed <basaratali@gmail.com>
Battaile Fauber <battaile@gmail.com>
Beau Smith <beau@beausmith.com>
Ben Alpert <ben@benalpert.com>
Ben Anderson <banderson@constantcontact.com>
Ben Brooks <ben@benbrooks.net>
Ben Foxall <benfoxall@gmail.com>
Ben Halpern <bendhalpern@gmail.com>
Ben Jaffe <jaffe.ben@gmail.com>
Ben Moss <ben@mossity.com>
Ben Newman <bn@cs.stanford.edu>
Ben Ripkens <bripkens.dev@gmail.com>
Benjamin Keen <ben.keen@gmail.com>
Benjamin Leiken <benleiken@gmail.com>
Benjamin Woodruff <github@benjam.info>
Benjy Cui <benjytrys@gmail.com>
Bill Blanchard <bill@plumbdev.com>
Bill Fisher <fisherwebdev@gmail.com>
Blaine Hatab <jbhatab@gmail.com>
Blaine Kasten <blainekasten@gmail.com>
Bob Eagan <bob@synapsestudios.com>
Bob Ralian <bob.ralian@gmail.com>
Bob Renwick <bob.renwick@gmail.com>
Bobby <puppybytes@gmail.com>
Bojan Mihelac <bmihelac@mihelac.org>
Bradley Spaulding <brad.spaulding@gmail.com>
Brandon Bloom <brandon@brandonbloom.name>
Brandon Tilley <brandon@brandontilley.com>
Brenard Cubacub <bcbcb@users.noreply.github.com>
Brian Cooke <bri@bricooke.com>
Brian Holt <btholt@gmail.com>
Brian Hsu <brianhsu@Brians-MacBook-Pro.local>
Brian Kim <briankimpossible@gmail.com>
Brian Kung <brian@callmekung.com>
Brian Reavis <brian@thirdroute.com>
Brian Rue <brian@rollbar.com>
Bruno Škvorc <bruno@skvorc.me>
Cam Song <neosoyn@gmail.com>
Cam Spiers <camspiers@gmail.com>
Cameron Chamberlain <git@camjc.com>
Cameron Matheson <cameron@instructure.com>
Carter Chung <carterchung@users.noreply.github.com>
Cassus Adam Banko <banko.adam@gmail.com>
Cat Chen <catchen@fb.com>
Cedric Sohrauer <cedric.sohrauer@infopark.de>
Cesar William Alvarenga <cesarwbr@gmail.com>
Changsoon Bok <winmain@gmail.com>
Charles Marsh <charlie@khanacademy.org>
Chase Adams <realchaseadams@gmail.com>
Cheng Lou <chenglou92@gmail.com>
Chitharanjan Das <das.chitharanjan@gmail.com>
Chris Bolin <bolin.chris@gmail.com>
Chris Grovers <chrisgrovers@users.noreply.github.com>
Chris Ha <chriskevinha@gmail.com>
Chris Rebert <github@rebertia.com>
Chris Sciolla <csciolla1@gmail.com>
Christian Alfoni <christianalfoni@gmail.com>
Christian Oliff <christianoliff@yahoo.com>
Christian Roman <chroman16@gmail.com>
Christoffer Sawicki <christoffer.sawicki@gmail.com>
Christoph Pojer <christoph.pojer@gmail.com>
Christopher Monsanto <chris@monsan.to>
Clay Allsopp <clay.allsopp@gmail.com>
Connor McSheffrey <c@conr.me>
Conor Hastings <hastings.conorm@gmail.com>
Cory House <housecor@gmail.com>
Cotton Hou <himcotton@gmail.com>
Craig Akimoto <strawbrary@users.noreply.github.com>
Cristovao Verstraeten <cristovao@apleasantview.com>
Damien Pellier <dpellier@leadformance.com>
Dan Abramov <dan.abramov@gmail.com>
Dan Fox <iamdanfox@gmail.com>
Dan Schafer <dschafer@fb.com>
Daniel Carlsson <daniel.carlsson.1987@gmail.com>
Daniel Cousens <dcousens@users.noreply.github.com>
Daniel Friesen <daniel@nadir-seen-fire.com>
Daniel Gasienica <daniel@gasienica.ch>
Daniel Hejl <daniel.hejl@hotmail.com>
Daniel Hejl <hejldaniel@gmail.com>
Daniel Lo Nigro <daniel@dan.cx>
Daniel Mané <danmane@gmail.com>
Daniel Miladinov <dmiladinov@wingspan.com>
Daniel Rodgers-Pryor <djrodgerspryor@gmail.com>
Daniel Schonfeld <daniel@schonfeld.org>
Danny Ben-David <dannybd@fb.com>
Darcy <smadad@me.com>
Daryl Lau <daryl@weak.io>
Darío Javier Cravero <dario@uxtemple.com>
Dave Galbraith <dave@jut.io>
David Baker <djbaker2@gmail.com>
David Ed Mellum <david@edmellum.com>
David Goldberg <gberg1@users.noreply.github.com>
David Granado <davidjgranado@gmail.com>
David Greenspan <dgreenspan@alum.mit.edu>
David Hellsing <david@aino.se>
David Hu <davidhu91@gmail.com>
David Khourshid <davidkpiano@gmail.com>
David Mininger <dmininger@gmail.com>
David Neubauer <davidneub@gmail.com>
David Percy <davetp425@gmail.com>
Dean Shi <dnshi@users.noreply.github.com>
Denis Sokolov <denis@sokolov.cc>
Deniss Jacenko <deniss.jacenko+github@gmail.com>
Dennis Johnson <djohnson@rallydev.com>
Devon Blandin <dblandin@gmail.com>
Devon Harvey <devonharvey@gmail.com>
Dmitrii Abramov <dmitrii@rheia.us>
Dmitriy Rozhkov <dmitriy.rozhkov@xing.com>
Dmitry Blues <dmitri.blyus@gmail.com>
Dmitry Mazuro <dmitry.mazuro@icloud.com>
Domenico Matteo <matteo.domenico@gmail.com>
Don Abrams <donabrams@gmail.com>
Dongsheng Liu <bellanchor@gmail.com>
Dustan Kasten <dustan.kasten@gmail.com>
Dustin Getz <dgetz@wingspan.com>
Dylan Harrington <dylanharrington@gmail.com>
Eduardo Garcia <emumaniacx@gmail.com>
Edvin Erikson <edvin@rocketblast.com>
Elaine Fang <elainefang@Elaines-MacBook-Pro.local>
Enguerran <engcolson@gmail.com>
Eric Clemmons <eric@smarterspam.com>
Eric Eastwood <contact@ericeastwood.com>
Eric Florenzano <floguy@gmail.com>
Eric O'Connell <eric.oconnell@idealist.org>
Eric Schoffstall <contra@wearefractal.com>
Erik Harper <eharper@mixpo.com>
Espen Hovlandsdal <rexxars@gmail.com>
Evan Coonrod <evan@paloalto.com>
Evan Vosberg <evanvosberg@urban.to>
Fabio M. Costa <fabiomcosta@gmail.com>
Federico Rampazzo <frampone@gmail.com>
Felipe Oliveira Carvalho <felipekde@gmail.com>
Felix Gnass <fgnass@gmail.com>
Felix Kling <felix.kling@gmx.net>
Fernando Correia <fernando@servicero.com>
Frankie Bagnardi <f.bagnardi@gmail.com>
François-Xavier Bois <fxbois@gmail.com>
Fred Zhao <fredz@fb.com>
Freddy Rangel <frederick.rangel@gmail.com>
Fyodor Ivanishchev <cbrwizard@gmail.com>
G Scott Olson <gscottolson@gmail.com>
G. Kay Lee <balancetraveller+github@gmail.com>
Gabe Levi <gabelevi@gmail.com>
Gajus Kuizinas <g.kuizinas@anuary.com>
Gareth Nicholson <gareth.nic@gmail.com>
Garren Smith <garren.smith@gmail.com>
Gavin McQuistin <gavin@kickfiredesign.com>
Geert Pasteels <geert.pasteels@gmail.com>
Geert-Jan Brits <gbrits@gmail.com>
George A Sisco III <george.sisco@gmail.com>
Georgii Dolzhykov <thorn.mailbox@gmail.com>
Gilbert <gilbertbgarza@gmail.com>
Glen Mailer <glenjamin@gmail.com>
Grant Timmerman <granttimmerman@gmail.com>
Greg Hurrell <glh@fb.com>
Greg Perkins <gregrperkins@fb.com>
Greg Roodt <groodt@gmail.com>
Gregory <g.marcilhacy@gmail.com>
Guangqiang Dong <gqdong@fb.com>
Guido Bouman <m@guido.vc>
Harry Hull <harry.hull1@gmail.com>
Harry Marr <harry.marr@gmail.com>
Harry Moreno <morenoh149@gmail.com>
Harshad Sabne <harshadsabne@users.noreply.github.com>
Hekar Khani <hekark@gmail.com>
Hendrik Swanepoel <hendrik.swanepoel@gmail.com>
Henrik Nyh <henrik@nyh.se>
Henry Wong <henryw4k@gmail.com>
Henry Zhu <hi@henryzoo.com>
Hideo Matsumoto <hideo-m@pekeq.com>
Hou Chia <kchia87@gmail.com>
Huang-Wei Chang <chang.huangwei.01@gmail.com>
Hugo Agbonon <hugo@agbonon.fr>
Hugo Jobling <me@thisishugo.com>
Hyeock Kwon <doublus@gmail.com>
Héliton Nordt <hnordt@hnordt.com>
Ian Obermiller <ian@obermillers.com>
Ignacio Carbajo <icarbajop@gmail.com>
Igor Scekic <igorscekic2@gmail.com>
Ilia Pavlenkov <dortonway@gmail.com>
Ilya Shuklin <ilya.shuklin@gmail.com>
Ilyá Belsky <gelias.gbelsky@gmail.com>
Ingvar Stepanyan <me@rreverser.com>
Irae Carvalho <irae@irae.pro.br>
Isaac Salier-Hellendag <isaac@fb.com>
Iurii Kucherov <yuyokk@gmail.com>
Ivan Kozik <ivan@ludios.org>
Ivan Krechetov <ikr@ikr.su>
Ivan Vergiliev <ivan.vergiliev@gmail.com>
J. Andrew Brassington <jabbrass@zoho.com>
J. Renée Beach <splendidnoise@gmail.com>
JD Isaacks <jd@jisaacks.com>
JJ Weber <jj.weber@gmail.com>
JW <JW00000@gmail.com>
Jack Zhang <jzhang31191@gmail.com>
Jackie Wung <jacquelinewung@gmail.com>
Jacob Gable <jacob.gable@gmail.com>
Jacob Greenleaf <jake@imgur.com>
Jae Hun Ro <jhr24@duke.edu>
Jaeho Lee <me@jaeholee.org>
Jaime Mingo <j.mingov@3boll.com>
Jake Worth <jakeworth82@gmail.com>
Jakub Malinowski <jakubmal@gmail.com>
James <james@mystrata.com>
James Brantly <james@jbrantly.com>
James Burnett <jtburnett@tribune.com>
James Friend <james@jsdf.co>
James Ide <ide@fb.com>
James Long <longster@gmail.com>
James Pearce <jpearce@fb.com>
James Seppi <james.seppi@gmail.com>
James South <james_south@hotmail.com>
James Wen <jrw2175@columbia.edu>
Jamie Wong <jamie.lf.wong@gmail.com>
Jamis Charles <jacharles@paypal.com>
Jamison Dance <jergason@gmail.com>
Jan Hancic <jan.hancic@gmail.com>
Jan Kassens <jan@kassens.net>
Jan Raasch <jan@janraasch.com>
Jared Forsyth <jared@jaredforsyth.com>
Jason <usaman2010us@gmail.com>
Jason Bonta <jbonta@gmail.com>
Jason Ly <jason.ly@gmail.com>
Jason Miller <aidenn0@geocities.com>
Jason Quense <monastic.panic@gmail.com>
Jason Trill <jason@jasontrill.com>
Jason Webster <jason@metalabdesign.com>
Jay Jaeho Lee <jay@spoqa.com>
Jean Lauliac <lauliacj@gmail.com>
Jed Watson <jed.watson@me.com>
Jeff Barczewski <jeff.barczewski@gmail.com>
Jeff Carpenter <gcarpenterv@gmail.com>
Jeff Chan <jefftchan@gmail.com>
Jeff Hicken <jhicken@gmail.com>
Jeff Kolesky <github@kolesky.com>
Jeff Morrison <jeff@anafx.com>
Jeff Welch <whatthejeff@gmail.com>
Jeffrey Lin <lin.jeffrey@gmail.com>
Jeremy Fairbank <elpapapollo@gmail.com>
Jesse Skinner <jesse@thefutureoftheweb.com>
Jignesh Kakadiya <jigneshhk1992@gmail.com>
Jim OBrien <jimobrien930@gmail.com>
Jim Sproch <jsproch@fb.com>
Jimmy Jea <jimjea@gmail.com>
Jing Chen <jingc@fb.com>
Jinwoo Oh <arkist@gmail.com>
Jinxiu Lee <lee.jinxiu@gmail.com>
Jiyeon Seo <zzzeons@gmail.com>
Jody McIntyre <scjody@modernduck.com>
Joe Critchley <joecritch@gmail.com>
Joe Stein <joeaarons@gmail.com>
Joel Auterson <joel.auterson@googlemail.com>
Johannes Baiter <johannes.baiter@gmail.com>
Johannes Emerich <johannes@emerich.de>
Johannes Lumpe <johannes@johanneslumpe.de>
John Heroy <johnheroy@users.noreply.github.com>
John Ryan <tjfryan@fb.com>
John Watson <jwatson@fb.com>
John-David Dalton <john.david.dalton@gmail.com>
Jon Beebe <jon.beebe@daveramsey.com>
Jon Chester <jonchester@fb.com>
Jon Hester <jon.d.hester@gmail.com>
Jon Madison <jon@tfftech.com>
Jon Scott Clark <jonscottclark@gmail.com>
Jon Tewksbury <jontewks@gmail.com>
Jonas Enlund <jonas.enlund@gmail.com>
Jonas Gebhardt <jonas@instagram.com>
Jonathan Hsu <jhiswin@gmail.com>
Jonathan Persson <persson.jonathan@gmail.com>
Jordan Harband <ljharb@gmail.com>
Jordan Walke <jordojw@gmail.com>
Jorrit Schippers <jorrit@ncode.nl>
Joseph Nudell <joenudell@gmail.com>
Joseph Savona <joesavona@fb.com>
Josh Bassett <josh.bassett@gmail.com>
Josh Duck <josh@fb.com>
Josh Perez <josh.perez@airbnb.com>
Josh Yudaken <yud@instagram.com>
Joshua Evans <joshua.evans@quantified.co>
Joshua Go <joshuago@gmail.com>
Joshua Goldberg <jsgoldberg90@gmail.com>
Joshua Ma <me@joshma.com>
João Valente <filipevalente@gmail.com>
Juan Serrano <germ13@users.noreply.github.com>
Julen Ruiz Aizpuru <julenx@gmail.com>
Julian Viereck <julian.viereck@gmail.com>
Julien Bordellier <git@julienbordellier.com>
Julio Lopez <ljuliom@gmail.com>
Jun Wu <quark@lihdd.net>
Juraj Dudak <jdudak@fb.com>
Justas Brazauskas <brazauskasjustas@gmail.com>
Justin Jaffray <justinjaffray@khanacademy.org>
Justin Robison <jrobison151@gmail.com>
Justin Woo <moomoowoo@gmail.com>
Kale <krydrogen@gmail.com>
Kamron Batman <kamronbatman@users.noreply.github.com>
Karl Mikkelsen <karl@kingkarl.com>
Karpich Dmitry <karpich@gollard.ru>
Keito Uchiyama <projects@keito.me>
Ken Powers <ken@kenpowers.net>
Kent C. Dodds <kent@doddsfamily.us>
Kevin Cheng <09chengk@gmail.com>
Kevin Coughlin <kevintcoughlin@gmail.com>
Kevin Huang <huang.kev@gmail.com>
Kevin Lau <thekevlau@gmail.com>
Kevin Old <kevin@kevinold.com>
Kevin Robinson <krobinson@twitter.com>
Kewei Jiang <jkewei328@hotmail.com>
Kier Borromeo <seraphipod@gmail.com>
KimCoding <jeokrang@hanmail.net>
Kirk Steven Hansen <hanski07@kirk-hansens-macbook.local>
Kit Randel <kit@nocturne.net.nz>
Kohei TAKATA <kt.koheitakata@gmail.com>
Koo Youngmin <youngmin@youngminz.kr>
Krystian Karczewski <karcz.k@gmail.com>
Kunal Mehta <k.mehta@berkeley.edu>
Kurt Ruppel <me@kurtruppel.com>
Kyle Kelley <rgbkrk@gmail.com>
Kyle Mathews <mathews.kyle@gmail.com>
Laurence Rowe <l@lrowe.co.uk>
Laurent Etiemble <laurent.etiemble@monobjc.net>
Lee Byron <lee@leebyron.com>
Lee Jaeyoung <jaeyoung@monodiary.net>
Lei <tendant@gmail.com>
Leland Richardson <leland.m.richardson@gmail.com>
Leon Fedotov <LeonFedotov@users.noreply.github.com>
Leon Yip <lyip1992@users.noreply.github.com>
Leonardo YongUk Kim <dalinaum@gmail.com>
Levi Buzolic <levibuzolic@gmail.com>
Levi McCallum <levi@levimccallum.com>
Lily <qvang.j@gmail.com>
Logan Allen <loganfynne@gmail.com>
Lovisa Svallingson <lovisasvallingson@gmail.com>
Ludovico Fischer <livrerie@gmail.com>
Luigy Leon <luichi.19@gmail.com>
Luke Horvat <lukehorvat@gmail.com>
MIKAMI Yoshiyuki <yoshuki@saikyoline.jp>
Maher Beg <maherbeg@gmail.com>
Manas <prometheansacrifice@gmail.com>
Marcin K. <katzoo@github.mail>
Marcin Kwiatkowski <marcin.kwiatkowski@hotmail.com>
Marcin Szczepanski <marcins@gmail.com>
Mariano Desanze <protronm@gmail.com>
Marjan <marjan.georgiev@gmail.com>
Mark Anderson <undernewmanagement@users.noreply.github.com>
Mark Funk <mfunk86@gmail.com>
Mark Hintz <markohintz@gmail.com>
Mark IJbema <markijbema@gmail.com>
Mark Murphy <murphy.mark@live.ca>
Mark Richardson <echo@fb.com>
Mark Rushakoff <mark@influxdb.com>
Mark Sun <sunmark14@gmail.com>
Marlon Landaverde <milanlandaverde@gmail.com>
Marshall Roch <mroch@fb.com>
Martin Andert <mandert@gmail.com>
Martin Hujer <mhujer@gmail.com>
Martin Jul <martin@mjul.com>
Martin Konicek <mkonicek@fb.com>
Martin Mihaylov <martomi@users.noreply.github.com>
Masaki KOBAYASHI <makky.4d6b.3f5@gmail.com>
Mathieu M-Gosselin <mathieumg@gmail.com>
Mathieu Savy <savy.mathieu@gmail.com>
Matias Singers <mail@matiassingers.com>
Matsunoki <himkt@klis.tsukuba.ac.jp>
Matt Brookes <matt@brookes.net>
Matt Dunn-Rankin <mdunnrankin@gmail.com>
Matt Harrison <mt.harrison86@gmail.com>
Matt Huggins <matt.huggins@gmail.com>
Matt Stow <matt.stow@foxsports.com.au>
Matt Zabriskie <mzabriskie@gmail.com>
Matthew Dapena-Tretter <m@tthewwithanm.com>
Matthew Herbst <mherbst@chegg.com>
Matthew Hodgson <matthew@matrix.org>
Matthew Johnston <matthewjohnston4@outlook.com>
Matthew King <mking@users.noreply.github.com>
Matthew Looi <looi.matthew@gmail.com>
Matthew Miner <matthew@matthewminer.com>
Matthias Le Brun <mlbli@me.com>
Matti Nelimarkka <matti.nelimarkka@hiit.fi>
Mattijs Kneppers <mattijs@arttech.nl>
Max F. Albrecht <1@178.is>
Max Heiber <max.heiber@gmail.com>
Max Stoiber <contact@mstoiber.com>
Maxi Ferreira <charca@gmail.com>
Maxim Abramchuk <MaximAbramchuck@gmail.com>
Merrick Christensen <merrick.christensen@gmail.com>
Mert Kahyaoğlu <mertkahyaoglu93@gmail.com>
Michael Chan <mijoch@gmail.com>
Michael McDermott <michael@mgmcdermott.com>
Michael Randers-Pehrson <michael.rp@gmail.com>
Michael Ridgway <mridgway@yahoo-inc.com>
Michael Warner <MichaelJWarner@hotmail.com>
Michael Wiencek <mwtuea@gmail.com>
Michael Ziwisky <mikezx@gmail.com>
Michal Srb <xixixao@seznam.cz>
Michelle Todd <himichelletodd@gmail.com>
Mihai Parparita <mihai.parparita@gmail.com>
Mike D Pilsbury <mike.pilsbury@gmail.com>
Mike Groseclose <mike.groseclose@gmail.com>
Mike Nordick <mnordick>
Mikolaj Dadela <mikolaj.dadela@hgv-online.de>
Miles Johnson <mileswjohnson@gmail.com>
Minwe LUO <minwe@yunshipei.com>
Miorel Palii <miorel@fb.com>
Morhaus <alexandre.kirszenberg@gmail.com>
Moshe Kolodny <kolodny.github@gmail.com>
Mouad Debbar <mdebbar@fb.com>
Murad <rogozhnikoff@users.noreply.github.com>
Murray M. Moss <murray@mmoss.name>
Nadeesha Cabral <nadeesha.cabral@gmail.com>
Naman Goel <naman34@gmail.com>
Nate Hunzaker <nate.hunzaker@gmail.com>
Nate Lee <nathaniel.jy.lee88@gmail.com>
Nathan Smith <NogsMPLS@users.noreply.github.com>
Nathan White <nw@nwhite.net>
Nee <944316342@qq.com>
Neri Marschik <marschik_neri@cyberagent.co.jp>
Nguyen Truong Duy <truongduy134@yahoo.com>
Nicholas Bergson-Shilcock <me@nicholasbs.net>
Nicholas Clawson <nickclaw@users.noreply.github.com>
Nick Balestra <nickbalestra@users.noreply.github.com>
Nick Fitzgerald <fitzgen@gmail.com>
Nick Gavalas <njg57@cornell.edu>
Nick Merwin <nick@lemurheavy.com>
Nick Presta <nick@nickpresta.ca>
Nick Raienko <enaqxx@gmail.com>
Nick Thompson <ncthom91@gmail.com>
Nick Williams <WickyNilliams@users.noreply.github.com>
Niklas Boström <nbostrom@gmail.com>
Ning Xia <ning-github@users.noreply.github.com>
Niole Nelson <niolenelson@gmail.com>
Oiva Eskola <oiva.eskola@gmail.com>
Oleg <o.yanchinskiy@gmail.com>
Oleksii Markhovskyi <olexiy.markhovsky@gmail.com>
Oliver Zeigermann <oliver.zeigermann@gmail.com>
Olivier Tassinari <Olivier.tassinari@gmail.com>
Owen Coutts <owenc@fb.com>
Pablo Lacerda de Miranda <pablolm@yahoo-inc.com>
Paolo Moretti <moretti@users.noreply.github.com>
Pascal Hartig <passy@twitter.com>
Patrick <info@telepark.de>
Patrick Laughlin <patrick@laughl.info>
Patrick Stapleton <github@gdi2290.com>
Paul Benigeri <me@benigeri.com>
Paul Harper <benekastah@gmail.com>
Paul O’Shannessy <paul@oshannessy.com>
Paul Seiffert <paul.seiffert@gmail.com>
Paul Shen <paul@mnml0.com>
Pedro Nauck <pedronauck@gmail.com>
Pete Hunt <floydophone@gmail.com>
Peter Blazejewicz <peter.blazejewicz@gmail.com>
Peter Cottle <pcottle@fb.com>
Peter Jaros <peter.a.jaros@gmail.com>
Peter Newnham <peter.newnham@appsbroker.com>
Petri Lehtinen <petri@digip.org>
Petri Lievonen <plievone@cc.hut.fi>
Pieter Vanderwerff <me@pieter.io>
Pouja Nikray <poujanik@gmail.com>
Prathamesh Sonpatki <csonpatki@gmail.com>
Prayag Verma <prayag.verma@gmail.com>
Preston Parry <ClimbsRocks@users.noreply.github.com>
Rafael <rafael.garcia@clever.com>
Rafal Dittwald <rafal.dittwald@gmail.com>
Rainer Oviir <roviir@gmail.com>
Rajat Sehgal <rajatsehgal1988@gmail.com>
Rajiv Tirumalareddy <rajivtreddy@gmail.com>
Ram Kaniyur <quadrupleslap@users.noreply.github.com>
Randall Randall <randall@randallsquared.com>
Ray <ray@tomo.im>
Raymond Ha <raymond@shraymonks.com>
Reed Loden <reed@reedloden.com>
Remko Tronçon <git@el-tramo.be>
Richard D. Worth <rdworth@gmail.com>
Richard Feldman <richard.t.feldman@gmail.com>
Richard Kho <hello@richardkho.com>
Richard Littauer <richard.littauer@gmail.com>
Richard Livesey <Livesey7@hotmail.co.uk>
Richard Wood <rwoodnz@gmail.com>
Rick Beerendonk <rick@beerendonk.com>
Rick Ford <rickfordrick@gmail.com>
Riley Tomasek <riley.tomasek@gmail.com>
Rob Arnold <robarnold@cs.cmu.edu>
Robert Binna <rbinna@gmail.com>
Robert Knight <robert.knight@mendeley.com>
Robert Sedovsek <robert.sedovsek@gmail.com>
Robin Berjon <robin@berjon.com>
Robin Frischmann <robin@rofrischmann.de>
Roman Pominov <rpominov+github@gmail.com>
Roman Vanesyan <roman.vanesyan@gmail.com>
Russ <russwirtz@gmail.com>
Ryan Seddon <seddon.ryan@gmail.com>
Sahat Yalkabov <sakhat@gmail.com>
Saif Hakim <saif@benchling.com>
Saiichi Hashimoto <saiichihashimoto@gmail.com>
Sam Beveridge <sbeveridge@saltstack.com>
Sam Saccone <samccone@gmail.com>
Sam Selikoff <sam.selikoff@gmail.com>
Samy Al Zahrani <samy@sadeem.net>
Sander Spies <sandermail@gmail.com>
Scott Burch <scott@bulldoginfo.com>
Scott Feeney <scott@oceanbase.org>
Sean Kinsey <oyvind@fb.com>
Sebastian Markbåge <sebastian@calyptus.eu>
Sebastian McKenzie <sebmck@gmail.com>
Seoh Char <devthewild@gmail.com>
Sercan Eraslan <sercan.eraslan@sahibinden.com>
Serg <undrdog@yandex.ru>
Sergey Generalov <sergey@genbit.ru>
Sergey Rubanov <chi187@gmail.com>
Seyi Adebajo <hello@seyinanigans.com>
Shane O'Sullivan <shaneosullivan1@gmail.com>
Shaun Trennery <shaun.trennery@gmail.com>
ShihChi Huang <hhuang@netflix.com>
Shim Won <marocchino@gmail.com>
Shinnosuke Watanabe <snnskwtnb@gmail.com>
Shogun Sea <shogunsea08@gmail.com>
Shota Kubota <kubosho@users.noreply.github.com>
Shripad K <assortmentofsorts@gmail.com>
Sibi <psibi2000@gmail.com>
Simen Bekkhus <sbekkhus91@gmail.com>
Simon Højberg <r.hackr@gmail.com>
Simon Welsh <simon@simon.geek.nz>
Simone Vittori <hello@simonewebdesign.it>
Soichiro Kawamura <mail@w-st.com>
Sophia Westwood <sophia@quip.com>
Sota Ohara <ohrst.18@gmail.com>
Spencer Handley <spencerhandley@gmail.com>
Stefan Dombrowski <sdo451@gmail.com>
Stephen Murphy <smurphy3@apple.com>
Sterling Cobb <sterlingcobb@gmail.com>
Steve Baker <_steve_@outlook.com>
Steven Luscher <react@steveluscher.com>
Steven Vachon <contact@svachon.com>
Stoyan Stefanov <ssttoo@ymail.com>
Sundeep Malladi <sundeep.malladi@gmail.com>
Sunny Juneja <me@sunnyjuneja.com>
Sven Helmberger <fforw@gmx.de>
Sverre Johansen <sverre.johansen@gmail.com>
Sébastien Lorber <lorber.sebastien@gmail.com>
Sławomir Laskowski <laskowski.box@gmail.com>
Taeho Kim <dittos@gmail.com>
Tay Yang Shun <tay.yang.shun@gmail.com>
Ted Kim <ted@vcnc.co.kr>
Tengfei Guo <terryr3rd@yeah.net>
Teodor Szente <teodor98sz@gmail.com>
Thomas Aylott <oblivious@subtlegradient.com>
Thomas Boyt <thomas.boyt@venmo.com>
Thomas Broadley <buriedunderbooks@hotmail.com>
Thomas Reggi <socialtr@gmail.com>
Thomas Röggla <t.roggla@cwi.nl>
Thomas Shaddox <thomas@heyzap.com>
Thomas Shafer <thomasjshafer@gmail.com>
ThomasCrvsr <crevoisier.thomas@gmail.com>
Tienchai Wirojsaksaree <tienchai@fb.com>
Tim Routowicz <troutowicz@gmail.com>
Tim Schaub <tschaub@users.noreply.github.com>
Timothy Yung <yungsters@gmail.com>
Timur Carpeev <timuric@users.noreply.github.com>
Tobias Reiss <tag+github@basecode.de>
Tom Duncalf <tom@tomduncalf.com>
Tom Haggie <thaggie@gmail.com>
Tom Hauburger <thauburger@gmail.com>
Tom MacWright <tom@macwright.org>
Tom Occhino <tomocchino@gmail.com>
Tomasz Kołodziejski <tkolodziejski@gmail.com>
Tomoya Suzuki <tmysz.dev@gmail.com>
Tony Spiro <tspiro@tonyspiro.com>
Toru Kobayashi <koba0004@gmail.com>
Trinh Hoang Nhu <trinhhoangnhu@gmail.com>
Tsung Hung <thung@me.com>
Tyler Brock <tyler.brock@gmail.com>
Ustin Zarubin <ustin.zarubin@campusbellhops.com>
Vadim Chernysh <chernysh.vadim@gmail.com>
Varun Rau <varunrau@gmail.com>
Vasiliy Loginevskiy <Yeti.or@gmail.com>
Victor Alvarez <v.alvarez312@gmail.com>
Victor Homyakov <vkhomyackov@gmail.com>
Victor Koenders <victor.koenders@gmail.com>
Ville Immonen <ville.immonen@iki.fi>
Vincent Riemer <vincentriemer@gmail.com>
Vincent Siao <vincent@asana.com>
Vipul A M <vipulnsward@gmail.com>
Vitaly Kramskikh <vkramskikh@gmail.com>
Vitor Balocco <vitorbal@gmail.com>
Vjeux <vjeuxx@gmail.com>
Volkan Unsal <spocksplanet@gmail.com>
Wander Wang <wander.wang@ismole.com>
Wayne Larsen <wayne@larsen.st>
WickyNilliams <WickyNilliams@MBA>
Wincent Colaiuta <win@wincent.com>
Wout Mertens <Wout.Mertens@gmail.com>
Xavier Morel <xmo-odoo@users.noreply.github.com>
XuefengWu <benewu@gmail.com>
Yakov Dalinchuk <murashki@users.noreply.github.com>
Yasar icli <hello@yasaricli.com>
YouBao Nong <noyobo@gmail.com>
Yuichi Hagio <yhagio87@gmail.com>
Yuriy Dybskiy <yuriy@dybskiy.com>
Yutaka Nakajima <nakazye@gmail.com>
Yuval Dekel <thedekel@fb.com>
Zach Bruggeman <mail@bruggie.com>
Zach Ramaekers <zramaekers@gmail.com>
Zacharias <zachasme@users.noreply.github.com>
Zeke Sikelianos <zeke@sikelianos.com>
Zhangjd <zhang.jd@qq.com>
adraeth <jerzy.mirecki@gmail.com>
arush <arush@ilovebrands.net>
brafdlog <brafdlog@gmail.com>
chen <kikyous@163.com>
clariroid <clarinette.uranus@gmail.com>
claudiopro <claudio.procida@gmail.com>
cutbko <kutsenko.eugene@hotmail.com>
davidxi <davidgraycn@gmail.com>
dongmeng.ldm <dongmeng.ldm@alibaba-inc.com>
iamchenxin <iamchenxin@gmail.com>
iamdoron <doronpagot@gmail.com>
iawia002 <z2d@jifangcheng.com>
imagentleman <imagentlemail@gmail.com>
koh-taka <koh-taka@users.noreply.github.com>
kohashi85 <hako584@gmail.com>
laiso <laiso@lai.so>
leeyoungalias <leeyoungalias@qq.com>
li.li <li.li@ele.me>
maxprafferty <maxprafferty@gmail.com>
rgarifullin <ringarifullin@gmail.com>
songawee <dennis@songawee.com>
sugarshin <shinsugar@gmail.com>
wali-s <ahmad3y2k@hotmail.com>
yiminghe <yiminghe@gmail.com>
youmoo <youmoolee@gmail.com>
zhangjg <jinguozhang@qq.com>
zwhitchcox <zwhitchcox@gmail.com>
Árni Hermann Reynisson <arnihr@gmail.com>
元彦 <yuanyan@users.noreply.github.com>
凌恒 <jiakun.dujk@alibaba-inc.com>
张敏 <cookfront@gmail.com>
================================================
FILE: docs/articles/intro_reactR_files/react-16.7.0/LICENSE.txt
================================================
MIT License
Copyright (c) 2013-present, Facebook, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: docs/articles/intro_reactR_files/react-16.8.1/AUTHORS
================================================
39 <8398a7@gmail.com>
Aaron Franks <aaron.franks@gmail.com>
Aaron Gelter <aaron.gelter@harman.com>
Adam Bloomston <adam@glitterfram.es>
Adam Krebs <amk528@cs.nyu.edu>
Adam Mark <adammark75@gmail.com>
Adam Solove <asolove@gmail.com>
Adam Timberlake <adam.timberlake@gmail.com>
Adam Zapletal <adamzap@gmail.com>
Ahmad Wali Sidiqi <wali-s@users.noreply.github.com>
Alan Plum <me@pluma.io>
Alan Souza <alansouzati@gmail.com>
Alan deLevie <adelevie@gmail.com>
Alastair Hole <afhole@gmail.com>
Alex <ultrafez@users.noreply.github.com>
Alex Boatwright <drdelambre@gmail.com>
Alex Boyd <alex@opengroove.org>
Alex Dajani <xelad1@gmail.com>
Alex Lopatin <alex@alexlopatin.com>
Alex Mykyta <dancingwithcows@gmail.com>
Alex Pien <alexpien@gmail.com>
Alex Smith <iqwz@ya.ru>
Alex Zelenskiy <azelenskiy@fb.com>
Alexander Shtuchkin <ashtuchkin@gmail.com>
Alexander Solovyov <alexander@solovyov.net>
Alexander Tseung <alextsg@gmail.com>
Alexandre Gaudencio <shahor@shahor.fr>
Alexey Raspopov <avenger7x13@gmail.com>
Alexey Shamrin <shamrin@gmail.com>
Ali Ukani <ali.ukani@gmail.com>
Andre Z Sanchez <andrezacsanchez@gmail.com>
Andreas Savvides <asavvides@twitter.com>
Andreas Svensson <andreas@syranide.com>
Andres Kalle <mjomble@gmail.com>
Andres Suarez <zertosh@gmail.com>
Andrew Clark <acdlite@me.com>
Andrew Cobby <cobbweb@users.noreply.github.com>
Andrew Davey <andrew@equin.co.uk>
Andrew Henderson <andrew.m.henderson@gmail.com>
Andrew Kulakov <avk@8xx8.ru>
Andrew Rasmussen <andras@fb.com>
Andrew Sokolov <asokolov@atlassian.com>
Andrew Zich <azich@fb.com>
Andrey Popp <8mayday@gmail.com>
Anthony van der Hoorn <anthony.vanderhoorn@gmail.com>
Anto Aravinth <anto.aravinth.cse@gmail.com>
Antonio Ruberto <anto.ruberto@gmail.com>
Antti Ahti <antti.ahti@gmail.com>
Anuj Tomar <ankuto@gmail.com>
AoDev <AoDev@users.noreply.github.com>
April Arcus <april.arcus@gmail.com>
Areeb Malik <areeb.malik91@gmail.com>
Aria Buckles <aria@khanacademy.org>
Aria Stewart <aredridel@dinhe.net>
Arian Faurtosh <arian@icloud.com>
Artem Nezvigin <artem@artnez.com>
Austin Wright <aaa@bzfx.net>
Ayman Osman <aymano.osman@gmail.com>
Baraa Hamodi <bhamodi@uwaterloo.ca>
Bartosz Kaszubowski <gosimek@gmail.com>
Basarat Ali Syed <basaratali@gmail.com>
Battaile Fauber <battaile@gmail.com>
Beau Smith <beau@beausmith.com>
Ben Alpert <ben@benalpert.com>
Ben Anderson <banderson@constantcontact.com>
Ben Brooks <ben@benbrooks.net>
Ben Foxall <benfoxall@gmail.com>
Ben Halpern <bendhalpern@gmail.com>
Ben Jaffe <jaffe.ben@gmail.com>
gitextract_1rmdkxph/ ├── .Rbuildignore ├── .gitattributes ├── .github/ │ ├── .gitignore │ └── workflows/ │ └── R-CMD-check.yaml ├── .gitignore ├── CONDUCT.md ├── DESCRIPTION ├── LICENSE ├── NAMESPACE ├── NEWS.md ├── R/ │ ├── babel.R │ ├── dependencies.R │ ├── meta.R │ ├── reacttools.R │ ├── scaffold_input.R │ ├── scaffold_utils.R │ └── scaffold_widget.R ├── README.Rmd ├── README.md ├── buildupdate/ │ └── getreact.R ├── cran-comments.md ├── docs/ │ ├── 404.html │ ├── CONDUCT.html │ ├── LICENSE-text.html │ ├── articles/ │ │ ├── index.html │ │ ├── intro_htmlwidgets.html │ │ ├── intro_htmlwidgets_files/ │ │ │ └── accessible-code-block-0.0.1/ │ │ │ └── empty-anchor.js │ │ ├── intro_inputs.html │ │ ├── intro_inputs_files/ │ │ │ └── accessible-code-block-0.0.1/ │ │ │ └── empty-anchor.js │ │ ├── intro_reactR.html │ │ └── intro_reactR_files/ │ │ ├── accessible-code-block-0.0.1/ │ │ │ └── empty-anchor.js │ │ ├── react-16.12.0/ │ │ │ ├── AUTHORS │ │ │ └── LICENSE.txt │ │ ├── react-16.7.0/ │ │ │ ├── AUTHORS │ │ │ └── LICENSE.txt │ │ ├── react-16.8.1/ │ │ │ ├── AUTHORS │ │ │ └── LICENSE.txt │ │ ├── react-16.8.6/ │ │ │ ├── AUTHORS │ │ │ └── LICENSE.txt │ │ ├── react-17.0.0/ │ │ │ ├── AUTHORS │ │ │ └── LICENSE.txt │ │ └── react-18.2.0/ │ │ ├── AUTHORS │ │ └── LICENSE.txt │ ├── authors.html │ ├── bootstrap-toc.css │ ├── bootstrap-toc.js │ ├── docsearch.css │ ├── docsearch.js │ ├── index.html │ ├── news/ │ │ └── index.html │ ├── pkgdown.css │ ├── pkgdown.js │ ├── pkgdown.yml │ ├── reference/ │ │ ├── React.html │ │ ├── babel_transform.html │ │ ├── component.html │ │ ├── createReactShinyInput.html │ │ ├── html_dependency_corejs.html │ │ ├── html_dependency_mobx.html │ │ ├── html_dependency_react.html │ │ ├── html_dependency_reacttools.html │ │ ├── index.html │ │ ├── reactMarkup.html │ │ ├── scaffoldReactShinyInput.html │ │ └── scaffoldReactWidget.html │ └── sitemap.xml ├── inst/ │ ├── examples/ │ │ ├── antd.R │ │ └── office-fabric.R │ ├── templates/ │ │ ├── input_app.R.txt │ │ ├── input_js.txt │ │ ├── input_r.txt │ │ ├── package.json.txt │ │ ├── webpack.config.js.txt │ │ ├── widget_app.R.txt │ │ ├── widget_js.txt │ │ ├── widget_r.txt │ │ └── widget_yaml.txt │ └── www/ │ ├── core-js/ │ │ ├── LICENSE │ │ └── package.json │ ├── mobx/ │ │ ├── LICENSE │ │ ├── mobx-react-lite.js │ │ ├── mobx-react.umd.js │ │ └── package.json │ ├── react/ │ │ ├── AUTHORS │ │ └── LICENSE.txt │ └── react-tools/ │ └── react-tools.js ├── js-tests/ │ └── react-tools.test.jsx ├── man/ │ ├── React.Rd │ ├── babel_transform.Rd │ ├── component.Rd │ ├── createReactShinyInput.Rd │ ├── html_dependency_corejs.Rd │ ├── html_dependency_mobx.Rd │ ├── html_dependency_react.Rd │ ├── html_dependency_reacttools.Rd │ ├── reactMarkup.Rd │ ├── scaffoldReactShinyInput.Rd │ └── scaffoldReactWidget.Rd ├── package.json ├── reactR.Rproj ├── srcjs/ │ ├── input.js │ ├── react-tools.js │ └── widget.js ├── vignettes/ │ ├── intro_htmlwidgets.Rmd │ ├── intro_inputs.Rmd │ └── intro_reactR.Rmd └── vite.config.js
SYMBOL INDEX (64 symbols across 8 files)
FILE: docs/docsearch.js
function matchedWords (line 54) | function matchedWords(hit) {
function updateHitURL (line 73) | function updateHitURL(hit) {
FILE: docs/pkgdown.js
function paths (line 42) | function paths(pathname) {
function prefix_length (line 53) | function prefix_length(needle, haystack) {
function changeTooltipMessage (line 72) | function changeTooltipMessage(element, msg) {
FILE: inst/www/mobx/mobx-react-lite.js
function useObservable (line 16) | function useObservable(initialValue) {
function useComputed (line 24) | function useComputed(func, inputs) {
function useDisposable (line 43) | function useDisposable(disposerGenerator, inputs) {
function useStaticRendering (line 81) | function useStaticRendering(enable) {
function isUsingStaticRendering (line 84) | function isUsingStaticRendering() {
function __read (line 114) | function __read(o, n) {
function printDebugValue (line 131) | function printDebugValue(v) {
function useUnmount (line 139) | function useUnmount(fn) {
function useForceUpdate (line 142) | function useForceUpdate() {
function isPlainObject (line 149) | function isPlainObject(value) {
function useObserver (line 158) | function useObserver(fn, baseComponentName, options) {
function observer (line 202) | function observer(baseComponent, options) {
function copyStaticProperties (line 238) | function copyStaticProperties(base, target) {
function ObserverComponent (line 246) | function ObserverComponent(_a) {
function ObserverPropsCheck (line 259) | function ObserverPropsCheck(props, key, componentName, location, propFul...
function useAsObservableSourceInternal (line 279) | function useAsObservableSourceInternal(current, usedByLocalStore) {
function useAsObservableSource (line 289) | function useAsObservableSource(current) {
function useLocalStore (line 293) | function useLocalStore(initializer, current) {
function wrapInTransaction (line 311) | function wrapInTransaction(fn, context) {
FILE: inst/www/mobx/mobx-react.umd.js
function s (line 1) | function s(e){return c[e]||(c[e]=function(e){if("function"==typeof Symbo...
function u (line 1) | function u(e,r){if(f(e,r))return!0;if("object"!=typeof e||null===e||"obj...
function f (line 1) | function f(e,r){return e===r?0!==e||1/e==1/r:e!=e&&r!=r}
function l (line 1) | function l(e,r,t){Object.hasOwnProperty.call(e,r)?e[r]=t:Object.definePr...
function y (line 1) | function y(e,r){for(var t=this,n=[],o=arguments.length-2;o-- >0;)n[o]=ar...
function h (line 1) | function h(e,r){return function(){for(var t=[],n=arguments.length;n--;)t...
function v (line 1) | function v(e,r,t){var n=function(e,r){var t=e[d]=e[d]||{},n=t[r]=t[r]||{...
function j (line 1) | function j(e,r){return t.isUsingStaticRendering()&&console.warn("[mobx-r...
function x (line 1) | function x(e,r){var t=s("reactProp_"+r+"_valueHolder"),n=s("reactProp_"+...
function R (line 1) | function R(e){if(!0===e.isMobxInjector&&console.warn("Mobx observer: You...
function r (line 1) | function r(r,t){e.call(this,r,t),this.state=Object.assign({},t,U(r))}
function U (line 1) | function U(e){var r={};if(!e)return r;for(var t in e)_(t)&&(r[t]=e[t]);r...
function _ (line 1) | function _(e){return!C[e]&&"suppressChangedStoreWarning"!==e}
function k (line 1) | function k(e,r,t,o){var a=function(e,r){var t=e.displayName||e.name||e.c...
function T (line 1) | function T(){var e=this;(this[A]||[]).concat(this[M]||[]).forEach(functi...
function D (line 1) | function D(e){function r(r,t,n,i,a,c){for(var s=[],u=arguments.length-6;...
function $ (line 1) | function $(e){var r=typeof e;return Array.isArray(e)?"array":e instanceo...
function q (line 1) | function q(e,r){return D(function(t,n,i,a,c){return o.untracked(function...
function N (line 1) | function N(e,r){return D(function(t,n,i,a,c){for(var s=[],u=arguments.le...
FILE: inst/www/react-tools/react-tools.js
function u (line 1) | function u(n,t){if(typeof t=="string")return t;if(t.name[0]===t.name[0]....
function y (line 1) | function y(n){var t={};for(var a in d)t[a]=d[a];for(var a in n){if(!d.ha...
function o (line 1) | function o(n,t){if(!t.appendPx)return n}
function g (line 1) | function g(n){return typeof n=="object"&&n.hasOwnProperty("name")&&n.has...
function b (line 1) | function b(n,t,a,r){var e=y(r);window.HTMLWidgets.widget({name:n,type:t,...
function O (line 1) | function O(n,{configuration:t,value:a}){let r=!1;t!==void 0&&(this.setIn...
function w (line 1) | function w(n,t,a,r){r=Object.assign({},m,r),Shiny.inputBindings.register...
FILE: js-tests/react-tools.test.jsx
class Shout (line 16) | class Shout extends React.Component {
method render (line 17) | render() {
class TodoList (line 26) | class TodoList extends React.Component {
method render (line 27) | render() {
function objectToTag (line 37) | function objectToTag(obj) {
function stringToTag (line 52) | function stringToTag(str) {
function xmlEqual (line 57) | function xmlEqual(x1, x2) {
FILE: srcjs/input.js
function defaultReceiveMessage (line 9) | function defaultReceiveMessage(el, { configuration, value }) {
function reactShinyInput (line 67) | function reactShinyInput(selector,
FILE: srcjs/widget.js
function hydrate (line 8) | function hydrate(components, tag) {
function mergeOptions (line 47) | function mergeOptions(options) {
function formatDimension (line 61) | function formatDimension(dim, options) {
function isTag (line 69) | function isTag(value) {
function reactWidget (line 85) | function reactWidget(name, type, components, options) {
Condensed preview — 107 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (632K chars).
[
{
"path": ".Rbuildignore",
"chars": 273,
"preview": "^CRAN-RELEASE$\n^node_modules$\n^js-tests$\n^srcjs$\n^pkgdown$\n^assets$\n^.*\\.Rproj$\n^CONDUCT\\.md$\n^README\\.Rmd$\n^\\.Rproj\\.us"
},
{
"path": ".gitattributes",
"chars": 92,
"preview": "/inst/www/react-tools/react-tools.js binary\n/inst/www/react-tools/react-tools.js.map binary\n"
},
{
"path": ".github/.gitignore",
"chars": 7,
"preview": "*.html\n"
},
{
"path": ".github/workflows/R-CMD-check.yaml",
"chars": 1326,
"preview": "# Workflow derived from https://github.com/r-lib/actions/tree/v2/examples\n# Need help debugging build failures? Start at"
},
{
"path": ".gitignore",
"chars": 117,
"preview": "Meta\ndoc\n.Rproj.user\n.Rhistory\n.RData\n.Ruserdata\ninst/doc\nnode_modules\nreactR.Rcheck\nreactR_*.tar.gz\n*.swp\n.DS_Store\n"
},
{
"path": "CONDUCT.md",
"chars": 1387,
"preview": "# Contributor Code of Conduct\n\nAs contributors and maintainers of this project, we pledge to respect all people who \ncon"
},
{
"path": "DESCRIPTION",
"chars": 1465,
"preview": "Package: reactR\nType: Package\nTitle: React Helpers\nVersion: 0.6.1\nDate: 2024-09-14\nAuthors@R: c(\n person(\n \""
},
{
"path": "LICENSE",
"chars": 42,
"preview": "YEAR: 2018\nCOPYRIGHT HOLDER: Kent Russell\n"
},
{
"path": "NAMESPACE",
"chars": 532,
"preview": "# Generated by roxygen2: do not edit by hand\n\nS3method(\"$\",react_component_builder)\nS3method(\"$<-\",react_component_build"
},
{
"path": "NEWS.md",
"chars": 2936,
"preview": "# reactR 0.6.1\n\n* Fix issue where the `react-tools.umd.cjs` script could be blocked by the browser in some cases, such a"
},
{
"path": "R/babel.R",
"chars": 666,
"preview": "#' Transform Code with Babel\n#'\n#' Helper function to use \\code{V8} with \\code{Babel} so we can\n#' avoid a JSX transform"
},
{
"path": "R/dependencies.R",
"chars": 3980,
"preview": "#' Dependencies for React\n#'\n#' Add JavaScript 'React' dependency. For this to work in RStudio Viewer, also include\n#' "
},
{
"path": "R/meta.R",
"chars": 96,
"preview": "#'@keywords internal\nreact_version <- function(){'18.2.0'}\nbabel_version <- function(){'6.26.0'}"
},
{
"path": "R/reacttools.R",
"chars": 5136,
"preview": "# A robust name string is a valid\n# - CSS class\n# - JavaScript variable name\n# - R variable name\nrobustName <- \"^[[:alph"
},
{
"path": "R/scaffold_input.R",
"chars": 2102,
"preview": "#' Create implementation scaffolding for a React.js-based Shiny input.\n#'\n#' Add the minimal code required to implement "
},
{
"path": "R/scaffold_utils.R",
"chars": 2169,
"preview": "slurp <- function(file) {\n paste(readLines(\n system.file(file, package = 'reactR')\n ), collapse = \"\\n\")\n}\n\n# invoke"
},
{
"path": "R/scaffold_widget.R",
"chars": 2721,
"preview": "#' Create implementation scaffolding for a React.js-based HTML widget\n#'\n#' Add the minimal code required to implement a"
},
{
"path": "README.Rmd",
"chars": 3412,
"preview": "---\noutput: github_document\n---\n\n# reactR <img src=\"vignettes/logo.svg\" alt=\"reactR logo\" width=\"100px\" />\n\n<!-- README."
},
{
"path": "README.md",
"chars": 3219,
"preview": "\n# reactR <img src=\"vignettes/logo.svg\" alt=\"reactR logo\" width=\"100px\" />\n\n<!-- README.md is generated from README.Rmd."
},
{
"path": "buildupdate/getreact.R",
"chars": 1232,
"preview": "# use the very nice rgithub\n# devtools::install_github(\"cscheid/rgithub\")\n\nget_react_latest <- function(){\n gsub(\n x"
},
{
"path": "cran-comments.md",
"chars": 303,
"preview": "## Test environments\n* local Windows 10 install, R 4.3.1\n* rhub check_for_cran\n* winbuilder\n* github actions check for c"
},
{
"path": "docs/404.html",
"chars": 5956,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\">\n<head>\n<meta http-equiv=\"Content-Type"
},
{
"path": "docs/CONDUCT.html",
"chars": 7492,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/LICENSE-text.html",
"chars": 5886,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/articles/index.html",
"chars": 6143,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/articles/intro_htmlwidgets.html",
"chars": 39529,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\">\n<head>\n<meta http-equiv=\"Content-Type"
},
{
"path": "docs/articles/intro_htmlwidgets_files/accessible-code-block-0.0.1/empty-anchor.js",
"chars": 653,
"preview": "// Hide empty <a> tag within highlighted CodeBlock for screen reader accessibility (see https://github.com/jgm/pandoc/is"
},
{
"path": "docs/articles/intro_inputs.html",
"chars": 27756,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\">\n<head>\n<meta http-equiv=\"Content-Type"
},
{
"path": "docs/articles/intro_inputs_files/accessible-code-block-0.0.1/empty-anchor.js",
"chars": 653,
"preview": "// Hide empty <a> tag within highlighted CodeBlock for screen reader accessibility (see https://github.com/jgm/pandoc/is"
},
{
"path": "docs/articles/intro_reactR.html",
"chars": 11177,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\">\n<head>\n<meta http-equiv=\"Content-Type"
},
{
"path": "docs/articles/intro_reactR_files/accessible-code-block-0.0.1/empty-anchor.js",
"chars": 653,
"preview": "// Hide empty <a> tag within highlighted CodeBlock for screen reader accessibility (see https://github.com/jgm/pandoc/is"
},
{
"path": "docs/articles/intro_reactR_files/react-16.12.0/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "docs/articles/intro_reactR_files/react-16.12.0/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "docs/articles/intro_reactR_files/react-16.7.0/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "docs/articles/intro_reactR_files/react-16.7.0/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "docs/articles/intro_reactR_files/react-16.8.1/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "docs/articles/intro_reactR_files/react-16.8.1/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "docs/articles/intro_reactR_files/react-16.8.6/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "docs/articles/intro_reactR_files/react-16.8.6/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "docs/articles/intro_reactR_files/react-17.0.0/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "docs/articles/intro_reactR_files/react-17.0.0/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "docs/articles/intro_reactR_files/react-18.2.0/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "docs/articles/intro_reactR_files/react-18.2.0/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "docs/authors.html",
"chars": 7352,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/bootstrap-toc.css",
"chars": 1843,
"preview": "/*!\n * Bootstrap Table of Contents v0.4.1 (http://afeld.github.io/bootstrap-toc/)\n * Copyright 2015 Aidan Feldman\n * Lic"
},
{
"path": "docs/bootstrap-toc.js",
"chars": 4764,
"preview": "/*!\n * Bootstrap Table of Contents v0.4.1 (http://afeld.github.io/bootstrap-toc/)\n * Copyright 2015 Aidan Feldman\n * Lic"
},
{
"path": "docs/docsearch.css",
"chars": 11758,
"preview": "/* Docsearch -------------------------------------------------------------- */\n/*\n Source: https://github.com/algolia/d"
},
{
"path": "docs/docsearch.js",
"chars": 2018,
"preview": "$(function() {\n\n // register a handler to move the focus to the search bar\n // upon pressing shift + \"/\" (i.e. \"?\")\n "
},
{
"path": "docs/index.html",
"chars": 16241,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\">\n<head>\n<meta http-equiv=\"Content-Type"
},
{
"path": "docs/news/index.html",
"chars": 13716,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/pkgdown.css",
"chars": 7308,
"preview": "/* Sticky footer */\n\n/**\n * Basic idea: https://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/\n * Details"
},
{
"path": "docs/pkgdown.js",
"chars": 3248,
"preview": "/* http://gregfranko.com/blog/jquery-best-practices/ */\n(function($) {\n $(function() {\n\n $('.navbar-fixed-top').head"
},
{
"path": "docs/pkgdown.yml",
"chars": 198,
"preview": "pandoc: 3.1.11\npkgdown: 2.0.7\npkgdown_sha: ~\narticles:\n intro_htmlwidgets: intro_htmlwidgets.html\n intro_inputs: intro"
},
{
"path": "docs/reference/React.html",
"chars": 9078,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/babel_transform.html",
"chars": 7871,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/component.html",
"chars": 8885,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/createReactShinyInput.html",
"chars": 10249,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/html_dependency_corejs.html",
"chars": 6914,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/html_dependency_mobx.html",
"chars": 14362,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/html_dependency_react.html",
"chars": 10861,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/html_dependency_reacttools.html",
"chars": 7000,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/index.html",
"chars": 8366,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/reactMarkup.html",
"chars": 7525,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/scaffoldReactShinyInput.html",
"chars": 7866,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/reference/scaffoldReactWidget.html",
"chars": 7863,
"preview": "<!DOCTYPE html>\n<!-- Generated by pkgdown: do not edit by hand --><html lang=\"en\"><head><meta http-equiv=\"Content-Type\" "
},
{
"path": "docs/sitemap.xml",
"chars": 1411,
"preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<urlset xmlns=\"http://www.sitemaps.org/schemas/sitemap/0.9\">\n <url>\n <loc>/40"
},
{
"path": "inst/examples/antd.R",
"chars": 3982,
"preview": "library(htmltools)\nlibrary(reactR)\nlibrary(pipeR)\n\nantd <- htmlDependency(\n name = \"antd\",\n version = \"2.13.10\",\n src"
},
{
"path": "inst/examples/office-fabric.R",
"chars": 1579,
"preview": "library(htmltools)\nlibrary(reactR)\n\nfabric <- htmlDependency(\n name = \"office-fabric-ui-react\",\n version = \"7.121.12\","
},
{
"path": "inst/templates/input_app.R.txt",
"chars": 308,
"preview": "library(shiny)\nlibrary(${package})\n\nui <- fluidPage(\n titlePanel(\"reactR Input Example\"),\n ${name}Input(\"textInput\"),\n"
},
{
"path": "inst/templates/input_js.txt",
"chars": 255,
"preview": "import { reactShinyInput } from 'reactR';\n\nconst TextInput = ({ configuration, value, setValue }) => {\n return <input t"
},
{
"path": "inst/templates/input_r.txt",
"chars": 789,
"preview": "#' <Add Title>\n#'\n#' <Add Description>\n#'\n#' @importFrom reactR createReactShinyInput\n#' @importFrom htmltools htmlDepen"
},
{
"path": "inst/templates/package.json.txt",
"chars": 408,
"preview": "{\n \"private\": true,\n \"dependencies\": {\n ${npmPkgs}\n },\n \"devDependencies\": {\n \"webpack\": \"^4.27.1\",\n \"webpa"
},
{
"path": "inst/templates/webpack.config.js.txt",
"chars": 854,
"preview": "var path = require('path');\n\nmodule.exports = {\n entry: path.join(__dirname, 'srcjs', '${name}.jsx'),\n output: {\n "
},
{
"path": "inst/templates/widget_app.R.txt",
"chars": 272,
"preview": "library(shiny)\nlibrary(${name})\n\nui <- fluidPage(\n titlePanel(\"reactR HTMLWidget Example\"),\n ${name}Output('widgetOutp"
},
{
"path": "inst/templates/widget_js.txt",
"chars": 81,
"preview": "import { reactWidget } from 'reactR';\n\nreactWidget('${name}', 'output', {}, {});\n"
},
{
"path": "inst/templates/widget_r.txt",
"chars": 1970,
"preview": "#' <Add Title>\n#'\n#' <Add Description>\n#'\n#' @import htmlwidgets\n#'\n#' @export\n${name} <- function(message, width = NULL"
},
{
"path": "inst/templates/widget_yaml.txt",
"chars": 116,
"preview": "# (uncomment to add a dependency)\n# dependencies:\n# - name:\n# version:\n# src:\n# script:\n# stylesheet:\n\n"
},
{
"path": "inst/www/core-js/LICENSE",
"chars": 1064,
"preview": "Copyright (c) 2014-2017 Denis Pushkarev\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof"
},
{
"path": "inst/www/core-js/package.json",
"chars": 4116,
"preview": "{\n \"devDependencies\": {\n \"@babel/cli\": \"^7.7.7\",\n \"@babel/core\": \"^7.7.7\",\n \"@babel/plugin-proposal-nullish-co"
},
{
"path": "inst/www/mobx/LICENSE",
"chars": 1084,
"preview": "The MIT License (MIT)\n\nCopyright (c) 2015 Michel Weststrate\n\nPermission is hereby granted, free of charge, to any person"
},
{
"path": "inst/www/mobx/mobx-react-lite.js",
"chars": 13064,
"preview": "(function (global, factory) {\n typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, requir"
},
{
"path": "inst/www/mobx/mobx-react.umd.js",
"chars": 10533,
"preview": "!function(e,r){\"object\"==typeof exports&&\"undefined\"!=typeof module?r(exports,require(\"react-dom\"),require(\"mobx-react-l"
},
{
"path": "inst/www/mobx/package.json",
"chars": 3594,
"preview": "{\n \"name\": \"mobx\",\n \"version\": \"5.10.1\",\n \"description\": \"Simple, scalable state management.\",\n \"main\": \"lib/mobx.js"
},
{
"path": "inst/www/react/AUTHORS",
"chars": 25706,
"preview": "39 <8398a7@gmail.com>\nAaron Franks <aaron.franks@gmail.com>\nAaron Gelter <aaron.gelter@harman.com>\nAdam Bloomston <adam@"
},
{
"path": "inst/www/react/LICENSE.txt",
"chars": 1080,
"preview": "MIT License\n\nCopyright (c) 2013-present, Facebook, Inc.\n\nPermission is hereby granted, free of charge, to any person obt"
},
{
"path": "inst/www/react-tools/react-tools.js",
"chars": 2973,
"preview": "(function(s,u){typeof exports==\"object\"&&typeof module<\"u\"?u(exports):typeof define==\"function\"&&define.amd?define([\"exp"
},
{
"path": "js-tests/react-tools.test.jsx",
"chars": 2925,
"preview": "import { assert, describe, it } from 'vitest'\nimport React from 'react'\nimport ReactDOM from 'react'\nimport { renderToSt"
},
{
"path": "man/React.Rd",
"chars": 972,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/reacttools.R\n\\docType{data}\n\\name{React}\n\\"
},
{
"path": "man/babel_transform.Rd",
"chars": 495,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/babel.R\n\\name{babel_transform}\n\\alias{babe"
},
{
"path": "man/component.Rd",
"chars": 675,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/reacttools.R\n\\name{component}\n\\alias{compo"
},
{
"path": "man/createReactShinyInput.Rd",
"chars": 1444,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/reacttools.R\n\\name{createReactShinyInput}\n"
},
{
"path": "man/html_dependency_corejs.Rd",
"chars": 361,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/dependencies.R\n\\name{html_dependency_corej"
},
{
"path": "man/html_dependency_mobx.Rd",
"chars": 1415,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/dependencies.R\n\\name{html_dependency_mobx}"
},
{
"path": "man/html_dependency_react.Rd",
"chars": 986,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/dependencies.R\n\\name{html_dependency_react"
},
{
"path": "man/html_dependency_reacttools.Rd",
"chars": 399,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/dependencies.R\n\\name{html_dependency_react"
},
{
"path": "man/reactMarkup.Rd",
"chars": 613,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/reacttools.R\n\\name{reactMarkup}\n\\alias{rea"
},
{
"path": "man/scaffoldReactShinyInput.Rd",
"chars": 908,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/scaffold_input.R\n\\name{scaffoldReactShinyI"
},
{
"path": "man/scaffoldReactWidget.Rd",
"chars": 910,
"preview": "% Generated by roxygen2: do not edit by hand\n% Please edit documentation in R/scaffold_widget.R\n\\name{scaffoldReactWidge"
},
{
"path": "package.json",
"chars": 381,
"preview": "{\n \"name\": \"react-tools\",\n \"private\": true,\n \"type\": \"module\",\n \"scripts\": {\n \"build\": \"vite build\",\n"
},
{
"path": "reactR.Rproj",
"chars": 395,
"preview": "Version: 1.0\n\nRestoreWorkspace: Default\nSaveWorkspace: Default\nAlwaysSaveHistory: Default\n\nEnableCodeIndexing: Yes\nUseSp"
},
{
"path": "srcjs/input.js",
"chars": 6169,
"preview": "/*\n * This default receiveMessage implementation expects data to contain whole\n * configuration and value properties. If"
},
{
"path": "srcjs/react-tools.js",
"chars": 149,
"preview": "import { reactWidget, hydrate } from './widget';\nimport { reactShinyInput } from './input';\n\nexport {\n reactShinyInput,"
},
{
"path": "srcjs/widget.js",
"chars": 4397,
"preview": "/**\n * Recursively transforms tag, a JSON representation of an instance of a\n * React component and its children, into a"
},
{
"path": "vignettes/intro_htmlwidgets.Rmd",
"chars": 12572,
"preview": "---\ntitle: \"Authoring htmlwidgets powered by React with reactR\"\nauthor:\n - Alan Dipert\n - Carson Sievert\ndate: \"`r Sys"
},
{
"path": "vignettes/intro_inputs.Rmd",
"chars": 10780,
"preview": "---\ntitle: \"Authoring inputs powered by React with reactR\"\nauthor:\n - Alan Dipert and Carson Sievert\ndate: \"`r Sys.Date"
},
{
"path": "vignettes/intro_reactR.Rmd",
"chars": 1631,
"preview": "---\ntitle: \"Intro to reactR\"\nauthor: \"Kent Russell\"\ndate: \"`r Sys.Date()`\"\noutput: rmarkdown::html_vignette\nvignette: >\n"
},
{
"path": "vite.config.js",
"chars": 722,
"preview": "import { resolve, join } from 'path';\nimport { defineConfig } from 'vite';\n\nexport default defineConfig({\n define: { 'p"
}
]
About this extraction
This page contains the full source code of the react-R/reactR GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 107 files (585.6 KB), approximately 184.2k tokens, and a symbol index with 64 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.