JSFiddle - React, Tailwind, and code Playground

by icylace

CSS

main {
  display: flex;
  flex-direction: column;
}

button {
  margin: 0.5em;
  width: fit-content;
}

JavaScript

import { app, h, text } from "https://unpkg.com/hyperapp"

const runLog = (_, x) => console.log(x)
const log = (x) => [runLog, x]

const Test = (state, payload) => [state, log(payload)]

app({
	init: {},
  view: () => h("main", {}, [
		h("button", { onclick: Test }, text("onclick: Test")),
		h("button", { onclick: [Test] }, text("onclick: [Test]")),
		h("button", { onclick: [Test, undefined] }, text("onclick: [Test, undefined]")),
		h("button", { onclick: [Test, null] }, text("onclick: [Test, null]")),
		h("button", { onclick: [Test, "test"] }, text("onclick: [Test, \"test\"]")),
  ]),
  node: document.body,
})