Batoi UIF 2.2.0: Stronger Examples, Typed Text, Brand Icons, and a Refined Visual System
Batoi UIF 2.2.0 component gallery with complete copy-ready examples.

Batoi UIF 2.2.0 is now available. This release makes the dependency-free interface framework easier to evaluate, understand, and adopt through stronger examples and practical presentation capabilities.

The component and icon galleries now serve as implementation references rather than visual inventories alone. The release also introduces dependency-free typed text, richer image and testimonial carousel patterns, common social icons, and a more deliberate typography and semantic color system.

Complete Examples That Stay Aligned with the Interface

Every component-gallery preview now provides complete, copy-ready markup. Developers can inspect a working component and copy its full HTML contract without reconstructing omitted sections.

Because the displayed markup is derived from the corresponding preview, the example and its implementation guidance remain aligned as the library evolves. This makes the gallery more useful for teams adopting UIF in server-rendered applications, Batoi RAD interfaces, and progressively enhanced product surfaces.

Richer Carousels Without Another Runtime

Batoi UIF already provides an accessible carousel contract with previous and next controls, slide indicators, keyboard operation, lifecycle cleanup, and status announcements. Version 2.2.0 builds richer presentation patterns on that established behavior.

  • A responsive multi-image carousel with useful alternative text and captions.
  • A portrait-led testimonial carousel using the same declarative interaction model.
  • Ordinary HTML that applications can adapt without introducing another slider dependency.
Mobile Batoi UIF testimonial carousel with portrait, quotation, and navigation controls
The testimonial pattern adapts to narrow screens while retaining accessible carousel controls.

Dependency-Free Typed Text

The effects package now includes typed text for concise rotating statements and status phrases. It uses the standard UIF declarative model:

<strong
  data-uif="typed-text"
  data-uif-strings='["server-rendered.","mobile-ready.","secure by design."]'
  data-uif-type-speed="55"
  data-uif-delete-speed="30"
  data-uif-pause="1200"
>
  server-rendered.
</strong>

Teams can configure phrases, typing and deletion speed, pause duration, start delay, and looping. UIF also owns the animation lifecycle so the behavior can be refreshed or removed cleanly. When reduced motion is preferred, the text appears immediately rather than simulating typing.

A More Useful Icon Gallery

Every icon card now includes copyable CSS alongside declarative markup, JavaScript usage, its icon name, and raw SVG. The gallery demonstrates how icons inherit sizing and color through the stable UIF icon host contract.

The first-party registry also adds marks for Facebook, GitHub, Instagram, LinkedIn, X/Twitter, and YouTube. These SVG icons participate in the existing search, metadata, category, and alias features without requiring an external icon font or runtime library.

Batoi UIF icon gallery filtered to first-party social and brand icons
Brand icons are searchable and include declarative, JavaScript, CSS, and SVG usage.

Typography Without a Required Webfont

Version 2.2.0 introduces a clearer typographic hierarchy while leaving font delivery under application control. The default stack uses available system fallbacks and does not download or bundle a webfont.

The visual system now includes explicit roles for body copy, controls, labels, titles, metrics, and display text; consistent line heights and spacing; responsive title sizes; readable content measures; and strong, muted, and subtle text colors for light and dark themes.

Semantic icon colors provide coordinated foreground and background pairs for common interface states. Together, these additions help applications communicate hierarchy and status consistently without forcing every surface into the same composition.

Diagram showing Batoi UIF 2.2.0 improvements across examples, components, icons, and typography
Batoi UIF 2.2.0 strengthens examples and presentation capabilities while preserving its dependency-free runtime model.

Available Now

Batoi UIF 2.2.0 is available from the public GitHub repository. Developers can also explore the published galleries and documentation before adopting individual patterns.

For teams building HTML-first applications, RAD interfaces, mobile-ready workflows, and progressively enhanced product surfaces, this release makes Batoi UIF faster to inspect and easier to put into practice while retaining its lean browser runtime.