What the heck happened to the rest of the UIF documentation?

All the CSS-only components have been moved across to the Storybook version of our UIF docs.

The jQuery dependent components are considered legacy, and while still currently available, are not going to be actively developed upon any longer. Also, it's a schlep trying to get jQuery to work within webpack/storybook, so they can stay here.

Please consider using CSS-only components for maximum ongoing happiness. 💖

Text Input formatter

Default behaviour

<input type="tel" class=" input-text" placeholder="YYYY-mm-dd" data-js="formatter">

Shortdate behaviour

<input type="tel" class=" input-text" placeholder="YY-mm" data-js="formatter" data-formatter-type="shortdate">

Introduction

The input formatter requires a data-js=formatter attribute to initialise.

The input formatter has a dependency on cleave. Remember to include a reference to external/cleave.min.js as well as the standard modules/jquery.pfInputFormatter.

Usage

Selector Effect Remarks
data-js="formatter" Added to the input elements to bind date behaviour. By default it will give YYYY-mm-dd. Required.
data-formatter-type="shortdate" To enforce "shortdate" behaviour, i.e. YY-mm. Optional.