Skip to content
Javier Sánchez - Marín edited this page Oct 5, 2013 · 1 revision

There are two ways to use uick. Requiring uick itself or requiring each component separately. If you require uick, yo can download builds from here which includes all the uick components available, or preferably do your own custom build.

In both cases, you should read the API documentation for each component you will be using.

Requiring uick

Provides an unified API for all the uick components, which are namespaced under the same object. The uick wrapper is somewhat similar to jQuery style API: select elements from DOM, instance new components and play with the component API. All of these with method chaining.

// require uick
var uick = require('uick');

// register uick components that will be used (all should be in the component.json)
uick.register(["checkbox", "select", "input-slider"]);

// create a new instance from an existing checkbox
var check = uick('input[type="checkbox"]').checkbox();

// play with the API
check.api().toggle();

If you are not using component(1) as package manager, you can download uick-standalone build and you save the require('uick') line. In this case uick is exposed to the global scope:

// create a new instance from an existing checkbox
var check = uick('input[type="checkbox"]').checkbox();

// play with the API
check.api().toggle();

Requiring components separately

All components are require()-able modules, so start require()-ing the components you want to use. Note that all uick components are prefixed with ui-.

// require ui-checkbox component
var checkbox = require('ui-checkbox');
var el = document.querySelectorAll('input[type="checkbox"]');

// create a new instance from an existing checkbox
var check = checkbox(el);

// play with the API
check.toggle());

Clone this wiki locally