improve cosmic-text integration, add full Ime support, improve text examples, fix most alignment issues, some performance fixes

- update cosmic-text to 0.18
- work around scrolling issues with cosmic text
- fix textbox mouse dragging handling
- fix textbox flickering
- make RenderText calculate widest line of the entire text, and not just what's visible
- slightly improve RenderText performance by reducing unnecessary work
    - cache widest line until text changed
    - cache size until text changed
    - don't prune layouting/shaping results until text changed
- fix RTL text rendering
- fix TextAtlas texture format with Color glyphs (Rgba8SrgbPremultiplied -> Rgba8Srgb)
- fix TextAtlas erroneously and repeatedly re-rendering glyphs when Color glyphs are requested
- cleanup text_renderer.rs a lot
- add mechanism to clear TextAtlas state when fonts change
- change default line height to 1.2
- mark blit as inline
- add more checks for textbox's active state
- add active field to TextBoxResponse
- separate out logic for calculating the max line width into a function
- add full Ime support with text_cursor in input_state and integrate it with winit and SDL
- improve text examples, make them use system fonts, add ability to use system fonts
- fix most alignment issues, add min_width and inline props to control alignment behavior
- make yakui manage its own font selection instead of relying on cosmic-text's mechanisms

also, a bunch of fixes with cursor and selection:
- cursor renders correctly now (there are no longer cases where the cursor either disappears or renders on the wrong line due to cursor affinity)
- ctrl+a works correctly now
- tapping left after ctrl+a works correctly now (puts cursor to start of selection)
- shifting while tapping up/down works correctly now
- selecting whole word works correctly now
- deselecting whole word works correctly now
- deselecting characters works correctly now
- selecting while cursor is inbetween a word works correctly now

Author: msparkles

crates/bootstrap/src/common.rs

@@ -1,5 +1,12 @@
+use core::cell::Cell;
+use std::sync::Arc;
+
+use yakui::cosmic_text::fontdb;
+use yakui::font::Fonts;
 use yakui::paint::{Texture, TextureFilter, TextureFormat};
-use yakui::{ManagedTextureId, TextureId, UVec2};
+use yakui::util::widget;
+use yakui::widget::Widget;
+use yakui::{ManagedTextureId, TextureId, UVec2, Vec2};
 
 pub const OPENMOJI: &[u8] = include_bytes!("../assets/OpenMoji-color-glyf_colr_0.ttf");
 
@@ -112,3 +119,43 @@ pub fn get_backend() -> BootstrapBackend {
         })
         .unwrap_or(BootstrapBackend::Winit)
 }
+
+#[derive(Debug)]
+struct LoadCommonFontsWidget {
+    loaded: Cell<bool>,
+}
+
+impl Widget for LoadCommonFontsWidget {
+    type Props<'a> = ();
+
+    type Response = ();
+
+    fn new() -> Self {
+        Self {
+            loaded: Cell::default(),
+        }
+    }
+
+    fn update(&mut self, _props: Self::Props<'_>) -> Self::Response {}
+
+    fn layout(
+        &self,
+        ctx: yakui::widget::LayoutContext<'_>,
+        _constraints: yakui::Constraints,
+    ) -> yakui::Vec2 {
+        if !self.loaded.get() {
+            let fonts = ctx.dom.get_global_or_init(Fonts::default);
+
+            fonts.load_system_fonts();
+            fonts.load_font_source(fontdb::Source::Binary(Arc::from(&OPENMOJI)));
+
+            self.loaded.set(true);
+        }
+
+        Vec2::ZERO
+    }
+}
+
+pub fn load_common_fonts() {
+    widget::<LoadCommonFontsWidget>(());
+}

crates/bootstrap/src/with_winit.rs

@@ -104,12 +104,11 @@ impl<T: ExampleBody> ApplicationHandler for App<T> {
         _window_id: WindowId,
         event: WindowEvent,
     ) {
-        if self
-            .yak_window
-            .as_mut()
-            .unwrap()
-            .handle_window_event(&mut self.yak, &event)
-        {
+        if self.yak_window.as_mut().unwrap().handle_window_event(
+            &mut self.yak,
+            &event,
+            self.window.as_ref().unwrap(),
+        ) {
             return;
         }
 

crates/demo/src/main.rs

@@ -47,7 +47,7 @@ async fn run(event_loop: EventLoop<()>, window: Window) {
             }
 
             Event::WindowEvent { event, .. } => {
-                graphics.handle_window_event(&mut yak, &event, event_loop);
+                graphics.handle_window_event(&mut yak, &event, event_loop, &window);
             }
             _ => (),
         })

crates/yakui-app/src/lib.rs

@@ -184,11 +184,12 @@ impl Graphics {
         yak: &mut yakui::Yakui,
         event: &WindowEvent,
         event_loop: &ActiveEventLoop,
+        window: &Window,
     ) -> bool {
         // yakui_winit will return whether it handled an event. This means that
         // yakui believes it should handle that event exclusively, like if a
         // button in the UI was clicked.
-        if self.window.handle_window_event(yak, event) {
+        if self.window.handle_window_event(yak, event, window) {
             return true;
         }
 

crates/yakui-core/src/event.rs

@@ -48,6 +48,11 @@ pub enum Event {
     /// A Unicode codepoint was typed in the window.
     TextInput(char),
 
+    /// An input-method preedit event has been fired.
+    ///
+    /// Follows winit's `Ime::Preedit`
+    TextPreedit(String, Option<(usize, usize)>),
+
     /// Request focus of a specific widget, or clear focus if `None`.
     RequestFocus(Option<WidgetId>),
 }
@@ -107,6 +112,9 @@ pub enum WidgetEvent {
     /// Text was sent to the widget.
     TextInput(char, Modifiers),
 
+    /// Preedit text was sent to the widget.
+    TextPreedit(String, Option<(usize, usize)>),
+
     /// The widget was focused or unfocused.
     FocusChanged(bool),
 }

crates/yakui-core/src/input/input_state.rs

@@ -6,6 +6,7 @@ use smallvec::SmallVec;
 
 use crate::dom::{Dom, DomNode};
 use crate::event::{Event, EventInterest, EventResponse, WidgetEvent};
+use crate::geometry::Rect;
 use crate::id::WidgetId;
 use crate::layout::LayoutDom;
 use crate::navigation::{navigate, NavDirection};
@@ -38,6 +39,9 @@ pub struct InputState {
 
     /// If set, text input should be active.
     text_input_enabled: Cell<bool>,
+
+    /// If there's a text input active with a cursor, this will be set and forwarded to the window.
+    text_cursor: Cell<Option<Rect>>,
 }
 
 #[derive(Debug)]
@@ -120,12 +124,14 @@ impl InputState {
             last_selection: Cell::new(None),
             pending_navigation: Cell::new(None),
             text_input_enabled: Cell::new(false),
+            text_cursor: Cell::new(None),
         }
     }
 
     /// Begin a new frame for input handling.
     pub fn start(&self, dom: &Dom, layout: &LayoutDom) {
         self.text_input_enabled.set(false);
+        self.text_cursor.set(None);
         self.notify_selection(dom, layout);
     }
 
@@ -155,6 +161,20 @@ impl InputState {
         self.text_input_enabled.get()
     }
 
+    /// Sets the text cursor. Should be called every update from an active text input.
+    ///
+    /// Should be in physical pixels.
+    pub fn set_text_cursor(&self, cursor: Rect) {
+        self.text_cursor.set(Some(cursor));
+    }
+
+    /// Gets the text cursor, if any.
+    ///
+    /// Should be in physical pixels.
+    pub fn get_text_cursor(&self) -> Option<Rect> {
+        self.text_cursor.get()
+    }
+
     /// Returns the mouse position, or [`None`] if it's outside the window.
     pub fn mouse_pos(&self, layout: &LayoutDom) -> Option<Vec2> {
         self.mouse
@@ -182,33 +202,33 @@ impl InputState {
         &self,
         dom: &Dom,
         layout: &LayoutDom,
-        event: &Event,
+        event: Event,
     ) -> EventResponse {
         let res = match event {
             Event::CursorMoved(pos) => {
-                self.mouse_moved(dom, layout, *pos);
+                self.mouse_moved(dom, layout, pos);
                 EventResponse::Bubble
             }
             Event::MouseButtonChanged { button, down } => {
                 // Left clicking clears selection, unless the widget handling the event sets the
                 // same selection again
-                if button == &MouseButton::One && *down {
+                if button == MouseButton::One && down {
                     self.selection.set(None);
                 }
-                let response = self.mouse_button_changed(dom, layout, *button, *down);
 
-                response
+                self.mouse_button_changed(dom, layout, button, down)
             }
-            Event::MouseScroll { delta } => self.send_mouse_scroll(dom, layout, *delta),
+            Event::MouseScroll { delta } => self.send_mouse_scroll(dom, layout, delta),
             Event::KeyChanged {
                 key,
                 down,
                 modifiers,
-            } => self.keyboard_key_changed(dom, layout, *key, *down, *modifiers),
+            } => self.keyboard_key_changed(dom, layout, key, down, modifiers),
             Event::ModifiersChanged(modifiers) => self.modifiers_changed(modifiers),
-            Event::TextInput(c) => self.text_input(dom, layout, *c),
+            Event::TextInput(c) => self.text_input(dom, layout, c),
+            Event::TextPreedit(text, position) => self.text_preedit(dom, layout, text, position),
             Event::RequestFocus(id) => {
-                self.set_selection(*id);
+                self.set_selection(id);
                 EventResponse::Bubble
             }
             _ => EventResponse::Bubble,
@@ -336,8 +356,36 @@ impl InputState {
         EventResponse::Bubble
     }
 
-    fn modifiers_changed(&self, modifiers: &Modifiers) -> EventResponse {
-        self.modifiers.set(*modifiers);
+    fn modifiers_changed(&self, modifiers: Modifiers) -> EventResponse {
+        self.modifiers.set(modifiers);
+        EventResponse::Bubble
+    }
+
+    fn text_preedit(
+        &self,
+        dom: &Dom,
+        layout: &LayoutDom,
+        text: String,
+        position: Option<(usize, usize)>,
+    ) -> EventResponse {
+        let selected = self.selection.get();
+        if let Some(id) = selected {
+            let Some(layout_node) = layout.get(id) else {
+                return EventResponse::Bubble;
+            };
+
+            if layout_node
+                .event_interest
+                .contains(EventInterest::FOCUSED_KEYBOARD)
+            {
+                // Panic safety: if this node is in the layout DOM, it must be
+                // in the DOM.
+                let mut node = dom.get_mut(id).unwrap();
+                let event = WidgetEvent::TextPreedit(text, position);
+                return self.fire_event(dom, layout, id, &mut node, &event);
+            }
+        }
+
         EventResponse::Bubble
     }
 

crates/yakui-core/src/state.rs

@@ -35,12 +35,12 @@ impl Yakui {
 
         context::bind_dom(&self.dom);
 
-        let response = self.input.handle_event(&self.dom, &self.layout, &event);
-
-        if let Event::ViewportChanged(viewport) = event {
-            self.layout.set_unscaled_viewport(viewport);
+        if let Event::ViewportChanged(viewport) = &event {
+            self.layout.set_unscaled_viewport(*viewport);
         }
 
+        let response = self.input.handle_event(&self.dom, &self.layout, event);
+
         context::unbind_dom();
         response == EventResponse::Sink
     }
@@ -148,6 +148,11 @@ impl Yakui {
         self.input.text_input_enabled()
     }
 
+    /// Gets the text cursor, if any.
+    pub fn get_text_cursor(&self) -> Option<Rect> {
+        self.input.get_text_cursor()
+    }
+
     /// Requests focus of a specific widget, or clears focus if `None`.
     pub fn request_focus(&mut self, id: Option<WidgetId>) {
         self.handle_event(Event::RequestFocus(id));

crates/yakui-sdl3/src/lib.rs

@@ -38,7 +38,6 @@ impl YakuiSdl3 {
 
     pub fn update(&mut self, window: &Window, state: &mut yakui_core::Yakui) {
         let new_value = state.text_input_enabled();
-
         match (self.text_input_enabled, new_value) {
             (false, true) => unsafe {
                 SDL_StartTextInput(window.raw());
@@ -48,6 +47,20 @@ impl YakuiSdl3 {
             },
             (true, true) | (false, false) => {}
         }
+        self.text_input_enabled = new_value;
+
+        if self.text_input_enabled {
+            if let Some(rect) = state.get_text_cursor() {
+                let pos = rect.pos();
+                let size = rect.size();
+
+                window.subsystem().text_input().set_rect(
+                    window,
+                    sdl3::rect::Rect::new(pos.x as i32, pos.y as i32, size.x as u32, size.y as u32),
+                    0,
+                );
+            }
+        }
     }
 
     pub fn handle_event(&mut self, state: &mut yakui_core::Yakui, event: &SdlEvent) -> bool {
@@ -122,6 +135,21 @@ impl YakuiSdl3 {
                 false
             }
 
+            SdlEvent::TextEditing {
+                text,
+                start,
+                length,
+                ..
+            } => {
+                let byte_lens = text.chars().map(|v| v.len_utf8()).collect::<Vec<_>>();
+                let start = *start as usize;
+                let end = start + *length as usize;
+                let start = byte_lens[..start].iter().sum();
+                let end = byte_lens[..end].iter().sum();
+
+                state.handle_event(Event::TextPreedit(text.clone(), Some((start, end))))
+            }
+
             SdlEvent::KeyDown {
                 scancode, keymod, ..
             } => {

crates/yakui-widgets/Cargo.toml

@@ -11,14 +11,18 @@ default = ["default-fonts"]
 
 # Include built-in fonts.
 default-fonts = []
+system-fonts = ["cosmic-text/fontconfig"]
 
 [dependencies]
 yakui-core = { path = "../yakui-core", version = "0.3.0" }
 
-cosmic-text = { version = "0.15.0", default-features = false, features = [
+cosmic-text = { version = "0.18.2", default-features = false, features = [
     "std",
     "swash",
 ] }
+# see yakui_widgets::widgets::textbox::cosmic_text_util
+unicode-segmentation = { version = "1.10.1" }
+
 sys-locale = "0.3.1"
 
 log.workspace = true