Giter Club home page Giter Club logo

reactr's People

Contributors

alandipert avatar cpsievert avatar dependabot[bot] avatar divadnojnarg avatar schloerke avatar stla avatar swsoyee avatar timelyportfolio avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

reactr's Issues

Multiple Shiny inputs

Hello,

I've done a package with multiple Shiny inputs. I'm using reactShinyInput multiple times for that, is it a good practice? The js file and the js.map file generated are suprisingly big.

ReactR state and other components

Hello,

first of all thank you for the awesome package. I love both technologies and played with it a bit.
In the documentation I found no way to pass state or child components.

class App extends React.Component {
  constructor() {
    super();
    this.state = {
      isFlipped: false
    };
    this.handleClick = this.handleClick.bind(this);
  }
 
  handleClick(e) {
    e.preventDefault();
    this.setState(prevState => ({ isFlipped: !prevState.isFlipped }));
  }
 
  render() {
    return (
      <ReactCardFlip isFlipped={this.state.isFlipped} flipDirection="vertical">
        <YOUR_FRONT_CCOMPONENT key="front">
          This is the front of the card.
          <button onClick={this.handleClick}>Click to flip</button>
        </FrontComponent>
 
        <YOUR_BACK_COMPONENT key="back">
          This is the back of the card.
          <button onClick={this.handleClick}>Click to flip</button>
        </BackComponent>
      </ReactCardFlip>
    )
  }
}

ReactDOM.render(<App />, document.querySelector("#pivot-example"));

I would like to use this Flip Card Component for example. It is possible to pass state? This Component also only works with Childcomponents. Is there a way to pass an Actionbutton for example?

Thank you :-)

Using Shiny and or R Outputs In React

As asked by another user @apolinario, can we use Shiny or any R script in a React component?

Use Case:
Our app only needs to run R scripts in a single component, thus we are not looking to develop the app using Shiny. All R scripts can be pre-computed and there is no need for real-time computations.

We need a simple way of integrating our R scripts in React.

Understand that using Shiny to develop the app would not be appropriate considering R is required in so few components.

What is the best solution for this?

If needed, we can collaborate to make reactR more compatible.

hydrate tag attributes

Hello,

There exist some React components which accept React components as props. The hydrate function does not handle this situation. So one could add this code at the beginning of the hydrate function:

for(attrib in tag.attribs){
  if(isTag(tag.attribs[attrib]){
    tag.attribs[attrib] = hydrate(components, tag.attribs[attrib]);
  }
}

New examples on authoring inputs

Could you please provide an additional example on how to implement a react element into a shiny input. Preferably, the react element should take some options. I've been trying all day to create a package from this react library https://caferati.me/demo/react-awesome-button/morty-theme which is quite simple however without concrete examples, it's impossible (at least for me) to do so.

Thank you very much in advance.

Use Plots or other HTML Based inputs in ReactR Components possible?

Hello everybody,

I played around with the reactsTrap example and created a custom Flipcard with received props.

function ActionButton({ configuration }) {
  return (
    <div>
      <div className="flip-card">
        <div className="flip-card-inner">
          <div className="flip-card-front">
            <img
              src={
                "https://www.tageblatt.lu/wp-content/uploads/2019/12/17735_cx__cy__cw__ch_-740x493.jpg"
              }
              style={{ width: 300, height: 500 }}
            />
          </div>
          <div className="flip-card-back">{configuration.label}</div>
        </div>
      </div>
    </div>
  );
}

The R file looks like this:

action_button <- function(
  inputId,
  label
) {
  reactR::createReactShinyInput(
    inputId,
    "action_button",
    htmltools::htmlDependency(
      name = "action_button-input",
      version = "1.0.0",
      src = "www/reactstrapTest",
      package = "reactstrapTest",
      script = "main.js"
    ),
    default = 0,
    configuration = list(
      label = label
    ),
    htmltools::tags$div
  )
}

The example works pretty fine and I am able to pass a label as plain text. What I desire to do is to pass more complex html Elements as props, for example a Plot from HighcharteR.

Passing everything else than plain text results in an Error:

action_button("bla", label = tags$p("test"))
Error: No method asJSON S3 class: shiny.tag

Is it possible to pass more complex objects there?

add core-js

Add core-js dependency, so will appear in RStudio Viewer. ref #2

How to pass child component when using `createReactShinyInput`?

Thank you for your excellent work!
I'm considering create a package which is going to use createReactShinyInput to create my own shiny inputs, but I have no idea about how to pass child component to JavaScript side, and struggle for a long time with try and error.

I have check the colorpicker-example, but in this example it doesn't show that how to pass child component.

Is there a way to make it?

createReactShinyInput(
  inputId,
  "myInput",
  dependencies,
  default = NULL,
  components = list(childComponents), # <- for example providing a parameter to pass the child components
  configuration = list(),
  container = htmltools::tags$div
)
const MyInput = () => {
  return(
    <myInput>
      { childComponents }
    </myInput>
  )
}

reactR in pinkgorilla

I am working on pink-gorilla [https://github.com/pink-gorilla/gorilla-notebook] - a web based notebook to do data-science with clojure. The frontend is written in Reagent (which uses React).

We have a little bit of R integration already in gg4clj [https://github.com/pink-gorilla/gg4clj].

In theory I don't think it should be difficult to make available reagent-components that are created by R.

I think the critical issue that has to be solved is the dependency management.
I have to say I am not an R expert at all. However, I looked into some R html widgets and saw that
there is some kind of dependency managment built into them.

We currently use requirejs where we do globally a dependency configuration and then modules
that are loaded essentially have to return a module that defines the functions it wants to export. Example: https://github.com/pink-gorilla/gorilla-renderable/blob/master/src/pinkgorilla/ui/module_test.clj

Could you tell me what kind of format you would spit-out from reactR if I would call your module?
I would guess it will be a javascript function as a string.

What I am interested in is if you automatically compile react into that javascript or if there
are options to keep this separate?

My idea is that all those htmlWidgets from R that are complex and not easily replicated in Clojure
should be available to be used from Clojure.

Once one is so far to do widgets that do interaction on the front-end I feel react is the only way
to get this done. So I figured why not start with React at the outset.

Thanks!

Empty attribs in React$Component should be an empty **named** list

Hello,

If we build a React component without attributes, we get an empty unnamed list in attribs:

> str(React$Component("Children"))
List of 3
 $ name    : chr "Component"
 $ attribs : list()
 $ children:List of 1
  ..$ : chr "Children"
 - attr(*, "class")= chr [1:2] "reactR_component" "shiny.tag"

This is bad, because this empty list is converted to an empty array in the JavaScript side:

> jsonlite::toJSON(list())
[]

However the attributes must be an object, not an array. So we need an empty named list.

To get such a list, one can use rlang::dots_list. That is, instead of

> reactR:::`$.react_component_builder`
function (x, name) 
{
    function(...) {
        component(name, list(...))
    }
}

one can do:

function (x, name) 
{
    function(...) {
        component(name, rlang::dots_list(...))
    }
}

Then this is fine;

> f <- function(...) component("Name", rlang::dots_list(...))
> str(f("Children"))
List of 3
 $ name    : chr "Name"
 $ attribs : Named list()
 $ children:List of 1
  ..$ : chr "Children"
 - attr(*, "class")= chr [1:2] "reactR_component" "shiny.tag"
 > jsonlite::toJSON(f("Children")$attribs)
{} # yeah, an empty object

Note that using rlang does not add a dependency to the package, because it is already a dependency of htmltools.

add/document recommended system dependencies for reactR

Trying to get reactR to run on the Ubuntu 18.04 image rstudio/r-base:3.6-bionic, I needed to install the following system dependencies:

  • curl -sL https://deb.nodesource.com/setup_13.x | sudo -E bash -
  • sudo apt-get install -y nodejs
    (I chose the nodesource version here, because I couldn't get vanilla apt to work)
  • sudo npm install -g yarn
    (needs to be installed from npm, not apt otherwise any later yarn install won't work)

I'm not much of a node expert -- are these dependencies alright or are different versions recommended?

I think it'd be nice if these system dependencies could be:

  • tightened up (i.e. are these the right versions / package repositories?)
  • documented in DESCRIPTION
  • documented in the vignette
  • entering the necessary info to sysreqs and/or system requirements to programmatically install the system requirements.
    This way authors of htmlwidgets wouldn't even necessarily have to document sysreqs in their DESCRIPTION, because they would carry over from Imports: reactR.

All of this might make it a bit easier on users who might typically not be fluent in these ecosystems (node).

If this is of interest, I'd be happy to write up a PR as well.

I'd appreciate any feedback you might have on what proper dependencies and sources thereof might be for the different OSes.

reactR example with selectize.js and leaflet

Is it possible to use reactR with selectize.js and leaflet?

I try to do this minimal shiny app, but without shiny. It's a leaflet choropleth map with a topojson. With the input panel you can select which property of the topojson (integer) should be used for choropleth. Could this be done with reactR?

library(shiny)
library(leaflet)
library(leaflet.extras)   # devtools::install_github('bhaskarvk/leaflet.extras')
library(readr)


# Define UI for application that draws a histogram
ui <- fluidPage(
   
   # Application title
   titlePanel("Minimal shiny example for a leaflet choropleth with selectable properties of the underlying topojson"),
   
   # Input panel to select the desired property of the topojson
   inputPanel(
     selectInput("prop", label = "Property:",choices = c('incidents','dist_num'), selected = 'incidents')
   ),
   
   # Map below sidebar layout
   leafletOutput("map")
)

# server logic to draw a leaflet
server <- function(input, output) {
   
topojson <- read_file('https://rawgit.com/TrantorM/leaflet-choropleth/gh-pages/examples/basic_topo/crimes_by_district.topojson')

 output$map <- renderLeaflet({
     property = input$prop
     leaflet() %>% 
       setView(-75.14, 40, zoom = 11) %>%
       addProviderTiles("CartoDB.Positron") %>% 
       addGeoJSONChoropleth(
         topojson,
         valueProperty =property
       )
   })
   
}

# Run the application 
shinyApp(ui = ui, server = server)

I also asked in stackoverflow regarding this problem.

write better introduction vignette/article

Intro to reactR is pretty pitiful and does not convey all that can be achieved with the combination of R + react.

I would really appreciate some help here, and I think this would be a great way for first time contributors to get involved. I am more than happy to assist and promise to be nice to anyone who might be interested regardless of level of experience.

Shiny nivocal not rendering

@jienagu reported on Slack that a simple nivocal Shiny example does not work.

library(shiny)
library(nivocal)

ui <- nivocalOutput("nv", height = 200)

server <- function(input, output, session) {
  output$nv <- renderNivocal({
    # fake data of 500 records/days starting 2017-03-15
    df <- data.frame(
      day = seq.Date(
        from = as.Date("2017-03-15"),
        length.out = 500,
        by = "days"
      ),
      value = round(runif(500)*1000, 0)
    )
    
    nivocal(df)
  })
}

shinyApp(ui, server)

Opposite direction? Exporting htmlwidgets::saveWidget() as a Component for external React application?

Hi everyone, reactR is a fantastic library that I stumbled upon while searching for the use case mentioned in the title. I'm not sure whether or not I can do it with this lib, if I could, I didn't manage get a sense of how; it seems that I can import React components into the htmlwidgets structure, but not the opposite. Let me know if I'm wrong and it is actually possible.

If not, I'll leave this as a suggestion: a way to generate an output with htmlwdigets that can be imported in React, in case you are potentially interested in offering this reverse direction in the future for the library. Also, if there's a known way of doing this I'd be grateful to learn

Thanks for the lib and in advance for any help!

event handling

Currently, there is no way to pass events from a react htmlwidget to Shiny. We have very briefly discussed the following approaches. I'd like to target this for next release.

Prop

One approach (shown in pull) would be to use a special prop that would get evaluated in react-tools.js. This is easy but only allows a single event, could interfere with a real prop (unlikely but possible), and requires a one argument function.

Wrapper Function in R

Another approach would add a function in R, such as withShinyEvent( reactwidget, ... ), that attaches an event handler to a widget.

Custom JavaScript from Author

@pvictor demonstrates how a widget author might write a custom component in JavaScript in reactcolors. This provides fairly unlimited flexibility but requires a higher level of author skill.

Are there other approaches not considered?

Cannot reproduce reactR example

Hi,

I was not able to reproduce the "nivocal" example today by following this post (http://www.buildingwidgets.com/blog/2019/1/27/build-your-own-react-based-htmlwidget) using the latest version of reactR (0.4.0) and yarn (v1.16.0). I was able to reproduce it last month successfully but today when I built the htmlwidget using the same process, the viewer didn't render anything (white screen) without any warning or error messages through the process. Here is my repo: https://github.com/jienagu/nivocal

Here are some discrepancies I noticed:

  1. in https://nivo.rocks/calendar/ page, it seems like they add an additional note to make sure the parent container has a defined height
  2. instead of getting js file like last time, I got a jsx file (nivocal.jsx) following the process
  3. @nivo/calendar has been updated to 0.58.0

My OS is Windows10.

Thanks for any help in advance!

About the `myWidget_html` function

Hello,

Thank you for this great package. I've done a couple of packages based on it, such as shinyDatetimePicker and rAmCharts4.

I have a minor remark. The function scaffoldReactWidget generates a template R file which contains a function myWidget_html:

#' Called by HTMLWidgets to produce the widget's root element.
#' @rdname myWidget-shiny
myWidget_html <- function(id, style, class, ...) {
  htmltools::tagList(
    # Necessary for RStudio viewer version < 1.2
    reactR::html_dependency_corejs(),
    reactR::html_dependency_react(),
    reactR::html_dependency_reacttools(),
    htmltools::tags$div(id = id, class = class, style = style)
  )
}

It took me a while to understand the role of this function. The fact that it is grouped with the Shiny functions is puzzling. It is not specific to Shiny. So I would suggest to remove @rdname myWidget-shiny and to put @noRd instead (because this function has nothing to do in the documentation).

Another remark: in the Roxygen code of the template R file generated by scaffoldReactShinyInput, there is an import of restoreInput from shiny, but this function is not used (I don't know what it is by the way).

And a last one: there is a duplicated key path in webpack.config.js:

    output: {
        path: path.join(__dirname, 'inst', 'www', '${package}', 'myWidget'),
        path: path.join(__dirname, 'inst/htmlwidgets'),
        filename: 'myWidget.js'
    },

Cheers.

Wrong use of scaffoldWidget() in vignette

Following the vignette example:

setwd("~")
# Create a directory 'sparklines' and populate it with skeletal package
# If run within RStudio, this will create a new RStudio session
usethis::create_package("sparklines")
reactR::scaffoldReactWidget("sparklines", c("react-sparklines", "^1.7.0"))
Created boilerplate for widget constructor R/sparklines.R
Created boilerplate for widget dependencies at inst/htmlwidgets/sparklines.yaml
Error: $ operator is invalid for atomic vectors

I think this is the fix is:

reactR::scaffoldReactWidget("sparklines", list(name = "react-sparklines", version = "^1.7.0"))

It'd be nice if it also supported this type of approach

reactR::scaffoldReactWidget("sparklines", list("npmpkg1" = "^1.7.0", "npmpkg2" = "^1.7.0"))

Or even:

reactR::scaffoldReactWidget("sparklines", c("npmpkg1" = "^1.7.0", "npmpkg2" = "^1.7.0"))

document best practices for CI/CD for react-based htmlwidgets

I'm trying to run CI/CD (with GitHub actions) on a nascent htmlwidgets package for a react library, ideally without any derived files in the commits.

So in addition to the system requirements in #36, I'm running yarn install, and yarn run webpack --mode=development in CICD as well as gitignore the crosscompiled js in inst/htmlwidgets.

This keeps the commits lean, and seems to work ok so far: here's the action running off of this github actions workflow.

This way of doing things of course breaks anything like remotes::install_github().

What are your suggestions for best CI/CD practices? Am I on the wrong track here?

With some guidance, I'd be happy to add a section about this to the vignette in a PR.

Using a typescript(.tsx) file.

I'm trying to create a widget for this component, here.

Documentation.

This isn't working. I wonder if typescript will work, or I'm just doing something wrong. I'm getting this long error when attempting to install:

system("yarn run webpack")
yarn run v1.22.10
$ /home/alamb/repos/shiny.synapse.react.client/node_modules/.bin/webpack
[BABEL] Note: The code generator has deoptimised the styling of /home/alamb/repos/shiny.synapse.react.client/node_modules/@fortawesome/free-solid-svg-icons/index.es.js as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of /home/alamb/repos/shiny.synapse.react.client/node_modules/plotly.js-basic-dist/plotly-basic.js as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of /home/alamb/repos/shiny.synapse.react.client/node_modules/sanitize-html/dist/sanitize-html.js as it exceeds the max of 500KB.
Hash: 6c05b3d288fa7e392e1b
Version: webpack 4.46.0
Time: 118353ms
Built at: 06/24/2021 9:53:18 AM
 2 assets
Entrypoint main = user_card.js user_card.js.map
   [0] external "window.React" 42 bytes {0} [built]
  [14] ./node_modules/react-bootstrap/esm/index.js + 160 modules 279 KiB {0} [built]
       |    161 modules
  [17] ./node_modules/react-bootstrap/esm/createWithBsPrefix.js + 1 modules 1.64 KiB {0} [built]
       |    2 modules
  [31] (webpack)/buildin/global.js 905 bytes {0} [built]
  [65] ./node_modules/lodash-es/lodash.js + 612 modules 597 KiB {0} [built]
       |    613 modules
  [75] (webpack)/buildin/module.js 552 bytes {0} [built]
 [205] ./node_modules/@material-ui/icons/esm/index.js + 5556 modules 2.9 MiB {0} [built]
       |    5557 modules
 [478] ./node_modules/react-bootstrap/esm/Modal.js + 11 modules 36.2 KiB {0} [built]
       |    12 modules
 [881] ./node_modules/react-router-dom/esm/react-router-dom.js + 5 modules 66.1 KiB {0} [built]
       |    6 modules
 [882] ./node_modules/universal-cookie/es6/index.js + 2 modules 5.31 KiB {0} [built]
       |    3 modules
 [890] external "window.reactR" 42 bytes {0} [built]
 [901] ./srcjs/user_card.jsx 152 bytes {0} [built]
[1889] ./node_modules/react-reflex/dist/es/index.js + 6 modules 71.5 KiB {0} [built]
       |    7 modules
[1890] ./node_modules/react-mailchimp-subscribe/es/index.js + 1 modules 4.96 KiB {0} [built]
       |    2 modules
[1891] ./node_modules/@upsetjs/react/dist/index.js + 1 modules 234 KiB {0} [built]
       |    2 modules
    + 1955 hidden modules

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/

ERROR in ./node_modules/sql-parser/lib/compiled_parser.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /home/alamb/repos/shiny.synapse.react.client/node_modules/sql-parser/lib/compiled_parser.js: In strict mode code, functions can only be declared at top level or inside a block. (338:8)

  336 |     }
  337 |     _token_stack:
> 338 |         function lex() {
      |         ^
  339 |             var token;
  340 |             token = lexer.lex() || EOF;
  341 |             if (typeof token !== 'number') {
    at Object._raise (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:816:17)
    at Object.raiseWithData (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:809:17)
    at Object.raise (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:770:17)
    at Object.parseStatementContent (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:12566:18)
    at Object.parseStatement (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:12534:17)
    at Object.parseLabeledStatement (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:13073:22)
    at Object.parseStatementContent (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:12668:19)
    at Object.parseStatement (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:12534:17)
    at Object.parseBlockOrModuleBlockBody (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:13123:25)
    at Object.parseBlockBody (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:13114:10)
    at Object.parseBlock (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:13098:10)
    at Object.parseFunctionBody (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11989:24)
    at Object.parseFunctionBodyAndFinish (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11973:10)
    at /home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:13256:12
    at Object.withTopicForbiddingContext (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:12303:14)
    at Object.parseFunction (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:13255:10)
    at Object.parseFunctionOrFunctionSent (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11401:17)
    at Object.parseExprAtom (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11227:21)
    at Object.parseExprAtom (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:5241:20)
    at Object.parseExprSubscripts (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10881:23)
    at Object.parseUpdate (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10861:21)
    at Object.parseMaybeUnary (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10839:23)
    at Object.parseExprOps (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10696:23)
    at Object.parseMaybeConditional (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10670:23)
    at Object.parseMaybeAssign (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10633:21)
    at /home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10595:39
    at Object.allowInAnd (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:12334:12)
    at Object.parseMaybeAssignAllowIn (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10595:17)
    at Object.parseObjectProperty (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11859:101)
    at Object.parseObjPropValue (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11884:100)
    at Object.parsePropertyDefinition (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11808:10)
    at Object.parseObjectLike (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11699:25)
    at Object.parseExprAtom (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:11223:23)
    at Object.parseExprAtom (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:5241:20)
    at Object.parseExprSubscripts (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10881:23)
    at Object.parseUpdate (/home/alamb/repos/shiny.synapse.react.client/node_modules/@babel/parser/lib/index.js:10861:21)
 @ ./node_modules/sql-parser/lib/parser.js 7:13-41
 @ ./node_modules/sql-parser/lib/sql_parser.js
 @ ./node_modules/sql-parser/index.js
 @ ./node_modules/synapse-react-client/dist/utils/functions/sqlFunctions.js
 @ ./node_modules/synapse-react-client/dist/containers/QueryCount.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/style/components/_spinner.scss 1:0
Module parse failed: Unexpected character '@' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> @keyframes spinner {
|   to {
|     transform: rotate(360deg);
 @ ./node_modules/synapse-react-client/dist/index.js 93:0-43
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/style/components/query_filter/_facet-filter-header.scss 2:0
Module parse failed: Unexpected character '@' (2:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 
> @import '../../abstracts/variables';  // TODO: deleted this line if this file is already imported in _all.scss
| 
| $icon-size: 14px;  // component-specific variable 
 @ ./node_modules/synapse-react-client/dist/containers/widgets/query-filter/FacetFilterHeader.js 17:0-75
 @ ./node_modules/synapse-react-client/dist/containers/widgets/query-filter/RangeFacetFilter.js
 @ ./node_modules/synapse-react-client/dist/containers/TotalQueryResults.js
 @ ./node_modules/synapse-react-client/dist/containers/Facets.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/chat-bubbles.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="43" viewBox="0 0 43 43" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M12.4785 26.55V22.833H15.399L16.992 23.6295H19.647L20.709 23.364L20.4435 22.302L19.9125 20.709L21.771 17.523L23.0985 14.868L23.895 13.0095H29.205L34.2495 14.6025L38.4975 18.054L41.1525 22.302L41.949 28.143L40.6215 33.453L38.4975 36.639L34.2495 40.6215L29.205 41.949L23.895 41.6835L20.4435 40.0905L18.585 39.294L16.461 40.0905L14.868 40.6215H13.275L11.4165 40.0905L10.3545 39.0285L13.0095 37.17L14.337 35.577L13.806 33.453L12.4785 29.736V26.55Z" fill="#5C94B9" fill-opacity="0.1"/>
| <path d="M9.7512 38.5904C9.58734 38.6547 9.46703 38.7957 9.42762 38.9679C9.38821 39.14 9.43592 39.3184 9.55622 39.447C12.7962 42.9338 17.2228 40.5484 18.4483 39.7747C21.0183 41.542 24.026 42.4754 27.1748 42.4754C35.615 42.4754 42.4803 35.6759 42.4803 27.319C42.4803 18.9622 35.6145 12.1627 27.1748 12.1627C26.0464 12.1627 24.9263 12.2913 23.8332 12.5319C24.0365 9.31065 22.906 6.02715 20.4232 3.52561C15.8184 -1.11649 8.25586 -1.18287 3.56819 3.37627C1.29487 5.58741 0.0274833 8.5411 0.00050855 11.696C-0.0285308 14.8488 1.18698 17.8253 3.41882 20.0757C5.77306 22.4486 8.93857 23.6828 12.1782 23.6081C11.5953 26.1863 11.9355 28.775 11.948 28.8745C12.118 30.5298 12.7569 32.6807 13.5783 34.3651C14.296 36.767 9.79699 38.5716 9.75137 38.5902L9.7512 38.5904ZM4.17145 19.3273C2.1408 17.28 1.03526 14.5732 1.06218 11.7064C1.08708 8.83775 2.24037 6.14946 4.31042 4.13962C8.58332 -0.0150302 15.4736 0.0472034 19.6701 4.27652C23.8123 8.45193 23.8517 15.025 19.7572 19.2401C19.6846 19.3148 19.61 19.3894 19.5332 19.4641C19.5187 19.4766 19.5063 19.4911 19.4938 19.5077C18.8632 20.271 18.855 20.9555 18.9587 21.3952C19.1142 22.0465 19.5892 22.5526 20.0476 22.9053C17.3636 23.7308 15.8743 22.2374 15.8079 22.1689C15.7063 22.0611 15.5652 22.003 15.4221 22.003C15.3682 22.003 15.3143 22.0113 15.2603 22.0279C11.3193 23.2807 7.06913 22.2478 4.17146 19.3273L4.17145 19.3273ZM14.578 34.0068C14.5697 33.9819 14.5614 33.957 14.549 33.9342C13.769 32.3474 13.1634 30.3188 13.0016 28.7486C12.9974 28.7217 12.6448 26.0065 13.292 23.5258C13.9599 23.447 14.6277 23.3204 15.2894 23.1275C15.7561 23.5092 16.8472 24.2206 18.4775 24.2206C19.33 24.2206 20.3319 24.0257 21.4685 23.4864C21.6552 23.3972 21.7734 23.2064 21.7713 22.9989C21.7672 22.7915 21.6448 22.6048 21.454 22.5198C21.1014 22.3642 20.1493 21.8125 19.9917 21.1467C19.9211 20.8521 20.0207 20.5431 20.2945 20.205C20.3692 20.1303 20.4438 20.0557 20.5185 19.9789C22.2837 18.1619 23.3395 15.9445 23.7087 13.6462C24.835 13.3683 26.0007 13.2231 27.1747 13.2231C35.0276 13.2251 41.4182 19.5473 41.4182 27.3195C41.4182 35.0918 35.0276 41.4139 27.1747 41.4139C24.1276 41.4139 21.2216 40.4763 18.77 38.7008C18.5812 38.5659 18.3282 38.5659 18.1415 38.7049C18.0979 38.7381 13.9889 41.725 10.888 39.2401C12.367 38.5079 15.4202 36.6369 14.5781 34.0068L14.578 34.0068Z" fill="#5C94B9"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 13:25-74
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/lock.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="49" viewBox="0 0 36 49" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path fill-rule="evenodd" clip-rule="evenodd" d="M26.0393 12.5492V19.089H26.0397H30.5554V12.5492C30.5554 5.62965 24.8774 0 17.8984 0V4.47765C22.3876 4.47765 26.0393 8.09818 26.0393 12.5492Z" fill="#5C94B9"/>
| <path fill-rule="evenodd" clip-rule="evenodd" d="M9.75828 19.0891V12.5493C9.75828 8.09841 13.4101 4.47777 17.899 4.47777V0C10.9202 0 5.24219 5.62965 5.24219 12.5492V19.0889H5.24255H9.75828V19.0891Z" fill="#5C94B9"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 15:17-58
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/flag.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="60" viewBox="0 0 45 60" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M3.35043 11.6993L20.52 59.0555L18.4435 60L1.27637 12.4541L3.35043 11.6993Z" fill="#5C94B9"/>
| <path fill-rule="evenodd" clip-rule="evenodd" d="M1.08672 8.49302C1.84137 8.30318 2.78586 8.68285 3.16318 9.4375C3.35302 10.0047 3.35302 10.382 3.16318 10.7593L0.899228 11.514C0.521895 11.3241 0.144575 11.1366 0.144575 10.5695C-0.232757 9.81483 0.144575 8.87034 1.08906 8.49302H1.08672Z" fill="#5C94B9"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 27:17-58
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/shield.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="60" viewBox="0 0 46 60" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M22.766 58.8119C9.68539 50.4096 4.45065 44.594 2.34834 37.6271C1.27184 34.0596 0.995427 30.1224 1.00006 25.2523C1.00214 23.0649 1.06047 20.708 1.12448 18.122C1.13166 17.8317 1.13892 17.5384 1.14618 17.2422C1.2112 14.5884 1.27595 11.7046 1.28757 8.54972C9.50478 8.43742 16.041 6.87564 22.7606 1.31573C29.3476 6.87737 35.8826 8.43748 44.0943 8.54972C44.106 11.6863 44.1707 14.5559 44.236 17.1989C44.2437 17.5071 44.2513 17.812 44.2588 18.1139C44.3228 20.6764 44.3813 23.0153 44.3845 25.1888C44.3917 30.052 44.1202 33.995 43.0526 37.5731C40.9679 44.5597 35.7683 50.4116 22.766 58.8119Z" fill="#5C94B9" fill-opacity="0.1" stroke="#5C94B9" stroke-width="2"/>
| <path fill-rule="evenodd" clip-rule="evenodd" d="M14.8693 29.3455C16.8859 31.5252 18.9022 33.7048 20.9188 35.8844C21.3431 36.3432 22.0069 36.1732 22.3247 35.6968L31.5972 21.7929C32.0375 21.1327 32.4779 20.4726 32.9181 19.8124C33.5746 18.8279 32.0236 17.8994 31.372 18.8761L22.0996 32.78C21.6593 33.4402 21.9043 33.0534 21.4639 33.7135C20.9952 33.7761 21.9327 33.6509 21.4639 33.7135C19.4474 31.5339 18.1518 30.2136 16.1352 28.034C15.3366 27.1705 14.0715 28.4832 14.8693 29.3455Z" fill="#5C94B9"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 19:19-62
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/people.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="60" viewBox="0 0 57 60" fill="none" xmlns="http://www.w3.org/2000/svg">
| <circle cx="28.4211" cy="31.579" r="27.4211" stroke="#5C94B9" stroke-width="2"/>
| <path d="M17.8945 20.8176C17.8945 15.1842 22.4616 10.6172 28.0953 10.6172C33.729 10.6172 38.2961 15.1842 38.2961 20.818L17.8945 20.8176Z" fill="white"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 21:19-62
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/pen.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="60" viewBox="0 0 58 60" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M9.76082 38.4706L41.0223 5.7222L52.3579 16.4808L21.1114 49.2143L9.76082 38.4706Z" fill="#5C94B9" fill-opacity="0.1" stroke="#5C94B9" stroke-width="1.5"/>
| <path d="M4.4441 51.0408L8.92569 39.4014L20.2493 50.1345L8.80186 55.183L4.4441 51.0408Z" stroke="#5C94B9"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 23:16-56
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/speaker.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
| <circle cx="30" cy="30" r="29" stroke="#5C94B9" stroke-width="2"/>
| <path d="M17.096 40.2764C16.8176 40.2764 16.5372 40.2176 16.2725 40.0999C15.7823 39.8803 15.4097 39.4822 15.2175 38.9822L11.4565 29.0699C11.2643 28.5699 11.2839 28.0268 11.4996 27.5365C11.7193 27.0463 12.1173 26.6737 12.6174 26.4815L25.6515 21.5361L30.8381 35.1998L17.812 40.1452C17.5806 40.2334 17.3413 40.2765 17.0962 40.2765L17.096 40.2764ZM24.8061 23.4382L13.1484 27.8659C13.0151 27.9149 12.9072 28.0188 12.8503 28.1443C12.7915 28.2777 12.7876 28.4189 12.8347 28.5561L16.5957 38.4684C16.6447 38.6017 16.7486 38.7096 16.8741 38.7665C17.0075 38.8253 17.1486 38.8292 17.2859 38.7821L28.9436 34.3545L24.8061 23.4382Z" fill="#5C94B9"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 25:20-64
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/scale.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg height="61" viewBox="0 0 63 61" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M45.9229 21.141H45.5448L45.5479 21.5191C45.5805 25.453 48.7682 28.2572 53.0391 28.2572H53.0394C57.307 28.2572 60.4945 25.4529 60.5272 21.5191L60.5303 21.141H60.1522H45.9229ZM53.3949 5.81433L53.0394 4.74711L52.6834 5.81413L48.4348 18.5465L48.2701 19.04L48.7903 19.0402L57.2808 19.0436L57.8011 19.0438L57.6367 18.5501L53.3949 5.81433ZM38.6256 57.6559H39.0006L39.0006 57.281L39.001 54.4849L39.0011 54.1957L38.7213 54.1222C36.0547 53.4219 33.3324 53.0699 30.61 53.0665H30.6096C30.6008 53.0665 30.5927 53.0667 30.5854 53.0671C30.5791 53.0674 30.5733 53.0677 30.5684 53.0681C30.5654 53.0683 30.5625 53.0686 30.5598 53.0688C30.5576 53.0686 30.5553 53.0684 30.5529 53.0682C30.542 53.0673 30.5276 53.0665 30.5107 53.0665H30.5102C27.7845 53.0699 25.0622 53.4219 22.3989 54.1222L22.1192 54.1957V54.4849V57.2809V57.6559H22.4942H38.6256ZM5.36199 37.4608L5.19769 37.9541L5.71762 37.9543L14.2047 37.9578L14.7251 37.958L14.5606 37.4643L10.3154 24.725L9.9595 23.6571L9.60381 24.7251L5.36199 37.4608ZM2.84677 40.0449H2.46864L2.47178 40.423C2.50442 44.3566 5.69182 47.1644 9.963 47.1644H9.96334C14.2313 47.1644 17.4182 44.3564 17.4546 40.4233L17.4581 40.0449H17.0796H2.84677ZM60.7509 19.0506L60.7507 19.0508H61.5771C62.1549 19.0508 62.624 19.5211 62.624 20.0942V21.4582C62.624 26.5075 58.5354 30.3474 53.0391 30.3474C47.5393 30.3474 43.4507 26.5076 43.4507 21.4582V20.0942C43.4507 19.5211 43.9199 19.0508 44.4976 19.0508H45.7899H46.0603L46.1457 18.7943L50.9808 4.28568L51.2583 3.45327L50.4649 3.82804L37.0029 10.1874L36.7507 10.3065L36.7922 10.5823C36.8384 10.8888 36.8699 11.1928 36.8699 11.4982C36.8699 14.4941 34.7382 17.0041 31.9069 17.5961L31.6086 17.6585V17.9632V50.6528V51.0129L31.9684 51.0275C34.7894 51.1422 37.6054 51.591 40.3493 52.4135L40.3507 52.4139C40.7925 52.5444 41.0981 52.9512 41.0981 53.4114V58.7034C41.0981 59.2788 40.6301 59.7469 40.0478 59.7469H21.0725C20.4914 59.7469 20.0256 59.28 20.0256 58.7034V53.4114C20.0256 52.9488 20.3266 52.544 20.7691 52.4141L20.771 52.4135C23.5149 51.591 26.3275 51.1422 29.1519 51.0275L29.5117 51.0129V50.6528V17.9326V17.6344L29.2211 17.5673C27.6192 17.1974 26.2518 16.2162 25.3831 14.881L25.2077 14.6114L24.9145 14.7437L11.5616 20.7687L11.2531 20.908L11.3601 21.2291L16.8499 37.7018L16.9354 37.9583H17.2057H18.5014C19.0797 37.9583 19.5483 38.4258 19.5483 39.0017V40.3623C19.5483 45.4118 15.4595 49.2549 9.9634 49.2549C4.46381 49.2549 0.375 45.4119 0.375 40.3623V39.0017C0.375 38.4257 0.843561 37.9583 1.42188 37.9583H2.71423H2.98448L3.06997 37.7019L8.82917 20.4314L8.84712 20.3775L8.84834 20.3208C8.8584 19.852 9.17752 19.4378 9.65257 19.3278L9.68853 19.3194L9.72217 19.3042L24.2273 12.7608L24.4825 12.6457L24.4447 12.3683C24.4049 12.0765 24.3765 11.7883 24.3765 11.4983C24.3765 8.06463 27.1776 5.26855 30.6233 5.26855C32.7969 5.26855 34.7144 6.38389 35.8348 8.07091L36.0142 8.34101L36.3074 8.20253L52.4117 0.595287L52.4346 0.584454L52.4559 0.570631C52.5507 0.508981 52.664 0.462067 52.796 0.429068L52.8063 0.426488L52.8164 0.423329C53.3128 0.26887 53.8499 0.492673 54.0741 0.968446L54.0746 0.969616C54.1447 1.117 54.1733 1.27482 54.1681 1.44134L54.166 1.5082L54.1871 1.57166L59.9292 18.7942L60.0147 19.0506H60.285H60.7509ZM26.4731 11.4973C26.4731 13.7816 28.3364 15.6401 30.6228 15.6401C32.9092 15.6401 34.7724 13.7816 34.7724 11.4973C34.7724 9.21613 32.909 7.35786 30.6228 7.35786C28.3366 7.35786 26.4731 9.21613 26.4731 11.4973Z" fill="#5C94B9" stroke="white" stroke-width="0.75"/>
| <path d="M2.1815 44.0825L1.30859 39.7179L1.74505 38.845H11.3471H18.7668V41.0273L17.021 44.9554L13.9658 47.5741L10.4742 48.447L6.54605 48.0106L3.92732 45.8283L2.1815 44.0825Z" fill="#5C94B9" fill-opacity="0.1"/>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js 17:18-60
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/json-form-tool-no-submissions.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="141" height="148" viewBox="0 0 141 148" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
| <rect width="141" height="148" fill="url(#pattern0)"/>
| <defs>
 @ ./node_modules/synapse-react-client/dist/containers/synapse_form_wrapper/SynapseFormSubmissionsGrid.js 29:66-129
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/calendar-clock.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="15" height="15" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M9.27273 9.27273H10.4318V11.4518L12.3173 12.5414L11.7377 13.5459L9.27273 12.1241V9.27273ZM12.3636 5.40909H1.54545V13.9091H5.15409C4.82182 13.2059 4.63636 12.4177 4.63636 11.5909C4.63636 10.1563 5.20625 8.78051 6.22065 7.7661C7.23505 6.7517 8.61088 6.18182 10.0455 6.18182C10.8723 6.18182 11.6605 6.36727 12.3636 6.69955V5.40909ZM1.54545 15.4545C0.687727 15.4545 0 14.7591 0 13.9091V3.09091C0 2.23318 0.687727 1.54545 1.54545 1.54545H2.31818V0H3.86364V1.54545H10.0455V0H11.5909V1.54545H12.3636C12.7735 1.54545 13.1666 1.70828 13.4564 1.99811C13.7463 2.28794 13.9091 2.68103 13.9091 3.09091V7.80455C14.8673 8.77818 15.4545 10.115 15.4545 11.5909C15.4545 13.0255 14.8847 14.4013 13.8703 15.4157C12.8559 16.4301 11.48 17 10.0455 17C8.56955 17 7.23273 16.4127 6.25909 15.4545H1.54545ZM10.0455 7.84318C9.0515 7.84318 8.09825 8.23803 7.39541 8.94087C6.69258 9.6437 6.29773 10.5969 6.29773 11.5909C6.29773 13.6618 7.97455 15.3386 10.0455 15.3386C10.5376 15.3386 11.025 15.2417 11.4796 15.0534C11.9343 14.865 12.3475 14.589 12.6955 14.241C13.0435 13.8929 13.3196 13.4798 13.5079 13.0251C13.6962 12.5704 13.7932 12.0831 13.7932 11.5909C13.7932 9.52 12.1164 7.84318 10.0455 7.84318Z" fill="white"/>
| </svg>
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/CalendarWithIconFormGroup.js 15:27-75
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationRoundEditor.js
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationRoundEditorList.js
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationEditorPage.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/NoSearchResults.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="181" height="181" viewBox="0 0 181 181" fill="none" xmlns="http://www.w3.org/2000/svg">
| <mask id="path-1-inside-1" fill="white">
| <path fill-rule="evenodd" clip-rule="evenodd" d="M94.3273 89.8488C99.146 84.0265 101.769 76.7772 101.769 69.1253C101.769 67.9598 101.705 66.7683 101.575 65.5898V65.5811C100.396 54.6626 93.8279 45.1435 84.0062 40.1219C79.3965 37.7649 74.4185 36.569 69.2113 36.569C59.5625 36.569 50.4644 40.8151 44.2559 48.2198C41.2843 51.764 39.1436 55.8064 37.8877 60.2432C37.0684 63.1331 36.6568 66.1184 36.6568 69.1253C36.6568 71.7293 36.9558 74.2769 37.545 76.7509C38.1389 79.2249 39.0271 81.6166 40.2051 83.9216C45.8026 94.8791 56.9197 101.682 69.2113 101.682C74.4233 101.682 79.4008 100.49 84.0062 98.133C86.0476 97.0904 87.9676 95.8384 89.7413 94.3953L105.229 109.883L109.795 105.316L94.3273 89.8488Z"/>
 @ ./node_modules/synapse-react-client/dist/containers/table/SearchResultsNotFound.js 11:52-101
 @ ./node_modules/synapse-react-client/dist/containers/table/SynapseTable.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/icon_plus_square_filled.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
|     <rect width="26" height="26" />
|     <path fill-rule="evenodd" clip-rule="evenodd" d="M14.1996 11.8004V7H11.7996V11.8004H7V14.2004H11.7996V19H14.1996V14.2004H19V11.8004H14.1996Z" fill="white"/>
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/round_limits/EvaluationRoundLimitOptionsList.js 13:36-96
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationRoundEditor.js
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationRoundEditorList.js
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationEditorPage.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/icon_times.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="27" height="26" viewBox="0 0 27 26" xmlns="http://www.w3.org/2000/svg">
|     <path d="M18.7729 8.10786L17.6651 7L13.2729 11.3921L8.88081 7L7.77295 8.10786L12.1651 12.5L7.77295 16.8921L8.88081 18L13.2729 13.6079L17.6651 18L18.7729 16.8921L14.3808 12.5L18.7729 8.10786Z" fill="inherit"/>
| </svg>
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/round_limits/EvaluationRoundLimitOptionsList.js 15:23-70
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationRoundEditor.js
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationRoundEditorList.js
 @ ./node_modules/synapse-react-client/dist/containers/evaluation_queues/EvaluationEditorPage.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/chart2.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="27" height="30" viewBox="0 0 27 30" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M0 30V9H6V30H0ZM10.5 30V0H16.5V30H10.5ZM21 30V18H27V30H21Z" fill="#ABABAC"/>
| </svg>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 29:43-86
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/Data2.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="28" height="32" viewBox="0 0 28 32" fill="none" xmlns="http://www.w3.org/2000/svg">
| <g clipPath="url(#clip0)">
| <path d="M25.9411 5.79833C25.9411 5.87044 25.9373 5.94255 25.9259 6.01466C25.9411 5.91219 25.9526 5.81351 25.9678 5.71104C25.945 5.88183 25.8993 6.04123 25.8345 6.20063C25.8726 6.10955 25.9107 6.01846 25.9488 5.92737C25.8993 6.04503 25.8383 6.15509 25.7698 6.26515C25.7355 6.31829 25.6974 6.36763 25.6632 6.42076C25.5946 6.52703 25.8383 6.21202 25.7545 6.3069C25.7317 6.32967 25.7127 6.35624 25.6898 6.38281C25.5946 6.49287 25.488 6.59914 25.3814 6.69782C25.328 6.74716 25.2709 6.79649 25.2138 6.84204C25.2024 6.84963 25.1262 6.90276 25.1262 6.91415C25.1262 6.89138 25.3737 6.72818 25.1948 6.86101C24.6502 7.26332 24.0409 7.57074 23.4202 7.83641C23.5116 7.79845 23.603 7.7605 23.6943 7.72255C21.9997 8.43606 20.1718 8.82318 18.3553 9.06988C18.4582 9.0547 18.5572 9.04331 18.66 9.02813C15.6592 9.42664 12.5898 9.42664 9.58899 9.02433C9.69181 9.03952 9.79082 9.0509 9.89364 9.06608C8.09239 8.81939 6.28353 8.43227 4.60033 7.73393C4.69173 7.77189 4.78312 7.80984 4.87452 7.84779C4.24237 7.58212 3.62545 7.27091 3.06946 6.86481C2.87524 6.72059 3.25606 7.01662 3.07327 6.86481C3.01614 6.81927 2.95902 6.76993 2.90571 6.72059C2.79527 6.62191 2.69245 6.51564 2.59344 6.40558C2.57059 6.37901 2.55155 6.35624 2.5287 6.32967C2.42588 6.21581 2.6201 6.43594 2.61629 6.44733C2.6201 6.43215 2.52109 6.3107 2.50966 6.29172C2.43731 6.17786 2.37257 6.06021 2.31925 5.93876C2.35734 6.02984 2.39542 6.12093 2.4335 6.21202C2.36876 6.05641 2.32306 5.89321 2.29641 5.72622C2.31164 5.82869 2.32306 5.92737 2.33829 6.02984C2.31925 5.87803 2.31925 5.72242 2.33829 5.57061C2.32306 5.67309 2.31164 5.77176 2.29641 5.87424C2.31925 5.71104 2.36495 5.55164 2.42969 5.39603C2.39161 5.48712 2.35353 5.5782 2.31545 5.66929C2.36114 5.55923 2.41827 5.45296 2.483 5.35049C2.51728 5.29356 2.55917 5.23663 2.59725 5.18349C2.65437 5.10379 2.75719 5.0127 2.49062 5.32012C2.50966 5.29735 2.5287 5.27458 2.54774 5.24801C2.63533 5.14174 2.73434 5.04307 2.83335 4.94818C2.89048 4.89505 2.9476 4.84192 3.00853 4.78878C3.06184 4.74324 3.28271 4.57245 3.08469 4.72426C2.88286 4.87987 3.12277 4.69769 3.17609 4.65974C3.24463 4.6142 3.31318 4.56486 3.38173 4.52311C3.52643 4.42823 3.67495 4.34094 3.82728 4.25744C4.17001 4.06768 4.52036 3.90068 4.88213 3.74887C4.79074 3.78682 4.69934 3.82478 4.60795 3.86273C6.29114 3.1606 8.10382 2.77348 9.90507 2.53058C9.80225 2.54576 9.70324 2.55715 9.60042 2.57233C11.9653 2.25732 14.372 2.19659 16.7483 2.37118C17.3919 2.42052 18.0354 2.48504 18.679 2.57233C18.5762 2.55715 18.4772 2.54576 18.3744 2.53058C20.1756 2.77348 21.9845 3.1606 23.6677 3.86273C23.5763 3.82478 23.4849 3.78682 23.3935 3.74887C23.7477 3.89689 24.0942 4.06008 24.4293 4.24605C24.5816 4.32955 24.7302 4.42064 24.8749 4.51172C24.951 4.56106 25.0234 4.6104 25.0957 4.65974C25.1529 4.69769 25.3852 4.87607 25.1871 4.72426C24.9853 4.56866 25.2138 4.75083 25.2633 4.78878C25.3204 4.83433 25.3737 4.88366 25.427 4.9368C25.5261 5.03168 25.6251 5.13036 25.7127 5.23663C25.7355 5.26319 25.7545 5.29735 25.7812 5.32012C25.7698 5.31253 25.5718 5.03927 25.6746 5.18349C25.7089 5.23663 25.7469 5.28597 25.7812 5.3391C25.8459 5.44537 25.9069 5.55543 25.9526 5.66929C25.9145 5.5782 25.8764 5.48712 25.8383 5.39603C25.9031 5.54784 25.9488 5.70724 25.9716 5.87424C25.9564 5.77176 25.945 5.67309 25.9297 5.57061C25.9335 5.64652 25.9373 5.72242 25.9411 5.79833C25.945 6.39419 26.4629 6.96349 27.0836 6.93692C27.7005 6.91035 28.2298 6.43594 28.226 5.79833C28.2146 4.27642 27.0341 3.14162 25.8079 2.41292C24.197 1.45271 22.3082 0.925168 20.4803 0.579796C18.0659 0.120565 15.5944 -0.0540191 13.142 0.0142962C10.8076 0.0788163 8.44274 0.344487 6.18071 0.940349C4.48609 1.38819 2.75338 2.0258 1.40149 3.16819C0.853121 3.63122 0.426609 4.21569 0.182888 4.88746C-0.117955 5.72242 0.053411 6.70541 0.529428 7.4417C1.18062 8.43606 2.22024 9.12681 3.28271 9.6202C4.36042 10.125 5.49524 10.4969 6.65292 10.7778C9.12821 11.3698 11.7063 11.6051 14.2463 11.5975C16.7978 11.59 19.3835 11.3395 21.8588 10.717C22.948 10.4438 24.0142 10.0794 25.0272 9.59742C26.0782 9.10024 27.1293 8.40191 27.7538 7.39615C28.0509 6.91794 28.2108 6.36383 28.2222 5.79833C28.2336 5.20247 27.6891 4.63317 27.0798 4.65974C26.4552 4.6901 25.9488 5.16072 25.9411 5.79833Z" fill="#DDDDDF"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 15:42-84
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/file.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M4.49999 0.900281C4.16834 0.901452 3.89999 1.16981 3.89999 1.50028V28.5003C3.89999 28.6597 3.96328 28.8132 4.07578 28.9257C4.18828 29.0382 4.34062 29.1015 4.50001 29.1015H25.5C25.6594 29.1015 25.8129 29.0382 25.9254 28.9257C26.0379 28.8132 26.1012 28.6597 26.1012 28.5003V8.10028H19.4988C19.3406 8.10028 19.1871 8.037 19.0746 7.9245C18.9621 7.812 18.8988 7.65966 18.8988 7.50027V0.900269L4.49999 0.900281ZM20.0988 1.25068V6.90028H25.7484L20.0988 1.25068ZM12.0012 5.40028H16.5C16.8316 5.40028 17.1012 5.66981 17.1012 6.00145C17.1012 6.3331 16.8316 6.60145 16.5 6.60145H12.0012C11.6695 6.60145 11.4 6.33309 11.4 6.00145C11.4 5.6698 11.6696 5.40028 12.0012 5.40028ZM8.99999 9.90028H21C21.3316 9.90028 21.6012 10.1698 21.6012 10.5014C21.6012 10.8331 21.3316 11.1014 21 11.1014H8.99999C8.66834 11.1014 8.39999 10.8331 8.39999 10.5014C8.39999 10.1698 8.66835 9.90028 8.99999 9.90028ZM8.99999 14.4003H21C21.3316 14.4003 21.6012 14.6698 21.6012 15.0014C21.6012 15.3331 21.3316 15.6014 21 15.6014H8.99999C8.66834 15.6014 8.39999 15.3331 8.39999 15.0014C8.39999 14.6698 8.66835 14.4003 8.99999 14.4003ZM8.99999 18.9003H21C21.3316 18.9003 21.6012 19.1698 21.6012 19.5014C21.6012 19.8331 21.3316 20.1014 21 20.1014H8.99999C8.66834 20.1014 8.39999 19.8331 8.39999 19.5014C8.39999 19.1698 8.66835 18.9003 8.99999 18.9003ZM8.99999 23.4003H21C21.3316 23.4003 21.6012 23.6698 21.6012 24.0014C21.6012 24.3331 21.3316 24.6014 21 24.6014H8.99999C8.66834 24.6014 8.39999 24.3331 8.39999 24.0014C8.39999 23.6698 8.66835 23.4003 8.99999 23.4003Z" fill="#ABABAC"/>
| </svg>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 31:41-82
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/person.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="31" height="31" viewBox="0 0 31 31" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M0 30.9994C0 22.6107 6.80089 15.8099 15.19 15.8099C23.5791 15.8099 30.38 22.6107 30.38 30.9999L0 30.9994Z" fill="#ABABAC"/>
| <path d="M15.4224 13.795C19.2318 13.795 22.3199 10.7069 22.3199 6.8975C22.3199 3.08812 19.2318 0 15.4224 0C11.613 0 8.5249 3.08812 8.5249 6.8975C8.5249 10.7069 11.613 13.795 15.4224 13.795Z" fill="#ABABAC"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 25:43-86
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/mouse.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="39" height="27" viewBox="0 0 39 27" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M19.6871 26.9083H17.4875C16.8791 26.9083 16.3019 26.6739 15.8651 26.2364C15.4283 25.7988 15.1943 25.2207 15.1943 24.6112C15.1943 23.3455 16.2239 22.3298 17.4719 22.3298H34.9439C35.6615 22.3298 36.3323 22.0486 36.8315 21.5485C37.3307 21.0485 37.6115 20.3766 37.6115 19.6577C37.6115 18.1889 36.4103 16.9857 34.9439 16.9857H30.6851C30.2951 16.9857 29.9831 16.6731 29.9831 16.2825C29.9831 15.8918 30.2951 15.5793 30.6851 15.5793H34.9439C37.1903 15.5793 38.9999 17.4076 38.9999 19.6421C38.9999 20.736 38.5787 21.7517 37.8143 22.5173C37.0499 23.283 36.0203 23.7049 34.9439 23.7049H17.4875C17.0039 23.7049 16.5983 24.1112 16.5983 24.5956C16.5983 24.83 16.6919 25.0644 16.8635 25.2207C17.0351 25.3926 17.2535 25.4863 17.4875 25.4863H19.6871C20.0771 25.4863 20.3891 25.7988 20.3891 26.1895C20.3735 26.5958 20.0615 26.9083 19.6871 26.9083Z" fill="#ABABAC"/>
| <path d="M6.64566 5.39097C6.05286 5.78163 5.53806 6.32854 5.16366 7.03172L4.88286 7.57864L4.64886 8.01617C4.43046 7.95367 4.21206 7.87554 4.00926 7.7974C0.499263 6.4223 0.296462 3.67209 1.20126 1.8282C1.71606 0.765622 2.62086 -6.10352e-05 3.46326 -6.10352e-05C5.85006 -6.10352e-05 6.64566 5.39097 6.64566 5.39097Z" fill="#ABABAC"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 27:42-84
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/subscribe_plus.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
| <mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="11" y="9" width="18" height="21">
| <path d="M18 28C18 29.11 18.9 30 20 30C20.5304 30 21.0391 29.7893 21.4142 29.4142C21.7893 29.0391 22 28.5304 22 28H18ZM26.88 23.82V18C26.88 14.75 24.63 12.03 21.59 11.31V10.59C21.59 10.1683 21.4225 9.76388 21.1243 9.4657C20.8261 9.16752 20.4217 9 20 9C19.5783 9 19.1739 9.16752 18.8757 9.4657C18.5775 9.76388 18.41 10.1683 18.41 10.59V11.31C15.37 12.03 13.12 14.75 13.12 18V23.82L11 25.94V27H29V25.94L26.88 23.82ZM24 20H21V23H19V20H16V18H19V15H21V18H24" fill="#9E9E9E"/>
 @ ./node_modules/synapse-react-client/dist/containers/RssFeedCards.js 15:51-96
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/file-dotted.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="46" height="64" viewBox="0 0 46 64" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M10 63H6V64H10V63Z" fill="#C4C4C4"/>
| <path fill-rule="evenodd" clip-rule="evenodd" d="M1 63H4V64H0V60H1V63Z" fill="#C4C4C4"/>
 @ ./node_modules/synapse-react-client/dist/containers/table/SynapseTable.js 35:48-93
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/account-registered.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="60" height="61" viewBox="0 0 60 61" fill="none" xmlns="http://www.w3.org/2000/svg">
| <circle cx="30" cy="25" r="25" fill="#1C76AF"/>
| <path d="M16 34.8317C16 28.112 21.4478 22.6643 28.1679 22.6643C34.8879 22.6643 40.3357 28.112 40.3357 34.8322L16 34.8317Z" fill="white"/>
 @ ./node_modules/synapse-react-client/dist/containers/AccountLevelBadge.js 15:31-80
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/account-validated.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="60" height="61" viewBox="0 0 60 61" fill="none" xmlns="http://www.w3.org/2000/svg">
| <circle cx="30" cy="25" r="25" fill="#1C76AF"/>
| <path d="M30.411 43.9997C28.9446 39.9284 24.4859 39.1271 20.9378 38.2919C18.0273 37.607 15.7531 35.9125 14.7347 33.3418C12.1754 27.6956 17.0707 23.467 17.7491 18.319C18.0891 15.7821 16.6142 13.7923 15.232 11.8602L17.5834 9.17422C21.4912 11.1725 26.9736 10.662 30.411 8C33.8482 10.662 39.3294 11.1753 43.2386 9.17703L45.5914 11.863C44.2078 13.7952 42.7343 15.7852 43.0742 18.3218C43.7541 23.4716 48.648 27.6987 46.0887 33.3447C45.0703 35.9153 42.7975 37.61 39.8856 38.2947C36.336 39.13 31.8774 39.9288 30.4109 44L30.411 43.9997Z" fill="white"/>
 @ ./node_modules/synapse-react-client/dist/containers/AccountLevelBadge.js 19:30-78
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/account-certified.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="60" height="61" viewBox="0 0 60 61" fill="none" xmlns="http://www.w3.org/2000/svg">
| <circle cx="30" cy="25" r="25" fill="#1C76AF"/>
| <path fill-rule="evenodd" clip-rule="evenodd" d="M33.1134 8L30 10.6276L26.8867 8L25.2149 11.7179L21.2723 10.7064L21.3776 14.7856L17.3823 15.5871L19.245 19.2065L16 21.6698L19.245 24.1266L17.3823 27.7525L21.3776 28.554L21.2723 32.6266L25.2149 31.6216L26.8867 35.3397L30 32.712L33.1134 35.3397L34.7852 31.6216L38.7278 32.6266L38.6225 28.554L42.6179 27.7525L40.7551 24.1266L44 21.6699V21.6698L40.7551 19.2065L42.6179 15.5871L38.6225 14.7856L38.7278 10.713L34.7852 11.7179L33.1134 8Z" fill="#62AC62"/>
 @ ./node_modules/synapse-react-client/dist/containers/AccountLevelBadge.js 17:30-78
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/DNA_Two.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="72" height="64" viewBox="0 0 72 64" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M19.4589 25.2468L11.3827 17.3076C10.8262 16.7606 10.8262 15.8738 11.3827 15.3268C11.9392 14.7797 12.8412 14.7797 13.3977 15.3268L21.4739 23.266C22.0303 23.813 22.0303 24.6998 21.4739 25.2468C20.9174 25.7938 20.0152 25.7938 19.4589 25.2468Z" fill="#F47E6C"/>
| <path d="M21.4373 23.282L17.3993 19.3125L15.3843 21.2933L19.4223 25.2628C19.9788 25.8098 20.8808 25.8098 21.4373 25.2628C21.9937 24.7159 21.9937 23.829 21.4373 23.282Z" fill="#FCCB6F"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 21:44-88
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/study-complete.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="73" height="83" viewBox="0 0 73 83" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M47.8545 68.3071C47.8545 70.1413 49.3411 71.6337 51.1663 71.6337C52.9914 71.6337 54.4765 70.1413 54.4765 68.3071C54.4765 66.4714 52.9914 64.979 51.1663 64.979C49.3411 64.979 47.8545 66.4714 47.8545 68.3071ZM52.1625 68.3071C52.1625 68.8596 51.7153 69.3091 51.1655 69.3091C50.6142 69.3091 50.167 68.8596 50.167 68.3071C50.167 67.7531 50.6142 67.3037 51.1655 67.3037C51.7153 67.3037 52.1625 67.7531 52.1625 68.3071Z" fill="#DDDDDF"/>
| <path d="M44.1641 27.21H34.1562V29.5346H44.1641V27.21Z" fill="#DDDDDF"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 19:51-102
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/study-active.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="75" height="84" viewBox="0 0 75 84" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M49.8545 69.3071C49.8545 71.1413 51.3411 72.6337 53.1663 72.6337C54.9914 72.6337 56.4765 71.1413 56.4765 69.3071C56.4765 67.4714 54.9914 65.979 53.1663 65.979C51.3411 65.979 49.8545 67.4714 49.8545 69.3071ZM54.1625 69.3071C54.1625 69.8596 53.7153 70.3091 53.1655 70.3091C52.6142 70.3091 52.167 69.8596 52.167 69.3071C52.167 68.7531 52.6142 68.3037 53.1655 68.3037C53.7153 68.3037 54.1625 68.7531 54.1625 69.3071Z" fill="#DDDDDF"/>
| <path d="M46.1641 28.21H36.1562V30.5346H46.1641V28.21Z" fill="#DDDDDF"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 17:49-98
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/organizations.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="83" height="76" viewBox="0 0 83 76" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M41.4784 47.8551L41.6689 48.6264L42.414 48.9021L45.3594 49.9921V55.7053L42.507 56.7901L41.7577 57.0751L41.5783 57.8565C41.2285 59.3803 40.633 60.6984 39.879 62.0936L39.5341 62.7319L39.8203 63.3985L41.0001 66.1464L36.9279 70.1387L34.1695 68.949L33.5003 68.6603L32.8598 69.008C31.4923 69.7505 30.0422 70.3609 28.6101 70.7163L27.847 70.9057L27.5686 71.6411L26.4862 74.5H20.92L19.8377 71.6411L19.5536 70.8908L18.7719 70.7105C17.2527 70.3602 15.9383 69.7637 14.5465 69.008L13.9059 68.6603L13.2367 68.949L10.4783 70.1387L6.40618 66.1464L7.58596 63.3985L7.87219 62.7319L7.52725 62.0936C6.78636 60.7227 6.17706 59.2687 5.82221 57.8324L5.63373 57.0695L4.89921 56.7901L2.04688 55.7053V49.9822L4.89921 48.8974L5.64858 48.6124L5.82797 47.831C6.17778 46.3072 6.77325 44.9891 7.52725 43.5939L7.87219 42.9556L7.58596 42.289L6.40139 39.53L10.3687 35.5536L13.1159 36.7385L13.7852 37.0272L14.4257 36.6795C15.7932 35.937 17.2433 35.3266 18.6754 34.9712L19.4385 34.7818L19.7169 34.0464L20.7993 31.1875H26.4661L27.4318 34.0021L27.7021 34.7898L28.5136 34.977C30.0328 35.3273 31.3472 35.9238 32.739 36.6795L33.3783 37.0265L34.0467 36.7394L36.8211 35.5477L40.8944 39.5411L39.7146 42.289L39.4284 42.9556L39.7733 43.5939C40.5142 44.9648 41.1235 46.4188 41.4784 47.8551Z" stroke="white" stroke-width="3"/>
| <path d="M23.7033 40.375C21.2574 40.3719 18.8646 41.0892 16.8237 42.4373C14.7828 43.7854 13.1841 45.7047 12.2271 47.9557C11.2701 50.2067 10.9972 52.6896 11.4424 55.0947C11.8876 57.4998 13.0312 59.7206 14.7305 61.4799C15.3227 59.5549 16.6385 57.9346 18.401 56.96C17.2526 55.8949 16.4517 54.5085 16.1029 52.9815C15.7541 51.4546 15.8736 49.8579 16.4456 48.3998C17.0177 46.9418 18.0158 45.6899 19.3099 44.8075C20.604 43.9251 22.1339 43.4531 23.7002 43.4531C25.2665 43.4531 26.7964 43.9251 28.0905 44.8075C29.3846 45.6899 30.3827 46.9418 30.9548 48.3998C31.5268 49.8579 31.6462 51.4546 31.2974 52.9815C30.9486 54.5085 30.1478 55.8949 28.9994 56.96C30.7619 57.9346 32.0776 59.5549 32.6699 61.4799C34.3688 59.721 35.5123 57.5008 35.9577 55.0963C36.4031 52.6918 36.1307 50.2093 35.1745 47.9586C34.2182 45.7079 32.6205 43.7885 30.5805 42.4399C28.5406 41.0913 26.1487 40.3731 23.7033 40.375Z" fill="white"/>
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/Icon.js 23:50-100
 @ ./node_modules/synapse-react-client/dist/containers/row_renderers/utils/index.js
 @ ./node_modules/synapse-react-client/dist/containers/home_page/featured-data/FeaturedDataTabs.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx

ERROR in ./node_modules/synapse-react-client/dist/assets/icons/terms/check.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg width="auto" height="15" viewBox="0 0 19 15" fill="none" xmlns="http://www.w3.org/2000/svg">
| <path d="M18.7184 1.81746L6.05903 14.6667L0.256836 8.77744L1.74431 7.26766L6.05903 11.6364L17.2309 0.307678L18.7184 1.81746Z" fill="white"/>
| </svg>
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditionsItem.js 11:18-60
 @ ./node_modules/synapse-react-client/dist/containers/TermsAndConditions.js
 @ ./node_modules/synapse-react-client/dist/index.js
 @ ./srcjs/user_card.jsx
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
> devtools::document()
ℹ Updating shiny.synapse.react.client documentation
ℹ Loading shiny.synapse.react.client
Writing NAMESPACE
Writing NAMESPACE

reactR::scaffoldReactWidget() creates devtools::check() warnings

Running reactR::scaffoldReactWidget() on an otherwise R CMD check-passing boilerplate package repo, even before running system("yarn install"); system("yarn run webpack") creates a warning (see full log below).
It's not super important, but I think it might remove some friction if setting up the scaffolding kept the package intact warning-free.

You can see the changes I needed to make to the boilerplate to pass devtools::check() in this commit
Comes down to a couple of @inheritParams and friends.
If you agree with this kind of change, I'd be happy to see whether I can work this in a PR.

==> devtools::check()

Updating reacthexgrid documentation
Warning: @param [/Users/max/GitHub/reacthexgrid/R/reacthexgrid.R#31]: mismatched braces or quotes
Writing NAMESPACE
Loading reacthexgrid
Writing NAMESPACE
── Building ──────────── reacthexgrid ──
Setting env vars:
● CFLAGS    : -Wall -pedantic -fdiagnostics-color=always
● CXXFLAGS  : -Wall -pedantic -fdiagnostics-color=always
● CXX11FLAGS: -Wall -pedantic -fdiagnostics-color=always
────────────────────────────────────────
✔  checking for file ‘/Users/max/GitHub/reacthexgrid/DESCRIPTION’ ...
─  preparing ‘reacthexgrid’:
✔  checking DESCRIPTION meta-information ...
─  checking for LF line-endings in source and make files and shell scripts
─  checking for empty or unneeded directories
─  building ‘reacthexgrid_0.0.0.9000.tar.gz’
   
── Checking ──────────── reacthexgrid ──
Setting env vars:
● _R_CHECK_CRAN_INCOMING_USE_ASPELL_: TRUE
● _R_CHECK_CRAN_INCOMING_REMOTE_    : FALSE
● _R_CHECK_CRAN_INCOMING_           : FALSE
● _R_CHECK_FORCE_SUGGESTS_          : FALSE
── R CMD check ─────────────────────────────────────────────────────────────────
* using log directory ‘/Users/max/GitHub/reacthexgrid.Rcheck’
* using R version 3.6.1 (2019-07-05)
* using platform: x86_64-apple-darwin15.6.0 (64-bit)
* using session charset: UTF-8
* using options ‘--no-manual --as-cran’
* checking for file ‘reacthexgrid/DESCRIPTION’ ... OK
* this is package ‘reacthexgrid’ version ‘0.0.0.9000’
* package encoding: UTF-8
* checking package namespace information ... OK
* checking package dependencies ... OK
* checking if this is a source package ... OK
* checking if there is a namespace ... OK
* checking for executable files ... OK
* checking for hidden files and directories ... OK
* checking for portable file names ... OK
* checking for sufficient/correct file permissions ... OK
* checking serialization versions ... OK
* checking whether package ‘reacthexgrid’ can be installed ... OK
* checking installed package size ... OK
* checking package directory ... OK
* checking for future file timestamps ... OK
* checking DESCRIPTION meta-information ... OK
* checking top-level files ... OK
* checking for left-over files ... OK
* checking index information ... OK
* checking package subdirectories ... OK
* checking R files for non-ASCII characters ... OK
* checking R files for syntax errors ... OK
* checking whether the package can be loaded ... OK
* checking whether the package can be loaded with stated dependencies ... OK
* checking whether the package can be unloaded cleanly ... OK
* checking whether the namespace can be loaded with stated dependencies ... OK
* checking whether the namespace can be unloaded cleanly ... OK
* checking dependencies in R code ... OK
* checking S3 generic/method consistency ... OK
* checking replacement functions ... OK
* checking foreign function calls ... OK
* checking R code for possible problems ... OK
* checking Rd files ... OK
* checking Rd metadata ... OK
* checking Rd line widths ... OK
* checking Rd cross-references ... OK
* checking for missing documentation entries ... OK
* checking for code/documentation mismatches ... OK
* checking Rd \usage sections ... WARNING
Undocumented arguments in documentation object 'reacthexgrid-shiny'
  ‘width’ ‘height’ ‘id’ ‘style’ ‘class’ ‘...’

Undocumented arguments in documentation object 'reacthexgrid'
  ‘message’ ‘width’ ‘height’ ‘elementId’

Functions with \usage entries need to have the appropriate \alias
entries, and all their arguments documented.
The \usage entries must correspond to syntactically valid R code.
See chapter ‘Writing R documentation files’ in the ‘Writing R
Extensions’ manual.
* checking Rd contents ... OK
* checking for unstated dependencies in examples ... OK
* checking examples ... NONE
* DONE

Status: 1 WARNING
See
  ‘/Users/max/GitHub/reacthexgrid.Rcheck/00check.log’
for details.


── R CMD check results ──────────────────────────── reacthexgrid 0.0.0.9000 ────
Duration: 12.6s

❯ checking Rd \usage sections ... WARNING
  Undocumented arguments in documentation object 'reacthexgrid-shiny'
    ‘width’ ‘height’ ‘id’ ‘style’ ‘class’ ‘...’
  
  Undocumented arguments in documentation object 'reacthexgrid'
    ‘message’ ‘width’ ‘height’ ‘elementId’
  
  Functions with \usage entries need to have the appropriate \alias
  entries, and all their arguments documented.
  The \usage entries must correspond to syntactically valid R code.
  See chapter ‘Writing R documentation files’ in the ‘Writing R
  Extensions’ manual.

0 errors ✔ | 1 warning ✖ | 0 notes ✔
Error: R CMD check found WARNINGs
Execution halted

Exited with status 1.
> devtools::session_info()
─ Session info ──────────────────────────────────────────────────────────────────────────────────
 setting  value                       
 version  R version 3.6.1 (2019-07-05)
 os       macOS Mojave 10.14.6        
 system   x86_64, darwin15.6.0        
 ui       RStudio                     
 language (EN)                        
 collate  en_US.UTF-8                 
 ctype    en_US.UTF-8                 
 tz       Europe/Berlin               
 date     2019-10-29                  

─ Packages ──────────────────────────────────────────────────────────────────────────────────────
 package     * version    date       lib source                            
 assertthat    0.2.1      2019-03-21 [1] CRAN (R 3.6.0)                    
 backports     1.1.5      2019-10-02 [1] CRAN (R 3.6.0)                    
 callr         3.3.2      2019-09-22 [1] CRAN (R 3.6.0)                    
 cli           1.1.0      2019-03-19 [1] CRAN (R 3.6.0)                    
 clisymbols    1.2.0      2017-05-21 [1] CRAN (R 3.6.0)                    
 crayon        1.3.4      2017-09-16 [1] CRAN (R 3.6.0)                    
 desc          1.2.0      2018-05-01 [1] CRAN (R 3.6.0)                    
 devtools      2.2.1      2019-09-24 [1] CRAN (R 3.6.1)                    
 digest        0.6.22     2019-10-21 [1] CRAN (R 3.6.1)                    
 ellipsis      0.3.0      2019-09-20 [1] CRAN (R 3.6.0)                    
 fs            1.3.1      2019-05-06 [1] CRAN (R 3.6.0)                    
 glue          1.3.1      2019-03-12 [1] CRAN (R 3.6.0)                    
 htmltools     0.4.0      2019-10-04 [1] CRAN (R 3.6.0)                    
 htmlwidgets   1.5.1      2019-10-08 [1] CRAN (R 3.6.0)                    
 magrittr      1.5        2014-11-22 [1] CRAN (R 3.6.0)                    
 memoise       1.1.0      2017-04-21 [1] CRAN (R 3.6.0)                    
 packrat       0.5.0      2018-11-14 [1] CRAN (R 3.6.0)                    
 pkgbuild      1.0.6      2019-10-09 [1] CRAN (R 3.6.0)                    
 pkgload       1.0.2      2018-10-29 [1] CRAN (R 3.6.0)                    
 prettyunits   1.0.2      2015-07-13 [1] CRAN (R 3.6.0)                    
 processx      3.4.1      2019-07-18 [1] CRAN (R 3.6.0)                    
 ps            1.3.0      2018-12-21 [1] CRAN (R 3.6.0)                    
 R6            2.4.0      2019-02-14 [1] CRAN (R 3.6.0)                    
 Rcpp          1.0.2      2019-07-25 [1] CRAN (R 3.6.0)                    
 reactR        0.4.1      2019-07-07 [1] CRAN (R 3.6.0)                    
 remotes       2.1.0      2019-06-24 [1] CRAN (R 3.6.0)                    
 rlang         0.4.1      2019-10-24 [1] CRAN (R 3.6.1)                    
 rprojroot     1.3-2      2018-01-03 [1] CRAN (R 3.6.0)                    
 rstudioapi    0.10       2019-03-19 [1] CRAN (R 3.6.0)                    
 sessioninfo   1.1.1      2018-11-05 [1] CRAN (R 3.6.0)                    
 testthat      2.2.1      2019-07-25 [1] CRAN (R 3.6.0)                    
 usethis       1.5.1.9000 2019-08-22 [1] Github (jimhester/usethis@b25c982)
 withr         2.1.2      2018-03-15 [1] CRAN (R 3.6.0)                    

[1] /Library/Frameworks/R.framework/Versions/3.6/Resources/library

Import of jsx files

Hi!
I'm new to the colourful world of shiny.
I have some experience with React and try now to import an JSX file into the main shiny UI and then render it into the document by
tags$head(
tags$script(HTML( babel_transform('ReactDOM.render(
<div><App/></div>, document.getElementById("app"))') ),
html_dependency_react()
)
),
`
But the react component is not recognized. I would be very thankful for any hint or an example!

Thanks!

Stefan

Issues with running examples

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.