Olevsoft

UIKit

A component library built for one thing: full control.

21 ES6 components, no framework, no build step, no dependencies. Every component is a plain class you instantiate, configure, and attach to the DOM — nothing renders on its own, nothing hides behind a virtual DOM or a compiler. It's the same library that runs the entire IMS interface.

21components
0dependencies
0build step
ES6native modules

How it works

No auto-rendering, no magic. Create an instance, chain configuration setters, append it to the page. Components talk to each other and to your code through emit/on events, not parent-child coupling.

Class API

new ui.Grid() — full class instances when you want direct control over lifecycle and state.

Factory namespace

UIKit.grid() — a lighter factory-style API for quick composition.

Event-driven

Every component emits and listens for events instead of relying on parent-child references — swap a component out without rewiring everything around it.

Some of the components

Each one exists because a real screen in IMS needed it — not designed up front as a checklist.

Grid

The most complex component: sort, filter, inline editing and column resizing, all working off a separate filtered-rows array so the original data is never mutated.

Dialog

Modal windows with a stack manager so nested dialogs always close in the right order.

DatePicker

A custom calendar overlay — built after the native date input conflicted with custom popups and needed two clicks to close.

Select vs. Combo vs. Dropdown

Three different pickers for three different scales: native <select> past ~50 items, an autocomplete Combo up to ~200, a lightweight Dropdown below that.

Form

Fields, validation and submit handling, with addField() appending a single field without re-rendering the whole form.

VerticalLayout / HorizontalLayout

Fixed/stretch/fixed three-zone layouts using absolute positioning, a pattern carried over from an older widget library rather than flexbox.

Themeable by design

Components read CSS custom properties, not hardcoded colors — a new visual theme is a new stylesheet with the same token names, no JS changes.