These are chat archives for chandu0101/scalajs-react-components

30th
Jun 2016
Øyvind Raddum Berg
@oyvindberg
Jun 30 2016 08:32
Yeah sure, its designed for that
Check the material-ui documentation for the exact incantation i guess
Raul Rodriguez
@raul782
Jun 30 2016 14:47
Hi guys,
package components

import chandu0101.scalajs.react.components.materialui._
import japgolly.scalajs.react._
import utils.ReactTags
import my.model.client.ClientModel.Contract
import scala.scalajs.js
import js.Dynamic.{ global => g }

object ContractComponent extends ReactTags {
  case class State(
    c: Contract
  )

  case class Backend($: BackendScope[Unit, State]) {
    val onChangeTextField: ReactEventI => Callback =
      e => {
       val text = e.target.value
       val isEmpty = text.isEmpty
        $.modState(
          s =>
            s.copy(
              c =
                Contract(
                  text,
                  s.c.employee,
                )
            )
          )
      }

    val themeBackgroundColor = Mui.Styles.Colors.blue600

    def render(S: State) =
      <.div(
        <.h3("Create Contract"),
        MuiPaper(zDepth = ZDepth._1, style = DefaultTheme.Style.containerLiteral)(
          MuiTextField(
            floatingLabelText = "Employer", onChange = onChangeTextField, value = S.c.employer
          )(), <.br(),
          MuiTextField(
            floatingLabelText = "Employee", onChange = onChangeTextField
          )(), <.br(),
          MuiRaisedButton(
            label = "Save",
            primary = true,
            backgroundColor = themeBackgroundColor
          )()
        )

      )
  }

  val component = ReactComponentB[Unit]("Contract")
      .initialState(State(Contract(
        "",  ""
      )))
      .renderBackend[Backend]
      .buildU

  def apply() = component()
}
Right now, when hovering over the MuiRaisedButton
I get an invariant violation
client-jsdeps.js:20273 Uncaught Invariant Violation: removeComponentAsRefFrom(...): Only a ReactOwner can have refs.
Any advice?, if I remove the raised button, everything works