Add new icons to all menu bar entries

.vscode/settings.json

@@ -43,7 +43,8 @@
 		"css-unused-selector": "ignore",
 		"vite-plugin-svelte-css-no-scopable-elements": "ignore",
 		"a11y-no-static-element-interactions": "ignore",
-		"a11y-no-noninteractive-element-interactions": "ignore"
+		"a11y-no-noninteractive-element-interactions": "ignore",
+		"a11y-click-events-have-key-events": "ignore"
 	},
 	// VS Code config
 	"html.format.wrapLineLength": 200,

editor/src/dispatcher.rs

@@ -211,10 +211,18 @@ impl Dispatcher {
 					let ipp = &self.message_handlers.input_preprocessor_message_handler;
 					let preferences = &self.message_handlers.preferences_message_handler;
 					let current_tool = &self.message_handlers.tool_message_handler.tool_state.tool_data.active_tool_type;
+					let message_logging_verbosity = self.message_handlers.debug_message_handler.message_logging_verbosity;
 
-					self.message_handlers
+					self.message_handlers.portfolio_message_handler.process_message(
-						.portfolio_message_handler
+						message,
-						.process_message(message, &mut queue, PortfolioMessageData { ipp, preferences, current_tool });
+						&mut queue,
+						PortfolioMessageData {
+							ipp,
+							preferences,
+							current_tool,
+							message_logging_verbosity,
+						},
+					);
 				}
 				Message::Preferences(message) => {
 					self.message_handlers.preferences_message_handler.process_message(message, &mut queue, ());

editor/src/messages/debug/utility_types.rs

@@ -1,4 +1,4 @@
-#[derive(Debug, Default, Clone, Copy)]
+#[derive(Debug, Default, Clone, Copy, Eq, PartialEq)]
 pub enum MessageLoggingVerbosity {
 	#[default]
 	Off,

editor/src/messages/dialog/simple_dialogs/demo_artwork_dialog.rs

@@ -30,25 +30,25 @@ impl LayoutHolder for DemoArtworkDialog {
 		let mut rows_of_images_with_buttons: Vec<_> = ARTWORK
 			.chunks(3)
 			.flat_map(|chunk| {
-				let images = chunk.iter().map(|(_, thumbnail, _)| ImageLabel::new(*thumbnail).width(Some("256px".into())).widget_holder()).collect();
+				fn make_dialog(name: &str, filename: &str) -> Message {
+					DialogMessage::CloseDialogAndThen {
+						followups: vec![FrontendMessage::TriggerFetchAndOpenDocument {
+							name: name.to_string(),
+							filename: filename.to_string(),
+						}
+						.into()],
+					}
+					.into()
+				}
+
+				let images = chunk
+					.iter()
+					.map(|(name, thumbnail, filename)| ImageButton::new(*thumbnail).width(Some("256px".into())).on_update(|_| make_dialog(name, filename)).widget_holder())
+					.collect();
 
 				let buttons = chunk
 					.iter()
-					.map(|(name, _, filename)| {
+					.map(|(name, _, filename)| TextButton::new(*name).min_width(256).flush(true).on_update(|_| make_dialog(name, filename)).widget_holder())
-						TextButton::new(*name)
-							.min_width(256)
-							.on_update(|_| {
-								DialogMessage::CloseDialogAndThen {
-									followups: vec![FrontendMessage::TriggerFetchAndOpenDocument {
-										name: name.to_string(),
-										filename: filename.to_string(),
-									}
-									.into()],
-								}
-								.into()
-							})
-							.widget_holder()
-					})
 					.collect();
 
 				vec![LayoutGroup::Row { widgets: images }, LayoutGroup::Row { widgets: buttons }, LayoutGroup::Row { widgets: vec![] }]

editor/src/messages/layout/layout_message_handler.rs

@@ -201,10 +201,18 @@ impl LayoutMessageHandler {
 					WidgetValueAction::Commit => (icon_button.on_commit.callback)(&()),
 					WidgetValueAction::Update => (icon_button.on_update.callback)(icon_button),
 				};
+
+				responses.add(callback_message);
+			}
+			Widget::ImageButton(image_label) => {
+				let callback_message = match action {
+					WidgetValueAction::Commit => (image_label.on_commit.callback)(&()),
+					WidgetValueAction::Update => (image_label.on_update.callback)(&()),
+				};
+
 				responses.add(callback_message);
 			}
 			Widget::IconLabel(_) => {}
-			Widget::ImageLabel(_) => {}
 			Widget::InvisibleStandinInput(invisible) => {
 				let callback_message = match action {
 					WidgetValueAction::Commit => (invisible.on_commit.callback)(&()),

editor/src/messages/layout/utility_types/layout_widget.rs

@@ -333,7 +333,7 @@ impl LayoutGroup {
 				Widget::FontInput(x) => &mut x.tooltip,
 				Widget::IconButton(x) => &mut x.tooltip,
 				Widget::IconLabel(x) => &mut x.tooltip,
-				Widget::ImageLabel(x) => &mut x.tooltip,
+				Widget::ImageButton(x) => &mut x.tooltip,
 				Widget::NumberInput(x) => &mut x.tooltip,
 				Widget::ParameterExposeButton(x) => &mut x.tooltip,
 				Widget::PopoverButton(x) => &mut x.tooltip,
@@ -504,7 +504,7 @@ pub enum Widget {
 	FontInput(FontInput),
 	IconButton(IconButton),
 	IconLabel(IconLabel),
-	ImageLabel(ImageLabel),
+	ImageButton(ImageButton),
 	InvisibleStandinInput(InvisibleStandinInput),
 	NodeCatalog(NodeCatalog),
 	NumberInput(NumberInput),
@@ -579,8 +579,8 @@ impl DiffUpdate {
 				Widget::ParameterExposeButton(widget) => Some((&mut widget.tooltip, &mut widget.tooltip_shortcut)),
 				Widget::PopoverButton(widget) => Some((&mut widget.tooltip, &mut widget.tooltip_shortcut)),
 				Widget::TextButton(widget) => Some((&mut widget.tooltip, &mut widget.tooltip_shortcut)),
+				Widget::ImageButton(widget) => Some((&mut widget.tooltip, &mut widget.tooltip_shortcut)),
 				Widget::IconLabel(_)
-				| Widget::ImageLabel(_)
 				| Widget::CurveInput(_)
 				| Widget::InvisibleStandinInput(_)
 				| Widget::NodeCatalog(_)

editor/src/messages/layout/utility_types/widgets/button_widgets.rs

@@ -1,6 +1,7 @@
 use crate::messages::input_mapper::utility_types::misc::ActionKeys;
 use crate::messages::layout::utility_types::widget_prelude::*;
 use crate::messages::portfolio::document::node_graph::utility_types::FrontendGraphDataType;
+use crate::messages::tool::tool_messages::tool_prelude::WidgetCallback;
 
 use graphene_std::vector::style::FillChoice;
 use graphite_proc_macros::WidgetBuilder;
@@ -120,6 +121,31 @@ pub struct TextButton {
 	pub on_commit: WidgetCallback<()>,
 }
 
+#[derive(Clone, serde::Serialize, serde::Deserialize, Derivative, Default, WidgetBuilder, specta::Type)]
+#[derivative(Debug, PartialEq)]
+pub struct ImageButton {
+	#[widget_builder(constructor)]
+	pub image: String,
+
+	pub width: Option<String>,
+
+	pub height: Option<String>,
+
+	pub tooltip: String,
+
+	#[serde(skip)]
+	pub tooltip_shortcut: Option<ActionKeys>,
+
+	// Callbacks
+	#[serde(skip)]
+	#[derivative(Debug = "ignore", PartialEq = "ignore")]
+	pub on_update: WidgetCallback<()>,
+
+	#[serde(skip)]
+	#[derivative(Debug = "ignore", PartialEq = "ignore")]
+	pub on_commit: WidgetCallback<()>,
+}
+
 #[derive(Clone, Derivative, serde::Serialize, serde::Deserialize, WidgetBuilder, specta::Type)]
 #[derivative(Debug, PartialEq, Default)]
 pub struct ColorButton {

editor/src/messages/layout/utility_types/widgets/label_widgets.rs

@@ -11,18 +11,6 @@ pub struct IconLabel {
 	pub tooltip: String,
 }
 
-#[derive(Clone, serde::Serialize, serde::Deserialize, Derivative, Debug, Default, PartialEq, Eq, WidgetBuilder, specta::Type)]
-pub struct ImageLabel {
-	#[widget_builder(constructor)]
-	pub image: String,
-
-	pub width: Option<String>,
-
-	pub height: Option<String>,
-
-	pub tooltip: String,
-}
-
 #[derive(Debug, Clone, Default, PartialEq, Eq, serde::Serialize, serde::Deserialize, WidgetBuilder, specta::Type)]
 pub struct Separator {
 	pub direction: SeparatorDirection,
@@ -55,6 +43,9 @@ pub struct TextLabel {
 
 	pub italic: bool,
 
+	#[serde(rename = "centerAlign")]
+	pub center_align: bool,
+
 	#[serde(rename = "tableAlign")]
 	pub table_align: bool,
 

editor/src/messages/portfolio/document/document_message.rs

@@ -37,10 +37,9 @@ pub enum DocumentMessage {
 		axis: AlignAxis,
 		aggregate: AlignAggregate,
 	},
-	ClearArtboards,
+	RemoveArtboards,
 	ClearLayersPanel,
 	CreateEmptyFolder,
-	DebugPrintDocument,
 	DeleteNode {
 		node_id: NodeId,
 	},

editor/src/messages/portfolio/document/document_message_handler.rs

@@ -272,8 +272,8 @@ impl MessageHandler<DocumentMessage, DocumentMessageData<'_>> for DocumentMessag
 					});
 				}
 			}
-			DocumentMessage::ClearArtboards => {
+			DocumentMessage::RemoveArtboards => {
-				responses.add(GraphOperationMessage::ClearArtboards);
+				responses.add(GraphOperationMessage::RemoveArtboards);
 			}
 			DocumentMessage::ClearLayersPanel => {
 				// Send an empty layer list
@@ -305,9 +305,6 @@ impl MessageHandler<DocumentMessage, DocumentMessageData<'_>> for DocumentMessag
 				});
 				responses.add(NodeGraphMessage::SelectedNodesSet { nodes: vec![id] });
 			}
-			DocumentMessage::DebugPrintDocument => {
-				info!("{:?}", self.network_interface);
-			}
 			DocumentMessage::DeleteNode { node_id } => {
 				responses.add(DocumentMessage::StartTransaction);
 
@@ -1337,7 +1334,6 @@ impl MessageHandler<DocumentMessage, DocumentMessageData<'_>> for DocumentMessag
 	fn actions(&self) -> ActionList {
 		let mut common = actions!(DocumentMessageDiscriminant;
 			CreateEmptyFolder,
-			DebugPrintDocument,
 			DeselectAllLayers,
 			GraphViewOverlayToggle,
 			Noop,

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

@@ -103,7 +103,7 @@ pub enum GraphOperationMessage {
 		location: IVec2,
 		dimensions: IVec2,
 	},
-	ClearArtboards,
+	RemoveArtboards,
 	NewSvg {
 		id: NodeId,
 		svg: String,

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

@@ -202,7 +202,7 @@ impl MessageHandler<GraphOperationMessage, GraphOperationMessageData<'_>> for Gr
 					modify_inputs.resize_artboard(location, dimensions);
 				}
 			}
-			GraphOperationMessage::ClearArtboards => {
+			GraphOperationMessage::RemoveArtboards => {
 				if network_interface.all_artboards().is_empty() {
 					return;
 				}

editor/src/messages/portfolio/menu_bar/menu_bar_message_handler.rs

@@ -1,3 +1,4 @@
+use crate::messages::debug::utility_types::MessageLoggingVerbosity;
 use crate::messages::input_mapper::utility_types::macros::action_keys;
 use crate::messages::layout::utility_types::widget_prelude::*;
 use crate::messages::portfolio::document::utility_types::clipboards::Clipboard;
@@ -10,6 +11,8 @@ pub struct MenuBarMessageData {
 	pub node_graph_open: bool,
 	pub has_selected_nodes: bool,
 	pub has_selected_layers: bool,
+	pub has_selection_history: (bool, bool),
+	pub message_logging_verbosity: MessageLoggingVerbosity,
 }
 
 #[derive(Debug, Clone, Default)]
@@ -19,6 +22,8 @@ pub struct MenuBarMessageHandler {
 	node_graph_open: bool,
 	has_selected_nodes: bool,
 	has_selected_layers: bool,
+	has_selection_history: (bool, bool),
+	message_logging_verbosity: MessageLoggingVerbosity,
 }
 
 impl MessageHandler<MenuBarMessage, MenuBarMessageData> for MenuBarMessageHandler {
@@ -29,12 +34,16 @@ impl MessageHandler<MenuBarMessage, MenuBarMessageData> for MenuBarMessageHandle
 			node_graph_open,
 			has_selected_nodes,
 			has_selected_layers,
+			has_selection_history,
+			message_logging_verbosity,
 		} = data;
 		self.has_active_document = has_active_document;
 		self.rulers_visible = rulers_visible;
 		self.node_graph_open = node_graph_open;
 		self.has_selected_nodes = has_selected_nodes;
 		self.has_selected_layers = has_selected_layers;
+		self.has_selection_history = has_selection_history;
+		self.message_logging_verbosity = message_logging_verbosity;
 
 		match message {
 			MenuBarMessage::SendLayout => self.send_layout(responses, LayoutTarget::MenuBar),
@@ -52,6 +61,10 @@ impl LayoutHolder for MenuBarMessageHandler {
 		let node_graph_open = self.node_graph_open;
 		let has_selected_nodes = self.has_selected_nodes;
 		let has_selected_layers = self.has_selected_layers;
+		let has_selection_history = self.has_selection_history;
+		let message_logging_verbosity_off = self.message_logging_verbosity == MessageLoggingVerbosity::Off;
+		let message_logging_verbosity_names = self.message_logging_verbosity == MessageLoggingVerbosity::Names;
+		let message_logging_verbosity_contents = self.message_logging_verbosity == MessageLoggingVerbosity::Contents;
 
 		let menu_bar_entries = vec![
 			MenuBarEntry {
@@ -89,6 +102,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 					vec![
 						MenuBarEntry {
 							label: "Close".into(),
+							icon: Some("Close".into()),
 							shortcut: action_keys!(PortfolioMessageDiscriminant::CloseActiveDocumentWithConfirmation),
 							action: MenuBarEntry::create_action(|_| PortfolioMessage::CloseActiveDocumentWithConfirmation.into()),
 							disabled: no_active_document,
@@ -96,6 +110,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Close All".into(),
+							icon: Some("CloseAll".into()),
 							shortcut: action_keys!(PortfolioMessageDiscriminant::CloseAllDocumentsWithConfirmation),
 							action: MenuBarEntry::create_action(|_| PortfolioMessage::CloseAllDocumentsWithConfirmation.into()),
 							disabled: no_active_document,
@@ -104,6 +119,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 					],
 					vec![MenuBarEntry {
 						label: "Save".into(),
+						icon: Some("Save".into()),
 						shortcut: action_keys!(DocumentMessageDiscriminant::SaveDocument),
 						action: MenuBarEntry::create_action(|_| DocumentMessage::SaveDocument.into()),
 						disabled: no_active_document,
@@ -112,12 +128,14 @@ impl LayoutHolder for MenuBarMessageHandler {
 					vec![
 						MenuBarEntry {
 							label: "Import…".into(),
+							icon: Some("FileImport".into()),
 							shortcut: action_keys!(PortfolioMessageDiscriminant::Import),
 							action: MenuBarEntry::create_action(|_| PortfolioMessage::Import.into()),
 							..MenuBarEntry::default()
 						},
 						MenuBarEntry {
 							label: "Export…".into(),
+							icon: Some("FileExport".into()),
 							shortcut: action_keys!(DialogMessageDiscriminant::RequestExportDialog),
 							action: MenuBarEntry::create_action(|_| DialogMessage::RequestExportDialog.into()),
 							disabled: no_active_document,
@@ -140,6 +158,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 					vec![
 						MenuBarEntry {
 							label: "Undo".into(),
+							icon: Some("HistoryUndo".into()),
 							shortcut: action_keys!(DocumentMessageDiscriminant::Undo),
 							action: MenuBarEntry::create_action(|_| DocumentMessage::Undo.into()),
 							disabled: no_active_document,
@@ -147,6 +166,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Redo".into(),
+							icon: Some("HistoryRedo".into()),
 							shortcut: action_keys!(DocumentMessageDiscriminant::Redo),
 							action: MenuBarEntry::create_action(|_| DocumentMessage::Redo.into()),
 							disabled: no_active_document,
@@ -179,51 +199,28 @@ impl LayoutHolder for MenuBarMessageHandler {
 							..MenuBarEntry::default()
 						},
 					],
+					vec![MenuBarEntry {
+						label: "Remove Artboards".into(),
+						icon: Some("Artboard".into()),
+						action: MenuBarEntry::create_action(|_| DocumentMessage::RemoveArtboards.into()),
+						disabled: no_active_document,
+						..MenuBarEntry::default()
+					}],
 				]),
 			),
 			MenuBarEntry::new_root(
 				"Layer".into(),
 				no_active_document,
 				MenuBarEntryChildren(vec![
-					vec![MenuBarEntry {
-						label: "New".into(),
-						icon: Some("NewLayer".into()),
-						shortcut: action_keys!(DocumentMessageDiscriminant::CreateEmptyFolder),
-						action: MenuBarEntry::create_action(|_| DocumentMessage::CreateEmptyFolder.into()),
-						disabled: no_active_document,
-						..MenuBarEntry::default()
-					}],
 					vec![
 						MenuBarEntry {
-							label: "Select All".into(),
+							label: "New Layer".into(),
-							shortcut: action_keys!(DocumentMessageDiscriminant::SelectAllLayers),
+							icon: Some("NewLayer".into()),
-							action: MenuBarEntry::create_action(|_| DocumentMessage::SelectAllLayers.into()),
+							shortcut: action_keys!(DocumentMessageDiscriminant::CreateEmptyFolder),
+							action: MenuBarEntry::create_action(|_| DocumentMessage::CreateEmptyFolder.into()),
 							disabled: no_active_document,
 							..MenuBarEntry::default()
 						},
-						MenuBarEntry {
-							label: "Deselect All".into(),
-							shortcut: action_keys!(DocumentMessageDiscriminant::DeselectAllLayers),
-							action: MenuBarEntry::create_action(|_| DocumentMessage::DeselectAllLayers.into()),
-							disabled: no_active_document || !has_selected_nodes,
-							..MenuBarEntry::default()
-						},
-					],
-					vec![
-						MenuBarEntry {
-							label: "Previous Selection".into(),
-							shortcut: action_keys!(DocumentMessageDiscriminant::SelectionStepBack),
-							action: MenuBarEntry::create_action(|_| DocumentMessage::SelectionStepBack.into()),
-							..MenuBarEntry::default()
-						},
-						MenuBarEntry {
-							label: "Next Selection".into(),
-							shortcut: action_keys!(DocumentMessageDiscriminant::SelectionStepForward),
-							action: MenuBarEntry::create_action(|_| DocumentMessage::SelectionStepForward.into()),
-							..MenuBarEntry::default()
-						},
-					],
-					vec![
 						MenuBarEntry {
 							label: "Group Selected".into(),
 							icon: Some("Folder".into()),
@@ -246,9 +243,44 @@ impl LayoutHolder for MenuBarMessageHandler {
 							..MenuBarEntry::default()
 						},
 					],
+					vec![
+						MenuBarEntry {
+							label: "Select All".into(),
+							icon: Some("SelectAll".into()),
+							shortcut: action_keys!(DocumentMessageDiscriminant::SelectAllLayers),
+							action: MenuBarEntry::create_action(|_| DocumentMessage::SelectAllLayers.into()),
+							disabled: no_active_document,
+							..MenuBarEntry::default()
+						},
+						MenuBarEntry {
+							label: "Deselect All".into(),
+							icon: Some("DeselectAll".into()),
+							shortcut: action_keys!(DocumentMessageDiscriminant::DeselectAllLayers),
+							action: MenuBarEntry::create_action(|_| DocumentMessage::DeselectAllLayers.into()),
+							disabled: no_active_document || !has_selected_nodes,
+							..MenuBarEntry::default()
+						},
+						MenuBarEntry {
+							label: "Previous Selection".into(),
+							icon: Some("HistoryUndo".into()),
+							shortcut: action_keys!(DocumentMessageDiscriminant::SelectionStepBack),
+							action: MenuBarEntry::create_action(|_| DocumentMessage::SelectionStepBack.into()),
+							disabled: !has_selection_history.0,
+							..MenuBarEntry::default()
+						},
+						MenuBarEntry {
+							label: "Next Selection".into(),
+							icon: Some("HistoryRedo".into()),
+							shortcut: action_keys!(DocumentMessageDiscriminant::SelectionStepForward),
+							action: MenuBarEntry::create_action(|_| DocumentMessage::SelectionStepForward.into()),
+							disabled: !has_selection_history.1,
+							..MenuBarEntry::default()
+						},
+					],
 					vec![
 						MenuBarEntry {
 							label: "Grab Selected".into(),
+							icon: Some("TransformationGrab".into()),
 							shortcut: action_keys!(TransformLayerMessageDiscriminant::BeginGrab),
 							action: MenuBarEntry::create_action(|_| TransformLayerMessage::BeginGrab.into()),
 							disabled: no_active_document || !has_selected_layers,
@@ -256,6 +288,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Rotate Selected".into(),
+							icon: Some("TransformationRotate".into()),
 							shortcut: action_keys!(TransformLayerMessageDiscriminant::BeginRotate),
 							action: MenuBarEntry::create_action(|_| TransformLayerMessage::BeginRotate.into()),
 							disabled: no_active_document || !has_selected_layers,
@@ -263,6 +296,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Scale Selected".into(),
+							icon: Some("TransformationScale".into()),
 							shortcut: action_keys!(TransformLayerMessageDiscriminant::BeginScale),
 							action: MenuBarEntry::create_action(|_| TransformLayerMessage::BeginScale.into()),
 							disabled: no_active_document || !has_selected_layers,
@@ -271,52 +305,57 @@ impl LayoutHolder for MenuBarMessageHandler {
 					],
 					vec![MenuBarEntry {
 						label: "Order".into(),
+						icon: Some("StackHollow".into()),
 						action: MenuBarEntry::no_action(),
 						disabled: no_active_document || !has_selected_layers,
-						children: MenuBarEntryChildren(vec![vec![
+						children: MenuBarEntryChildren(vec![
-							MenuBarEntry {
+							vec![
-								label: "Raise To Front".into(),
+								MenuBarEntry {
-								shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersRaiseToFront),
+									label: "Raise To Front".into(),
-								action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersRaiseToFront.into()),
+									icon: Some("Stack".into()),
+									shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersRaiseToFront),
+									action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersRaiseToFront.into()),
+									disabled: no_active_document || !has_selected_layers,
+									..MenuBarEntry::default()
+								},
+								MenuBarEntry {
+									label: "Raise".into(),
+									icon: Some("StackRaise".into()),
+									shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersRaise),
+									action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersRaise.into()),
+									disabled: no_active_document || !has_selected_layers,
+									..MenuBarEntry::default()
+								},
+								MenuBarEntry {
+									label: "Lower".into(),
+									icon: Some("StackLower".into()),
+									shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersLower),
+									action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersLower.into()),
+									disabled: no_active_document || !has_selected_layers,
+									..MenuBarEntry::default()
+								},
+								MenuBarEntry {
+									label: "Lower to Back".into(),
+									icon: Some("StackBottom".into()),
+									shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersLowerToBack),
+									action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersLowerToBack.into()),
+									disabled: no_active_document || !has_selected_layers,
+									..MenuBarEntry::default()
+								},
+							],
+							vec![MenuBarEntry {
+								label: "Reverse".into(),
+								icon: Some("StackReverse".into()),
+								// shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersReverse),
+								action: MenuBarEntry::create_action(|_| DialogMessage::RequestComingSoonDialog { issue: Some(2271) }.into()),
 								disabled: no_active_document || !has_selected_layers,
 								..MenuBarEntry::default()
-							},
+							}],
-							MenuBarEntry {
+						]),
-								label: "Raise".into(),
-								shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersRaise),
-								action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersRaise.into()),
-								disabled: no_active_document || !has_selected_layers,
-								..MenuBarEntry::default()
-							},
-							MenuBarEntry {
-								label: "Lower".into(),
-								shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersLower),
-								action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersLower.into()),
-								disabled: no_active_document || !has_selected_layers,
-								..MenuBarEntry::default()
-							},
-							MenuBarEntry {
-								label: "Lower to Back".into(),
-								shortcut: action_keys!(DocumentMessageDiscriminant::SelectedLayersLowerToBack),
-								action: MenuBarEntry::create_action(|_| DocumentMessage::SelectedLayersLowerToBack.into()),
-								disabled: no_active_document || !has_selected_layers,
-								..MenuBarEntry::default()
-							},
-						]]),
 						..MenuBarEntry::default()
 					}],
 				]),
 			),
-			MenuBarEntry::new_root(
-				"Document".into(),
-				no_active_document,
-				MenuBarEntryChildren(vec![vec![MenuBarEntry {
-					label: "Clear Artboards".into(),
-					action: MenuBarEntry::create_action(|_| DocumentMessage::ClearArtboards.into()),
-					disabled: no_active_document,
-					..MenuBarEntry::default()
-				}]]),
-			),
 			MenuBarEntry::new_root(
 				"View".into(),
 				no_active_document,
@@ -324,6 +363,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 					vec![
 						MenuBarEntry {
 							label: "Tilt".into(),
+							icon: Some("Tilt".into()),
 							shortcut: action_keys!(NavigationMessageDiscriminant::BeginCanvasTilt),
 							action: MenuBarEntry::create_action(|_| NavigationMessage::BeginCanvasTilt { was_dispatched_from_menu: true }.into()),
 							disabled: no_active_document || node_graph_open,
@@ -331,6 +371,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Reset Tilt".into(),
+							icon: Some("TiltReset".into()),
 							shortcut: action_keys!(NavigationMessageDiscriminant::CanvasTiltSet),
 							action: MenuBarEntry::create_action(|_| NavigationMessage::CanvasTiltSet { angle_radians: 0.into() }.into()),
 							disabled: no_active_document || node_graph_open,
@@ -354,10 +395,9 @@ impl LayoutHolder for MenuBarMessageHandler {
 							disabled: no_active_document,
 							..MenuBarEntry::default()
 						},
-					],
-					vec![
 						MenuBarEntry {
 							label: "Zoom to Fit Selection".into(),
+							icon: Some("FrameSelected".into()),
 							shortcut: action_keys!(NavigationMessageDiscriminant::FitViewportToSelection),
 							action: MenuBarEntry::create_action(|_| NavigationMessage::FitViewportToSelection.into()),
 							disabled: no_active_document || !has_selected_layers,
@@ -365,6 +405,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Zoom to Fit All".into(),
+							icon: Some("FrameAll".into()),
 							shortcut: action_keys!(DocumentMessageDiscriminant::ZoomCanvasToFitAll),
 							action: MenuBarEntry::create_action(|_| DocumentMessage::ZoomCanvasToFitAll.into()),
 							disabled: no_active_document,
@@ -372,6 +413,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Zoom to 100%".into(),
+							icon: Some("Zoom1x".into()),
 							shortcut: action_keys!(DocumentMessageDiscriminant::ZoomCanvasTo100Percent),
 							action: MenuBarEntry::create_action(|_| DocumentMessage::ZoomCanvasTo100Percent.into()),
 							disabled: no_active_document,
@@ -379,6 +421,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Zoom to 200%".into(),
+							icon: Some("Zoom2x".into()),
 							shortcut: action_keys!(DocumentMessageDiscriminant::ZoomCanvasTo200Percent),
 							action: MenuBarEntry::create_action(|_| DocumentMessage::ZoomCanvasTo200Percent.into()),
 							disabled: no_active_document,
@@ -407,6 +450,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 					}],
 					vec![MenuBarEntry {
 						label: "User Manual".into(),
+						icon: Some("UserManual".into()),
 						action: MenuBarEntry::create_action(|_| {
 							FrontendMessage::TriggerVisitLink {
 								url: "https://graphite.rs/learn/".into(),
@@ -418,6 +462,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 					vec![
 						MenuBarEntry {
 							label: "Report a Bug".into(),
+							icon: Some("Bug".into()),
 							action: MenuBarEntry::create_action(|_| {
 								FrontendMessage::TriggerVisitLink {
 									url: "https://github.com/GraphiteEditor/Graphite/issues/new".into(),
@@ -428,6 +473,7 @@ impl LayoutHolder for MenuBarMessageHandler {
 						},
 						MenuBarEntry {
 							label: "Visit on GitHub".into(),
+							icon: Some("Website".into()),
 							action: MenuBarEntry::create_action(|_| {
 								FrontendMessage::TriggerVisitLink {
 									url: "https://github.com/GraphiteEditor/Graphite".into(),
@@ -437,50 +483,49 @@ impl LayoutHolder for MenuBarMessageHandler {
 							..MenuBarEntry::default()
 						},
 					],
-					vec![
+					vec![MenuBarEntry {
-						MenuBarEntry {
+						label: "Developer Debug".into(),
-							label: "Debug: Print Messages".into(),
+						icon: Some("Code".into()),
-							action: MenuBarEntry::no_action(),
+						action: MenuBarEntry::no_action(),
-							children: MenuBarEntryChildren(vec![vec![
+						children: MenuBarEntryChildren(vec![
+							vec![MenuBarEntry {
+								label: "Print Trace Logs".into(),
+								icon: Some(if log::max_level() == log::LevelFilter::Trace { "CheckboxChecked" } else { "CheckboxUnchecked" }.into()),
+								action: MenuBarEntry::create_action(|_| DebugMessage::ToggleTraceLogs.into()),
+								..MenuBarEntry::default()
+							}],
+							vec![
 								MenuBarEntry {
-									label: "Off".into(),
+									label: "Print Messages: Off".into(),
-									// icon: Some("Checkmark".into()), // TODO: Find a way to set this icon on the active mode
+									icon: message_logging_verbosity_off.then_some("SmallDot".into()),
 									shortcut: action_keys!(DebugMessageDiscriminant::MessageOff),
 									action: MenuBarEntry::create_action(|_| DebugMessage::MessageOff.into()),
 									..MenuBarEntry::default()
 								},
 								MenuBarEntry {
-									label: "Only Names".into(),
+									label: "Print Messages: Only Names".into(),
+									icon: message_logging_verbosity_names.then_some("SmallDot".into()),
 									shortcut: action_keys!(DebugMessageDiscriminant::MessageNames),
 									action: MenuBarEntry::create_action(|_| DebugMessage::MessageNames.into()),
 									..MenuBarEntry::default()
 								},
 								MenuBarEntry {
-									label: "Full Contents".into(),
+									label: "Print Messages: Full Contents".into(),
+									icon: message_logging_verbosity_contents.then_some("SmallDot".into()),
 									shortcut: action_keys!(DebugMessageDiscriminant::MessageContents),
 									action: MenuBarEntry::create_action(|_| DebugMessage::MessageContents.into()),
 									..MenuBarEntry::default()
 								},
-							]]),
+							],
-							..MenuBarEntry::default()
+							vec![MenuBarEntry {
-						},
+								label: "Trigger a Crash".into(),
-						MenuBarEntry {
+								icon: Some("Warning".into()),
-							label: "Debug: Print Trace Logs".into(),
+								action: MenuBarEntry::create_action(|_| panic!()),
-							icon: Some(if log::max_level() == log::LevelFilter::Trace { "CheckboxChecked" } else { "CheckboxUnchecked" }.into()),
+								..MenuBarEntry::default()
-							action: MenuBarEntry::create_action(|_| DebugMessage::ToggleTraceLogs.into()),
+							}],
-							..MenuBarEntry::default()
+						]),
-						},
+						..MenuBarEntry::default()
-						MenuBarEntry {
+					}],
-							label: "Debug: Print Document".into(),
-							action: MenuBarEntry::create_action(|_| DocumentMessage::DebugPrintDocument.into()),
-							..MenuBarEntry::default()
-						},
-						MenuBarEntry {
-							label: "Debug: Panic (DANGER)".into(),
-							action: MenuBarEntry::create_action(|_| panic!()),
-							..MenuBarEntry::default()
-						},
-					],
 				]),
 			),
 		];

editor/src/messages/portfolio/portfolio_message_handler.rs

@@ -3,6 +3,7 @@ use super::document::utility_types::network_interface::{self, InputConnector, Ou
 use super::utility_types::{PanelType, PersistentData};
 use crate::application::generate_uuid;
 use crate::consts::DEFAULT_DOCUMENT_NAME;
+use crate::messages::debug::utility_types::MessageLoggingVerbosity;
 use crate::messages::dialog::simple_dialogs;
 use crate::messages::frontend::utility_types::FrontendDocumentDetails;
 use crate::messages::layout::utility_types::widget_prelude::*;
@@ -28,6 +29,7 @@ pub struct PortfolioMessageData<'a> {
 	pub ipp: &'a InputPreprocessorMessageHandler,
 	pub preferences: &'a PreferencesMessageHandler,
 	pub current_tool: &'a ToolType,
+	pub message_logging_verbosity: MessageLoggingVerbosity,
 }
 
 #[derive(Debug, Default)]
@@ -45,7 +47,12 @@ pub struct PortfolioMessageHandler {
 
 impl MessageHandler<PortfolioMessage, PortfolioMessageData<'_>> for PortfolioMessageHandler {
 	fn process_message(&mut self, message: PortfolioMessage, responses: &mut VecDeque<Message>, data: PortfolioMessageData) {
-		let PortfolioMessageData { ipp, preferences, current_tool } = data;
+		let PortfolioMessageData {
+			ipp,
+			preferences,
+			current_tool,
+			message_logging_verbosity,
+		} = data;
 
 		match message {
 			// Sub-messages
@@ -55,6 +62,7 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageData<'_>> for PortfolioMes
 				let mut node_graph_open = false;
 				let mut has_selected_nodes = false;
 				let mut has_selected_layers = false;
+				let mut has_selection_history = (false, false);
 
 				if let Some(document) = self.active_document_id.and_then(|document_id| self.documents.get_mut(&document_id)) {
 					has_active_document = true;
@@ -63,6 +71,14 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageData<'_>> for PortfolioMes
 					let selected_nodes = document.network_interface.selected_nodes(&[]).unwrap();
 					has_selected_nodes = selected_nodes.selected_nodes().next().is_some();
 					has_selected_layers = selected_nodes.selected_visible_layers(&document.network_interface).next().is_some();
+					has_selection_history = document
+						.network_interface
+						.network_metadata(&[])
+						.map(|metadata| {
+							let metadata = &metadata.persistent_metadata;
+							(!metadata.selection_undo_history.is_empty(), !metadata.selection_redo_history.is_empty())
+						})
+						.unwrap_or((false, false));
 				}
 				self.menu_bar_message_handler.process_message(
 					message,
@@ -73,6 +89,8 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageData<'_>> for PortfolioMes
 						node_graph_open,
 						has_selected_nodes,
 						has_selected_layers,
+						has_selection_history,
+						message_logging_verbosity,
 					},
 				);
 			}

frontend/assets/icon-16px-solid/artboard.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M13,4H5v1h7v9h1V4z" />
 	<path d="M4,11V2H3v10h8v-1H4z" />
 	<rect x="14" y="11" width="1" height="1" />

frontend/assets/icon-16px-solid/bug.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M15.36,14.58l-.99-.64-.39-1.78-1.99-.99v-1.88l1.55.77,1.77-.88c.25-.12.35-.42.22-.67-.12-.25-.42-.35-.67-.22l-1.32.66-1.55-.77v-1.17c0-.05-.02-.1-.03-.15l1.95-.98,1.07-2.15c.12-.25.02-.55-.22-.67-.25-.12-.55-.02-.67.22l-.93,1.85-1.85.93s0,0-.01.01c-.1-.03-.2-.06-.31-.06h-5c-.1,0-.18.03-.27.06,0,0,0,0,0,0l-1.85-.93-.93-1.85c-.12-.25-.42-.35-.67-.22-.25.12-.35.42-.22.67l1.07,2.15,1.91.95c-.01.06-.03.11-.03.17v1.19l-1.5.75-1.32-.66c-.25-.12-.55-.02-.67.22-.12.25-.02.55.22.67l1.77.88,1.5-.75v1.88l-1.94.97-.38,1.78-.99.64c-.23.15-.3.46-.15.69.1.15.26.23.42.23.09,0,.19-.03.27-.08l1.34-.87.37-1.71,1.16-.58c.31,1.4,1.47,2.48,2.91,2.69v-5.95h1v5.95c1.45-.21,2.61-1.3,2.91-2.71l1.2.6.37,1.71,1.34.87c.08.05.18.08.27.08.16,0,.32-.08.42-.23.15-.23.08-.54-.15-.69z" />
+	<path d="M4.97,1.05c1.34.17,1.81,1.32,1.97,2.01-.57.46-.94,1.15-.94,1.94h5c0-.77-.35-1.45-.9-1.9.15-.68.61-1.87,1.98-2.04.27-.03.47-.28.43-.56-.03-.27-.3-.46-.56-.43-1.66.21-2.45,1.48-2.76,2.55-.22-.06-.45-.11-.69-.11-.23,0-.44.04-.65.1C7.54,1.53,6.74.27,5.09.06c-.28-.03-.52.16-.56.43s.16.52.43.56z" />
+</svg>

frontend/assets/icon-16px-solid/checkbox-checked.svg

@@ -1,4 +1,4 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<polygon points="7.19,13.83 2.18,9.44 3.82,7.56 6.81,10.17 12,3.25 14,4.75" />
-	<path d="M14,16H2c-1.1,0-2-.9-2-2V2C0,.9,.9,0,2,0H14c1.1,0,2,.9,2,2V14c0,1.1-.9,2-2,2ZM2,1c-.55,0-1,.45-1,1V14c0,.55,.45,1,1,1H14c.55,0,1-.45,1-1V2c0-.55-.45-1-1-1H2Z" />
+	<path d="M14,16H2c-1.1,0-2-.9-2-2V2C0,.9,.9,0,2,0H14c1.1,0,2,.9,2,2V14c0,1.1-.9,2-2,2ZM2,1c-.55,0-1,.45-1,1V14c0,.55,.45,1,1,1H14c.55,0,1-.45,1-1V2c0-.55-.45-1-1-1H2z" />
 </svg>

frontend/assets/icon-16px-solid/checkbox-unchecked.svg

@@ -1,3 +1,3 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-	<path d="M14,16H2c-1.1,0-2-.9-2-2V2C0,.9,.9,0,2,0H14c1.1,0,2,.9,2,2V14c0,1.1-.9,2-2,2ZM2,1c-.55,0-1,.45-1,1V14c0,.55,.45,1,1,1H14c.55,0,1-.45,1-1V2c0-.55-.45-1-1-1H2Z" />
+	<path d="M14,16H2c-1.1,0-2-.9-2-2V2C0,.9,.9,0,2,0H14c1.1,0,2,.9,2,2V14c0,1.1-.9,2-2,2ZM2,1c-.55,0-1,.45-1,1V14c0,.55,.45,1,1,1H14c.55,0,1-.45,1-1V2c0-.55-.45-1-1-1H2z" />
 </svg>

frontend/assets/icon-16px-solid/close-all.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M8,11l-3.45,3.45-1-1,3.45-3.45,1,1ZM13.45,3.55l-3.45,3.45,1,1,3.45-3.45-1-1ZM8,7l4.45-4.45-1-1-4.45,4.45L2.55,1.55l-1,1,4.45,4.45L1.55,11.45l1,1,4.45-4.45,6.45,6.45,1-1-6.45-6.45z" />
+</svg>

frontend/assets/icon-16px-solid/close.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon points="13.45 3.55 12.45 2.55 8 7 3.55 2.55 2.55 3.55 7 8 2.55 12.45 3.55 13.45 8 9 12.45 13.45 13.45 12.45 9 8 13.45 3.55" />
+</svg>

frontend/assets/icon-16px-solid/code.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M11,15c-.55,0-1-.45-1-1s.45-1,1-1c.92,0,1.11-.2,1.11-.2.11-.13-.03-.86-.09-1.21-.17-.96-.46-2.52.66-3.59-1.12-1.07-.83-2.63-.66-3.59.06-.35.2-1.08.09-1.21,0,0-.19-.2-1.11-.2-.55,0-1-.45-1-1s.45-1,1-1c.81,0,1.96.1,2.65.92.71.85.51,1.91.34,2.85-.26,1.41-.35,1.94,1.21,2.25.47.09.8.5.8.98s-.34.89-.8.98c-1.56.31-1.46.84-1.21,2.25.17.94.37,2-.34,2.85-.69.82-1.84.92-2.65.92z" />
+	<path d="M5,15c-.81,0-1.96-.09-2.65-.92-.71-.84-.51-1.91-.34-2.85.26-1.41.35-1.94-1.21-2.25-.47-.09-.8-.5-.8-.98s.34-.89.8-.98c1.56-.31,1.46-.84,1.21-2.25-.17-.94-.36-2,.34-2.85.69-.82,1.84-.92,2.65-.92.55,0,1,.45,1,1s-.45,1-1,1c-.92,0-1.11.2-1.11.2-.11.13.03.86.09,1.21.18.97.46,2.52-.66,3.59,1.11,1.07.83,2.63.66,3.59-.06.35-.2,1.08-.09,1.21,0,0,.19.2,1.11.2.55,0,1,.45,1,1s-.45,1-1,1z" />
+</svg>

frontend/assets/icon-16px-solid/deselect-all.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M6.5,4c.83,0,1.5.67,1.5,1.5s-.67,1.5-1.5,1.5-1.5-.67-1.5-1.5.67-1.5,1.5-1.5M6.5,3c-1.38,0-2.5,1.12-2.5,2.5s1.12,2.5,2.5,2.5,2.5-1.12,2.5-2.5-1.12-2.5-2.5-2.5h0z" />
+	<path d="M10,10c.55,0,1,.45,1,1s-.45,1-1,1-1-.45-1-1,.45-1,1-1M10,9c-1.1,0-2,.9-2,2s.9,2,2,2,2-.9,2-2-.9-2-2-2h0z" />
+	<polygon points="3 14 3 13 2 13 2 15 4 15 4 14 3 14" />
+	<polygon points="13 13 13 14 12 14 12 15 14 15 14 13 13 13" />
+	<polygon points="2 1 2 3 3 3 3 2 4 2 4 1 2 1" />
+	<polygon points="12 1 12 2 13 2 13 3 14 3 14 1 12 1" />
+</svg>

frontend/assets/icon-16px-solid/empty.svg

@@ -0,0 +1,2 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+</svg>

frontend/assets/icon-16px-solid/file-export.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon points="12 14 12 15 3 15 3 5 6 5 6 2 12 2 12 6 13 6 13 1 5 1 2 4 2 16 13 16 13 14 12 14" />
+	<polygon points="7 9 11 9 11 7 15 10 11 13 11 11 7 11 7 9" />
+</svg>

frontend/assets/icon-16px-solid/file-import.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon points="6 1 3 4 3 7 4 7 4 5 7 5 7 2 13 2 13 15 4 15 4 13 3 13 3 16 14 16 14 1 6 1" />
+	<polygon points="1 9 6 9 6 7 10 10 6 13 6 11 1 11 1 9" />
+</svg>

frontend/assets/icon-16px-solid/folder.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M14,13H2c-0.55,0-1-0.45-1-1V6h5.42l1-1H15v7C15,12.55,14.55,13,14,13z" />
 	<path d="M6,2H2C1.45,2,1,2.45,1,3v2h5l1-1h8c0-0.55-0.45-1-1-1H7L6,2z" />
 </svg>

frontend/assets/icon-16px-solid/frame-selected.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon points="3 1 0 1 0 4 1 4 1 2 3 2 3 1" />
+	<polygon points="13 1 13 2 15 2 15 4 16 4 16 1 13 1" />
+	<polygon points="1 14 1 12 0 12 0 15 3 15 3 14 1 14" />
+	<polygon points="15 12 15 14 13 14 13 15 16 15 16 12 15 12" />
+	<circle cx="6.5" cy="5.5" r="2.5" />
+	<circle cx="10" cy="11" r="2" />
+</svg>

frontend/assets/icon-16px-solid/graph-view-closed.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
   <path d="M6,9.5l4-2.4c0,0.5,0.5,0.9,1,0.9h3c0.6,0,1-0.4,1-1V3c0-0.6-0.4-1-1-1h-3c-0.6,0-1,0.4-1,1H6c0-0.6-0.4-1-1-1H2C1.4,2,1,2.4,1,3v2c0,0.6,0.4,1,1,1h3c0.6,0,1-0.4,1-1V4h4v1.9L5.8,8.4C5.6,8.2,5.3,8,5,8H2C1.4,8,1,8.4,1,9v2c0,0.6,0.4,1,1,1h3c0.4,0,0.8-0.2,0.9-0.6L10,13v1c0,0.6,0.4,1,1,1h3c0.6,0,1-0.4,1-1v-2c0-0.6-0.4-1-1-1h-3c-0.5,0-1,0.4-1,1l-4-1.6V9.5z M11,3h3v4h-3V3z M5,5H2V3h3V5z M5,11H2V9h3V11z M11,12h3v2h-3V12z" />
 </svg>

frontend/assets/icon-16px-solid/graph-view-open.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
   <path d="M6,9.5l4-2.4c0,0.5,0.5,0.9,1,0.9h3c0.6,0,1-0.4,1-1V3c0-0.6-0.4-1-1-1h-3c-0.6,0-1,0.4-1,1H6c0-0.6-0.4-1-1-1H2C1.4,2,1,2.4,1,3v2c0,0.6,0.4,1,1,1h3c0.6,0,1-0.4,1-1V4h4v1.9L5.8,8.4C5.6,8.2,5.3,8,5,8H2C1.4,8,1,8.4,1,9v2c0,0.6,0.4,1,1,1h3c0.4,0,0.8-0.2,0.9-0.6L10,13v1c0,0.6,0.4,1,1,1h3c0.6,0,1-0.4,1-1v-2c0-0.6-0.4-1-1-1h-3c-0.5,0-1,0.4-1,1l-4-1.6V9.5z" />
 </svg>

frontend/assets/icon-16px-solid/history-redo.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M6.8,4h4.2s0-2,0-2l4,3-4,3v-2s-3,0-3,0c-2.4,0-4,1.37-4,3.62,0,1.67,1.7,3.05,3.4,3.32-.2.02-.39.06-.6.06-2.65,0-4.8-2.01-4.8-4.5,0-2.25,2.15-4.5,4.8-4.5z" />
+</svg>

frontend/assets/icon-16px-solid/history-undo.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M9.2,4h-4.2v-2L1,5l4,3v-2h3c2.4,0,4,1.38,4,3.62,0,1.67-1.7,3.05-3.4,3.32.2.02.39.06.6.06,2.65,0,4.8-2.01,4.8-4.5,0-2.25-2.15-4.5-4.8-4.5z" />
+</svg>

frontend/assets/icon-16px-solid/image.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<circle cx="4" cy="6" r="1.5" />
 	<path d="M14,6l-2-2l-1-1H1v10h14V7L14,6z M11,4v3h3v4L9.5,6.5l-3,4l-2-2L2,12V4H11z" />
 </svg>

frontend/assets/icon-16px-solid/layer.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M0,2v7.3L4.7,14H16V2H0z M15,13H6V9H1V3h14V13z" />
 </svg>

frontend/assets/icon-16px-solid/new-layer.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M10,8H8v2H7V8H5V7h2V5h1v2h2V8z M12,3H3v9h9V3 M12,2c0.6,0,1,0.4,1,1v9c0,0.6-0.4,1-1,1H3c-0.6,0-1-0.4-1-1V3c0-0.6,0.4-1,1-1H12L12,2z" />
 </svg>

frontend/assets/icon-16px-solid/node-blur.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M11.61,6.6C10.05,4.38,8.82,2.36,8,1C7.18,2.36,5.95,4.38,4.39,6.6s-1.81,4.74-0.74,6.39C4.67,14.34,6.31,15.1,8,15c1.69,0.1,3.33-0.66,4.35-2.01C13.42,11.34,13.17,8.9,11.61,6.6 M5.87,7.75c0.49,4.67,2.95,5.74,2.95,5.74C2.26,13.85,5.87,7.75,5.87,7.75" />
 </svg>

frontend/assets/icon-16px-solid/node-brushwork.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M9.49,11.76c-0.33,0.12-0.67,0.22-1,0.32c-0.42,1.03-1.26,1.87-2.35,2.24c-0.6,0.16-1.2,0.24-1.8,0.26c0.53,0.13,1.12,0.24,1.82,0.33c4.34,0.53,5.22-1.12,8.78-1.49C14.94,13.42,13.88,10.11,9.49,11.76z" />
 	<path d="M7.79,10.64C7.72,9.55,6.82,8.69,5.73,8.68C4.77,8.64,3.9,9.34,3.25,10.8C2.77,11.73,1.97,12.45,1,12.83c1.47,0.79,3.2,0.99,4.81,0.55C6.98,12.98,7.77,11.88,7.79,10.64" />
 	<path d="M14.03,2.23c-0.46-0.5-2.68,1.25-5.11,3.49C8.09,6.45,7.33,7.24,6.64,8.09c0.38,0.09,0.73,0.28,1.02,0.56c0.34,0.3,0.57,0.7,0.67,1.14c0.85-0.69,1.63-1.46,2.33-2.31C12.85,4.88,14.54,2.73,14.03,2.23" />

frontend/assets/icon-16px-solid/node-color-correction.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M10.43,9.65c7.82-3.53,2.77-8.99-1.77-8.64S0.83,4.86,1.62,9.34c0.76,4.33,6.79,6.72,8.76,5.2C12.4,12.98,6.85,11.27,10.43,9.65 M11.55,3.17c0.59,0,1.07,0.47,1.08,1.06S12.16,5.3,11.57,5.3c-0.59,0-1.07-0.47-1.08-1.06c0,0,0,0,0,0C10.49,3.65,10.96,3.17,11.55,3.17 M4.06,9.91c-0.59,0-1.07-0.47-1.07-1.06c0-0.59,0.47-1.07,1.06-1.07c0.59,0,1.07,0.47,1.07,1.06C5.13,9.42,4.65,9.91,4.06,9.91C4.06,9.91,4.06,9.91,4.06,9.91 M4.82,6.51c-0.59,0-1.07-0.47-1.07-1.06s0.47-1.07,1.06-1.07c0.59,0,1.07,0.47,1.07,1.06c0,0,0,0,0,0C5.89,6.03,5.41,6.51,4.82,6.51 M7.87,4.47C7.28,4.48,6.8,4,6.79,3.41s0.47-1.07,1.06-1.08c0.59,0,1.07,0.47,1.08,1.06c0,0,0,0,0,0C8.93,3.99,8.46,4.47,7.87,4.47" />
 </svg>

frontend/assets/icon-16px-solid/node-gradient.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M14,1h-1c0.23,0.28,0.37,0.63,0.4,1l0,0c0,0.77-0.63,1.4-1.4,1.4c-0.77,0-1.4-0.63-1.4-1.4c0.03-0.37,0.17-0.72,0.4-1H9.5c0.2,0.29,0.31,0.64,0.3,1l0,0c0,0.99-0.81,1.8-1.8,1.8S6.2,2.99,6.2,2c0.04-0.35,0.14-0.69,0.3-1H5.7C5.9,1.22,6.01,1.5,6,1.8C6.11,2.9,5.3,3.89,4.2,4C5.3,4.11,6.11,5.1,6,6.2C5.9,7.15,5.15,7.9,4.2,8C5.3,8.11,6.11,9.1,6,10.2c-0.1,0.95-0.85,1.7-1.8,1.8c0.97,0.07,1.73,0.83,1.8,1.8c0,0.42-0.11,0.83-0.3,1.2h0.8c-0.2-0.29-0.31-0.64-0.3-1c0-0.03,0-0.06,0-0.08c0-0.94,0.76-1.71,1.7-1.72c0,0,0,0,0,0h0.01c0.99,0,1.79,0.81,1.79,1.8c0,0,0,0,0,0c0.01,0.36-0.1,0.71-0.3,1H11c-0.23-0.28-0.37-0.63-0.4-1c0-0.77,0.63-1.4,1.4-1.4c0.77,0,1.4,0.63,1.4,1.4l0,0c-0.03,0.37-0.17,0.72-0.4,1h1c0.55,0,1-0.45,1-1V2C15,1.45,14.55,1,14,1 M9.8,10c0,0.99-0.81,1.79-1.8,1.79c-0.99,0-1.79-0.81-1.79-1.8C6.22,9,7.02,8.2,8.01,8.2C9,8.2,9.8,9,9.8,9.99V10 M9.8,6c0,0.99-0.81,1.79-1.8,1.79c-0.99,0-1.79-0.81-1.79-1.8C6.22,5,7.02,4.2,8.01,4.2C9,4.2,9.8,5,9.8,5.99V6 M13.4,10c0,0.77-0.63,1.4-1.4,1.4s-1.4-0.63-1.4-1.4c0-0.77,0.63-1.4,1.4-1.4c0,0,0,0,0,0c0.75-0.02,1.38,0.58,1.4,1.33C13.4,9.96,13.4,9.98,13.4,10 M13.4,6c0,0.77-0.63,1.4-1.4,1.4c-0.77,0-1.4-0.63-1.4-1.4c0-0.77,0.63-1.4,1.4-1.4c0.75-0.02,1.38,0.58,1.4,1.33C13.4,5.95,13.4,5.98,13.4,6 M3.8,8C3.04,8.09,2.39,8.59,2.1,9.3C1.91,8.75,1.52,8.28,1,8c0.52-0.28,0.91-0.75,1.1-1.3C2.39,7.41,3.04,7.91,3.8,8 M3.8,4C3.05,4.12,2.41,4.61,2.1,5.3C1.91,4.75,1.52,4.28,1,4c0.52-0.28,0.91-0.75,1.1-1.3C2.41,3.39,3.05,3.88,3.8,4 M3.8,12c-0.76,0.09-1.41,0.59-1.7,1.3C1.88,12.76,1.49,12.31,1,12c0.52-0.28,0.91-0.75,1.1-1.3C2.39,11.41,3.04,11.91,3.8,12" />
 </svg>

frontend/assets/icon-16px-solid/node-imaginate.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M9.6,13.6C9.5,14.5,8.7,15,8,15c-0.5,0-1-0.2-1.3-0.6L9.6,13.6z M6.3,12.5c0,0.3,0,0.6,0.1,1c0,0,0,0,0,0.1l3.3-0.8c0-0.5,0.1-0.8,0.1-1.1L6.3,12.5z M8,2c2.3,0,4.1,1.9,4.1,4.2c0,2.5-1.5,3.1-2.1,4.5c0,0,0,0.1,0,0.1l-3.8,0.9c-0.1-0.4-0.2-0.7-0.3-1C5.4,9.3,3.9,8.7,3.9,6.2c0,0,0,0,0,0C3.9,3.9,5.7,2,8,2C8,2,8,2,8,2z M8.2,8.9C8,8.7,7.3,9.2,7.1,9.5c-0.2,0.3-0.2,0.7,0.1,1c0.5,0.1,0.9,0,1.2-0.4C8.6,9.7,8.6,9.2,8.2,8.9z M8.2,8c0.3-0.7,1.2-4.7,1.2-4.7C8.2,2.7,7.1,4.2,7.1,4.2C7,5.5,7.1,6.8,7.2,8.1C7.6,8.2,7.9,8.1,8.2,8L8.2,8z" />
 </svg>

frontend/assets/icon-16px-solid/node-magic-wand.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<polygon points="6.08,4.08 8,3.5 6.08,2.92 5.5,1 4.92,2.92 3,3.5 4.92,4.08 5.5,6" />
 	<polygon points="9.9,12.9 11.5,12.5 9.9,12.1 9.5,10.5 9.1,12.1 7.5,12.5 9.1,12.9 9.5,14.5" />
 	<polygon points="12.98,9.98 15,9.5 12.98,9.02 12.5,7 12.02,9.02 10,9.5 12.02,9.98 12.5,12" />

frontend/assets/icon-16px-solid/node-mask.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M13.391,5.529c-.414-.037-1.91-1.088-2.941-1.027S8.663,5.1,8,5.1s-1.418-.54-2.449-.6-2.527.99-2.941,1.027c-.721.065-.952-.246-1.61-.736a13.341,13.341,0,0,0,.459,3.454A4.249,4.249,0,0,0,4.5,11.389a3.063,3.063,0,0,0,2.2-.2A3.129,3.129,0,0,1,8,10.7a3.133,3.133,0,0,1,1.3.49,3.061,3.061,0,0,0,2.2.2,4.249,4.249,0,0,0,3.042-3.142A13.338,13.338,0,0,0,15,4.793c-.657.49-.888.8-1.609.736M6.94,9.232c-.486.438-2.157.257-2.7-.038-.652-.353-1.465-1.218-.881-1.7a2.646,2.646,0,0,1,2.876-.113c.869.719.928,1.651.707,1.85m4.823-.038c-.545.3-2.216.476-2.7.038-.221-.2-.162-1.131.707-1.85a2.645,2.645,0,0,1,2.875.113c.585.481-.229,1.346-.88,1.7" />
 </svg>

frontend/assets/icon-16px-solid/node-motion-blur.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M8.06,4.18l0.87-2.19C4.14,1.43,0.05,6.67,2.9,11.07C1.32,7.09,4.37,2.89,8.06,4.18z" />
 	<path d="M7.94,11.82l-0.87,2.19c4.79,0.56,8.88-4.68,6.03-9.08C14.68,8.91,11.63,13.11,7.94,11.82z" />
 	<path d="M10.04,2.72c-0.49,0.75-1.37,2.46-1.8,3.3C8.16,6.01,8.08,6,8,6C6.9,6,6,6.9,6,8c0,0.15,0.02,0.3,0.05,0.44c-1.28,1.16-4.62,4.26-5.02,5.51c-0.42,1.32,3.38,1.68,4.93-0.68c0.49-0.75,1.37-2.46,1.8-3.3C7.84,9.99,7.92,10,8,10c1.1,0,2-0.9,2-2c0-0.15-0.02-0.3-0.05-0.44c1.28-1.16,4.62-4.26,5.02-5.51C15.39,0.72,11.59,0.36,10.04,2.72z M8,9C7.45,9,7,8.55,7,8c0-0.55,0.45-1,1-1s1,0.45,1,1C9,8.55,8.55,9,8,9z" />

frontend/assets/icon-16px-solid/node-nodes.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<polygon points="3,1 1,1 0,1 0,2 0,4 1,4 1,2 3,2" />
 	<polygon points="15,1 13,1 13,2 15,2 15,4 16,4 16,2 16,1" />
 	<polygon points="1,14 1,12 0,12 0,14 0,15 1,15 3,15 3,14" />

frontend/assets/icon-16px-solid/node-output.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M7,2L3,6v8h10V2H7z M12,13H4V7h4V3h4V13z" />
 </svg>

frontend/assets/icon-16px-solid/node-shape.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M14.96,5.19c-0.16-0.53-0.72-0.83-1.25-0.66c-0.96,0.3-1.86,0.6-2.7,0.91V5H5v3.16c-2.36,1.31-3.56,2.32-3.65,2.4c-0.42,0.36-0.46,0.99-0.1,1.41c0.2,0.23,0.48,0.35,0.76,0.35c0.23,0,0.46-0.08,0.65-0.24c0.02-0.01,0.8-0.67,2.34-1.6V11h6V7.59c1.01-0.39,2.09-0.78,3.29-1.15C14.82,6.28,15.12,5.72,14.96,5.19z M9,9H7V7h2V9z" />
 </svg>

frontend/assets/icon-16px-solid/node-text.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-	<path d="M3,2v3h0.5c0,0,0-2,2.29-2H7v8.79C7,12.48,6.89,13,5,13v1h6v-1c-1.89,0-2-0.52-2-1.21V3h1.21c2.29,0,2.29,2,2.29,2H13V2H3z"/>
+	<path d="M3,2v3h0.5c0,0,0-2,2.29-2H7v8.79C7,12.48,6.89,13,5,13v1h6v-1c-1.89,0-2-0.52-2-1.21V3h1.21c2.29,0,2.29,2,2.29,2H13V2H3z" />
 </svg>

frontend/assets/icon-16px-solid/node-transform.svg

@@ -1,3 +1,3 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M15,12l-5-3v2H6.95C6.75,10.02,5.98,9.25,5,9.05V6h2L4,1L1,6h2v3.51c-0.6,0.46-1,1.17-1,1.99C2,12.88,3.12,14,4.5,14c0.82,0,1.53-0.4,1.99-1H10v2L15,12z M4.5,12.5c-0.55,0-1-0.45-1-1c0-0.55,0.45-1,1-1s1,0.45,1,1C5.5,12.05,5.05,12.5,4.5,12.5z" />
 </svg>

frontend/assets/icon-16px-solid/node.svg

@@ -1,5 +1,5 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-	<path d="M12,2h-2v1h2c1.1,0,2,.9,2,2v6c0,1.1-.9,2-2,2H4c-1.1,0-2-.9-2-2v-3h-1v3c0,1.65,1.35,3,3,3h8c1.65,0,3-1.35,3-3v-6c0-1.65-1.35-3-3-3Z" />
+	<path d="M12,2h-2v1h2c1.1,0,2,.9,2,2v6c0,1.1-.9,2-2,2H4c-1.1,0-2-.9-2-2v-3h-1v3c0,1.65,1.35,3,3,3h8c1.65,0,3-1.35,3-3v-6c0-1.65-1.35-3-3-3z" />
 	<polygon points="10.25 9.25 12.5 8.5 10.25 7.75 9.5 5.5 8.75 7.75 6.5 8.5 8.75 9.25 9.5 11.5 10.25 9.25" />
 	<polygon points="5.3 5.3 8.5 4.5 5.3 3.7 4.5 .5 3.7 3.7 .5 4.5 3.7 5.3 4.5 8.5 5.3 5.3" />
 </svg>

frontend/assets/icon-16px-solid/save.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M12,1H2c-.55,0-1,.45-1,1v12c0,.55.45,1,1,1h12c.55,0,1-.45,1-1V4l-3-3ZM9,2h2v3h-2v-3ZM12,14H4v-5h8v5ZM14,14h-1v-5c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1v5h-1V2h2v3c0,.55.45,1,1,1h6c.55,0,1-.45,1-1v-2.59l2,2v9.59z" />
+</svg>

frontend/assets/icon-16px-solid/select-all.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<rect x="2" y="5" width="1" height="2" />
+	<rect x="13" y="5" width="1" height="2" />
+	<rect x="13" y="9" width="1" height="2" />
+	<rect x="2" y="9" width="1" height="2" />
+	<polygon points="3 14 3 13 2 13 2 15 5 15 5 14 3 14" />
+	<polygon points="13 13 13 14 11 14 11 15 14 15 14 13 13 13" />
+	<rect x="7" y="1" width="2" height="1" />
+	<rect x="7" y="14" width="2" height="1" />
+	<polygon points="2 1 2 3 3 3 3 2 5 2 5 1 2 1" />
+	<polygon points="11 1 11 2 13 2 13 3 14 3 14 1 11 1" />
+	<circle cx="6.5" cy="5.5" r="2.5" />
+	<circle cx="10" cy="11" r="2" />
+</svg>

frontend/assets/icon-16px-solid/small-dot.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<circle cx="8" cy="8" r="3" />
+</svg>

frontend/assets/icon-16px-solid/stack-bottom.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M15.45,4.83l-6.56-3.62c-.56-.27-1.22-.27-1.78,0L.55,4.83C.18,5.03,0,5.3,0,5.57c0,.27.18.54.55.74l6.56,3.62c.56.27,1.22.27,1.78,0l6.56-3.62c.37-.2.55-.47.55-.74,0-.27-.18-.54-.55-.74ZM8.47,8.87c-.3.12-.63.12-.93,0L1.57,5.57l5.97-3.3c.3-.12.63-.12.93,0l5.97,3.3-5.97,3.3z" />
+	<path d="M15.45,9.69l-1.88-1.04-4.68,2.59c-.56.27-1.22.27-1.79,0l-4.68-2.59-1.88,1.04c-.74.41-.74,1.07,0,1.48l6.56,3.62c.56.27,1.22.27,1.79,0l6.55-3.62c.74-.41.74-1.07,0-1.48z" />
+</svg>

frontend/assets/icon-16px-solid/stack-hollow.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M15.45,4.83l-6.56-3.62c-.56-.27-1.22-.27-1.78,0L.55,4.83C.18,5.03,0,5.3,0,5.57c0,.27.18.54.55.74l6.56,3.62c.56.27,1.22.27,1.78,0l6.56-3.62c.37-.2.55-.47.55-.74,0-.27-.18-.54-.55-.74ZM8.47,8.87c-.3.12-.63.12-.93,0L1.57,5.57l5.97-3.3c.3-.12.63-.12.93,0l5.97,3.3-5.97,3.3z" />
+	<path d="M15.45,9.69l-1.88-1.04-1.18.65,2.04,1.13-5.97,3.3c-.3.12-.63.12-.93,0l-5.97-3.3,2.04-1.13-1.18-.65-1.88,1.04c-.74.41-.74,1.07,0,1.48l6.56,3.63c.56.27,1.22.27,1.78,0l6.56-3.62c.74-.41.74-1.07,0-1.48z" />
+</svg>

frontend/assets/icon-16px-solid/stack-lower.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M9,10.38c-.32.11-.66.19-1,.19s-.68-.08-1-.19v2.62h-2l3,3,3-3h-2v-2.62z" />
+	<path d="M8,3c-.55,0-1,.45-1,1v1h2v-1c0-.55-.45-1-1-1z" />
+	<path d="M15.69,4.42c-.07-.06-.15-.11-.24-.16l-5.45-3.01h0l-1.11-.61c-.56-.27-1.22-.27-1.78,0L.55,4.26c-.09.05-.17.11-.24.16C.1,4.6,0,4.8,0,5c0,.2.1.4.31.58.07.06.15.11.24.16l5.45,3.01h0l1.11.61c.56.27,1.22.27,1.78,0l6.56-3.62c.09-.05.17-.11.24-.16.21-.17.31-.38.31-.58,0-.2-.1-.4-.31-.58ZM8.47,8.3c-.3.12-.63.12-.93,0L1.57,5,7.53,1.7c.3-.12.63-.12.93,0l5.97,3.3-5.97,3.3z" />
+</svg>

frontend/assets/icon-16px-solid/stack-raise.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M15.45,9.26l-5.45-3.01v1.3l4.43,2.45-5.97,3.3c-.3.12-.63.12-.93,0l-5.97-3.3,4.43-2.45v-1.3L.55,9.26c-.37.2-.55.47-.55.74s.18.54.55.74l6.56,3.62c.56.27,1.22.27,1.78,0l6.56-3.62c.37-.2.55-.47.55-.74s-.18-.54-.55-.74z" />
+	<polygon points="11 5 8 2 5 5 7 5 7 10 9 10 9 5 11 5" />
+</svg>

frontend/assets/icon-16px-solid/stack-reverse.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon points="11 3 8 0 5 3 7 3 7 6 9 6 9 3 11 3" />
+	<path d="M9,11.38c-.32.11-.66.19-1,.19s-.68-.08-1-.19v1.62h-2l3,3,3-3h-2v-1.62z" />
+	<path d="M15.45,5.26l-2.28-1.26h-2.35l3.62,2-5.97,3.3c-.3.12-.63.12-.93,0L1.56,6l3.62-2h-2.35l-2.28,1.26c-.37.2-.55.47-.55.74s.18.54.55.74l6.56,3.62c.56.27,1.22.27,1.78,0l6.56-3.62c.37-.2.55-.47.55-.74s-.18-.54-.55-.74z" />
+</svg>

frontend/assets/icon-16px-solid/stack.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
-	<path d="M15.4,9.7l-1.9-1-1.2.7,2,1.1-6,3.3c-.3.1-.6.1-.9,0l-6-3.3,2-1.1-1.2-.7-1.9,1c-.7.4-.7,1.1,0,1.5l6.6,3.6c.6.3,1.2.3,1.8,0l6.6-3.6c.7-.4.7-1.1,0-1.5Z" />
+	<path d="M15.45,9.69l-1.88-1.04-1.18.65,2.04,1.13-5.97,3.3c-.3.12-.63.12-.93,0l-5.97-3.3,2.04-1.13-1.18-.65-1.88,1.04c-.74.41-.74,1.07,0,1.48l6.56,3.63c.56.27,1.22.27,1.78,0l6.56-3.62c.74-.41.74-1.07,0-1.48z" />
-	<path d="M7.1,9.9L.6,6.3c-.7-.4-.7-1.1,0-1.5L7.1,1.2c.6-.3,1.2-.3,1.8,0l6.6,3.6c.7.4.7,1.1,0,1.5l-6.6,3.6c-.6.3-1.2.3-1.8,0Z" />
+	<path d="M7.11,9.94L.55,6.31c-.74-.41-.74-1.07,0-1.48L7.11,1.2c.56-.27,1.22-.27,1.78,0l6.56,3.63c.74.41.74,1.07,0,1.48l-6.56,3.63c-.56.27-1.22.27-1.78,0z" />
 </svg>

frontend/assets/icon-16px-solid/tilt-reset.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M11.01,1.44l.36,1.24c2.15,1.06,3.63,3.27,3.63,5.82,0,3.58-2.92,6.5-6.5,6.5s-6.5-2.92-6.5-6.5c0-2.55,1.48-4.76,3.63-5.82l.36-1.24C3.09,2.47,1,5.24,1,8.5c0,4.14,3.36,7.5,7.5,7.5s7.5-3.36,7.5-7.5c0-3.26-2.09-6.03-4.99-7.06z" />
+	<path d="M8.5,0l-2.5,8.5,2.5,5.5,2.5-5.5L8.5,0ZM7,8.5c0-.5,3-.5,3,0l-1.5,3.5-1.5-3.5z" />
+	<circle cx="13.5" cy="8.5" r=".5" />
+	<circle cx="3.5" cy="8.5" r=".5" />
+</svg>

frontend/assets/icon-16px-solid/tilt.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M15.27,5.28l-.62,1.13c.22.66.35,1.36.35,2.09,0,3.58-2.92,6.5-6.5,6.5s-6.5-2.92-6.5-6.5,2.92-6.5,6.5-6.5c.73,0,1.43.13,2.09.35l1.13-.62c-.98-.47-2.07-.73-3.22-.73C4.36,1,1,4.36,1,8.5s3.36,7.5,7.5,7.5,7.5-3.36,7.5-7.5c0-1.15-.27-2.24-.73-3.22z" />
+	<path d="M14.51,2.49l-7.78,4.24-2.12,5.66,5.66-2.12,4.24-7.78ZM7.44,7.44c.35-.35,2.47,1.77,2.12,2.12l-3.54,1.41,1.41-3.54z" />
+	<circle cx="13.5" cy="8.5" r=".5" />
+	<circle cx="3.5" cy="8.5" r=".5" />
+	<circle cx="8.5" cy="13.5" r=".5" />
+	<circle cx="8.5" cy="3.5" r=".5" />
+</svg>

frontend/assets/icon-16px-solid/transformation-grab.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<circle cx="3.5" cy="12.5" r="1.25" />
+	<polygon points="3 9 4 9 4 4 6 4 3.5 1 1 4 3 4 3 9" />
+	<polygon points="15 12.5 12 10 12 12 7 12 7 13 12 13 12 15 15 12.5" />
+</svg>

frontend/assets/icon-16px-solid/transformation-rotate.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon ="15 12.5 12 10 12 12 4 12 4 4 6 4 3.5 1 1 4 3 4 3 13 12 13 12 15 15 12.5" />
+	<path d="M13.5,5l-2.5,3h2c0,2.76-2.24,5-5,5v1c3.31,0,6-2.69,6-6h2l-2.5-3z" />
+	<path d="M9,4v-1c-3.31,0-6,2.69-6,6H1l2.5,3,2.5-3h-2c0-2.76,2.24-5,5-5z" />
+	<circle cx="8.5" cy="8.5" r="1.25" />
+</svg>

frontend/assets/icon-16px-solid/transformation-scale.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<circle cx="8.5" cy="8.5" r="1.25" />
+	<path d="M11.29,10.59c-.2.27-.44.51-.71.71l3.55,3.55c.25-.22.49-.46.71-.71l-3.55-3.55z" />
+	<path d="M5.71,6.41c.2-.27.44-.51.71-.71l-3.55-3.55c-.25.22-.49.46-.71.71l3.55,3.55z" />
+	<polygon points="15 15 15 11.5 11.5 15 15 15" />
+	<polygon points="2 2 2 5.5 5.5 2 2 2" />
+</svg>

frontend/assets/icon-16px-solid/trash.svg

@@ -1,4 +1,4 @@
-<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
 	<path d="M11,6v7c0,0.5-0.4,1-0.9,1H4.9C4.4,14,4,13.5,4,13V6H11z M12,5H3v8c0,1.1,0.8,1.9,1.8,2h0h5.3h0c1-0.1,1.8-1,1.8-2V5z" />
 	<path d="M12,3h-2c0-1.1-0.9-2-2-2H7C5.9,1,5,1.9,5,3H3C2.4,3,2,3.4,2,4h11C13,3.4,12.6,3,12,3 M7,2h1c0.6,0,1,0.4,1,1H6C6,2.4,6.4,2,7,2" />
 	<path d="M6,12.5C6,12.8,5.8,13,5.5,13S5,12.8,5,12.5v-5C5,7.2,5.2,7,5.5,7S6,7.2,6,7.5V12.5z" />

frontend/assets/icon-16px-solid/user-manual.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<polygon points="9 9 9 5 7 5 7 6 8 6 8 9 7 9 7 10 10 10 10 9 9 9" />
+	<circle cx="8.25" cy="3.25" r=".75" />
+	<path d="M14,0H5c-1.1,0-2,.9-2,2v11.5c0-1.97.42-2.39,1-2.47V2c0-.55.45-1,1-1h8v11H4.5c-.18,0-.34.04-.5.09-.58.21-1,.76-1,1.41,0,.83.67,1.5,1.5,1.5h9.5v-.21c-.3-.26-.5-.74-.5-1.29s.2-1.03.5-1.29V0ZM12.54,14H4.5c-.28,0-.5-.22-.5-.5s.22-.5.5-.5h8.04c-.03.16-.04.33-.04.5s.01.34.04.5z" />
+</svg>

frontend/assets/icon-16px-solid/zoom-1x.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M2,7s1.42-.28,2.38-.84c0,0-.38,2.44-.38,6.84h2V3s-2.33,1.88-3.92,2.28l-.08,1.72z" />
+	<path d="M14,7h-2s-.34.73-1,1.84c-.66-1.1-1-1.84-1-1.84h-2s1.09,1.29,2.26,3.02c-.6.91-1.36,1.95-2.26,2.98h2c.3-.62.64-1.23,1-1.82.36.59.7,1.2,1,1.82h2c-.9-1.04-1.65-2.07-2.26-2.98,1.16-1.73,2.26-3.02,2.26-3.02z" />
+</svg>

frontend/assets/icon-16px-solid/zoom-2x.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+	<path d="M2.86,7.43c-.22-.88.15-2.05,1.51-2.32,1.64-.33,2.57,1.76-.04,3.35-1.12.68-2.33,1.56-2.92,2.67-.43.8-.41,1.87-.41,1.87h7v-1.71c-1.06.18-4.78.46-4.78.46.2-1.03,3.07-2.41,3.97-3.86,1.29-2.07.21-4.32-2.28-4.32-1.75,0-4.16.74-3.76,4.22l1.71-.35z" />
+	<path d="M15,7h-2s-.34.73-1,1.84c-.66-1.1-1-1.84-1-1.84h-2s1.09,1.29,2.26,3.02c-.6.91-1.36,1.95-2.26,2.98h2c.3-.62.64-1.23,1-1.82.36.59.7,1.2,1,1.82h2c-.9-1.04-1.65-2.07-2.26-2.98,1.16-1.73,2.26-3.02,2.26-3.02z" />
+</svg>

frontend/src/components/floating-menus/MenuList.svelte

@@ -429,7 +429,7 @@
 					on:pointerleave={() => !entry.disabled && onEntryPointerLeave(entry)}
 				>
 					{#if entry.icon && drawIcon}
-						<IconLabel icon={entry.icon} class="entry-icon" />
+						<IconLabel icon={entry.icon} iconSizeOverride={16} class="entry-icon" />
 					{:else if drawIcon}
 						<div class="no-icon" />
 					{/if}

frontend/src/components/widgets/WidgetSpan.svelte

@@ -10,6 +10,7 @@
 	import BreadcrumbTrailButtons from "@graphite/components/widgets/buttons/BreadcrumbTrailButtons.svelte";
 	import ColorButton from "@graphite/components/widgets/buttons/ColorButton.svelte";
 	import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
+	import ImageButton from "@graphite/components/widgets/buttons/ImageButton.svelte";
 	import ParameterExposeButton from "@graphite/components/widgets/buttons/ParameterExposeButton.svelte";
 	import PopoverButton from "@graphite/components/widgets/buttons/PopoverButton.svelte";
 	import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
@@ -24,7 +25,6 @@
 	import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
 	import WorkingColorsInput from "@graphite/components/widgets/inputs/WorkingColorsInput.svelte";
 	import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
-	import ImageLabel from "@graphite/components/widgets/labels/ImageLabel.svelte";
 	import Separator from "@graphite/components/widgets/labels/Separator.svelte";
 	import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
 	import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
@@ -124,9 +124,9 @@
 		{#if iconLabel}
 			<IconLabel {...exclude(iconLabel)} />
 		{/if}
-		{@const imageLabel = narrowWidgetProps(component.props, "ImageLabel")}
+		{@const imageButton = narrowWidgetProps(component.props, "ImageButton")}
-		{#if imageLabel}
+		{#if imageButton}
-			<ImageLabel {...exclude(imageLabel)} />
+			<ImageButton {...exclude(imageButton)} action={() => widgetValueCommitAndUpdate(index, undefined)} />
 		{/if}
 		{@const nodeCatalog = narrowWidgetProps(component.props, "NodeCatalog")}
 		{#if nodeCatalog}

frontend/src/components/widgets/buttons/ImageButton.svelte

@@ -9,13 +9,15 @@
 	export let width: string | undefined;
 	export let height: string | undefined;
 	export let tooltip: string | undefined = undefined;
+	// Callbacks
+	export let action: (e?: MouseEvent) => void;
 
 	$: extraClasses = Object.entries(classes)
 		.flatMap(([className, stateName]) => (stateName ? [className] : []))
 		.join(" ");
 </script>
 
-<img src={IMAGE_BASE64_STRINGS[image]} style:width style:height class={`image-label ${className} ${extraClasses}`.trim()} title={tooltip} alt="" />
+<img src={IMAGE_BASE64_STRINGS[image]} style:width style:height class={`image-label ${className} ${extraClasses}`.trim()} title={tooltip} alt="" on:click={action} />
 
 <style lang="scss" global>
 	.image-label {

frontend/src/components/widgets/labels/IconLabel.svelte

@@ -7,11 +7,12 @@
 	export { className as class };
 	export let classes: Record<string, boolean> = {};
 	export let icon: IconName;
+	export let iconSizeOverride: number | undefined = undefined;
 	export let disabled = false;
 	export let tooltip: string | undefined = undefined;
 
 	$: iconSizeClass = ((icon: IconName) => {
-		return `size-${ICONS[icon].size}`;
+		return `size-${iconSizeOverride || ICONS[icon].size}`;
 	})(icon);
 	$: extraClasses = Object.entries(classes)
 		.flatMap(([className, stateName]) => (stateName ? [className] : []))

frontend/src/components/widgets/labels/TextLabel.svelte

@@ -8,6 +8,7 @@
 	export let disabled = false;
 	export let bold = false;
 	export let italic = false;
+	export let centerAlign = false;
 	export let tableAlign = false;
 	export let minWidth = 0;
 	export let multiline = false;
@@ -27,6 +28,7 @@
 	class:bold
 	class:italic
 	class:multiline
+	class:center-align={centerAlign}
 	class:table-align={tableAlign}
 	style:min-width={minWidth > 0 ? `${minWidth}px` : ""}
 	style={`${styleName} ${extraStyles}`.trim() || undefined}
@@ -59,6 +61,10 @@
 			margin: 4px 0;
 		}
 
+		&.center-align {
+			text-align: center;
+		}
+
 		&.table-align {
 			flex: 0 0 30%;
 			text-align: right;

frontend/src/io-managers/localization.ts

@@ -14,7 +14,7 @@ function localizeTimestamp(utc: string): { timestamp: string; year: string } {
 	const date = new Date(utc);
 	if (Number.isNaN(date.getTime())) return { timestamp: utc, year: `${new Date().getFullYear()}` };
 
-	const timezoneName = Intl.DateTimeFormat(undefined, { timeZoneName: "long" })
+	const timezoneName = Intl.DateTimeFormat(undefined, { timeZoneName: "longGeneric" })
 		.formatToParts(new Date())
 		.find((part) => part.type === "timeZoneName");
 

frontend/src/messages.ts

@@ -1075,7 +1075,7 @@ export class IconLabel extends WidgetProps {
 	tooltip!: string | undefined;
 }
 
-export class ImageLabel extends WidgetProps {
+export class ImageButton extends WidgetProps {
 	image!: IconName;
 
 	@Transform(({ value }: { value: string }) => value || undefined)
@@ -1289,6 +1289,8 @@ export class TextLabel extends WidgetProps {
 
 	italic!: boolean;
 
+	centerAlign!: boolean;
+
 	tableAlign!: boolean;
 
 	minWidth!: number;
@@ -1317,8 +1319,8 @@ const widgetSubTypes = [
 	{ value: DropdownInput, name: "DropdownInput" },
 	{ value: FontInput, name: "FontInput" },
 	{ value: IconButton, name: "IconButton" },
+	{ value: ImageButton, name: "ImageButton" },
 	{ value: IconLabel, name: "IconLabel" },
-	{ value: ImageLabel, name: "ImageLabel" },
 	{ value: NodeCatalog, name: "NodeCatalog" },
 	{ value: NumberInput, name: "NumberInput" },
 	{ value: ParameterExposeButton, name: "ParameterExposeButton" },

frontend/src/utility-functions/icons.ts

@@ -104,25 +104,37 @@ import BooleanIntersect from "@graphite-frontend/assets/icon-16px-solid/boolean-
 import BooleanSubtractBack from "@graphite-frontend/assets/icon-16px-solid/boolean-subtract-back.svg";
 import BooleanSubtractFront from "@graphite-frontend/assets/icon-16px-solid/boolean-subtract-front.svg";
 import BooleanUnion from "@graphite-frontend/assets/icon-16px-solid/boolean-union.svg";
+import Bug from "@graphite-frontend/assets/icon-16px-solid/bug.svg";
 import CheckboxChecked from "@graphite-frontend/assets/icon-16px-solid/checkbox-checked.svg";
 import CheckboxUnchecked from "@graphite-frontend/assets/icon-16px-solid/checkbox-unchecked.svg";
+import CloseAll from "@graphite-frontend/assets/icon-16px-solid/close-all.svg";
+import Close from "@graphite-frontend/assets/icon-16px-solid/close.svg";
+import Code from "@graphite-frontend/assets/icon-16px-solid/code.svg";
 import Copy from "@graphite-frontend/assets/icon-16px-solid/copy.svg";
 import Credits from "@graphite-frontend/assets/icon-16px-solid/credits.svg";
 import CustomColor from "@graphite-frontend/assets/icon-16px-solid/custom-color.svg";
 import Cut from "@graphite-frontend/assets/icon-16px-solid/cut.svg";
+import DeselectAll from "@graphite-frontend/assets/icon-16px-solid/deselect-all.svg";
 import Edit from "@graphite-frontend/assets/icon-16px-solid/edit.svg";
+import Empty from "@graphite-frontend/assets/icon-16px-solid/empty.svg";
 import EyeHidden from "@graphite-frontend/assets/icon-16px-solid/eye-hidden.svg";
 import EyeHide from "@graphite-frontend/assets/icon-16px-solid/eye-hide.svg";
 import EyeShow from "@graphite-frontend/assets/icon-16px-solid/eye-show.svg";
 import EyeVisible from "@graphite-frontend/assets/icon-16px-solid/eye-visible.svg";
 import Eyedropper from "@graphite-frontend/assets/icon-16px-solid/eyedropper.svg";
+import FileExport from "@graphite-frontend/assets/icon-16px-solid/file-export.svg";
+import FileImport from "@graphite-frontend/assets/icon-16px-solid/file-import.svg";
 import File from "@graphite-frontend/assets/icon-16px-solid/file.svg";
 import FlipHorizontal from "@graphite-frontend/assets/icon-16px-solid/flip-horizontal.svg";
 import FlipVertical from "@graphite-frontend/assets/icon-16px-solid/flip-vertical.svg";
 import Folder from "@graphite-frontend/assets/icon-16px-solid/folder.svg";
+import FrameAll from "@graphite-frontend/assets/icon-16px-solid/frame-all.svg";
+import FrameSelected from "@graphite-frontend/assets/icon-16px-solid/frame-selected.svg";
 import GraphViewClosed from "@graphite-frontend/assets/icon-16px-solid/graph-view-closed.svg";
 import GraphViewOpen from "@graphite-frontend/assets/icon-16px-solid/graph-view-open.svg";
 import GraphiteLogo from "@graphite-frontend/assets/icon-16px-solid/graphite-logo.svg";
+import HistoryRedo from "@graphite-frontend/assets/icon-16px-solid/history-redo.svg";
+import HistoryUndo from "@graphite-frontend/assets/icon-16px-solid/history-undo.svg";
 import IconsGrid from "@graphite-frontend/assets/icon-16px-solid/icons-grid.svg";
 import Image from "@graphite-frontend/assets/icon-16px-solid/image.svg";
 import Layer from "@graphite-frontend/assets/icon-16px-solid/layer.svg";
@@ -148,16 +160,29 @@ import Paste from "@graphite-frontend/assets/icon-16px-solid/paste.svg";
 import PinActive from "@graphite-frontend/assets/icon-16px-solid/pin-active.svg";
 import PinInactive from "@graphite-frontend/assets/icon-16px-solid/pin-inactive.svg";
 import Random from "@graphite-frontend/assets/icon-16px-solid/random.svg";
-import Regenerate from "@graphite-frontend/assets/icon-16px-solid/regenerate.svg";
 import Reload from "@graphite-frontend/assets/icon-16px-solid/reload.svg";
-import Rescale from "@graphite-frontend/assets/icon-16px-solid/rescale.svg";
 import Reset from "@graphite-frontend/assets/icon-16px-solid/reset.svg";
+import Resync from "@graphite-frontend/assets/icon-16px-solid/resync.svg";
 import ReverseRadialGradientToLeft from "@graphite-frontend/assets/icon-16px-solid/reverse-radial-gradient-to-left.svg";
 import ReverseRadialGradientToRight from "@graphite-frontend/assets/icon-16px-solid/reverse-radial-gradient-to-right.svg";
 import Reverse from "@graphite-frontend/assets/icon-16px-solid/reverse.svg";
+import Save from "@graphite-frontend/assets/icon-16px-solid/save.svg";
+import SelectAll from "@graphite-frontend/assets/icon-16px-solid/select-all.svg";
 import Settings from "@graphite-frontend/assets/icon-16px-solid/settings.svg";
+import SmallDot from "@graphite-frontend/assets/icon-16px-solid/small-dot.svg";
+import StackBottom from "@graphite-frontend/assets/icon-16px-solid/stack-bottom.svg";
+import StackHollow from "@graphite-frontend/assets/icon-16px-solid/stack-hollow.svg";
+import StackLower from "@graphite-frontend/assets/icon-16px-solid/stack-lower.svg";
+import StackRaise from "@graphite-frontend/assets/icon-16px-solid/stack-raise.svg";
+import StackReverse from "@graphite-frontend/assets/icon-16px-solid/stack-reverse.svg";
 import Stack from "@graphite-frontend/assets/icon-16px-solid/stack.svg";
+import TiltReset from "@graphite-frontend/assets/icon-16px-solid/tilt-reset.svg";
+import Tilt from "@graphite-frontend/assets/icon-16px-solid/tilt.svg";
+import TransformationGrab from "@graphite-frontend/assets/icon-16px-solid/transformation-grab.svg";
+import TransformationRotate from "@graphite-frontend/assets/icon-16px-solid/transformation-rotate.svg";
+import TransformationScale from "@graphite-frontend/assets/icon-16px-solid/transformation-scale.svg";
 import Trash from "@graphite-frontend/assets/icon-16px-solid/trash.svg";
+import UserManual from "@graphite-frontend/assets/icon-16px-solid/user-manual.svg";
 import ViewModeNormal from "@graphite-frontend/assets/icon-16px-solid/view-mode-normal.svg";
 import ViewModeOutline from "@graphite-frontend/assets/icon-16px-solid/view-mode-outline.svg";
 import ViewModePixels from "@graphite-frontend/assets/icon-16px-solid/view-mode-pixels.svg";
@@ -168,6 +193,8 @@ import Volunteer from "@graphite-frontend/assets/icon-16px-solid/volunteer.svg";
 import Website from "@graphite-frontend/assets/icon-16px-solid/website.svg";
 import WorkingColorsPrimary from "@graphite-frontend/assets/icon-16px-solid/working-colors-primary.svg";
 import WorkingColorsSecondary from "@graphite-frontend/assets/icon-16px-solid/working-colors-secondary.svg";
+import Zoom1x from "@graphite-frontend/assets/icon-16px-solid/zoom-1x.svg";
+import Zoom2x from "@graphite-frontend/assets/icon-16px-solid/zoom-2x.svg";
 import ZoomIn from "@graphite-frontend/assets/icon-16px-solid/zoom-in.svg";
 import ZoomOut from "@graphite-frontend/assets/icon-16px-solid/zoom-out.svg";
 import ZoomReset from "@graphite-frontend/assets/icon-16px-solid/zoom-reset.svg";
@@ -186,25 +213,37 @@ const SOLID_16PX = {
 	BooleanSubtractBack: { svg: BooleanSubtractBack, size: 16 },
 	BooleanSubtractFront: { svg: BooleanSubtractFront, size: 16 },
 	BooleanUnion: { svg: BooleanUnion, size: 16 },
+	Bug: { svg: Bug, size: 16 },
 	CheckboxChecked: { svg: CheckboxChecked, size: 16 },
 	CheckboxUnchecked: { svg: CheckboxUnchecked, size: 16 },
+	Close: { svg: Close, size: 16 },
+	CloseAll: { svg: CloseAll, size: 16 },
+	Code: { svg: Code, size: 16 },
 	Copy: { svg: Copy, size: 16 },
 	Credits: { svg: Credits, size: 16 },
 	CustomColor: { svg: CustomColor, size: 16 },
 	Cut: { svg: Cut, size: 16 },
+	DeselectAll: { svg: DeselectAll, size: 16 },
 	Edit: { svg: Edit, size: 16 },
+	Empty: { svg: Empty, size: 16 },
 	Eyedropper: { svg: Eyedropper, size: 16 },
 	EyeHidden: { svg: EyeHidden, size: 16 },
 	EyeHide: { svg: EyeHide, size: 16 },
 	EyeShow: { svg: EyeShow, size: 16 },
 	EyeVisible: { svg: EyeVisible, size: 16 },
 	File: { svg: File, size: 16 },
+	FileExport: { svg: FileExport, size: 16 },
+	FileImport: { svg: FileImport, size: 16 },
 	FlipHorizontal: { svg: FlipHorizontal, size: 16 },
 	FlipVertical: { svg: FlipVertical, size: 16 },
 	Folder: { svg: Folder, size: 16 },
+	FrameAll: { svg: FrameAll, size: 16 },
+	FrameSelected: { svg: FrameSelected, size: 16 },
 	GraphiteLogo: { svg: GraphiteLogo, size: 16 },
 	GraphViewClosed: { svg: GraphViewClosed, size: 16 },
 	GraphViewOpen: { svg: GraphViewOpen, size: 16 },
+	HistoryRedo: { svg: HistoryRedo, size: 16 },
+	HistoryUndo: { svg: HistoryUndo, size: 16 },
 	IconsGrid: { svg: IconsGrid, size: 16 },
 	Image: { svg: Image, size: 16 },
 	Layer: { svg: Layer, size: 16 },
@@ -230,16 +269,29 @@ const SOLID_16PX = {
 	PinActive: { svg: PinActive, size: 16 },
 	PinInactive: { svg: PinInactive, size: 16 },
 	Random: { svg: Random, size: 16 },
-	Regenerate: { svg: Regenerate, size: 16 },
 	Reload: { svg: Reload, size: 16 },
-	Rescale: { svg: Rescale, size: 16 },
 	Reset: { svg: Reset, size: 16 },
+	Resync: { svg: Resync, size: 16 },
 	Reverse: { svg: Reverse, size: 16 },
 	ReverseRadialGradientToLeft: { svg: ReverseRadialGradientToLeft, size: 16 },
 	ReverseRadialGradientToRight: { svg: ReverseRadialGradientToRight, size: 16 },
+	Save: { svg: Save, size: 16 },
+	SelectAll: { svg: SelectAll, size: 16 },
 	Settings: { svg: Settings, size: 16 },
+	SmallDot: { svg: SmallDot, size: 16 },
 	Stack: { svg: Stack, size: 16 },
+	StackBottom: { svg: StackBottom, size: 16 },
+	StackHollow: { svg: StackHollow, size: 16 },
+	StackLower: { svg: StackLower, size: 16 },
+	StackRaise: { svg: StackRaise, size: 16 },
+	StackReverse: { svg: StackReverse, size: 16 },
+	Tilt: { svg: Tilt, size: 16 },
+	TiltReset: { svg: TiltReset, size: 16 },
+	TransformationGrab: { svg: TransformationGrab, size: 16 },
+	TransformationRotate: { svg: TransformationRotate, size: 16 },
+	TransformationScale: { svg: TransformationScale, size: 16 },
 	Trash: { svg: Trash, size: 16 },
+	UserManual: { svg: UserManual, size: 16 },
 	ViewModeNormal: { svg: ViewModeNormal, size: 16 },
 	ViewModeOutline: { svg: ViewModeOutline, size: 16 },
 	ViewModePixels: { svg: ViewModePixels, size: 16 },
@@ -250,6 +302,8 @@ const SOLID_16PX = {
 	Website: { svg: Website, size: 16 },
 	WorkingColorsPrimary: { svg: WorkingColorsPrimary, size: 16 },
 	WorkingColorsSecondary: { svg: WorkingColorsSecondary, size: 16 },
+	Zoom1x: { svg: Zoom1x, size: 16 },
+	Zoom2x: { svg: Zoom2x, size: 16 },
 	ZoomIn: { svg: ZoomIn, size: 16 },
 	ZoomOut: { svg: ZoomOut, size: 16 },
 	ZoomReset: { svg: ZoomReset, size: 16 },