Check out the microsite and Scaladocs.

See the examples folder for commented code examples. Try them out by running examples/fastLinkJS in sbt and serving the index.html using something like Live Server.

For good measure, there is an implementation of todomvc in the todo-mvc folder.

Artifacts are published to Maven Central for Scala 2.13 and Scala 3.

libraryDependencies += "io.github.buntec" %%% "ff4s" % "0.24.0"

• ff4s-canvas
• ff4s-shoelace
• ff4s-heroicons

• The store constructor is simplified to (Action, State) => (State, F[Unit]). To migrate replace all occurrences of None with Applicative[F].unit (see microsite and examples).

• Adds withClass extension method to the V type that allows overriding the class attribute of the underlying node. This turns out to be useful for literals, e.g., setting the class on an SVG icon.

• Dsl[F, State, Action] becomes Dsl[State, Action]. The F parameter was merely an implementation detail leaking out.
• ff4s.App no longer has an implicit Dsl member. A better pattern for organizing components is to use a Dsl[State, Action] self-type (see the examples), which obviates the need for passing a Dsl parameter to every component.

• Adds a debug mode for inspecting the state from the browser console.
• Improves support for web components by adding a WebComponent base trait and a Slot modifier (see ff4s-shoelace for usage examples).

• Bug fix: map reflected attributes to attributes instead of props. Properties typically cannot be deleted so things like id, once set, couldn't be removed.

• Adds caching for literals. This can significantly improve performance, e.g., when displaying a large number of SVG icon literals.

You can query the state of your ff4s app in the Browser console by defining/declaring the following global variables (e.g., by adding an inline script to your index.html):

var process = {
  env: {
    'FF4S_DEBUG': 'TRUE',
  }
};
var ff4s_state;

The current state can then be retrieved from the ff4s_state variable. In particular, you can call ff4s_state.toString() (and toString can be customized in your Scala code).