Skip to content

v0.2.2: Keyboard Navigation and Password Input Improvements

Choose a tag to compare

View all tags
@Augani Augani released this 28 Oct 18:02
· 83 commits to main since this release
v0.2.2
86dc09e

adabraka-ui v0.2.2 Release Notes

Release Date: October 28, 2025

Overview

This release focuses on improving form usability and developer experience with keyboard navigation enhancements, password input fixes, and comprehensive project documentation.

What's New

Keyboard Navigation

We've added full Tab/Shift-Tab navigation support for form inputs, making it easier to create accessible forms:

// Tab navigation works automatically with proper FocusHandle configuration
Input::new(&email_input)
    .placeholder("Email")

Input::new(&password_input)
    .placeholder("Password")
    .password(true)

// Press Tab to move to next input, Shift-Tab to go back

Implementation Details:

  • FocusHandle configured with .tab_index(0).tab_stop(true) for proper focus management
  • Window-level navigation using window.focus_next() and window.focus_prev()
  • Emits InputEvent::Tab and InputEvent::ShiftTab for custom handling

Password Input Eye Icon Toggle

The password input eye icon now works correctly, allowing users to toggle password visibility:

Input::new(&password_input)
    .password(true)  // Enables the eye icon toggle
    .placeholder("Enter password")

Features:

  • Icon toggles between "eye" (hidden) and "eye-off" (visible)
  • Password masking switches between bullets (••••) and actual text
  • Immediate visual feedback with proper state management
  • Clean, intuitive UX aligned with modern web standards

Comprehensive ROADMAP

Added detailed ROADMAP.md with complete component inventory:

  • 90+ Components organized by category (Display, Forms, Navigation, Overlays, etc.)
  • Status indicators (✅ Complete, 🔄 In Progress, ❌ Todo, ⚠️ Partial)
  • Phase-based development plan with desktop integration features
  • Prioritized quick wins and improvements

Improvements

Code Quality

  • Removed 13 unnecessary inline comments across 6 files
  • Cleaner, more production-ready codebase
  • Files improved: color_picker.rs, input_state.rs, input.rs, text.rs, lib.rs, transitions.rs

New Examples

  • password_test.rs - Demonstrates password toggle functionality with clear instructions

Bug Fixes

  • Fixed password input eye icon not toggling correctly
  • Fixed password masking not switching between hidden/visible states
  • Fixed state reading to use dynamic input_state.masked value for immediate updates

Technical Details

Password Toggle Implementation

The password toggle now properly reads state dynamically and triggers UI refresh:

// Dynamic state reading
let is_masked = input_state.masked;

// Toggle on click with immediate refresh
state.update(cx, |state, cx| {
    state.masked = !state.masked;
    cx.notify();
});
window.refresh();

Keyboard Navigation Architecture

Built on GPUI's focus system with proper FocusHandle configuration:

// FocusHandle is the source of truth for tab properties
.track_focus(&self.state.read(cx).focus_handle(cx).tab_index(0).tab_stop(true))

// Tab handlers in InputState
pub fn tab(&mut self, _: &Tab, window: &mut Window, cx: &mut Context<Self>) {
    window.focus_next();
    cx.emit(InputEvent::Tab);
}

Migration Guide

No breaking changes in this release. All existing code will continue to work without modifications.

To use the new keyboard navigation features, ensure your inputs are rendered in the proper order and they will automatically support Tab/Shift-Tab navigation.

Installation

[dependencies]
adabraka-ui = "0.2.2"

What's Next

Check out our ROADMAP.md for upcoming features including:

  • File upload component
  • Virtualized list improvements
  • Multi-window support
  • System tray integration
  • And much more!

Contributors

Thank you to everyone who contributed to this release!

Resources

For questions or feedback, please open an issue on GitHub.

Assets 2
Loading