Running the App

To run a Foldkit application, create a runtime with makeElement or makeApplication, then call Runtime.run.

makeElement creates a component without URL handling. The init function takes no URL argument (or just flags if you use them). Use this for standalone widgets or components embedded in existing pages.

import { Runtime } from 'foldkit'

const element = Runtime.makeElement({
  Model,
  init,
  update,
  view,
  container: document.getElementById('root')!,
})

Runtime.run(element)

makeApplication creates a full-page application with routing. The init function receives the current URL, and you must provide a browser config to handle URL changes.

import { Runtime } from 'foldkit'

const app = Runtime.makeApplication({
  Model,
  init, // receives (url: Url) => [Model, Commands]
  update,
  view,
  container: document.getElementById('root')!,
  browser: {
    onUrlRequest: request => ClickedLink({ request }),
    onUrlChange: url => ChangedUrl({ url }),
  },
})

Runtime.run(app)

The browser config has two handlers: onUrlRequest is called when a link is clicked (giving you a chance to handle internal vs external links), and onUrlChange is called when the URL changes (so you can update your model with the new route).