KissJS ui layer is the heart and the initial purpose of the library. It provides built-in UI components, which consists of:

Containers

• kiss.ui.Block: basic container
• kiss.ui.Panel: container with a header and other properties that allow to create standard draggable windows and modal windows
• kiss.ui.WizardPanel: panel where items are displayed one at a time (each wizard page) with helper buttons (next, previous) to navigate through the pages

Elements

• kiss.ui.Button: standard clickable button with an icon
• kiss.ui.Dialog: modal dialog box
• kiss.ui.Html: component to insert html
• kiss.ui.Image: component to insert an image
• kiss.ui.Menu: menu of clickable items with icons
• kiss.ui.Notification: notification which disappears automatically (toast message)
• kiss.ui.Spacer: simple empty element used as a spacer in the layout
• kiss.ui.Tip: tip that follows the mouse cursor

Data components

• kiss.ui.Datatable: powerful datatable
• kiss.ui.Calendar: simple calendar
• kiss.ui.Kanban: nice kanban with standard view setup (sort, filter, group, fields)
• kiss.ui.Timeline: powerful timeline with standard view setup (sort, filter, group, fields) + options like color, period, and more
• kiss.ui.ChartView: chart view (with setup) embedding a chart component

Fields

• kiss.ui.Field: text, textarea, number, date or time fields
• kiss.ui.Checkbox: checkbox with multiple design options
• kiss.ui.Select: highly flexible field to select one or more options into a dropdown list
• kiss.ui.Attachment: widget to manage file attachments
• kiss.ui.Color: field to select a color
• kiss.ui.ColorPicker: widget to pick a color
• kiss.ui.Icon: field to select an icon
• kiss.ui.IconPicker: widget to pick an icon
• kiss.ui.Slider: slider widget to select a number value
• kiss.ui.Rating: widget used for ranking and notation

The ui layer is a work in progress and might change rapidly according to new project requirements.