Add max width/height to text layers and draggable text boxes to the Text tool

editor/src/messages/frontend/frontend_message.rs

@@ -28,6 +28,8 @@ pub enum FrontendMessage {
 		text: String,
 		#[serde(rename = "lineWidth")]
 		line_width: Option<f64>,
+		#[serde(rename = "lineHeightRatio")]
+		line_height_ratio: f64,
 		#[serde(rename = "fontSize")]
 		font_size: f64,
 		color: Color,

editor/src/messages/input_mapper/input_mappings.rs

@@ -154,7 +154,9 @@ pub fn input_mappings() -> Mapping {
 		entry!(KeyDown(Escape); action_dispatch=EyedropperToolMessage::Abort),
 		//
 		// TextToolMessage
-		entry!(KeyUp(MouseLeft); action_dispatch=TextToolMessage::Interact),
+		entry!(PointerMove; action_dispatch=TextToolMessage::PointerMove { center: Alt, lock_ratio: Shift }),
+		entry!(KeyDown(MouseLeft); action_dispatch=TextToolMessage::DragStart),
+		entry!(KeyUp(MouseLeft); action_dispatch=TextToolMessage::DragStop),
 		entry!(KeyDown(Escape); action_dispatch=TextToolMessage::CommitText),
 		entry!(KeyDown(Enter); modifiers=[Accel], action_dispatch=TextToolMessage::CommitText),
 		//

editor/src/messages/portfolio/document/graph_operation/graph_operation_message.rs

@@ -95,6 +95,7 @@ pub enum GraphOperationMessage {
 		font: Font,
 		size: f64,
 		line_height_ratio: f64,
+		line_width: Option<f64>,
 		character_spacing: f64,
 		parent: LayerNodeIdentifier,
 		insert_index: usize,

editor/src/messages/portfolio/document/graph_operation/graph_operation_message_handler.rs

@@ -176,13 +176,14 @@ impl MessageHandler<GraphOperationMessage, GraphOperationMessageData<'_>> for Gr
 				font,
 				size,
 				line_height_ratio,
+				line_width,
 				character_spacing,
 				parent,
 				insert_index,
 			} => {
 				let mut modify_inputs = ModifyInputsContext::new(network_interface, responses);
 				let layer = modify_inputs.create_layer(id);
-				modify_inputs.insert_text(text, font, size, line_height_ratio, character_spacing, layer);
+				modify_inputs.insert_text(text, font, size, line_height_ratio, line_width, character_spacing, layer);
 				network_interface.move_layer_to_stack(layer, parent, insert_index, &[]);
 				responses.add(GraphOperationMessage::StrokeSet { layer, stroke: Stroke::default() });
 				responses.add(NodeGraphMessage::RunDocumentGraph);
@@ -279,7 +280,7 @@ fn import_usvg_node(modify_inputs: &mut ModifyInputsContext, node: &usvg::Node,
 		}
 		usvg::Node::Text(text) => {
 			let font = Font::new(graphene_core::consts::DEFAULT_FONT_FAMILY.to_string(), graphene_core::consts::DEFAULT_FONT_STYLE.to_string());
-			modify_inputs.insert_text(text.chunks().iter().map(|chunk| chunk.text()).collect(), font, 24., 1.2, 1., layer);
+			modify_inputs.insert_text(text.chunks().iter().map(|chunk| chunk.text()).collect(), font, 24., 1.2, None, 1., layer);
 			modify_inputs.fill_set(Fill::Solid(Color::BLACK));
 		}
 	}

editor/src/messages/portfolio/document/graph_operation/utility_types.rs

@@ -179,7 +179,7 @@ impl<'a> ModifyInputsContext<'a> {
 		}
 	}
 
-	pub fn insert_text(&mut self, text: String, font: Font, size: f64, line_height_ratio: f64, character_spacing: f64, layer: LayerNodeIdentifier) {
+	pub fn insert_text(&mut self, text: String, font: Font, size: f64, line_height_ratio: f64, line_width: Option<f64>, character_spacing: f64, layer: LayerNodeIdentifier) {
 		let stroke = resolve_document_node_type("Stroke").expect("Stroke node does not exist").default_node_template();
 		let fill = resolve_document_node_type("Fill").expect("Fill node does not exist").default_node_template();
 		let transform = resolve_document_node_type("Transform").expect("Transform node does not exist").default_node_template();
@@ -190,6 +190,7 @@ impl<'a> ModifyInputsContext<'a> {
 			Some(NodeInput::value(TaggedValue::F64(size), false)),
 			Some(NodeInput::value(TaggedValue::F64(line_height_ratio), false)),
 			Some(NodeInput::value(TaggedValue::F64(character_spacing), false)),
+			Some(NodeInput::value(TaggedValue::OptionalF64(line_width), false)),
 		]);
 
 		let text_id = NodeId::new();

editor/src/messages/portfolio/document/node_graph/document_node_definitions.rs

@@ -2115,6 +2115,7 @@ fn static_nodes() -> Vec<DocumentNodeDefinition> {
 						NodeInput::value(TaggedValue::F64(24.), false),
 						NodeInput::value(TaggedValue::F64(1.2), false),
 						NodeInput::value(TaggedValue::F64(1.), false),
+						NodeInput::value(TaggedValue::OptionalF64(None), false),
 					],
 					..Default::default()
 				},
@@ -2126,6 +2127,7 @@ fn static_nodes() -> Vec<DocumentNodeDefinition> {
 						"Size".to_string(),
 						"Line Height".to_string(),
 						"Character Spacing".to_string(),
+						"Line Width".to_string(),
 					],
 					output_names: vec!["Vector".to_string()],
 					..Default::default()

editor/src/messages/portfolio/document/node_graph/node_properties.rs

@@ -661,6 +661,26 @@ fn number_widget(document_node: &DocumentNode, node_id: NodeId, index: usize, na
 				.on_commit(commit_value)
 				.widget_holder(),
 		]),
+		Some(&TaggedValue::OptionalF64(x)) => {
+			// TODO: figure out a better default value than `100` (it is not obvious how to do this)
+			let toggle_enabled = move |checkbox_input: &CheckboxInput| TaggedValue::OptionalF64(if checkbox_input.checked { Some(100.) } else { None });
+			widgets.extend_from_slice(&[
+				Separator::new(SeparatorType::Unrelated).widget_holder(),
+				// The checkbox toggles if the value is Some or None
+				CheckboxInput::new(x.is_some())
+					.icon("Edit12px")
+					.on_update(update_value(toggle_enabled, node_id, index))
+					.on_commit(commit_value)
+					.widget_holder(),
+				Separator::new(SeparatorType::Related).widget_holder(),
+				number_props
+					.value(x)
+					.on_update(update_value(move |x: &NumberInput| TaggedValue::OptionalF64(x.value), node_id, index))
+					.disabled(x.is_none())
+					.on_commit(commit_value)
+					.widget_holder(),
+			]);
+		}
 		_ => {}
 	}
 
@@ -1734,6 +1754,7 @@ pub(crate) fn text_properties(document_node: &DocumentNode, node_id: NodeId, _co
 	let size = number_widget(document_node, node_id, 3, "Size", NumberInput::default().unit(" px").min(1.), true);
 	let line_height_ratio = number_widget(document_node, node_id, 4, "Line Height", NumberInput::default().min(0.).step(0.1), true);
 	let character_spacing = number_widget(document_node, node_id, 5, "Character Spacing", NumberInput::default().min(0.).step(0.1), true);
+	let line_width = number_widget(document_node, node_id, 6, "Line Width", NumberInput::default().unit(" px").min(1.), true);
 
 	let mut result = vec![LayoutGroup::Row { widgets: text }, LayoutGroup::Row { widgets: font }];
 	if let Some(style) = style {
@@ -1742,6 +1763,7 @@ pub(crate) fn text_properties(document_node: &DocumentNode, node_id: NodeId, _co
 	result.push(LayoutGroup::Row { widgets: size });
 	result.push(LayoutGroup::Row { widgets: line_height_ratio });
 	result.push(LayoutGroup::Row { widgets: character_spacing });
+	result.push(LayoutGroup::Row { widgets: line_width });
 	result
 }
 

editor/src/messages/portfolio/portfolio_message_handler.rs

@@ -547,6 +547,9 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageData<'_>> for PortfolioMes
 						document
 							.network_interface
 							.set_input(&InputConnector::node(*node_id, 5), NodeInput::value(TaggedValue::F64(1.), false), &[]);
+						document
+							.network_interface
+							.set_input(&InputConnector::node(*node_id, 6), NodeInput::value(TaggedValue::OptionalF64(None), false), &[]);
 					}
 
 					// Upgrade Sine, Cosine, and Tangent nodes to include a boolean input for whether the output should be in radians, which was previously the only option but is now not the default

editor/src/messages/tool/common_functionality/graph_modification_utils.rs

@@ -127,16 +127,17 @@ pub fn get_text_id(layer: LayerNodeIdentifier, network_interface: &NodeNetworkIn
 }
 
 /// Gets properties from the Text node
-pub fn get_text(layer: LayerNodeIdentifier, network_interface: &NodeNetworkInterface) -> Option<(&String, &Font, f64, f64, f64)> {
+pub fn get_text(layer: LayerNodeIdentifier, network_interface: &NodeNetworkInterface) -> Option<(&String, &Font, f64, f64, f64, Option<f64>)> {
 	let inputs = NodeGraphLayer::new(layer, network_interface).find_node_inputs("Text")?;
 
 	let Some(TaggedValue::String(text)) = &inputs[1].as_value() else { return None };
 	let Some(TaggedValue::Font(font)) = &inputs[2].as_value() else { return None };
 	let Some(&TaggedValue::F64(font_size)) = inputs[3].as_value() else { return None };
 	let Some(&TaggedValue::F64(line_height_ratio)) = inputs[4].as_value() else { return None };
 	let Some(&TaggedValue::F64(character_spacing)) = inputs[5].as_value() else { return None };
+	let Some(&TaggedValue::OptionalF64(line_width)) = inputs[6].as_value() else { return None };
 
-	Some((text, font, font_size, line_height_ratio, character_spacing))
+	Some((text, font, font_size, line_height_ratio, character_spacing, line_width))
 }
 
 pub fn get_stroke_width(layer: LayerNodeIdentifier, network_interface: &NodeNetworkInterface) -> Option<f64> {

editor/src/messages/tool/common_functionality/resize.rs

@@ -1,12 +1,10 @@
 use crate::messages::input_mapper::utility_types::input_mouse::ViewportPosition;
 use crate::messages::portfolio::document::utility_types::document_metadata::LayerNodeIdentifier;
 use crate::messages::prelude::*;
-use crate::messages::tool::common_functionality::snapping::SnapManager;
+use crate::messages::tool::common_functionality::snapping::{SnapCandidatePoint, SnapConstraint, SnapData, SnapManager, SnapTypeConfiguration};
 use crate::messages::{input_mapper::utility_types::input_keyboard::Key, portfolio::document::graph_operation::utility_types::TransformIn};
 use glam::{DAffine2, DVec2, Vec2Swizzles};
 
-use super::snapping::{SnapCandidatePoint, SnapConstraint, SnapData, SnapTypeConfiguration};
-
 #[derive(Clone, Debug, Default)]
 pub struct Resize {
 	drag_start: ViewportPosition,