Add TemplateEditor to generate UI based on a block format string

This new component replaces StatementBlock.format_string in favour of a
more declarative API.

https://phabricator.endlessm.com/T35564

Author: dylanmccall

addons/block_code/code_generation/block_definition.gd

@@ -4,6 +4,8 @@ extends Resource
 
 const Types = preload("res://addons/block_code/types/types.gd")
 
+const FORMAT_STRING_PATTERN = "\\[(?<out_parameter>[^\\]]+)\\]|\\{(?<in_parameter>[^}]+)\\}|(?<label>[^\\{\\[]+)"
+
 @export var name: StringName
 
 ## The target node. Leaving this empty the block is considered a general block
@@ -29,6 +31,8 @@ const Types = preload("res://addons/block_code/types/types.gd")
 
 @export var extension_script: GDScript
 
+static var _display_template_regex := RegEx.create_from_string(FORMAT_STRING_PATTERN)
+
 var _extension: BlockExtension:
 	get:
 		if _extension == null and extension_script and extension_script.can_instantiate():
@@ -76,3 +80,52 @@ func get_defaults_for_node(parent_node: Node) -> Dictionary:
 
 func _to_string():
 	return "%s - %s" % [name, target_node_class]
+
+
+func get_output_parameters() -> Dictionary:
+	var result: Dictionary
+	for item in parse_display_template(display_template):
+		if item.has("out_parameter"):
+			var parameter = item.get("out_parameter")
+			result[parameter["name"]] = parameter["type"]
+	return result
+
+
+static func parse_display_template(template_string: String):
+	var items: Array[Dictionary]
+	for regex_match in _display_template_regex.search_all(template_string):
+		if regex_match.names.has("label"):
+			var label_string := regex_match.get_string("label")
+			items.append({"label": label_string})
+		elif regex_match.names.has("in_parameter"):
+			var parameter_string := regex_match.get_string("in_parameter")
+			items.append({"in_parameter": _parse_parameter_format(parameter_string)})
+		elif regex_match.names.has("out_parameter"):
+			var parameter_string := regex_match.get_string("out_parameter")
+			items.append({"out_parameter": _parse_parameter_format(parameter_string)})
+	return items
+
+
+static func _parse_parameter_format(parameter_format: String) -> Dictionary:
+	var parameter_name: String
+	var parameter_type_str: String
+	var parameter_type: Variant.Type
+	var split := parameter_format.split(":", true, 1)
+
+	if len(split) == 0:
+		return {}
+
+	if len(split) > 0:
+		parameter_name = split[0].strip_edges()
+
+	if len(split) > 1:
+		parameter_type_str = split[1].strip_edges()
+
+	if parameter_type_str:
+		parameter_type = Types.STRING_TO_VARIANT_TYPE[parameter_type_str]
+
+	return {"name": parameter_name, "type": parameter_type}
+
+
+static func has_category(block_definition, category: String) -> bool:
+	return block_definition.category == category

addons/block_code/ui/block_canvas/block_canvas.gd

@@ -153,13 +153,17 @@ func ui_tree_from_ast_node(ast_node: BlockAST.ASTNode) -> Block:
 	var block: Block = _context.block_script.instantiate_block(ast_node.data)
 
 	# Args
+	var parameter_values: Dictionary
+
 	for arg_name in ast_node.arguments:
 		var argument = ast_node.arguments[arg_name]
 		if argument is BlockAST.ASTValueNode:
 			var value_block = ui_tree_from_ast_value_node(argument)
-			block.args_to_add_after_format[arg_name] = value_block
+			parameter_values[arg_name] = value_block
 		else:  # Argument is not a node, but a user input value
-			block.args_to_add_after_format[arg_name] = argument
+			parameter_values[arg_name] = argument
+
+	block.set_parameter_values_on_ready(parameter_values)
 
 	# Children
 	var current_block: Block = block
@@ -184,13 +188,17 @@ func ui_tree_from_ast_value_node(ast_value_node: BlockAST.ASTValueNode) -> Block
 	var block: Block = _context.block_script.instantiate_block(ast_value_node.data)
 
 	# Args
+	var parameter_values: Dictionary
+
 	for arg_name in ast_value_node.arguments:
 		var argument = ast_value_node.arguments[arg_name]
 		if argument is BlockAST.ASTValueNode:
 			var value_block = ui_tree_from_ast_value_node(argument)
-			block.args_to_add_after_format[arg_name] = value_block
+			parameter_values[arg_name] = value_block
 		else:  # Argument is not a node, but a user input value
-			block.args_to_add_after_format[arg_name] = argument
+			parameter_values[arg_name] = argument
+
+	block.set_parameter_values_on_ready(parameter_values)
 
 	reconnect_block.emit(block)
 	return block
@@ -217,14 +225,14 @@ func build_ast(block: Block) -> BlockAST.ASTNode:
 	var ast_node := BlockAST.ASTNode.new()
 	ast_node.data = block.definition
 
-	for arg_name in block.arg_name_to_param_input_dict:
-		var param_input = block.arg_name_to_param_input_dict[arg_name]
-		var snap_point = param_input.snap_point
-		var snapped_block = snap_point.get_snapped_block()
-		if snapped_block:
-			ast_node.arguments[arg_name] = build_value_ast(snapped_block)
+	var parameter_values := block.get_parameter_values()
+
+	for arg_name in parameter_values:
+		var arg_value = parameter_values[arg_name]
+		if arg_value is Block:
+			ast_node.arguments[arg_name] = build_value_ast(arg_value)
 		else:
-			ast_node.arguments[arg_name] = param_input.get_raw_input()
+			ast_node.arguments[arg_name] = arg_value
 
 	var children: Array[BlockAST.ASTNode] = []
 
@@ -250,14 +258,14 @@ func build_value_ast(block: ParameterBlock) -> BlockAST.ASTValueNode:
 	var ast_node := BlockAST.ASTValueNode.new()
 	ast_node.data = block.definition
 
-	for arg_name in block.arg_name_to_param_input_dict:
-		var param_input = block.arg_name_to_param_input_dict[arg_name]
-		var snap_point = param_input.snap_point
-		var snapped_block = snap_point.get_snapped_block()
-		if snapped_block:
-			ast_node.arguments[arg_name] = build_value_ast(snapped_block)
+	var parameter_values := block.get_parameter_values()
+
+	for arg_name in parameter_values:
+		var arg_value = parameter_values[arg_name]
+		if arg_value is Block:
+			ast_node.arguments[arg_name] = build_value_ast(arg_value)
 		else:
-			ast_node.arguments[arg_name] = param_input.get_raw_input()
+			ast_node.arguments[arg_name] = arg_value
 
 	return ast_node
 

addons/block_code/ui/blocks/block/block.gd

@@ -20,6 +20,9 @@ signal modified
 ## Snap point that holds blocks that should be nested under this block
 @export var child_snap: SnapPoint = null
 
+## The resource containing the definition of the block
+@export var template_editor: TemplateEditor = null
+
 ## The scope of the block (statement of matching entry block)
 @export var scope: String = ""
 
@@ -29,10 +32,34 @@ signal modified
 ## Whether the block can be deleted by the Delete key.
 var can_delete: bool = true
 
+@onready var _context := BlockEditorContext.get_default()
+
 
 func _ready():
 	focus_mode = FocusMode.FOCUS_ALL
 	mouse_filter = Control.MOUSE_FILTER_IGNORE
+	_update_template_editor()
+
+
+func set_parameter_values_on_ready(raw_values: Dictionary):
+	await ready
+	set_parameter_values(raw_values)
+
+
+func set_parameter_values(raw_values: Dictionary):
+	template_editor.set_parameter_values(raw_values)
+
+
+func get_parameter_values() -> Dictionary:
+	return template_editor.get_parameter_values()
+
+
+func _update_template_editor():
+	if template_editor == null:
+		return
+
+	template_editor.format_string = definition.display_template if definition else ""
+	template_editor.parameter_defaults = definition.get_defaults_for_node(_context.parent_node) if definition else {}
 
 
 func _gui_input(event):
@@ -57,6 +84,10 @@ func _gui_input(event):
 			EditorInterface.popup_dialog_centered(dialog)
 
 
+func _modified():
+	modified.emit()
+
+
 func remove_from_tree():
 	var parent = get_parent()
 	if parent:
@@ -84,7 +115,7 @@ func disconnect_signals():
 
 
 func _to_string():
-	return "<{block_class}:{block_name}#{rid}>".format({"block_name": definition.name, "block_class": get_block_class(), "rid": get_instance_id()})
+	return "<{block_class}:{block_name}#{rid}>".format({"block_name": definition.name if definition else "", "block_class": get_block_class(), "rid": get_instance_id()})
 
 
 func _make_custom_tooltip(for_text) -> Control:

addons/block_code/ui/blocks/control_block/control_block.gd

@@ -3,9 +3,9 @@ class_name ControlBlock
 extends Block
 
 const Constants = preload("res://addons/block_code/ui/constants.gd")
-
-var arg_name_to_param_input_dict: Dictionary
-var args_to_add_after_format: Dictionary  # Only used when loading
+const DragDropArea = preload("res://addons/block_code/ui/blocks/utilities/drag_drop_area/drag_drop_area.gd")
+const DragDropAreaScene = preload("res://addons/block_code/ui/blocks/utilities/drag_drop_area/drag_drop_area.tscn")
+const Gutter = preload("res://addons/block_code/ui/blocks/utilities/background/gutter.gd")
 
 
 func _ready():
@@ -19,16 +19,6 @@ func _ready():
 	%SnapGutter.color = color
 	%SnapGutter.custom_minimum_size.x = Constants.CONTROL_MARGIN
 
-	format()
-
-	for arg_name in arg_name_to_param_input_dict:
-		if arg_name in args_to_add_after_format:
-			var argument = args_to_add_after_format[arg_name]
-			if argument is Block:
-				arg_name_to_param_input_dict[arg_name].snap_point.add_child(argument)
-			else:
-				arg_name_to_param_input_dict[arg_name].set_raw_input(argument)
-
 
 func _on_drag_drop_area_mouse_down():
 	_drag_started()
@@ -40,7 +30,3 @@ static func get_block_class():
 
 static func get_scene_path():
 	return "res://addons/block_code/ui/blocks/control_block/control_block.tscn"
-
-
-func format():
-	arg_name_to_param_input_dict = StatementBlock.format_string(self, %RowHBox, definition.display_template, definition.defaults)

addons/block_code/ui/blocks/control_block/control_block.tscn

@@ -1,18 +1,20 @@
-[gd_scene load_steps=6 format=3 uid="uid://bk2argmujy0kk"]
+[gd_scene load_steps=7 format=3 uid="uid://bk2argmujy0kk"]
 
 [ext_resource type="Script" path="res://addons/block_code/ui/blocks/control_block/control_block.gd" id="1_2hbir"]
 [ext_resource type="Script" path="res://addons/block_code/ui/blocks/utilities/background/gutter.gd" id="2_6o8pf"]
 [ext_resource type="PackedScene" uid="uid://c7puyxpqcq6xo" path="res://addons/block_code/ui/blocks/utilities/drag_drop_area/drag_drop_area.tscn" id="2_lpu3c"]
 [ext_resource type="Script" path="res://addons/block_code/ui/blocks/utilities/background/background.gd" id="2_tx0qr"]
 [ext_resource type="PackedScene" uid="uid://b1oge52xhjqnu" path="res://addons/block_code/ui/blocks/utilities/snap_point/snap_point.tscn" id="3_nhryi"]
+[ext_resource type="PackedScene" uid="uid://b1xvp3u11h41s" path="res://addons/block_code/ui/blocks/utilities/template_editor/template_editor.tscn" id="4_6uktl"]
 
-[node name="ControlBlock" type="MarginContainer" node_paths=PackedStringArray("bottom_snap", "child_snap")]
+[node name="ControlBlock" type="MarginContainer" node_paths=PackedStringArray("bottom_snap", "child_snap", "template_editor")]
 size_flags_horizontal = 0
 focus_mode = 2
 mouse_filter = 2
 script = ExtResource("1_2hbir")
 bottom_snap = NodePath("VBoxContainer/SnapPoint")
 child_snap = NodePath("VBoxContainer/MarginContainer/Rows/SnapContainer/SnapPoint")
+template_editor = NodePath("VBoxContainer/MarginContainer/Rows/Row/RowHBoxContainer/TemplateEditor")
 
 [node name="VBoxContainer" type="VBoxContainer" parent="."]
 layout_mode = 2
@@ -57,11 +59,9 @@ theme_override_constants/margin_top = 6
 theme_override_constants/margin_right = 12
 theme_override_constants/margin_bottom = 6
 
-[node name="RowHBox" type="HBoxContainer" parent="VBoxContainer/MarginContainer/Rows/Row/RowHBoxContainer"]
+[node name="TemplateEditor" parent="VBoxContainer/MarginContainer/Rows/Row/RowHBoxContainer" instance=ExtResource("4_6uktl")]
 unique_name_in_owner = true
 layout_mode = 2
-mouse_filter = 2
-theme_override_constants/separation = 0
 
 [node name="SnapContainer" type="MarginContainer" parent="VBoxContainer/MarginContainer/Rows"]
 unique_name_in_owner = true
@@ -95,4 +95,5 @@ shift_top = 20.0
 [node name="SnapPoint" parent="VBoxContainer" instance=ExtResource("3_nhryi")]
 layout_mode = 2
 
+[connection signal="modified" from="." to="." method="_modified"]
 [connection signal="mouse_down" from="VBoxContainer/MarginContainer/Rows/Row/DragDropArea" to="." method="_on_drag_drop_area_mouse_down"]

addons/block_code/ui/blocks/entry_block/entry_block.tscn

@@ -1,16 +1,18 @@
-[gd_scene load_steps=5 format=3 uid="uid://d2fibflv3ojys"]
+[gd_scene load_steps=6 format=3 uid="uid://d2fibflv3ojys"]
 
 [ext_resource type="Script" path="res://addons/block_code/ui/blocks/entry_block/entry_block.gd" id="2_3ik8h"]
 [ext_resource type="Script" path="res://addons/block_code/ui/blocks/utilities/background/background.gd" id="2_yrw8l"]
 [ext_resource type="PackedScene" uid="uid://c7puyxpqcq6xo" path="res://addons/block_code/ui/blocks/utilities/drag_drop_area/drag_drop_area.tscn" id="3_v0qw8"]
+[ext_resource type="PackedScene" uid="uid://b1xvp3u11h41s" path="res://addons/block_code/ui/blocks/utilities/template_editor/template_editor.tscn" id="4_1gwsm"]
 [ext_resource type="PackedScene" uid="uid://b1oge52xhjqnu" path="res://addons/block_code/ui/blocks/utilities/snap_point/snap_point.tscn" id="4_yj206"]
 
-[node name="EntryBlock" type="MarginContainer" node_paths=PackedStringArray("child_snap")]
+[node name="EntryBlock" type="MarginContainer" node_paths=PackedStringArray("child_snap", "template_editor")]
 size_flags_horizontal = 0
 focus_mode = 2
 mouse_filter = 2
 script = ExtResource("2_3ik8h")
 child_snap = NodePath("VBoxContainer/SnapPoint")
+template_editor = NodePath("VBoxContainer/TopMarginContainer/MarginContainer/TemplateEditor")
 
 [node name="VBoxContainer" type="VBoxContainer" parent="."]
 layout_mode = 2
@@ -46,14 +48,12 @@ theme_override_constants/margin_top = 6
 theme_override_constants/margin_right = 12
 theme_override_constants/margin_bottom = 6
 
-[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer/TopMarginContainer/MarginContainer"]
+[node name="TemplateEditor" parent="VBoxContainer/TopMarginContainer/MarginContainer" instance=ExtResource("4_1gwsm")]
 unique_name_in_owner = true
-custom_minimum_size = Vector2(50, 0)
 layout_mode = 2
-mouse_filter = 2
-theme_override_constants/separation = 0
 
 [node name="SnapPoint" parent="VBoxContainer" instance=ExtResource("4_yj206")]
 layout_mode = 2
 
 [connection signal="mouse_down" from="VBoxContainer/TopMarginContainer/DragDropArea" to="." method="_on_drag_drop_area_mouse_down"]
+[connection signal="modified" from="VBoxContainer/TopMarginContainer/MarginContainer/TemplateEditor" to="." method="_modified"]

addons/block_code/ui/blocks/parameter_block/parameter_block.gd

@@ -4,11 +4,10 @@ extends Block
 
 const Constants = preload("res://addons/block_code/ui/constants.gd")
 const Util = preload("res://addons/block_code/ui/util.gd")
+const ParameterOutput = preload("res://addons/block_code/ui/blocks/utilities/parameter_output/parameter_output.gd")
 
 @onready var _panel := $Panel
-@onready var _hbox := %HBoxContainer
 
-var arg_name_to_param_input_dict: Dictionary
 var args_to_add_after_format: Dictionary  # Only used when loading
 var spawned_by: ParameterOutput
 
@@ -30,16 +29,6 @@ func _ready():
 	if not Util.node_is_part_of_edited_scene(self):
 		_panel.add_theme_stylebox_override("panel", _panel_normal)
 
-	format()
-
-	for arg_name in arg_name_to_param_input_dict:
-		if arg_name in args_to_add_after_format:
-			var argument = args_to_add_after_format[arg_name]
-			if argument is Block:
-				arg_name_to_param_input_dict[arg_name].snap_point.add_child(argument)
-			else:
-				arg_name_to_param_input_dict[arg_name].set_raw_input(argument)
-
 
 func _on_drag_drop_area_mouse_down():
 	_drag_started()
@@ -53,10 +42,6 @@ static func get_scene_path():
 	return "res://addons/block_code/ui/blocks/parameter_block/parameter_block.tscn"
 
 
-func format():
-	arg_name_to_param_input_dict = StatementBlock.format_string(self, %HBoxContainer, definition.display_template, definition.defaults)
-
-
 func _on_focus_entered():
 	_panel.add_theme_stylebox_override("panel", _panel_focus)