29.6.10 release

Author: davidjgraph

.claude/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.0.1",
+  "configurations": [
+    {
+      "name": "dos-drawio",
+      "runtimeExecutable": "python3",
+      "runtimeArgs": ["-m", "http.server", "8765"],
+      "port": 8765
+    }
+  ]
+}

ChangeLog

@@ -1,3 +1,27 @@
+02-APR-2026: 29.6.10
+
+- Fixes build dashboard URL
+- Fixes selection only option in print dialog for single page files [jgraph/drawio#5530]
+- Remove unused GraphViewer.mergeXmlDelta and helper functions
+- Adds pop effect easter egg to create hash property
+- Add collapsible sections to format panel
+- Increase sidebar padding and spacing for lighter feel
+- Increase sidebar padding and spacing for lighter feel
+- Enhance More Shapes dialog with new styles and layout adjustments
+- Improve More Shapes dialog footer spacing and alignment
+
+01-APR-2026: 29.6.9
+
+- Adds elastic pop animation and popIn/popOut custom link actions
+- fix: skip spacebar panning when focus is in a form element [jgraph/drawio#5529]
+
+31-MAR-2026: 29.6.8
+
+- Adds GraphViewer.mergeXmlDelta
+- Fixes dy is not defined in EditorUi.showPublishLinkDialog
+- Fixes TypeError in translateCell for invalid geometry objects
+- Fixes TypeError in GraphViewer hiddenTags when diagrams is undefined
+
 31-MAR-2026: 29.6.7
 
 - Adds compressed XML support for SVG CLI export [jgraph/drawio-desktop#2143]

VERSION

@@ -1 +1 @@
-29.6.7
+29.6.10

src/main/webapp/js/app.min.js

@@ -3704,13 +3704,30 @@ App.prototype.executeCreateObject = function(value, done)
 					// Fits diagram to window
 					this.initialFitDiagram(1.2);
 
+					// Easter egg: pop effect animates all cells on load
+					if (value.effect == 'pop')
+					{
+						var graph = this.editor.graph;
+						var cells = graph.model.getDescendants(
+							graph.model.getRoot());
+						var nodes = graph.getNodesForCells(cells);
+						Graph.setOpacityForNodes(nodes, 0);
+
+						window.setTimeout(mxUtils.bind(this, function()
+						{
+							var animations = graph.createPopAnimations(
+								cells, true);
+							graph.executeAnimations(animations);
+						}), 200);
+					}
+
 					// Needs to go before upate of hash if
 					// it replaces the history state
 					if (done != null)
 					{
 						done();
 					}
-					
+
 					// Sets create value with compressed XML
 					value.type = 'xml';
 					value.compressed = true;

src/main/webapp/js/diagramly/App.js

@@ -10275,31 +10275,27 @@ var MoreShapesDialog = function(editorUi, expanded, entries)
 			{
 				(function(section)
 				{
-					var title = listEntry.cloneNode(false);
-					title.style.fontWeight = 'bold';
-					title.style.backgroundColor = 'light-dark(#e5e5e5, #505759)';
-					title.style.padding = '6px 0px 6px 20px';
+					var title = document.createElement('div');
+					title.className = 'geMoreShapesSectionHeader';
 					mxUtils.write(title, section.title);
 					list.appendChild(title);
 
 					for (var j = 0; j < section.entries.length; j++)
 					{
 						(function(entry)
 						{
-							var option = listEntry.cloneNode(false);
-							option.style.cursor = 'pointer';
-							option.style.padding = '4px 0px 4px 20px';
-							option.style.whiteSpace = 'nowrap';
-							option.style.overflow = 'hidden';
-							option.style.textOverflow = 'ellipsis';
+							var option = document.createElement('div');
+							option.className = 'geMoreShapesItem';
 							option.setAttribute('title', entry.title + ' (' + entry.id + ')');
-							
+
 							var checkbox = document.createElement('input');
 							checkbox.setAttribute('type', 'checkbox');
 							checkbox.checked = editorUi.sidebar.isEntryVisible(entry.id);
 							checkbox.defaultChecked = checkbox.checked;
 							option.appendChild(checkbox);
-							mxUtils.write(option, ' ' + entry.title);
+							var label = document.createElement('span');
+							mxUtils.write(label, entry.title);
+							option.appendChild(label);
 
 							list.appendChild(option);
 
@@ -10345,11 +10341,11 @@ var MoreShapesDialog = function(editorUi, expanded, entries)
 
 									if (currentListItem != null)
 									{
-										currentListItem.style.backgroundColor = '';
+										currentListItem.classList.remove('geMoreShapesItemSelected');
 									}
-									
+
 									currentListItem = option;
-									currentListItem.style.backgroundColor = 'light-dark(#ebf2f9, #000000)';
+									currentListItem.classList.add('geMoreShapesItemSelected');
 
 									if (evt != null)
 									{
@@ -10397,30 +10393,23 @@ var MoreShapesDialog = function(editorUi, expanded, entries)
 		list.style.position = 'absolute';
 		list.style.top = '40px';
 		list.style.left = '0px';
-		list.style.width = '202px';
-		list.style.bottom = '60px';
+		list.style.width = '220px';
+		list.style.bottom = '70px';
 		list.style.overflow = 'auto';
-		
+
+		preview.className = 'geMoreShapesPreview';
 		preview.style.position = 'absolute';
-		preview.style.left = '202px';
+		preview.style.left = '220px';
 		preview.style.right = '0px';
 		preview.style.top = '40px';
-		preview.style.bottom = '60px';
+		preview.style.bottom = '70px';
 		preview.style.overflow = 'auto';
-		preview.style.borderLeftStyle = 'solid';
-		preview.style.borderLeftWidth = '1px';
 		preview.style.textAlign = 'center';
-		
+
 		var currentListItem = null;
 		var applyFunctions = [];
-		
-		var listEntry = document.createElement('div');
-		listEntry.style.position = 'relative';
-		listEntry.style.left = '0px';
-		listEntry.style.right = '0px';
-		
+
 		addEntries(entries);
-		div.style.padding = '30px';
 
 		div.appendChild(hd);
 		div.appendChild(list);
@@ -10429,56 +10418,47 @@ var MoreShapesDialog = function(editorUi, expanded, entries)
 		var buttons = document.createElement('div');
 		buttons.className = 'geDialogFooter';
 		buttons.style.position = 'absolute';
+		buttons.style.display = 'flex';
+		buttons.style.alignItems = 'center';
 		buttons.style.paddingRight = '16px';
+		buttons.style.paddingLeft = '16px';
 		buttons.style.left = '0px';
 		buttons.style.right = '0px';
 		buttons.style.bottom = '0px';
-		buttons.style.height = '60px';
-		buttons.style.lineHeight = '52px';
-		
+		buttons.style.height = '70px';
+
+		var checksDiv = document.createElement('div');
+		checksDiv.className = 'geMoreShapesFooterChecks';
+
+		var labelsLabel = document.createElement('label');
+		labelsLabel.className = 'geMoreShapesFooterCheck';
 		var labels = document.createElement('input');
 		labels.setAttribute('type', 'checkbox');
-		labels.style.position = 'relative';
-		labels.style.top = '1px';
 		labels.checked = editorUi.sidebar.sidebarTitles;
 		labels.defaultChecked = labels.checked;
-		buttons.appendChild(labels);
-		var span = document.createElement('span');
-		mxUtils.write(span, ' ' + mxResources.get('labels'));
-		span.style.paddingRight = '20px';
-		buttons.appendChild(span);
-		
-		mxEvent.addListener(span, 'click', function(evt)
-		{
-			labels.checked = !labels.checked;
-			mxEvent.consume(evt);
-		});
+		labelsLabel.appendChild(labels);
+		var labelsText = document.createElement('span');
+		mxUtils.write(labelsText, mxResources.get('labels'));
+		labelsLabel.appendChild(labelsText);
+		checksDiv.appendChild(labelsLabel);
 
 		var cb = document.createElement('input');
 		cb.setAttribute('type', 'checkbox');
-		
+
 		if (isLocalStorage || mxClient.IS_CHROMEAPP)
 		{
-			var span = document.createElement('span');
-			span.style.paddingRight = '20px';
-			span.appendChild(cb);
-			mxUtils.write(span, ' ' + mxResources.get('rememberThisSetting'));
-			cb.style.position = 'relative';
-			cb.style.top = '1px';
+			var rememberLabel = document.createElement('label');
+			rememberLabel.className = 'geMoreShapesFooterCheck';
 			cb.checked = true;
 			cb.defaultChecked = true;
-			
-			mxEvent.addListener(span, 'click', function(evt)
-			{
-				if (mxEvent.getSource(evt) != cb)
-				{
-					cb.checked = !cb.checked;
-					mxEvent.consume(evt);
-				}
-			});
-			
-			buttons.appendChild(span);
+			rememberLabel.appendChild(cb);
+			var rememberText = document.createElement('span');
+			mxUtils.write(rememberText, mxResources.get('rememberThisSetting'));
+			rememberLabel.appendChild(rememberText);
+			checksDiv.appendChild(rememberLabel);
 		}
+
+		buttons.appendChild(checksDiv);
 
 		var cancelBtn = mxUtils.button(mxResources.get('cancel'), function()
 		{
@@ -10529,18 +10509,24 @@ var MoreShapesDialog = function(editorUi, expanded, entries)
 			editorUi.setSidebarTitles(labels.checked, cb.checked);
 		});
 		applyBtn.className = 'geBtn gePrimaryBtn';
-		
+
+		var btnsRight = document.createElement('div');
+		btnsRight.style.flex = '1';
+		btnsRight.style.textAlign = 'right';
+
 		if (editorUi.editor.cancelFirst)
 		{
-			buttons.appendChild(cancelBtn);
-			buttons.appendChild(applyBtn);
+			btnsRight.appendChild(cancelBtn);
+			btnsRight.appendChild(applyBtn);
 		}
 		else
 		{
-			buttons.appendChild(applyBtn);
-			buttons.appendChild(cancelBtn);
+			btnsRight.appendChild(applyBtn);
+			btnsRight.appendChild(cancelBtn);
 		}
-		
+
+		buttons.appendChild(btnsRight);
+
 		div.appendChild(buttons);
 	}
 	else

src/main/webapp/js/diagramly/Dialogs.js

@@ -8465,6 +8465,18 @@
 							this.getCellsForAction(action.wipeOut, true), false));
 					}
 
+					if (action.popIn != null)
+					{
+						animations = animations.concat(this.createPopAnimations(
+							this.getCellsForAction(action.popIn, true), true));
+					}
+
+					if (action.popOut != null)
+					{
+						animations = animations.concat(this.createPopAnimations(
+							this.getCellsForAction(action.popOut, true), false));
+					}
+
 					// Executes all actions that change cell states
 					if (action.toggle != null)
 					{
@@ -9630,7 +9642,7 @@
 		{
 			div.appendChild(pagesSection);
 		}
-		
+
 		// Selection only
 		var selectionSection = document.createElement('div');
 		selectionSection.className = 'geDialogCheckRow';
@@ -9656,7 +9668,17 @@
 
 		if (graph.isEnabled())
 		{
-			pagesSection.appendChild(selectionSection);
+			if (pageCount > 1)
+			{
+				pagesSection.appendChild(selectionSection);
+			}
+			else
+			{
+				var selectionWrapper = document.createElement('div');
+				selectionWrapper.className = 'geDialogSection';
+				selectionWrapper.appendChild(selectionSection);
+				div.appendChild(selectionWrapper);
+			}
 		}
 
 		if (!editorUi.isPagesEnabled() || editorUi.lastPrintPagesRadioChecked)

src/main/webapp/js/diagramly/Editor.js

@@ -7962,14 +7962,9 @@
 		var edit = editSection.getEditInput();
 
 		// Cannot disable lightbox in iframes
-		if (showFrameOption)
+		if (showFrameOption && lightbox.checkRow != null)
 		{
-			if (lightbox.checkRow != null)
-			{
-				lightbox.checkRow.style.display = 'none';
-			}
-
-			dy -= 20;
+			lightbox.checkRow.style.display = 'none';
 		}
 
 		var layers = this.addCheckbox(optSection, mxResources.get('layers'),