Add Reusable[TagMod] to TriStateCheckbox Props

Author: japgolly

coreGeneric/src/main/scala/japgolly/scalajs/react/Reusable.scala

@@ -3,6 +3,7 @@ package japgolly.scalajs.react
 import japgolly.scalajs.react.internal.CoreGeneral._
 import japgolly.scalajs.react.util.Effect.Sync
 import japgolly.scalajs.react.util.{DefaultEffects => D}
+import japgolly.scalajs.react.vdom.TagMod
 import scala.reflect.ClassTag
 
 /**
@@ -150,6 +151,9 @@ object Reusable {
   def reusabilityInstance[A](r: Reusability[A]): Reusable[Reusability[A]] =
     byRef(r.test).map(new Reusability(_))
 
+  lazy val emptyVdom: Reusable[TagMod] =
+    Reusable.byRef(TagMod.empty)
+
   // ===================================================================================================================
 
   /** Convenience methods that help you create `I => Reusable[O]` functions.

doc/changelog/2.0.0.md

@@ -78,6 +78,8 @@ Contents:
 * New extension method `showDom(): String` available on mounted components given
   `import japgolly.scalajs.react.test._` and/or `import japgolly.scalajs.react.test.ReactTestUtil._`
 
+* Add `Reusable.emptyVdom` which has the type `Reusable[TagMod]`
+
 
 # Removals
 
@@ -333,6 +335,7 @@ You can run the script in the Migration section at the bottom of the page to aut
     * `ModStateWithPropsFn`
   * `TimerSupport.install` had an infinite loop
   * `TriStateCheckbox`'s `onKeyDown` handler was calling `event.preventDefault()` on unhandled keys
+* `TriStateCheckbox` now accepts an optional `Reusable[TagMod]` in its `Props` that will be applied to the `<input>`
 
 * Upgrade deps
   * Cats-effect to 3.2.1

extra/src/main/scala/japgolly/scalajs/react/extra/internal/TriStateCheckboxF.scala

@@ -56,14 +56,17 @@ class TriStateCheckboxF[F[_]](implicit F: Sync[F]) {
 
   case class Props(state       : State,
                    setNextState: F[Unit],
-                   disabled    : Boolean = false) {
+                   disabled    : Boolean = false,
+                   tagMod      : Reusable[TagMod] = Reusable.emptyVdom,
+                  ) {
     @inline def render: VdomElement = Component(this)
   }
 
   private def render($: ScalaComponent.MountedPure[Props, Unit, Unit], p: Props) = {
     val props = F.transSync($.props)(DefaultEffects.Sync)
     val setNext = F.flatMap(props)(p => if (p.disabled) F.empty else p.setNextState) // Only access .setNextState inside Sync for Reusability
     <.input.checkbox(
+      p.tagMod,
       ^.disabled := p.disabled,
       TagMod.unless(p.disabled)(eventHandlers(setNext)))
   }

tests/src/test/scala/japgolly/scalajs/react/extra/TriStateCheckboxTest.scala

@@ -2,11 +2,11 @@ package japgolly.scalajs.react.extra
 
 import japgolly.scalajs.react._
 import japgolly.scalajs.react.extra.components.TriStateCheckbox
-import japgolly.scalajs.react.vdom.html_<^._
-import japgolly.scalajs.react.test.TestUtil._
 import japgolly.scalajs.react.test.ReactTestUtils._
-import utest._
+import japgolly.scalajs.react.test.TestUtil._
 import japgolly.scalajs.react.test._
+import japgolly.scalajs.react.vdom.html_<^._
+import utest._
 
 object TriStateCheckboxTest extends TestSuite {