Awesome
Purescript Halogen MDL (Material Design Lite)
Overview
purescript-halogen-mdl
is a Purescript Halogen library to
componentize the Google Material Design Lite (MDL)
UI components, classes, attributes, and native javascript effects so that
they can be used within a Halogen application.
Note: MDL is now a "deprecated" library which is in the process of being replaced with a new UI library called Material Components Web. Material Components Web can be thought of as version 2 of MDL, but is not backwards compatible.
Documentation
The example application is currently the best way to see how to use the components from Halogen.
Each MDL component is wrapped up in a Purescript module. Some modules just contain type-safe constants for classes and attributes. Some contain helper functions for creating commonly-used blocks of HTML, and some Purescript modules contain actual Halogen components which attempt to wrap up all the native behavior.
The main native MDL function upgradeElement
is exposed in several different ways as a native import in the MDL
module.
This function is used to "upgrade" the DOM elements to give them the custom MDL behaviors, like button ripples, animations, etc.
Setup
> npm install
> bower install
Examples
# In a terminal:
# Run compiler watch task:
> npm run watch:examples
# In another terminal:
# Run static http file server from this location (e.g. node-static, live-server, etc.)
> cd examples/dist
> live-server .
or
> static .
etc.