karm-ui: Fixed multiline selection in text input and added mouse selection.

Author: sleepy-monax

src/karm-gfx/prose.cpp

@@ -440,16 +440,13 @@ export struct Prose : Meta::Pinned {
         for (auto& line : _lines) {
             Au lineTop = currHeight;
 
-            Au maxAscent = 0_au;
-            Au maxDescend = 0_au;
+            Au maxAscent = fontAscent;
+            Au maxDescend = fontDescend;
             for (auto const& block : line.blocks()) {
                 if (block.strut()) {
                     Au baseline{block.strut()->baseline};
                     maxAscent = max(maxAscent, baseline);
                     maxDescend = max(maxDescend, block.strut()->size.y - baseline);
-                } else {
-                    maxAscent = max(maxAscent, fontAscent);
-                    maxDescend = max(maxDescend, fontDescend);
                 }
             }
 
@@ -594,6 +591,57 @@ export struct Prose : Meta::Pinned {
 
         return {block.pos + cell.pos, cell.Yposition(line.baseline)};
     }
+
+    // MARK: Hit Testing -------------------------------------------------------
+
+    usize hitTest(Vec2Au point) const {
+        if (isEmpty(_lines))
+            return 0;
+
+        Au fontAscent = Au{_lineHeight};
+
+        // Find the line containing the y coordinate
+        usize li = _lines.len() - 1;
+        for (usize i = 0; i + 1 < _lines.len(); i++) {
+            Au nextLineTop = _lines[i + 1].baseline - fontAscent;
+            if (point.y < nextLineTop) {
+                li = i;
+                break;
+            }
+        }
+
+        auto& line = _lines[li];
+
+        if (isEmpty(line.blocks()))
+            return line.runeRange.start;
+
+        // Find the block closest to the x coordinate
+        usize bi = 0;
+        for (usize i = 0; i < line.blocks().len(); i++) {
+            auto& block = line.blocks()[i];
+            if (point.x < block.pos + block.width) {
+                bi = i;
+                break;
+            }
+            bi = i;
+        }
+
+        auto& block = line.blocks()[bi];
+
+        if (isEmpty(block.cells()))
+            return block.runeRange.start;
+
+        // Find the cell closest to the x coordinate
+        for (auto& cell : block.cells()) {
+            Au cellMid = block.pos + cell.pos + cell.adv / 2_au;
+            if (point.x < cellMid)
+                return cell.runeRange.start;
+        }
+
+        // Past the last cell — return end of block
+        auto& lastCell = last(block.cells());
+        return lastCell.runeRange.end();
+    }
 };
 
 } // namespace Karm::Gfx

src/karm-ui/input.cpp

@@ -380,31 +380,43 @@ static void _paintCaret(Gfx::Canvas& g, Gfx::Prose& p, usize runeIndex, Gfx::Col
     g.lineTo(ce);
     g.strokeStyle({
         .fill = color,
-        .width = 2.0,
+        .width = 1.0,
         .align = Gfx::CENTER_ALIGN,
     });
     g.stroke();
 }
 
 static void _paintSelection(Gfx::Canvas& g, Gfx::Prose& p, usize start, usize end, Gfx::Color color) {
-    if (start == end)
+    if (start == end or isEmpty(p._lines))
         return;
 
-    if (not p._style.multiline) {
-        auto ps = p.queryPosition(start);
-        auto pe = p.queryPosition(end);
-        auto m = p._style.font.metrics();
+    if (start > end)
+        std::swap(start, end);
 
-        auto rect =
+    auto m = p._style.font.metrics();
+    auto [startLi, startBi, startCi] = p.lbcAt(start);
+    auto [endLi, endBi, endCi] = p.lbcAt(end);
+
+    g.fillStyle(color);
+
+    for (usize li = startLi; li <= endLi; li++) {
+        auto& line = p._lines[li];
+
+        auto lineStart = (li == startLi)
+                             ? p.queryPosition(start)
+                             : Vec2Au{0_au, line.baseline};
+
+        auto lineEnd = (li == endLi)
+                           ? p.queryPosition(end)
+                           : Vec2Au{line.width, line.baseline};
+
+        g.fill(
             RectAu::fromTwoPoint(
-                ps + Vec2Au{0_au, Au{m.descend}},
-                pe - Vec2Au{0_au, Au{m.ascend}}
+                lineStart + Vec2Au{0_au, Au{m.descend}},
+                lineEnd - Vec2Au{0_au, Au{m.ascend}}
             )
-                .cast<f64>();
-
-        g.fillStyle(color);
-        g.fill(rect);
-        return;
+                .cast<f64>()
+        );
     }
 }
 
@@ -414,6 +426,7 @@ struct Input : View<Input> {
     FocusListener _focus;
     Rc<TextModel> _model;
     Send<TextAction> _onChange;
+    bool _mouseDown = false;
 
     Opt<Rc<Gfx::Prose>> _text;
 
@@ -458,6 +471,31 @@ struct Input : View<Input> {
     }
 
     void event(App::Event& e) override {
+        _focus.event(*this, e);
+
+        if (auto me = e.is<App::MouseEvent>()) {
+            if (me->type == App::MouseEvent::PRESS and
+                me->button == App::MouseButton::LEFT and
+                bound().contains(me->pos)) {
+                _ensureText().layout(Au{bound().width});
+                auto local = me->pos - bound().xy;
+                auto pos = _ensureText().hitTest({Au{local.x}, Au{local.y}});
+                _mouseDown = true;
+                _onChange(*this, TextAction::moveTo(pos));
+                e.accept();
+            } else if (me->type == App::MouseEvent::MOVE and _mouseDown) {
+                _ensureText().layout(Au{bound().width});
+                auto local = me->pos - bound().xy;
+                auto pos = _ensureText().hitTest({Au{local.x}, Au{local.y}});
+                _onChange(*this, TextAction::selectTo(pos));
+                e.accept();
+            } else if (me->type == App::MouseEvent::RELEASE and
+                       me->button == App::MouseButton::LEFT) {
+                _mouseDown = false;
+            }
+            return;
+        }
+
         auto a = TextAction::fromEvent(e);
         if (a) {
             e.accept();
@@ -472,6 +510,8 @@ struct Input : View<Input> {
 
     Math::Vec2i size(Math::Vec2i s, Hint) override {
         auto size = _ensureText().layout(Au{s.width});
+        // NOTE: Ensure the input is always at least 1 pixel wide to show the caret.
+        size.x = max(size.x, Au{1});
         return size.ceil().cast<isize>();
     }
 };
@@ -492,6 +532,7 @@ struct SimpleInput : View<SimpleInput> {
     FocusListener _focus;
     Opt<TextModel> _model;
     Opt<Rc<Gfx::Prose>> _prose;
+    bool _mouseDown = false;
 
     SimpleInput(Gfx::ProseStyle style, String text, Send<String> onChange)
         : _style(style),
@@ -547,6 +588,32 @@ struct SimpleInput : View<SimpleInput> {
 
     void event(App::Event& e) override {
         _focus.event(*this, e);
+
+        if (auto me = e.is<App::MouseEvent>()) {
+            if (me->type == App::MouseEvent::PRESS and
+                me->button == App::MouseButton::LEFT and
+                bound().contains(me->pos)) {
+                _ensureText().layout(Au{bound().width});
+                auto local = me->pos - bound().xy;
+                auto pos = _ensureText().hitTest({Au{local.x}, Au{local.y}});
+                _mouseDown = true;
+                _ensureModel().setCursor(pos);
+                shouldRepaint(*this);
+                e.accept();
+            } else if (me->type == App::MouseEvent::MOVE and _mouseDown) {
+                _ensureText().layout(Au{bound().width});
+                auto local = me->pos - bound().xy;
+                auto pos = _ensureText().hitTest({Au{local.x}, Au{local.y}});
+                _ensureModel().setSelectionEnd(pos);
+                shouldRepaint(*this);
+                e.accept();
+            } else if (me->type == App::MouseEvent::RELEASE and
+                       me->button == App::MouseButton::LEFT) {
+                _mouseDown = false;
+            }
+            return;
+        }
+
         auto a = TextAction::fromEvent(e);
         if (a and a->op == TextAction::NEWLINE and not _style.multiline)
             a = NONE;
@@ -566,6 +633,8 @@ struct SimpleInput : View<SimpleInput> {
 
     Math::Vec2i size(Math::Vec2i s, Hint) override {
         auto size = _ensureText().layout(Au{s.width});
+        // NOTE: Ensure the input is always at least 1 pixel wide to show the caret.
+        size.x = max(size.x, Au{1});
         return size.ceil().cast<isize>();
     }
 };

src/karm-ui/reducer.cpp

@@ -23,24 +23,24 @@ struct Model {
     static constexpr auto reduce = R;
 
     template <typename X, typename... Args>
-    static Func<void(Node&)> bind(Args... args) {
+    static Send<> bind(Args... args) {
         return bindBubble<Action>(X{std::forward<Args>(args)...});
     }
 
     template <typename X>
-    static Func<void(Node&)> bind(X value) {
+    static Send<> bind(X value) {
         return bindBubble<Action>(value);
     }
 
     template <typename X, typename... Args>
-    static Opt<Func<void(Node&)>> bindIf(bool cond, Args... args) {
+    static Opt<Send<>> bindIf(bool cond, Args... args) {
         if (not cond)
             return NONE;
         return bindBubble<Action>(X{std::forward<Args>(args)...});
     }
 
     template <typename X>
-    static Opt<Func<void(Node&)>> bindIf(bool cond, X value) {
+    static Opt<Send<>> bindIf(bool cond, X value) {
         if (not cond)
             return NONE;
         return bindBubble<Action>(value);

src/karm-ui/text.cpp

@@ -46,6 +46,9 @@ export struct TextAction {
         CUT,
         PASTE,
 
+        MOVE_TO,
+        SELECT_TO,
+
         UNDO,
         REDO,
 
@@ -54,9 +57,22 @@ export struct TextAction {
 
     _Op op;
     Rune rune = {};
+    usize pos = {};
 
     TextAction(_Op op, Rune rune = 0) : op(op), rune(rune) {}
 
+    static TextAction moveTo(usize pos) {
+        TextAction a{MOVE_TO};
+        a.pos = pos;
+        return a;
+    }
+
+    static TextAction selectTo(usize pos) {
+        TextAction a{SELECT_TO};
+        a.pos = pos;
+        return a;
+    }
+
     static Opt<TextAction> fromEvent(App::Event& e) {
         if (
             auto ke = e.is<App::KeyboardEvent>();
@@ -379,6 +395,17 @@ export struct TextModel {
         return _buf.len();
     }
 
+    // MARK: Cursor API -------------------------------------------------------
+
+    void setCursor(usize pos) {
+        _cur.head = min(pos, _buf.len());
+        _cur.tail = _cur.head;
+    }
+
+    void setSelectionEnd(usize pos) {
+        _cur.head = min(pos, _buf.len());
+    }
+
     // MARK: Commands
 
     void insert(Rune rune) {
@@ -667,6 +694,14 @@ export struct TextModel {
             selectAll();
             break;
 
+        case TextAction::MOVE_TO:
+            _moveTo(a.pos);
+            break;
+
+        case TextAction::SELECT_TO:
+            _selectTo(a.pos);
+            break;
+
         case TextAction::UNDO:
             undo();
             break;