Web components for creating interfaces - built with lit-html and lit-element by Blackstone Publishing

Installation

Blackstone-UI is available as an npm package

npm install blackstone-ui --save

Or if you want the latest cutting-edge version

npm install https://github.com/kjantzer/bui.git --save

Overview

Web components (or custom elements) allow us to encapsalate logic, designs, and features in html elements. Along with custom elements, various "presenters" (or views) have been created for all the ways an app needs to display data

• Elements - common building-block elements
• Util - utility methods
• Router - manages the url and triggers views
• Helpers - helper/extensions
• Presenters - ways to present views and data
  • Dialog
  • Form Control
  • List
  • Menu
  • Panel
  • Popover
  • Tabs

Developing

lit-html and lit-element are being used to create and render custom elements. The beauty in these tools is that they are simply syntactic sugar for native web technologies

lit-html - this is a templating tool that replaces a need for something like mustache.js

lit-element - this is a base class for that makes it easier to make custom elements removing a lot of the boilerplate code usually needed.

Demo

Install the parcel bundler

npm install -g parcel-bundler

Then cd to this directory and run:

npm start

Notes

• consider switching out moment.js for something lighter weight (like day.js)