diff --git a/crates/engine/src/cmd/edit/props.rs b/crates/engine/src/cmd/edit/props.rs index da19b1eec..2ec716818 100644 --- a/crates/engine/src/cmd/edit/props.rs +++ b/crates/engine/src/cmd/edit/props.rs @@ -267,6 +267,18 @@ pub(super) fn paint_list(s: &mut Session, p: &Value, fills: bool, add: bool) -> let doc = s.doc_mut()?; for i in ids { let n = doc.get_mut(i)?; + // A removal that names no paint among the rows shown changes nothing, the characters' own + // fills included; characters coloured differently show no rows at all ("Click + to + // replace mixed content"). + if !add { + let shown = if fills { crate::cmd::lists::character_fills(n).map_or(0, |f| f.len()) } else { n.strokes.len() }; + if index.unwrap_or(shown.saturating_sub(1)) >= shown { + continue; + } + } + if fills { + crate::cmd::lists::take_character_fills(n); + } let frameish = n.kind.is_frame_like(); let list = if fills { &mut n.fills } else { &mut n.strokes }; if add { @@ -298,6 +310,9 @@ pub(super) fn paint_set(s: &mut Session, p: &Value, fills: bool) -> Result Result Result { Ok(json!({"image": image, "width": width, "height": height, "changed": changed})) } -/// The index of a layer's top visible image fill (fills paint bottom to top). +/// The index of a layer's top visible image fill among the fills it shows (fills paint bottom to +/// top): a text's characters' shared list, so none while they are coloured differently. pub fn top_image_fill(n: &Node) -> Option { - n.fills.iter().rposition(|f| f.visible && matches!(f.kind, PaintKind::Image(_))) + crate::cmd::lists::character_fills(n)?.iter().rposition(|f| f.visible && matches!(f.kind, PaintKind::Image(_))) } fn crop(s: &mut Session, p: &Value) -> Result { @@ -197,11 +198,15 @@ fn crop(s: &mut Session, p: &Value) -> Result { let [id] = ids[..] else { return Err(refuse("select one layer to crop its image")) }; let doc = s.doc()?; let n = doc.get(id)?; + // A text's fills are its characters' (the Design panel's rows): the crop edits that list, and + // characters coloured differently have no row to crop ("Click + to replace mixed content"). + let shown = + crate::cmd::lists::character_fills(n).ok_or_else(|| refuse("the characters have different fills, so there is no one fill to crop"))?; let index = match get(p, "index") { None | Some(Value::Null) => top_image_fill(n).ok_or_else(|| refuse("the layer has no image fill to crop"))?, Some(_) => req_index(cmd, p, "index")?, }; - let mut paint = n.fills.get(index).cloned().ok_or_else(|| bad(cmd, "no fill at that index"))?; + let mut paint = shown.get(index).cloned().ok_or_else(|| bad(cmd, "no fill at that index"))?; let PaintKind::Image(img) = &mut paint.kind else { return Err(bad(cmd, "that fill is not an image")) }; // An image already in Crop mode only enters crop mode: no edit, no undo step. if img.scale_mode != ImageScaleMode::Crop { @@ -209,6 +214,8 @@ fn crop(s: &mut Session, p: &Value) -> Result { img.crop = Some(img.placement_crop(f64::from(data.width), f64::from(data.height), n.width, n.height)); img.scale_mode = ImageScaleMode::Crop; let n = s.doc_mut()?.get_mut(id)?; + // The characters' shared list becomes the layer's, so the crop shows on every one of them. + crate::cmd::lists::take_character_fills(n); if let Some(f) = n.fills.get_mut(index) { *f = paint; } diff --git a/crates/engine/src/cmd/lists.rs b/crates/engine/src/cmd/lists.rs index e53291b6d..455a02567 100644 --- a/crates/engine/src/cmd/lists.rs +++ b/crates/engine/src/cmd/lists.rs @@ -6,7 +6,7 @@ //! Every list is stored bottom first: index 0 paints (or applies) first, the last one is on top; //! the Design panel shows them in reverse, the topmost row first. -use figcraft_doc::{Document, LayoutGrid, Node, NodeId}; +use figcraft_doc::{Document, LayoutGrid, Node, NodeId, NodeKind}; use serde_json::Value; use super::{CommandSpec, ok}; @@ -189,6 +189,52 @@ fn paint_field_kept(old: &figcraft_color::Paint, new: &figcraft_color::Paint, fi } } +/// The fills a text's characters show when every character shows the same list: the layer's +/// fills, or the one list that styling all of them while editing left on them. None when the +/// characters differ, as the layer's fill is then mixed ("Text nodes can have multiple sets of +/// fills if some characters are colored differently than others", the developer documentation's +/// `fills`). Any other layer: its fills. +pub fn character_fills(n: &Node) -> Option> { + let NodeKind::Text(t) = &n.kind else { return Some(n.fills.clone()) }; + let mut spans = t.spans().into_iter().map(|(_, _, st)| st.fills.as_ref().unwrap_or(&n.fills)); + let first = spans.next().unwrap_or(&n.fills).clone(); + spans.all(|f| *f == first).then_some(first) +} + +/// Whether any character of a text carries fills of its own (on its base style or a run). +pub(crate) fn has_character_fills(n: &Node) -> bool { + match &n.kind { + NodeKind::Text(t) => t.style.fills.is_some() || t.runs.iter().any(|r| r.style.fills.is_some()), + _ => false, + } +} + +/// Before a layer-level edit of a text's fills (the Fill section, `fill.*`, `node.set`): the +/// characters' own fills go, so the edit shows on every one of them. One list they all shared +/// becomes the layer's first, so the edit starts from what the characters showed; characters +/// that differed fall back to the layer's fills, which the edit then replaces ("Click + to +/// replace mixed content"). Not a text, or no character with fills of its own: nothing changes. +pub(crate) fn take_character_fills(n: &mut Node) { + if !has_character_fills(n) { + return; + } + if let Some(shared) = character_fills(n) + && shared != n.fills + { + let old = std::mem::replace(&mut n.fills, shared); + for (i, p) in old.iter().enumerate() { + rebind_edited_paint(n, true, i, p); + } + } + if let NodeKind::Text(t) = &mut n.kind { + t.style.fills = None; + for r in &mut t.runs { + r.style.fills = None; + } + t.normalize(); + } +} + /// Where item `k` lands when the item at `from` moves to `to`. pub fn moved_index(k: usize, from: usize, to: usize) -> usize { if k == from { @@ -250,11 +296,19 @@ fn move_item(s: &mut Session, p: &Value, cmd: &str, list: BoundList) -> Result= len || to >= len || from == to { continue; } let n = s.doc_mut()?.get_mut(id)?; + if list == BoundList::Fills { + take_character_fills(n); + } let moved = match list { BoundList::Fills => reorder(&mut n.fills, from, to), BoundList::Strokes => reorder(&mut n.strokes, from, to), diff --git a/crates/engine/src/cmd/props.rs b/crates/engine/src/cmd/props.rs index e80c846f8..2e5da37bd 100644 --- a/crates/engine/src/cmd/props.rs +++ b/crates/engine/src/cmd/props.rs @@ -413,6 +413,9 @@ fn layout_mut<'a>(cmd: &str, k: &str, n: &'a mut Node) -> Result<&'a mut AutoLay /// Replace a node's fills (or strokes). Bindings on the paints whose bound values the new list /// changed let go, as an explicit edit does (see `lists::rebind_edited_paint`). fn set_paints(n: &mut Node, fills: bool, paints: Vec) { + if fills { + super::lists::take_character_fills(n); + } let old = std::mem::replace(if fills { &mut n.fills } else { &mut n.strokes }, paints); for (i, p) in old.iter().enumerate() { super::lists::rebind_edited_paint(n, fills, i, p); diff --git a/crates/engine/src/text_fill_tests.rs b/crates/engine/src/text_fill_tests.rs index 8501a6ce5..348fcc9e7 100644 --- a/crates/engine/src/text_fill_tests.rs +++ b/crates/engine/src/text_fill_tests.rs @@ -1,10 +1,94 @@ -//! Range fills on text: set on a range, cleared back to the layer's fill. +//! Range fills on text: set on a range, cleared back to the layer's fill; a layer-level fill edit +//! reaches every character. use serde_json::json; use crate::Session; +use crate::cmd::lists::character_fills; use crate::params::id_of; +/// The fill each character of `t` shows, as hex. +fn fills_shown(s: &Session, t: figcraft_doc::NodeId) -> Vec { + let n = s.doc().unwrap().node(t).unwrap().clone(); + let tx = n.kind.text().unwrap().clone(); + (0..tx.char_count()) + .map(|i| { + tx.style_at(i) + .fills + .clone() + .unwrap_or_else(|| n.fills.clone()) + .iter() + .map(|p| p.solid_color().unwrap().to_hex()) + .collect::>() + .join("+") + }) + .collect() +} + +/// A text styled on a range, or on all of its characters, keeps those fills until the layer's +/// fill is edited: then every character takes the layer's fills, in one undo step (#1856). +#[test] +fn a_layer_fill_edit_reaches_every_character() { + let mut s = Session::new(); + let t = id_of(&s.execute("text.create", &json!({"text": "Hello", "x": 0, "y": 0})).unwrap()["id"]).unwrap(); + s.execute("fill.set", &json!({"ids": [t], "color": "#FF0000"})).unwrap(); + let node = |s: &Session| s.doc().unwrap().node(t).unwrap().clone(); + assert_eq!(character_fills(&node(&s)).map(|f| f.len()), Some(1), "one shared list"); + // "ello" yellow: the characters differ, the layer's fill is mixed, the canvas keeps both. + s.execute("text.style", &json!({"id": t, "start": 1, "end": 5, "textFills": ["#FFFF00"]})).unwrap(); + assert_eq!(fills_shown(&s, t), ["FF0000", "FFFF00", "FFFF00", "FFFF00", "FFFF00"]); + assert_eq!(character_fills(&node(&s)), None, "mixed"); + s.execute("select.set", &json!({"ids": []})).unwrap(); + s.execute("select.set", &json!({"ids": [t]})).unwrap(); + assert_eq!(fills_shown(&s, t), ["FF0000", "FFFF00", "FFFF00", "FFFF00", "FFFF00"], "reselecting changes nothing"); + // The layer's fill set: every character takes it, their own fills are gone. + let steps = s.ds().unwrap().history.undo.len(); + s.execute("fill.set", &json!({"ids": [t], "color": "#0000FF"})).unwrap(); + assert_eq!(fills_shown(&s, t), ["0000FF"; 5]); + assert!(node(&s).kind.text().unwrap().runs.is_empty(), "no character keeps fills of its own"); + assert_eq!(s.ds().unwrap().history.undo.len(), steps + 1, "one undo step"); + s.undo().unwrap(); + assert_eq!(fills_shown(&s, t), ["FF0000", "FFFF00", "FFFF00", "FFFF00", "FFFF00"], "undo puts the characters' fills back"); + s.redo().unwrap(); + // All of the characters styled while editing: they share a list the layer doesn't have yet. + // A fill added at the layer goes on top of that list, not the layer's old one. + s.execute("text.style", &json!({"id": t, "start": 0, "end": 5, "textFills": ["#00FF00"]})).unwrap(); + assert_eq!(fills_shown(&s, t), ["00FF00"; 5]); + assert_eq!(character_fills(&node(&s)).map(|f| f.len()), Some(1), "one shared list, the characters'"); + assert_eq!(node(&s).fills[0].solid_color().unwrap().to_hex(), "0000FF", "the layer's own list is older"); + s.execute("fill.add", &json!({"ids": [t], "color": "#FF00FF"})).unwrap(); + assert_eq!(fills_shown(&s, t), ["00FF00+FF00FF"; 5]); + assert!(node(&s).kind.text().unwrap().runs.is_empty()); + assert_eq!(node(&s).fills.len(), 2, "the layer's list is the characters' now"); + // `node.set` with a fill, and a mixed text again: both reach every character. + s.execute("text.style", &json!({"id": t, "start": 1, "end": 5, "textFills": ["#FFFF00"]})).unwrap(); + s.execute("node.set", &json!({"id": t, "props": {"fill": "#123456"}})).unwrap(); + assert_eq!(fills_shown(&s, t), ["123456"; 5]); + // A removal that names no paint leaves the characters' own fills alone; a copy takes the fill + // the characters show, the list the Design panel's rows are. + s.execute("text.style", &json!({"id": t, "start": 1, "end": 5, "textFills": ["#FFFF00"]})).unwrap(); + s.execute("fill.remove", &json!({"ids": [t], "index": 7})).unwrap(); + assert_eq!(fills_shown(&s, t), ["123456", "FFFF00", "FFFF00", "FFFF00", "FFFF00"], "nothing removed, nothing taken"); + // Characters coloured differently show no fill rows at all: a removal with or without an + // index leaves the layer's hidden fill and the characters' own alone, and there is no row to + // crop (the command is unavailable, as the menu has it). + s.execute("fill.remove", &json!({"ids": [t], "index": 0})).unwrap(); + s.execute("fill.remove", &json!({"ids": [t]})).unwrap(); + assert_eq!(fills_shown(&s, t), ["123456", "FFFF00", "FFFF00", "FFFF00", "FFFF00"], "mixed: nothing to remove"); + assert_eq!(node(&s).fills.len(), 1, "the layer's own fill stays"); + assert!(matches!(s.execute("image.crop", &json!({"ids": [t]})), Err(crate::EngineError::Disabled(..))), "mixed: nothing to crop"); + assert_eq!(fills_shown(&s, t), ["123456", "FFFF00", "FFFF00", "FFFF00", "FFFF00"], "and nothing taken"); + assert_eq!(crate::cmd::image::top_image_fill(&node(&s)), None, "the menu finds no image to crop either"); + s.execute("text.style", &json!({"id": t, "start": 0, "end": 5, "textFills": ["#00FF00"]})).unwrap(); + s.execute("fill.copy", &json!({"id": t})).unwrap(); + let copied = s.clipboard.paint.clone().and_then(|(_, p)| p.solid_color()).map(|c| c.to_hex()); + assert_eq!(copied.as_deref(), Some("00FF00"), "the characters' fill is copied, not the layer's older one"); + // A rectangle is left alone by all of this. + let r = id_of(&s.execute("shape.rectangle", &json!({"x": 0, "y": 0, "width": 10, "height": 10})).unwrap()["id"]).unwrap(); + s.execute("fill.set", &json!({"ids": [r], "color": "#ABCDEF"})).unwrap(); + assert_eq!(character_fills(s.doc().unwrap().node(r).unwrap()).map(|f| f.len()), Some(1)); +} + #[test] fn range_fill_sets_and_clears() { let mut s = Session::new(); diff --git a/crates/ui-egui/src/canvas/handles.rs b/crates/ui-egui/src/canvas/handles.rs index 949819b03..effc6d07f 100644 --- a/crates/ui-egui/src/canvas/handles.rs +++ b/crates/ui-egui/src/canvas/handles.rs @@ -40,6 +40,15 @@ enum Drag { /// The Crop-mode image being edited: (node, fills, index, paint, image rect in the unit box). type UnitRect = (f64, f64, f64, f64); +/// The paint list a picker paint at an index belongs to on layer `n`, as the Fill section and the +/// colour picker list it: for fills, a text's characters' shared fills (`character_fills`: the +/// layer's own when the characters have none), else the layer's strokes. None when a text's +/// characters have different fills. Writes go through `fill.set`, which moves the characters' +/// list to the layer first, so the handles read and write the same paint (#1856). +fn edited_list(n: &figcraft_doc::Node, fills: bool) -> Option> { + if fills { figcraft_engine::cmd::lists::character_fills(n) } else { Some(n.strokes.clone()) } +} + /// The paint open in the colour picker, else the image fill in crop mode (while its layer is the /// selection). fn crop_target(app: &FigApp) -> Option<(NodeId, bool, usize, ImagePaint, UnitRect)> { @@ -53,7 +62,7 @@ fn crop_target(app: &FigApp) -> Option<(NodeId, bool, usize, ImagePaint, UnitRec }; let doc = app.session.doc().ok()?; let n = doc.node(id)?; - let list = if fills { &n.fills } else { &n.strokes }; + let list = edited_list(n, fills)?; let PaintKind::Image(img) = &list.get(index)?.kind else { return None }; if img.scale_mode != ImageScaleMode::Crop { return None; @@ -220,7 +229,7 @@ fn gradient_target(app: &FigApp) -> Option<(NodeId, bool, usize, figcraft_color: return None; } let n = app.session.doc().ok()?.node(id)?; - let list = if *fills { &n.fills } else { &n.strokes }; + let list = edited_list(n, *fills)?; match &list.get(*index)?.kind { PaintKind::Gradient(g) => Some((id, *fills, *index, g.clone())), _ => None, @@ -260,7 +269,7 @@ fn line_param(a: Pos2, b: Pos2, p: Pos2) -> Option<(f64, f32)> { fn set_gradient(app: &mut FigApp, id: NodeId, fills: bool, index: usize, g: figcraft_color::Gradient) { let Some(n) = app.session.doc().ok().and_then(|d| d.node(id)).cloned() else { return }; - let list = if fills { &n.fills } else { &n.strokes }; + let Some(list) = edited_list(&n, fills) else { return }; let Some(mut paint) = list.get(index).cloned() else { return }; paint.kind = PaintKind::Gradient(g); let cmd = if fills { "fill.set" } else { "stroke.set" }; @@ -684,7 +693,7 @@ fn apply(app: &mut FigApp, drag: &Drag, pos: Pos2, shift: bool) { Drag::Gradient { id, fills, index, which } => { let Some(u) = screen_to_unit(app, *id, pos) else { return }; let Some(n) = app.session.doc().ok().and_then(|d| d.node(*id)).cloned() else { return }; - let list = if *fills { &n.fills } else { &n.strokes }; + let Some(list) = edited_list(&n, *fills) else { return }; let Some(mut paint) = list.get(*index).cloned() else { return }; if let PaintKind::Gradient(g) = &mut paint.kind { match which { @@ -759,7 +768,7 @@ fn apply(app: &mut FigApp, drag: &Drag, pos: Pos2, shift: bool) { (ax.min(ax + nw), ay.min(ay + nh), ax.max(ax + nw), ay.max(ay + nh)) }; let Some(n) = app.session.doc().ok().and_then(|d| d.node(*id)).cloned() else { return }; - let list = if *fills { &n.fills } else { &n.strokes }; + let Some(list) = edited_list(&n, *fills) else { return }; let Some(mut paint) = list.get(*index).cloned() else { return }; if let PaintKind::Image(img) = &mut paint.kind { img.crop = Some(ImagePaint::crop_from_rect(r.0, r.1, r.2, r.3)); @@ -781,3 +790,6 @@ fn apply(app: &mut FigApp, drag: &Drag, pos: Pos2, shift: bool) { } } } + +#[cfg(test)] +mod character_fill_tests; diff --git a/crates/ui-egui/src/canvas/handles/character_fill_tests.rs b/crates/ui-egui/src/canvas/handles/character_fill_tests.rs new file mode 100644 index 000000000..59488cd3b --- /dev/null +++ b/crates/ui-egui/src/canvas/handles/character_fill_tests.rs @@ -0,0 +1,40 @@ +//! The canvas crop handles on a text whose characters share an image fill the layer doesn't have +//! (#1856): they show and edit the characters' image, the one the Fill section and the colour +//! picker show, not the layer's own fill at that index. + +use base64::Engine as _; +use figcraft_color::{Color, ImageScaleMode, Paint, PaintKind}; +use figcraft_engine::Session; +use serde_json::json; + +use super::crop_target; +use crate::colorpicker::PickerTarget; +use crate::layers_drag_tests::Ui; +use crate::present_tests::id; + +#[test] +fn the_crop_handles_follow_the_characters_shared_image_in_crop_mode() { + let mut s = Session::new(); + let t = id(&s.execute("text.create", &json!({"text": "Hello", "x": 0, "y": 0})).unwrap()); + s.execute("fill.set", &json!({"ids": [t.0], "color": "#00FF00"})).unwrap(); + let image = image::RgbaImage::from_pixel(40, 20, image::Rgba([200, 30, 30, 255])); + let mut png = std::io::Cursor::new(Vec::new()); + image.write_to(&mut png, image::ImageFormat::Png).unwrap(); + let data = base64::engine::general_purpose::STANDARD.encode(png.into_inner()); + s.execute("image.place", &json!({"data": data, "target": t.0, "mode": "fill"})).unwrap(); + s.execute("image.crop", &json!({"ids": [t.0], "index": 1})).unwrap(); + // The cropped image goes to the characters; the layer keeps only its green. + let cropped = s.doc().unwrap().node(t).unwrap().fills[1].clone(); + s.execute("text.style", &json!({"id": t.0, "start": 0, "end": 5, "textFills": [cropped]})).unwrap(); + s.doc_mut().unwrap().get_mut(t).unwrap().fills = vec![Paint::solid(Color::from_hex("#00FF00").unwrap())]; + let mut u = Ui::new(s); + // The picker on the Fill section's row: the characters' image, already in Crop mode. + u.app.ui.picker = Some(PickerTarget::Paint { fills: true, index: 0, ids: vec![t] }); + let (at, fills, index, img, _) = crop_target(&u.app).expect("the handles show the characters' image"); + assert_eq!((at, fills, index), (t, true, 0)); + assert_eq!(img.scale_mode, ImageScaleMode::Crop); + assert!( + matches!(u.app.session.doc().unwrap().node(t).unwrap().fills[0].kind, PaintKind::Solid { .. }), + "the layer's own fill is not what they show" + ); +} diff --git a/crates/ui-egui/src/lib.rs b/crates/ui-egui/src/lib.rs index cb80d4bbe..b31cebeda 100644 --- a/crates/ui-egui/src/lib.rs +++ b/crates/ui-egui/src/lib.rs @@ -249,6 +249,8 @@ mod text_enter_tests; #[cfg(test)] mod text_link_tests; #[cfg(test)] +mod text_mixed_fill_tests; +#[cfg(test)] mod titlebar_tests; #[cfg(test)] mod ui_params_tests; diff --git a/crates/ui-egui/src/panels/right/paints.rs b/crates/ui-egui/src/panels/right/paints.rs index 4b37b5c2a..186d09f9f 100644 --- a/crates/ui-egui/src/panels/right/paints.rs +++ b/crates/ui-egui/src/panels/right/paints.rs @@ -293,7 +293,8 @@ pub(super) fn paints(app: &mut FigApp, ui: &mut Ui, doc: &Document, sel: &[NodeI } let t = Tokens::get(ui.ctx()); let ids = sel.to_vec(); - let list = common(doc, sel, |n| if fills { n.fills.clone() } else { n.strokes.clone() }); + // A text's fills are what its characters show: one list they share, or mixed (#1856). + let list = common(doc, sel, |n| if fills { figcraft_engine::cmd::lists::character_fills(n) } else { Some(n.strokes.clone()) }).flatten(); let title = if fills { tr("Fill") } else { tr("Stroke") }; let empty = list.as_ref().is_none_or(|l| l.is_empty()); let slot = if fills { StyleSlot::Fill } else { StyleSlot::Stroke }; diff --git a/crates/ui-egui/src/text_mixed_fill_tests.rs b/crates/ui-egui/src/text_mixed_fill_tests.rs new file mode 100644 index 000000000..b494c267d --- /dev/null +++ b/crates/ui-egui/src/text_mixed_fill_tests.rs @@ -0,0 +1,107 @@ +//! The Fill section on a text whose characters were coloured while editing (#1856), driven +//! through egui headless: characters with different fills show as mixed content and + replaces +//! them on every character; characters that all share fills the layer doesn't have show those. + +use egui::accesskit::Role; +use egui::{Pos2, pos2}; +use figcraft_doc::NodeId; +use figcraft_engine::Session; +use serde_json::json; + +use crate::layers_drag_tests::Ui; + +const NOTE: &str = "Click + to replace mixed content"; + +/// A red "Hello" with its characters from `from` on coloured yellow while editing, selected. +fn ui(from: usize) -> (Ui, NodeId) { + let mut s = Session::new(); + let t = NodeId(s.execute("text.create", &json!({"text": "Hello", "x": 0, "y": 0})).unwrap()["id"].as_u64().unwrap()); + s.execute("fill.set", &json!({"ids": [t], "color": "#FF0000"})).unwrap(); + s.execute("text.style", &json!({"id": t, "start": from, "end": 5, "textFills": ["#FFFF00"]})).unwrap(); + s.execute("select.set", &json!({"ids": [t]})).unwrap(); + let mut u = Ui::new(s); + u.ctx.enable_accesskit(); + u.frame(vec![]); + (u, t) +} + +/// The accessible controls after a frame: role, label, value and centre. +fn controls(u: &mut Ui) -> Vec<(Role, String, String, Pos2)> { + u.frame(vec![]); + let out = u.frame_output(vec![]); + let nodes = out.platform_output.accesskit_update.expect("an AccessKit update").nodes; + nodes + .iter() + .map(|(_, n)| { + let at = n.bounds().map_or(pos2(0.0, 0.0), |b| pos2(((b.x0 + b.x1) / 2.0) as f32, ((b.y0 + b.y1) / 2.0) as f32)); + (n.role(), n.label().unwrap_or_default().to_string(), n.value().unwrap_or_default().to_string(), at) + }) + .collect() +} + +/// What the Fill section shows: its hex rows top first, whether the mixed-content note is there +/// (only a paint section shows it, and the strokes here are never mixed), and its + button. The +/// section's rows lie between its + and the Stroke section's; Selection colors is further down. +fn fill_section(c: &[(Role, String, String, Pos2)]) -> (Vec, bool, Pos2) { + let button = |name: &str| { + c.iter().find(|(r, l, _, _)| *r == Role::Button && l == name).map(|(_, _, _, p)| *p).unwrap_or_else(|| panic!("no {name} button: {c:?}")) + }; + let (top, bottom) = (button("Add fill"), button("Add stroke")); + let mut rows: Vec<(f32, String)> = + c.iter().filter(|(r, _, _, p)| *r == Role::TextInput && p.y > top.y && p.y < bottom.y).map(|(_, _, v, p)| (p.y, v.clone())).collect(); + rows.sort_by(|a, b| a.0.total_cmp(&b.0)); + let note = c.iter().any(|(_, l, v, _)| l == NOTE || v == NOTE); + (rows.into_iter().map(|(_, v)| v).collect(), note, top) +} + +fn fills_shown(u: &Ui, t: NodeId) -> Vec { + let n = u.app.session.doc().unwrap().node(t).unwrap().clone(); + let tx = n.kind.text().unwrap().clone(); + (0..tx.char_count()) + .map(|i| { + tx.style_at(i) + .fills + .clone() + .unwrap_or_else(|| n.fills.clone()) + .iter() + .map(|p| p.solid_color().unwrap().to_hex()) + .collect::>() + .join("+") + }) + .collect() +} + +#[test] +fn differently_coloured_characters_show_as_mixed_content_and_plus_replaces_them() { + let (mut u, t) = ui(1); + let c = controls(&mut u); + let (rows, note, plus) = fill_section(&c); + assert!(note, "the Fill section shows the note: {c:?}"); + assert!(rows.is_empty(), "no row for the layer's own red: {rows:?}"); + // + adds a fill on top of the layer's: every character shows the layer's fills now. + let steps = u.app.session.ds().unwrap().history.undo.len(); + u.button(plus, true); + u.button(plus, false); + u.frame(vec![]); + let n = u.app.session.doc().unwrap().node(t).unwrap().clone(); + assert_eq!(n.fills.len(), 2, "the new fill on the layer's: {:?}", n.fills); + assert!(n.kind.text().unwrap().runs.is_empty(), "no character keeps fills of its own"); + assert!(fills_shown(&u, t).iter().all(|f| f == "FF0000+D9D9D9"), "{:?}", fills_shown(&u, t)); + assert_eq!(u.app.session.ds().unwrap().history.undo.len(), steps + 1, "one undo step"); + let c = controls(&mut u); + let (rows, note, _) = fill_section(&c); + assert!(!note, "no note once the characters agree: {c:?}"); + assert_eq!(rows, ["D9D9D9", "FF0000"], "the new fill above the layer's red: {c:?}"); +} + +#[test] +fn characters_sharing_fills_the_layer_lacks_show_theirs() { + let (mut u, t) = ui(0); + let n = u.app.session.doc().unwrap().node(t).unwrap().clone(); + assert_eq!(n.fills[0].solid_color().unwrap().to_hex(), "FF0000", "the layer still has its old fill"); + assert_eq!(fills_shown(&u, t), ["FFFF00"; 5]); + let c = controls(&mut u); + let (rows, note, _) = fill_section(&c); + assert_eq!(rows, ["FFFF00"], "the characters' yellow is the row, not the layer's red: {c:?}"); + assert!(!note, "{c:?}"); +} diff --git a/crates/ui-egui/src/widgets/colorpicker.rs b/crates/ui-egui/src/widgets/colorpicker.rs index 6ba6af305..a24aa749b 100644 --- a/crates/ui-egui/src/widgets/colorpicker.rs +++ b/crates/ui-egui/src/widgets/colorpicker.rs @@ -92,7 +92,8 @@ fn current_paint(app: &FigApp, target: &PickerTarget) -> Option { }, PickerTarget::Paint { fills, index, ids } => { let n = doc.node(*ids.first()?)?; - let list = if *fills { &n.fills } else { &n.strokes }; + // A text's fills are its characters' (none to pick while they differ). + let list = if *fills { figcraft_engine::cmd::lists::character_fills(n)? } else { n.strokes.clone() }; list.get(*index).cloned() } PickerTarget::Effect { ids, index, secondary } => doc.node(*ids.first()?)?.effects.get(*index)?.color(*secondary).map(Paint::solid), diff --git a/docs/ui-parity.md b/docs/ui-parity.md index 6c38177bb..bbe4155c1 100644 --- a/docs/ui-parity.md +++ b/docs/ui-parity.md @@ -1,6 +1,6 @@ # UI and interaction parity -> **Last reviewed:** 2026-10-10 · **Last updated:** 2026-11-04 · **Change:** minor (a number field scrubs when dragged with Alt held, as the help center's scrub section says, not only by its label; reuse visible layer selection roots (M8); ; with a shape or frame tool chosen and nothing selected, the arrows show a placement crosshair in the middle of the view and move it, and Enter places there, as Accessibility at Figma says (#1839); text direction per paragraph: Text ▸ Text direction forces a paragraph left to right or right to left, as Add right-to-left text says (#1830), with `text.direction`, `node.set textDirection`, the Type settings control once a right-to-left script is in the text, inspect, the CSS `direction` and the `.fig` lines' `sourceDirectionality`; the boolean operation menu in the Design panel leads each entry with an original icon drawn in code, a filled preview of the result (#2003); a press on the open gradient's handles or stops on the canvas keeps the colour picker open through the drag, as its own control (#1852); a click with the Bend tool on a sharp point curves it, its handles along the line between its neighbours, as Edit vector layers says (#1875); wrap style: Auto, Balance and Pretty on a text layer decide where its lines break, as Explore text properties says (#1827), with the Type settings control, `text.wrapStyle`, `node.set wrapStyle`, inspect and the CSS `text-wrap`; Backspace or Delete at the start of a list item keeps the item's indentation level, as the lists article says; max lines on auto-width text keep it auto width, hugging that many lines, as the text properties article says; superscript and subscript are synthesised where the font has no glyphs for them, from the standard glyphs shrunk and shifted by the font's OS/2 metrics, and a run mixing available and unavailable glyphs is synthesised whole, as Explore text properties says (#1828); Alt+Enter while editing text opens the link at the caret, as the accessibility page documents; Minimize, by its shortcut or the button by the file name, collapses the navigation bar and both sidebars as the help center says, with the right sidebar back while something is selected (#1835); the interface size keys of the help center's accessibility page: Cmd/Ctrl+Shift+Alt with =, - and 0 step the interface through the Preferences sizes and back to the system's size; Cmd/Ctrl+Alt+arrows rotate the selection a degree at a time, 15 with Shift, as the help center's accessibility page says; they resized before; the Layers panel answers Ctrl+1 as well as Alt+1 on Windows and Linux, the two keys the help center gives it; the colour picker's Image tab shows a placeholder and Upload from computer, an asset preview, and a file dropped on it replaces the image, keeping the fill mode, crop and position (#1682); the keyboard's Menu key opens the context menu, as Shift+F10 does; the eyedropper with Cmd/Ctrl+Shift makes a colour style or variable of what it picks; sidebar number and text fields keep their text vertically centered when focused, including typography spacing; with the pen out, Enter or a double-click ends the path and edits the vector with the Move tool instead of drawing on (#1430); the Actions palette offers only commands that run from it, and no second row reading like a menu item: Place image opens the file dialog (#1574); Preferences ▸ Scroll wheel zoom: a mouse wheel zooms the canvas about the pointer and Cmd/Ctrl+wheel scrolls (#1390); boolean operations refuse input past their caps, and a boolean group past them draws without its result (#1104); the selection and hover outlines of rounded rectangles and frames follow their corners (#1506); colour picker review fixes for text undo, fitted sidebars, moving controls and gradient variables; Corner smoothing: an original icon and the shared number-field drag gesture, preserving fractional baselines; guides snap to layers when dragged; Crop image: Object ▸ Crop image, the right-click menu and the image fill row enter crop mode (`image.crop`, #1464); the Design panel's sections on one grid — 16 / 8 margins, 88 + 8 + 88 + 8 + 24 columns, 24 pt rows, 4 pt between a row's buttons (#858); the toolbar on one 32 pt grid, without its Resources button (#1210); colour picker LCH and OKLCH models; an XML (Android Vector Drawable) export format; Context menus: the Menu key reaches egui 0.37 but is unbound (row done → partial); the Text on a path tool; board tool keys pinned; community fixes: the text box by dragging, the font picker keys, the pen path on leaving Design, a still canvas in vector edit mode, a scrolling pages list, colour emoji, readable new text in frames, system theme on first run; the Small caps sample in Type settings drawn from capitals; recent files as cards; vector edit mode: hovering, hatching, selecting and dragging filled regions; home screen: Templates tab, first-run templates and Getting started tips; number fields: scrub rates, arrow steps, arithmetic with brackets, relative edits of mixed values; outline mode's hidden layers and object bounds; Hide when publishing; cursors per tool and modifier; panel widths; dark pages for files made in the dark theme; drag threshold and double-clicks into text in groups; rotation origin on Alt+R and placing with Enter: no documented shortcut missing; keyboard shortcut parity suite and bindings; cursor chat and spotlight in live sessions; layers and assets panels behaviour suite and fixes; vector multi-edit and the vector edit tail; canvas navigation, guides and grids behaviour suite and fixes; shapes and vector behaviour suite and fixes; paint and effects behaviour suite and fixes; frames, groups, sections and masks behaviour suite and fixes; layers panel keyboard: F2 rename, Shift+F10 context menu, F8 box selection; selection and transform behaviour suite and fixes; Display P3: gamut warning and soft-proof (true P3 blocked upstream); several windows; boolean hit testing on the result, group drags, frame outlines and slices; outlines for the selection, mask outlines; arc fields, live boolean editing, shape builder on strokes, one-sided widths; fields select their text on focus; Typography spacing icons support scrubbing (#373); CSS colour names in hex fields; a rename selects the whole name, so typing replaces it; Escape or Enter after a pen path stays on the same vector (#760); IME composition kept on through idle frames of a text edit, candidates at the caret (#747); Selection colors for mixed selections and smart-selection spacing (#753); submenus with a hover delay and a safe triangle; the Actions palette's tabs, ranked search, highlight and recents; menu items that ask for a value; editor fixes from the community batches) · **Target:** Figma Design UI3 (desktop app 126.10.7) +> **Last reviewed:** 2026-10-10 · **Last updated:** 2026-11-04 · **Change:** minor (the Fill section of a text whose characters were coloured differently while editing shows mixed content, characters that all share fills the layer doesn't have show those, and a layer-level fill edit reaches every character (#1856); a number field scrubs when dragged with Alt held, as the help center's scrub section says, not only by its label; reuse visible layer selection roots (M8); ; with a shape or frame tool chosen and nothing selected, the arrows show a placement crosshair in the middle of the view and move it, and Enter places there, as Accessibility at Figma says (#1839); text direction per paragraph: Text ▸ Text direction forces a paragraph left to right or right to left, as Add right-to-left text says (#1830), with `text.direction`, `node.set textDirection`, the Type settings control once a right-to-left script is in the text, inspect, the CSS `direction` and the `.fig` lines' `sourceDirectionality`; the boolean operation menu in the Design panel leads each entry with an original icon drawn in code, a filled preview of the result (#2003); a press on the open gradient's handles or stops on the canvas keeps the colour picker open through the drag, as its own control (#1852); a click with the Bend tool on a sharp point curves it, its handles along the line between its neighbours, as Edit vector layers says (#1875); wrap style: Auto, Balance and Pretty on a text layer decide where its lines break, as Explore text properties says (#1827), with the Type settings control, `text.wrapStyle`, `node.set wrapStyle`, inspect and the CSS `text-wrap`; Backspace or Delete at the start of a list item keeps the item's indentation level, as the lists article says; max lines on auto-width text keep it auto width, hugging that many lines, as the text properties article says; superscript and subscript are synthesised where the font has no glyphs for them, from the standard glyphs shrunk and shifted by the font's OS/2 metrics, and a run mixing available and unavailable glyphs is synthesised whole, as Explore text properties says (#1828); Alt+Enter while editing text opens the link at the caret, as the accessibility page documents; Minimize, by its shortcut or the button by the file name, collapses the navigation bar and both sidebars as the help center says, with the right sidebar back while something is selected (#1835); the interface size keys of the help center's accessibility page: Cmd/Ctrl+Shift+Alt with =, - and 0 step the interface through the Preferences sizes and back to the system's size; Cmd/Ctrl+Alt+arrows rotate the selection a degree at a time, 15 with Shift, as the help center's accessibility page says; they resized before; the Layers panel answers Ctrl+1 as well as Alt+1 on Windows and Linux, the two keys the help center gives it; the colour picker's Image tab shows a placeholder and Upload from computer, an asset preview, and a file dropped on it replaces the image, keeping the fill mode, crop and position (#1682); the keyboard's Menu key opens the context menu, as Shift+F10 does; the eyedropper with Cmd/Ctrl+Shift makes a colour style or variable of what it picks; sidebar number and text fields keep their text vertically centered when focused, including typography spacing; with the pen out, Enter or a double-click ends the path and edits the vector with the Move tool instead of drawing on (#1430); the Actions palette offers only commands that run from it, and no second row reading like a menu item: Place image opens the file dialog (#1574); Preferences ▸ Scroll wheel zoom: a mouse wheel zooms the canvas about the pointer and Cmd/Ctrl+wheel scrolls (#1390); boolean operations refuse input past their caps, and a boolean group past them draws without its result (#1104); the selection and hover outlines of rounded rectangles and frames follow their corners (#1506); colour picker review fixes for text undo, fitted sidebars, moving controls and gradient variables; Corner smoothing: an original icon and the shared number-field drag gesture, preserving fractional baselines; guides snap to layers when dragged; Crop image: Object ▸ Crop image, the right-click menu and the image fill row enter crop mode (`image.crop`, #1464); the Design panel's sections on one grid — 16 / 8 margins, 88 + 8 + 88 + 8 + 24 columns, 24 pt rows, 4 pt between a row's buttons (#858); the toolbar on one 32 pt grid, without its Resources button (#1210); colour picker LCH and OKLCH models; an XML (Android Vector Drawable) export format; Context menus: the Menu key reaches egui 0.37 but is unbound (row done → partial); the Text on a path tool; board tool keys pinned; community fixes: the text box by dragging, the font picker keys, the pen path on leaving Design, a still canvas in vector edit mode, a scrolling pages list, colour emoji, readable new text in frames, system theme on first run; the Small caps sample in Type settings drawn from capitals; recent files as cards; vector edit mode: hovering, hatching, selecting and dragging filled regions; home screen: Templates tab, first-run templates and Getting started tips; number fields: scrub rates, arrow steps, arithmetic with brackets, relative edits of mixed values; outline mode's hidden layers and object bounds; Hide when publishing; cursors per tool and modifier; panel widths; dark pages for files made in the dark theme; drag threshold and double-clicks into text in groups; rotation origin on Alt+R and placing with Enter: no documented shortcut missing; keyboard shortcut parity suite and bindings; cursor chat and spotlight in live sessions; layers and assets panels behaviour suite and fixes; vector multi-edit and the vector edit tail; canvas navigation, guides and grids behaviour suite and fixes; shapes and vector behaviour suite and fixes; paint and effects behaviour suite and fixes; frames, groups, sections and masks behaviour suite and fixes; layers panel keyboard: F2 rename, Shift+F10 context menu, F8 box selection; selection and transform behaviour suite and fixes; Display P3: gamut warning and soft-proof (true P3 blocked upstream); several windows; boolean hit testing on the result, group drags, frame outlines and slices; outlines for the selection, mask outlines; arc fields, live boolean editing, shape builder on strokes, one-sided widths; fields select their text on focus; Typography spacing icons support scrubbing (#373); CSS colour names in hex fields; a rename selects the whole name, so typing replaces it; Escape or Enter after a pen path stays on the same vector (#760); IME composition kept on through idle frames of a text edit, candidates at the caret (#747); Selection colors for mixed selections and smart-selection spacing (#753); submenus with a hover delay and a safe triangle; the Actions palette's tabs, ranked search, highlight and recents; menu items that ask for a value; editor fixes from the community batches) · **Target:** Figma Design UI3 (desktop app 126.10.7) Fine canvas control is what Figma users feel first: handles, snapping, nudging, modifier keys, drag behaviour, numeric precision. This checklist covers the tools, gestures and panels. Status: @@ -33,6 +33,7 @@ interaction feel not yet compared. | Colour picker placement and dismissal | done | Opens 8 pt beside the sidebar at the opening control, lifted to fit the screen; outside presses (including the sidebar), Escape and X close it. Reopening resets a dragged position; eyedropper sampling keeps it open, and so does a drag of the open gradient's handles or stops on the canvas (#1852). | | Colour picker image well | partial | the Image tab shows a checkered placeholder and Upload from computer until there is a file (no dialog at once); an image paint shows its asset preview; a file dropped on the open picker replaces the image, keeping the fill mode, crop, position and adjustments (`image.replace`). Layers' fills and strokes only (text ranges, styles and selection colours keep Upload). The Fill and Stroke swatches take no drop: a dragged file's position isn't known, so a drop with none goes to the open picker | | Colour picker on a new fill or stroke | done | + opens the picker on the new paint when the selection shares one paint list; on a mixed selection + adds a paint to each layer and no picker opens (#404) | +| Fill section on a text with coloured characters | done | a text's Fill section shows what its characters show: characters coloured differently while editing are mixed content ("Click + to replace mixed content", as a mixed selection; the developer documentation's `fills`: "Text nodes can have multiple sets of fills if some characters are colored differently than others"), and characters that all share fills the layer doesn't have show those. Any layer-level fill edit (a row, its picker, +, reordering, `fill.*`, `node.set`) reaches every character, starting from the list they showed; the characters' own fills go in the same undo step; the canvas gradient and crop handles show and edit the paint the row shows, the characters' own, also when their image is already in Crop mode (`text_mixed_fill_tests`, `canvas::handles::character_fill_tests`, engine `text_fill_tests`; #1856). A range selected while editing keeps its own Fill row | | Blend mode menus: the layer's (Design panel) and each paint's (colour picker) | done | Pass through and Normal are distinct (Normal isolates a group's or frame's children); paints have no pass-through; plus darker drawn exactly on the canvas | ## Layers and Assets panels @@ -180,6 +181,7 @@ in the table. `crates/ui-egui/src/shortcut_keys_tests.rs` drives the keys a look | Date | Change | Summary | |---|---|---| +| 2026-11-02 | patch | Fill section: a text whose characters were coloured differently while editing shows mixed content, as a mixed selection does ("Text nodes can have multiple sets of fills if some characters are colored differently than others", the developer documentation's `fills`); characters that all share fills the layer doesn't have (all of them styled while editing) show those instead of the layer's older list; and a layer-level fill edit (a row, its picker, +, reordering, `fill.*`, `node.set`) reaches every character, their own fills going in the same undo step. The section used to show the layer's own fill, a single colour the canvas no longer showed (#1856). Tests: `text_mixed_fill_tests`, engine `text_fill_tests`. Numbers unchanged | | 2026-11-06 | patch | M1, #2028: Edit ▸ Set default properties copied the selected layer's properties into the Paste properties clipboard and nothing else, so a new rectangle drawn afterwards was still grey (and what Copy properties had copied was lost). The defaults are now kept apart (`Session::default_props`, one set for shapes and one for text): rectangles, ellipses, polygons and stars drawn or clicked with their tools take the shape defaults (`apply_copied_props`, the same rules as Paste properties: corners only where a layer has them), and new text from the Text tool takes a text layer's fills and font and is laid out at that size. Frames, sections, slices, lines, arrows, vectors and layers made by commands keep their own look. `edit.setDefaultProperties` answers `{for: shapes|text, properties}`. Tests: `default_props_tests` (3) | | 2026-11-01 | patch | Number fields: dragging the field itself with Alt held scrubs it ("You can also hover the input field itself and hold down the modifier key: Mac: ⌥ Option Windows: Alt", Adjust alignment, rotation, position, and dimensions), with the resize cursor and the label's rates (Alt is the enabler there, so it isn't the fine rate); a click with Alt doesn't open the editor. Found by a documentation audit of the ui-parity rows. Test: `field_tests::alt_held_over_a_field_scrubs_it`. Counts unchanged | | 2026-11-02 | minor | M8: layer hierarchy backgrounds compute each visible row's selection root once, plus its immediate offscreen neighbors, rather than walking ancestors three times per row. Selection membership uses a set instead of a linear search. The scrolling regression keeps the internal seams square at viewport boundaries. Numbers unchanged. |