1. Intro


DomKit is a HTML5 UI toolkit designed for building Web-based user interfaces. Collectivity DomKit is composed of two layers:

  • dom: The dom pod provides low-level access to the browser DOM
  • domkit: A library of reusable widgets and utilities used to construct UI's

One of the chief design goals for DomKit is to minimize the abstractions added the the W3C DOM, which has several benefits:

  • Allows us to take advantage of browser innovations as they are added over time
  • Limits conflicts for using 3rd Party HTML components with DomKit
  • Leverages existing knowledge and resources for building HTML interfaces
  • Keeps library smaller and simpler

A key point to emphasize is a DomKit "widget" is nothing more than a standard DOM element node (i.e. a <div>). It can be used and placed anywhere in your DOM tree. Likewise a "widget" can also contain most any valid HTML content as children.

This manual is organized into 6 main sections:

  • Dom: Low-level DOM API overview
  • Layout: Overview of DomKit layout containers
  • Controls: Overview of standard DomKit controls
  • Modals: Overview of DomKit modal elements
  • Drag and Drop: Overview of DomKit drag and drop API
  • Theming: Overview of customizing DomKit CSS

To get a feel for what is available in Domkit and some example use cases, you can run the test suite:

$ fan testDomkit

This command will start a local web server on port 8080 which you can then open in your browser: