guise-ui 1.0.0

//! The shared guts of every single-line text field.
//!
//! Before this existed each field drew its value as three sibling divs —
//! `before`, a 1px caret, `after` — which meant the caret landed wherever the
//! layout engine happened to break the boxes, the mouse could not point at a
//! character at all, and a value longer than the box was simply clipped. This
//! module replaces that with a real gpui [`Element`] that shapes the line
//! through the text system, so:
//!
//! - the caret sits on a glyph boundary, and the mouse can hit-test into the
//!   text (click to place, drag to select, double-click a word, triple-click
//!   the line),
//! - a long value scrolls horizontally to keep the caret in view instead of
//!   disappearing under the border,
//! - painting registers an [`ElementInputHandler`], which is the only way to
//!   get IME composition, dead keys, press-and-hold accents, the macOS
//!   character palette, and the system's own text services. A plain
//!   `on_key_down` handler cannot see any of them.
//!
//! Text entry therefore does **not** run through key handling: the platform
//! delivers it to [`EntityInputHandler::replace_text_in_range`] after the key
//! handler declines it. Key handling covers navigation, deletion, the
//! clipboard, undo, and focus movement only.
//!
//! A field opts in by implementing [`LineEditor`] and calling
//! [`line_input_handler!`] to get the platform trait for free.

use std::ops::Range;
use std::time::Duration;

use gpui::prelude::*;
use gpui::{
    fill, point, px, size, App, Bounds, ClipboardItem, Context, ElementInputHandler, Entity,
    FocusHandle, GlobalElementId, Hsla, KeyDownEvent, LayoutId, MouseDownEvent, MouseMoveEvent,
    MouseUpEvent, PaintQuad, Pixels, Point, ShapedLine, SharedString, Style, TextRun,
    UnderlineStyle, Window,
};

use super::edit::TextEdit;
use super::{apply_nav, KeyOutcome};
use crate::theme::theme;

/// What a masked field shows instead of its characters.
const MASK: char = '\u{2022}';
/// The same bullet as a string, so masking is one allocation rather than two.
const MASK_STR: &str = "\u{2022}";

/// How long the caret stays visible, then hidden. Matches the platform's own
/// text fields closely enough that the two don't visibly beat against each
/// other when both are on screen.
const BLINK: Duration = Duration::from_millis(530);

/// Breathing room kept between the caret and the field edge while scrolling,
/// so the caret never sits flush against the border.
const SCROLL_PAD: f32 = 2.0;

/// Per-field state owned by the host entity but written by the element: the
/// shaped line and bounds from the last paint (which is what hit-testing and
/// the platform's `bounds_for_range` need), the horizontal scroll offset, the
/// in-progress IME composition, and the caret blink.
#[derive(Debug, Default)]
pub struct LineState {
    /// The line as it was last shaped — masked text for a password field,
    /// the placeholder when the value is empty.
    pub(crate) shaped: Option<ShapedLine>,
    pub(crate) bounds: Option<Bounds<Pixels>>,
    /// How far the text is scrolled left, in pixels, to keep the caret visible.
    pub(crate) scroll: Pixels,
    /// The IME's in-progress composition, as a char range into the real text.
    pub(crate) marked: Option<Range<usize>>,
    /// True between mouse-down and mouse-up, while a drag extends a selection.
    pub(crate) selecting: bool,
    /// Whether the last paint masked the text, so index mapping can undo it.
    pub(crate) masked: bool,
    /// Whether the last paint showed the placeholder rather than a value.
    pub(crate) empty: bool,
    pub(crate) focused: bool,
    pub(crate) caret_on: bool,
    /// Whether a blink task is already running for this field.
    pub(crate) blinking: bool,
}

impl LineState {
    pub fn new() -> Self {
        LineState {
            caret_on: true,
            ..Default::default()
        }
    }

    /// Byte offset into the *shaped* line for a char index into the real text.
    /// The two differ when the field is masked, because one bullet stands in
    /// for one char but takes three bytes.
    fn shaped_byte(&self, edit: &TextEdit, index: usize) -> usize {
        if self.masked {
            index.min(edit.len()) * MASK.len_utf8()
        } else {
            edit.byte_of(index)
        }
    }

    /// The inverse of [`shaped_byte`](Self::shaped_byte).
    fn char_index(&self, edit: &TextEdit, byte: usize) -> usize {
        if self.masked {
            (byte / MASK.len_utf8()).min(edit.len())
        } else {
            edit.char_of(byte)
        }
    }

    /// The char index the given window-space point falls on. Returns `None`
    /// when the field hasn't been painted yet or is showing its placeholder,
    /// in which case there is nowhere to point but the start.
    pub(crate) fn index_at(&self, edit: &TextEdit, position: Point<Pixels>) -> Option<usize> {
        let (bounds, shaped) = (self.bounds?, self.shaped.as_ref()?);
        if self.empty {
            return Some(0);
        }
        let x = position.x - bounds.left() + self.scroll;
        Some(self.char_index(edit, shaped.closest_index_for_x(x)))
    }

    /// Note that something happened worth showing a solid caret for.
    fn wake(&mut self) {
        self.caret_on = true;
    }
}

/// A field that can be drawn and driven by [`Line`].
///
/// Implementors keep the buffer and the [`LineState`]; everything else — glyph
/// layout, hit-testing, scrolling, IME, the clipboard — is shared.
/// The platform trait comes along for the ride: a field that can be drawn by
/// [`Line`] is by definition one the OS can drive text into, and every
/// implementor gets it from [`line_input_handler!`].
pub trait LineEditor: 'static + Sized + gpui::EntityInputHandler {
    fn edit(&self) -> &TextEdit;
    fn edit_mut(&mut self) -> &mut TextEdit;
    fn line(&self) -> &LineState;
    fn line_mut(&mut self) -> &mut LineState;
    fn line_focus(&self) -> &FocusHandle;

    /// Show bullets instead of characters, and refuse to copy or cut.
    fn line_masked(&self) -> bool {
        false
    }

    /// Accept focus, selection, and copy, but reject every mutation.
    fn line_read_only(&self) -> bool {
        false
    }

    /// Cap on the value's length in chars, enforced on typing and on paste the
    /// way an `<input maxlength>` is.
    fn line_max_length(&self) -> Option<usize> {
        None
    }

    /// Narrow what may be entered, the way `<input type="number">` does.
    /// Returns the text to actually insert; dropping every char rejects the
    /// input. Applied to typing, IME, drops, and paste alike, so a field can't
    /// be filled with something it rejects by any route.
    fn line_filter(&self, text: String) -> String {
        text
    }

    /// Called after any mutation so the field can emit its change event. The
    /// element never calls `cx.notify` on the host's behalf; do it here.
    fn line_changed(&mut self, cx: &mut Context<Self>);
}

/// Implement gpui's [`EntityInputHandler`] for a [`LineEditor`].
///
/// The trait can't be blanket-implemented — it's foreign, and the orphan rules
/// reject an uncovered type parameter — so each field opts in by name. Every
/// body here is the same mechanical translation between the platform's UTF-16
/// offsets and the model's char indices.
macro_rules! line_input_handler {
    ($ty:ty) => {
        impl ::gpui::EntityInputHandler for $ty {
            fn text_for_range(
                &mut self,
                range_utf16: ::std::ops::Range<usize>,
                actual: &mut Option<::std::ops::Range<usize>>,
                _window: &mut ::gpui::Window,
                _cx: &mut ::gpui::Context<Self>,
            ) -> Option<String> {
                let range = $crate::input::line::from_utf16(self.edit(), &range_utf16);
                actual.replace($crate::input::line::to_utf16(self.edit(), &range));
                Some($crate::input::line::slice(self.edit(), &range))
            }

            fn selected_text_range(
                &mut self,
                _ignore_disabled: bool,
                _window: &mut ::gpui::Window,
                _cx: &mut ::gpui::Context<Self>,
            ) -> Option<::gpui::UTF16Selection> {
                Some($crate::input::line::utf16_selection(self.edit()))
            }

            fn marked_text_range(
                &self,
                _window: &mut ::gpui::Window,
                _cx: &mut ::gpui::Context<Self>,
            ) -> Option<::std::ops::Range<usize>> {
                let marked = self.line().marked.clone()?;
                Some($crate::input::line::to_utf16(self.edit(), &marked))
            }

            fn unmark_text(
                &mut self,
                _window: &mut ::gpui::Window,
                _cx: &mut ::gpui::Context<Self>,
            ) {
                self.line_mut().marked = None;
            }

            fn replace_text_in_range(
                &mut self,
                range_utf16: Option<::std::ops::Range<usize>>,
                text: &str,
                _window: &mut ::gpui::Window,
                cx: &mut ::gpui::Context<Self>,
            ) {
                $crate::input::line::replace(self, range_utf16, text, None, cx);
            }

            fn replace_and_mark_text_in_range(
                &mut self,
                range_utf16: Option<::std::ops::Range<usize>>,
                text: &str,
                selected_utf16: Option<::std::ops::Range<usize>>,
                _window: &mut ::gpui::Window,
                cx: &mut ::gpui::Context<Self>,
            ) {
                $crate::input::line::replace(self, range_utf16, text, Some(selected_utf16), cx);
            }

            fn bounds_for_range(
                &mut self,
                range_utf16: ::std::ops::Range<usize>,
                bounds: ::gpui::Bounds<::gpui::Pixels>,
                _window: &mut ::gpui::Window,
                _cx: &mut ::gpui::Context<Self>,
            ) -> Option<::gpui::Bounds<::gpui::Pixels>> {
                $crate::input::line::range_bounds(self, range_utf16, bounds)
            }

            fn character_index_for_point(
                &mut self,
                point: ::gpui::Point<::gpui::Pixels>,
                _window: &mut ::gpui::Window,
                _cx: &mut ::gpui::Context<Self>,
            ) -> Option<usize> {
                let index = self.line().index_at(self.edit(), point)?;
                Some($crate::input::line::to_utf16(self.edit(), &(0..index)).end)
            }
        }
    };
}

pub(crate) use line_input_handler;

// --- UTF-16 translation -----------------------------------------------------
//
// The platform addresses text in UTF-16 code units; the model counts chars.
// These four helpers are the only place that conversion happens.

pub(crate) fn to_utf16(edit: &TextEdit, range: &Range<usize>) -> Range<usize> {
    // Over `chars()` rather than `text()`: the platform calls these several
    // times per keystroke, and `text()` builds a fresh `String` each time.
    let buffer = edit.chars();
    let units = |chars: usize| {
        buffer[..chars.min(buffer.len())]
            .iter()
            .map(|c| c.len_utf16())
            .sum::<usize>()
    };
    units(range.start)..units(range.end)
}

pub(crate) fn from_utf16(edit: &TextEdit, range: &Range<usize>) -> Range<usize> {
    let buffer = edit.chars();
    let chars = |units: usize| {
        let mut seen = 0;
        for (index, c) in buffer.iter().enumerate() {
            if seen >= units {
                return index;
            }
            seen += c.len_utf16();
        }
        buffer.len()
    };
    chars(range.start)..chars(range.end)
}

pub(crate) fn slice(edit: &TextEdit, range: &Range<usize>) -> String {
    let buffer = edit.chars();
    let start = range.start.min(buffer.len());
    let end = range.end.clamp(start, buffer.len());
    buffer[start..end].iter().collect()
}

pub(crate) fn utf16_selection(edit: &TextEdit) -> gpui::UTF16Selection {
    let (start, end) = edit.selection().unwrap_or((edit.cursor(), edit.cursor()));
    let reversed = edit.cursor() == start && start != end;
    gpui::UTF16Selection {
        range: to_utf16(edit, &(start..end)),
        reversed,
    }
}

/// A single-line field never holds a line break, exactly like `<input>`, which
/// flattens them out of anything pasted or dropped into it. Other control
/// characters would render as nothing useful, so they go too — and this is
/// also what makes it impossible for a stray `\t` to be typed.
fn flatten(text: &str) -> String {
    text.chars()
        .map(|c| if c == '\n' || c == '\r' { ' ' } else { c })
        .filter(|c| !c.is_control())
        .collect()
}

/// The shared body of `replace_text_in_range` and its marked-text sibling.
/// `marking` is `Some(selection)` when the IME is mid-composition.
pub(crate) fn replace<V: LineEditor>(
    this: &mut V,
    range_utf16: Option<Range<usize>>,
    text: &str,
    marking: Option<Option<Range<usize>>>,
    cx: &mut Context<V>,
) {
    if this.line_read_only() {
        return;
    }
    let text = this.line_filter(flatten(text));

    let range = range_utf16
        .map(|r| from_utf16(this.edit(), &r))
        .or_else(|| this.line().marked.clone())
        .unwrap_or_else(|| {
            this.edit()
                .selection()
                .map(|(s, e)| s..e)
                .unwrap_or_else(|| this.edit().cursor()..this.edit().cursor())
        });

    // `maxlength` counts what would remain, so a replacement that swaps a
    // selection for something the same size always fits.
    let text = match this.line_max_length() {
        Some(max) => {
            let kept = this.edit().len() - range.len().min(this.edit().len());
            text.chars().take(max.saturating_sub(kept)).collect()
        }
        None => text,
    };

    let start = range.start;
    this.edit_mut().replace_range(range, &text);
    match marking {
        Some(selection) => {
            let end = start + text.chars().count();
            this.line_mut().marked = (!text.is_empty()).then_some(start..end);
            if let Some(selection) = selection {
                let selection = from_utf16(this.edit(), &selection);
                this.edit_mut()
                    .set_selection(start + selection.start, start + selection.end);
            }
        }
        None => this.line_mut().marked = None,
    }
    this.line_mut().wake();
    this.line_changed(cx);
}

/// Where a char range sits on screen, for the IME's candidate window.
pub(crate) fn range_bounds<V: LineEditor>(
    this: &V,
    range_utf16: Range<usize>,
    bounds: Bounds<Pixels>,
) -> Option<Bounds<Pixels>> {
    let shaped = this.line().shaped.as_ref()?;
    let range = from_utf16(this.edit(), &range_utf16);
    let x = |index: usize| {
        bounds.left() + shaped.x_for_index(this.line().shaped_byte(this.edit(), index))
            - this.line().scroll
    };
    Some(Bounds::from_corners(
        point(x(range.start), bounds.top()),
        point(x(range.end), bounds.bottom()),
    ))
}

// --- mouse ------------------------------------------------------------------

/// Focus the field and place (or extend) the selection where the user clicked.
/// Click counts follow the platform convention a browser also uses: one places
/// the caret, two takes the word, three takes the whole value.
pub(crate) fn mouse_down<V: LineEditor>(
    this: &mut V,
    event: &MouseDownEvent,
    window: &mut Window,
    cx: &mut Context<V>,
) {
    window.focus(this.line_focus());
    let Some(index) = this.line().index_at(this.edit(), event.position) else {
        cx.notify();
        return;
    };
    match event.click_count {
        1 if event.modifiers.shift => this.edit_mut().extend_to(index),
        1 => this.edit_mut().set_cursor(index),
        2 => {
            let (start, end) = this.edit().word_at(index);
            this.edit_mut().set_selection(start, end);
        }
        _ => this.edit_mut().select_all(),
    }
    this.line_mut().selecting = true;
    this.line_mut().wake();
    cx.notify();
}

/// Extend the selection while the button is held.
pub(crate) fn mouse_move<V: LineEditor>(
    this: &mut V,
    event: &MouseMoveEvent,
    _window: &mut Window,
    cx: &mut Context<V>,
) {
    if !this.line().selecting {
        return;
    }
    if let Some(index) = this.line().index_at(this.edit(), event.position) {
        this.edit_mut().extend_to(index);
        cx.notify();
    }
}

pub(crate) fn mouse_up<V: LineEditor>(
    this: &mut V,
    _event: &MouseUpEvent,
    _window: &mut Window,
    cx: &mut Context<V>,
) {
    if this.line().selecting {
        this.line_mut().selecting = false;
        cx.notify();
    }
}

/// Attach the mouse handling every field shares, and mark it a text surface.
///
/// The four handlers have to travel together — a selection drag that only
/// registers `on_mouse_up` and not `on_mouse_up_out` never ends when the
/// pointer leaves the field — so they are applied in one place rather than
/// copied into each field's `render`. Fields that need more (a picker that
/// also opens its list) add their own handler after; gpui runs both.
pub(crate) fn wire<V: LineEditor>(
    element: gpui::Stateful<gpui::Div>,
    focus: &FocusHandle,
    cx: &mut Context<V>,
) -> gpui::Stateful<gpui::Div> {
    element
        .track_focus(focus)
        .cursor(gpui::CursorStyle::IBeam)
        .on_mouse_down(gpui::MouseButton::Left, cx.listener(mouse_down))
        .on_mouse_move(cx.listener(mouse_move))
        .on_mouse_up(gpui::MouseButton::Left, cx.listener(mouse_up))
        .on_mouse_up_out(gpui::MouseButton::Left, cx.listener(mouse_up))
}

/// Give a field the Tab-order and focus accessors every form control needs.
///
/// These were copy-pasted into three fields and simply absent from the other
/// four, which left half the inputs in the Tab ring with no way for a host to
/// order them or focus them on open.
macro_rules! line_focus_builders {
    ($ty:ty) => {
        impl $ty {
            /// Where this field sits in the window's Tab order. Fields default
            /// to 0, which walks them in render order; set this only to
            /// override that.
            pub fn tab_index(mut self, index: isize) -> Self {
                self.focus = self.focus.clone().tab_index(index);
                self
            }

            /// Leave the field out of the Tab order without disabling it.
            pub fn tab_stop(mut self, tab_stop: bool) -> Self {
                self.focus = self.focus.clone().tab_stop(tab_stop);
                self
            }

            /// The field's focus handle, so a host can focus it on open.
            pub fn focus_handle(&self) -> ::gpui::FocusHandle {
                self.focus.clone()
            }
        }
    };
}

pub(crate) use line_focus_builders;

// --- keyboard ---------------------------------------------------------------

/// The keys a single-line field handles itself: the clipboard, undo, focus
/// movement, then navigation and deletion via
/// [`apply_nav`](super::apply_nav).
///
/// Printable input is deliberately absent. Returning [`KeyOutcome::Pass`] for
/// it lets the platform hand the key to the input handler instead, which is
/// what makes dead keys, IME composition, and press-and-hold work.
pub(crate) fn keys<V: LineEditor>(
    this: &mut V,
    event: &KeyDownEvent,
    window: &mut Window,
    cx: &mut Context<V>,
) -> KeyOutcome {
    let ks = &event.keystroke;
    let m = &ks.modifiers;

    // Tab is focus movement, never a character. Without this the platform
    // reports a `\t` for it and the field would type one, which is the one
    // behaviour every HTML form gets right for free.
    if ks.key == "tab" && !m.platform && !m.control {
        if m.shift {
            window.focus_prev();
        } else {
            window.focus_next();
        }
        cx.stop_propagation();
        return KeyOutcome::Edited;
    }

    if m.platform && !m.alt && !m.control {
        match ks.key.as_str() {
            "c" => return copy(this, cx),
            "x" => return cut(this, cx),
            "v" => return paste(this, cx),
            "z" if m.shift => return history(this, false, cx),
            "z" => return history(this, true, cx),
            "y" => return history(this, false, cx),
            _ => {}
        }
    }

    if this.line_read_only() && mutates(ks.key.as_str()) {
        return KeyOutcome::Pass;
    }

    let outcome = apply_nav(this.edit_mut(), ks);
    if outcome == KeyOutcome::Edited {
        this.line_mut().wake();
    }
    outcome
}

/// Whether a key would change the text, for the read-only check.
fn mutates(key: &str) -> bool {
    matches!(key, "backspace" | "delete" | "k")
}

fn copy<V: LineEditor>(this: &mut V, cx: &mut Context<V>) -> KeyOutcome {
    if !this.line_masked() {
        if let Some(text) = this.edit().selected_text() {
            cx.write_to_clipboard(ClipboardItem::new_string(text));
        }
    }
    cx.stop_propagation();
    KeyOutcome::Pass
}

fn cut<V: LineEditor>(this: &mut V, cx: &mut Context<V>) -> KeyOutcome {
    if this.line_masked() || this.line_read_only() {
        cx.stop_propagation();
        return KeyOutcome::Pass;
    }
    let Some(text) = this.edit().selected_text() else {
        cx.stop_propagation();
        return KeyOutcome::Pass;
    };
    cx.write_to_clipboard(ClipboardItem::new_string(text));
    this.edit_mut().delete_selection();
    this.line_mut().wake();
    cx.stop_propagation();
    KeyOutcome::Edited
}

fn paste<V: LineEditor>(this: &mut V, cx: &mut Context<V>) -> KeyOutcome {
    if this.line_read_only() {
        cx.stop_propagation();
        return KeyOutcome::Pass;
    }
    let Some(text) = cx.read_from_clipboard().and_then(|item| item.text()) else {
        cx.stop_propagation();
        return KeyOutcome::Pass;
    };
    let text = this.line_filter(flatten(&text));
    let text = match this.line_max_length() {
        Some(max) => {
            let selected = this.edit().selection().map_or(0, |(s, e)| e - s);
            let room = max.saturating_sub(this.edit().len() - selected);
            text.chars().take(room).collect()
        }
        None => text,
    };
    this.edit_mut().break_undo();
    this.edit_mut().insert(&text);
    this.edit_mut().break_undo();
    this.line_mut().wake();
    cx.stop_propagation();
    KeyOutcome::Edited
}

fn history<V: LineEditor>(this: &mut V, undo: bool, cx: &mut Context<V>) -> KeyOutcome {
    if this.line_read_only() {
        cx.stop_propagation();
        return KeyOutcome::Pass;
    }
    let changed = if undo {
        this.edit_mut().undo()
    } else {
        this.edit_mut().redo()
    };
    this.line_mut().wake();
    cx.stop_propagation();
    if changed {
        KeyOutcome::Edited
    } else {
        KeyOutcome::Pass
    }
}

// --- the element ------------------------------------------------------------

/// The text, caret, and selection of a single-line field.
///
/// Give it the entity that owns the buffer and the colors already resolved
/// from the theme; it handles the rest. Put it inside the field's chrome —
/// it fills the width it is given and is one line tall.
pub struct Line<V: LineEditor> {
    field: Entity<V>,
    placeholder: SharedString,
    /// Only the placeholder's color varies between fields — a picker that has
    /// a value shows it in the text color rather than dimmed. The rest is the
    /// theme's, resolved at paint.
    placeholder_color: Option<Hsla>,
}

impl<V: LineEditor> Line<V> {
    pub fn new(field: Entity<V>) -> Self {
        Line {
            field,
            placeholder: SharedString::default(),
            placeholder_color: None,
        }
    }

    /// Text to show while the field is empty, and the color to show it in.
    pub fn placeholder(mut self, placeholder: impl Into<SharedString>, color: Hsla) -> Self {
        self.placeholder = placeholder.into();
        self.placeholder_color = Some(color);
        self
    }
}

/// What `prepaint` worked out for `paint` to draw.
pub struct LinePrepaint {
    shaped: Option<ShapedLine>,
    caret: Option<PaintQuad>,
    selection: Option<PaintQuad>,
    scroll: Pixels,
}

impl<V: LineEditor> IntoElement for Line<V> {
    type Element = Self;

    fn into_element(self) -> Self::Element {
        self
    }
}

impl<V: LineEditor> Element for Line<V> {
    type RequestLayoutState = ();
    type PrepaintState = LinePrepaint;

    fn id(&self) -> Option<gpui::ElementId> {
        None
    }

    fn source_location(&self) -> Option<&'static std::panic::Location<'static>> {
        None
    }

    fn request_layout(
        &mut self,
        _id: Option<&GlobalElementId>,
        _inspector: Option<&gpui::InspectorElementId>,
        window: &mut Window,
        cx: &mut App,
    ) -> (LayoutId, ()) {
        let mut style = Style::default();
        style.size.width = gpui::relative(1.0).into();
        style.size.height = window.line_height().into();
        (window.request_layout(style, [], cx), ())
    }

    fn prepaint(
        &mut self,
        _id: Option<&GlobalElementId>,
        _inspector: Option<&gpui::InspectorElementId>,
        bounds: Bounds<Pixels>,
        _layout: &mut (),
        window: &mut Window,
        cx: &mut App,
    ) -> LinePrepaint {
        // The field's visuals are the theme's, so they are read here rather
        // than threaded through `Line::new` by seven callers that all passed
        // the same three values.
        let t = theme(cx);
        let text_color = t.text().hsla();
        let caret_color = t.primary().hsla();
        let selection_color = t.selection();
        let dimmed = t.dimmed().hsla();

        let focused = self.field.read(cx).line_focus().is_focused(window);
        let field = self.field.read(cx);
        let masked = field.line_masked();
        let empty = field.edit().is_empty();
        let cursor = field.edit().cursor();
        let selection = field.edit().selection();
        let marked = field.line().marked.clone();
        let chars = field.edit().len();
        let caret_on = field.line().caret_on;

        // Built per branch rather than up front: a masked field would otherwise
        // allocate and copy the whole cleartext buffer every frame only to
        // throw it away, and an empty one would build an empty `String`.
        let display: SharedString = if empty {
            self.placeholder.clone()
        } else if masked {
            SharedString::from(MASK_STR.repeat(chars))
        } else {
            SharedString::from(field.edit().text())
        };

        let style = window.text_style();
        let font_size = style.font_size.to_pixels(window.rem_size());
        let color = if empty {
            self.placeholder_color.unwrap_or(dimmed)
        } else {
            text_color
        };
        let run = TextRun {
            len: display.len(),
            font: style.font(),
            color,
            background_color: None,
            underline: None,
            strikethrough: None,
        };

        // The IME underlines what it is still composing, so the user can see
        // which characters are provisional.
        let runs = match marked.filter(|_| !empty) {
            Some(marked) => {
                // Runs have to cover the shaped string exactly — the text
                // system sums their lengths and slices the string by the
                // total, so an over-long run is a panic, not a mis-draw. The
                // marked range is the IME's view of the text and can outlive
                // an edit that shortened it, so clamp rather than trust it.
                let limit = display.len();
                let byte = |index: usize| {
                    if masked {
                        index.saturating_mul(MASK.len_utf8())
                    } else {
                        byte_of(&display, index)
                    }
                    .min(limit)
                };
                let start = byte(marked.start);
                let end = byte(marked.end).max(start);
                vec![
                    TextRun {
                        len: start,
                        ..run.clone()
                    },
                    TextRun {
                        len: end.saturating_sub(start),
                        underline: Some(UnderlineStyle {
                            color: Some(color),
                            thickness: px(1.0),
                            wavy: false,
                        }),
                        ..run.clone()
                    },
                    TextRun {
                        len: display.len().saturating_sub(end),
                        ..run
                    },
                ]
                .into_iter()
                .filter(|run| run.len > 0)
                .collect()
            }
            None => vec![run],
        };

        // Cloning a `SharedString` is a refcount bump, so the shaped copy and
        // the one the offsets are measured against are the same allocation.
        let shaped = window
            .text_system()
            .shape_line(display.clone(), font_size, &runs, None);

        // Scroll so the caret stays inside the field. Anchoring on the caret
        // rather than the text means a long value slides under the border on
        // whichever side the user is not looking at.
        // Measured against the shaped string, which is the value itself when
        // it isn't masked — so no second copy of it has to be kept alive.
        let byte = |index: usize| {
            if masked {
                index.saturating_mul(MASK.len_utf8())
            } else {
                byte_of(&display, index)
            }
        };
        let caret_x = if empty {
            px(0.0)
        } else {
            shaped.x_for_index(byte(cursor))
        };
        let width = bounds.size.width;
        let pad = px(SCROLL_PAD);
        let mut scroll = self.field.read(cx).line().scroll;
        // Never scroll past the end: shrinking the value should pull the text
        // back rather than leave the field looking empty.
        scroll = scroll.min((shaped.width - width + pad).max(px(0.0)));
        if caret_x - scroll > width - pad {
            scroll = caret_x - width + pad;
        }
        if caret_x - scroll < px(0.0) {
            scroll = caret_x;
        }
        scroll = scroll.max(px(0.0));

        let quads = if focused && !empty {
            match selection {
                Some((start, end)) => (
                    None,
                    Some(fill(
                        Bounds::from_corners(
                            point(
                                bounds.left() + shaped.x_for_index(byte(start)) - scroll,
                                bounds.top(),
                            ),
                            point(
                                bounds.left() + shaped.x_for_index(byte(end)) - scroll,
                                bounds.bottom(),
                            ),
                        ),
                        selection_color,
                    )),
                ),
                None => (caret_quad(bounds, caret_x - scroll, caret_color), None),
            }
        } else if focused {
            (caret_quad(bounds, caret_x - scroll, caret_color), None)
        } else {
            (None, None)
        };

        self.field.update(cx, |field, cx| {
            let state = field.line_mut();
            state.scroll = scroll;
            state.masked = masked;
            state.empty = empty;
            if state.focused != focused {
                state.focused = focused;
                state.caret_on = true;
            }
            // One blink task per focused field, started the first frame it
            // holds focus and stopped by the task itself when it loses it.
            if focused && !state.blinking {
                state.blinking = true;
                blink(cx);
            }
        });

        LinePrepaint {
            shaped: Some(shaped),
            caret: quads.0.filter(|_| caret_on),
            selection: quads.1,
            scroll,
        }
    }

    fn paint(
        &mut self,
        _id: Option<&GlobalElementId>,
        _inspector: Option<&gpui::InspectorElementId>,
        bounds: Bounds<Pixels>,
        _layout: &mut (),
        prepaint: &mut LinePrepaint,
        window: &mut Window,
        cx: &mut App,
    ) {
        let focus = self.field.read(cx).line_focus().clone();
        window.handle_input(
            &focus,
            ElementInputHandler::new(bounds, self.field.clone()),
            cx,
        );

        let shaped = prepaint.shaped.take().unwrap_or_default();
        let origin = point(bounds.origin.x - prepaint.scroll, bounds.origin.y);
        // Clip to the field: scrolled text would otherwise paint over the
        // border and whatever sits beside it.
        window.with_content_mask(Some(gpui::ContentMask { bounds }), |window| {
            if let Some(selection) = prepaint.selection.take() {
                window.paint_quad(selection);
            }
            shaped.paint(origin, window.line_height(), window, cx).ok();
            if let Some(caret) = prepaint.caret.take() {
                window.paint_quad(caret);
            }
        });

        self.field.update(cx, |field, _| {
            let state = field.line_mut();
            state.shaped = Some(shaped);
            state.bounds = Some(bounds);
        });
    }
}

fn caret_quad(bounds: Bounds<Pixels>, x: Pixels, color: Hsla) -> Option<PaintQuad> {
    Some(fill(
        Bounds::new(
            point(bounds.left() + x, bounds.top()),
            size(px(1.0), bounds.size.height),
        ),
        color,
    ))
}

/// Byte offset of a char index into `text`.
fn byte_of(text: &str, index: usize) -> usize {
    text.char_indices()
        .nth(index)
        .map(|(byte, _)| byte)
        .unwrap_or(text.len())
}

/// Toggle the caret while the field holds focus. The task ends itself the
/// first tick after focus is lost, so nothing has to be cancelled.
fn blink<V: LineEditor>(cx: &mut Context<V>) {
    cx.spawn(async move |field, cx| loop {
        cx.background_executor().timer(BLINK).await;
        let running = field
            .update(cx, |field, cx| {
                let state = field.line_mut();
                if !state.focused {
                    state.blinking = false;
                    state.caret_on = true;
                    cx.notify();
                    return false;
                }
                state.caret_on = !state.caret_on;
                cx.notify();
                true
            })
            .unwrap_or(false);
        if !running {
            break;
        }
    })
    .detach();
}