@elyra/canvas 13.15.0 → 13.16.0

package/dist/lib/canvas-controller.es.js

@@ -1,2 +1,2 @@
-import"../createClass-a140e270.js";import"../en-872b9ff3.js";import"../isArrayLikeObject-058fae1a.js";import"../get-0aeefae2.js";export{C as default}from"../canvas-controller-3f4f6f8a.js";import"./command-stack.es.js";import"../canvas-constants-3e720cc5.js";import"../canvas-logger-037c0c68.js";import"../common-canvas-utils-cc218b20.js";import"../inherits-860188e5.js";import"../datarecord-metadata-v3-schema-bb227243.js";import"uuid";import"redux";import"jsonschema";import"@elyra/pipeline-schemas";import"immutable";
+import"../createClass-a140e270.js";import"../en-872b9ff3.js";import"../isArrayLikeObject-058fae1a.js";import"../get-0aeefae2.js";export{C as default}from"../canvas-controller-c134dba5.js";import"./command-stack.es.js";import"../canvas-constants-3e720cc5.js";import"../canvas-logger-037c0c68.js";import"../common-canvas-utils-cc218b20.js";import"../inherits-860188e5.js";import"../datarecord-metadata-v3-schema-bb227243.js";import"uuid";import"redux";import"jsonschema";import"@elyra/pipeline-schemas";import"immutable";
 //# sourceMappingURL=canvas-controller.es.js.map

package/dist/lib/canvas-controller.js

@@ -1,2 +1,2 @@
-"use strict";require("../createClass-df7b07d6.js"),require("../en-72f12441.js"),require("../isArrayLikeObject-541cd370.js"),require("../get-ce68a4b3.js");var e=require("../canvas-controller-f38976ec.js");require("./command-stack.js"),require("../canvas-constants-6bc0dd7f.js"),require("../canvas-logger-45fa2be6.js"),require("../common-canvas-utils-6a327226.js"),require("../inherits-74e481d1.js"),require("../datarecord-metadata-v3-schema-df671574.js"),require("uuid"),require("redux"),require("jsonschema"),require("@elyra/pipeline-schemas"),require("immutable"),module.exports=e.CanvasController;
+"use strict";require("../createClass-df7b07d6.js"),require("../en-72f12441.js"),require("../isArrayLikeObject-541cd370.js"),require("../get-ce68a4b3.js");var e=require("../canvas-controller-98ea28eb.js");require("./command-stack.js"),require("../canvas-constants-6bc0dd7f.js"),require("../canvas-logger-45fa2be6.js"),require("../common-canvas-utils-6a327226.js"),require("../inherits-74e481d1.js"),require("../datarecord-metadata-v3-schema-df671574.js"),require("uuid"),require("redux"),require("jsonschema"),require("@elyra/pipeline-schemas"),require("immutable"),module.exports=e.CanvasController;
 //# sourceMappingURL=canvas-controller.js.map

package/dist/lib/canvas.es.js

@@ -1,2 +1,2 @@
-export{c as CommonCanvas}from"../common-canvas-4796f111.js";export{C as CanvasController}from"../canvas-controller-3f4f6f8a.js";import"../createClass-a140e270.js";import"../inherits-860188e5.js";import"react";import"react-redux";import"react-intl";import"../get-0aeefae2.js";import"../toolbar-aa394d30.js";import"../iconPropTypes-4cbeb95d-f4b5dc39.js";import"prop-types";import"../datarecord-metadata-v3-schema-bb227243.js";import"../en-872b9ff3.js";import"../isArrayLikeObject-058fae1a.js";import"../canvas-constants-3e720cc5.js";import"react-resize-detector";import"../keyboard-utils-18c50c59.js";import"../common-canvas-utils-cc218b20.js";import"./tooltip.es.js";import"react-portal";import"@carbon/react";import"uuid";import"react-inlinesvg";import"../bucket-9-7ad0e1b8.js";import"../icon-5f32b619.js";import"../bucket-3-64d04e07.js";import"../canvas-logger-037c0c68.js";import"../context-menu-wrapper-eb9cc697.js";import"react-dom";import"./command-stack.es.js";import"immutable";import"redux";import"jsonschema";import"@elyra/pipeline-schemas";
+export{c as CommonCanvas}from"../common-canvas-ee905f14.js";export{C as CanvasController}from"../canvas-controller-c134dba5.js";import"../createClass-a140e270.js";import"../inherits-860188e5.js";import"react";import"react-redux";import"react-intl";import"../get-0aeefae2.js";import"../toolbar-aa394d30.js";import"../iconPropTypes-4cbeb95d-f4b5dc39.js";import"prop-types";import"../datarecord-metadata-v3-schema-bb227243.js";import"../en-872b9ff3.js";import"../isArrayLikeObject-058fae1a.js";import"../canvas-constants-3e720cc5.js";import"react-resize-detector";import"../keyboard-utils-18c50c59.js";import"../common-canvas-utils-cc218b20.js";import"./tooltip.es.js";import"react-portal";import"@carbon/react";import"uuid";import"react-inlinesvg";import"../bucket-9-7ad0e1b8.js";import"../icon-5f32b619.js";import"../bucket-3-64d04e07.js";import"../canvas-logger-037c0c68.js";import"../context-menu-wrapper-eb9cc697.js";import"react-dom";import"./command-stack.es.js";import"immutable";import"redux";import"jsonschema";import"@elyra/pipeline-schemas";
 //# sourceMappingURL=canvas.es.js.map

package/dist/lib/canvas.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../common-canvas-f34148dc.js"),r=require("../canvas-controller-f38976ec.js");require("../createClass-df7b07d6.js"),require("../inherits-74e481d1.js"),require("react"),require("react-redux"),require("react-intl"),require("../get-ce68a4b3.js"),require("../toolbar-f58a9942.js"),require("../iconPropTypes-4cbeb95d-7a1b2520.js"),require("prop-types"),require("../datarecord-metadata-v3-schema-df671574.js"),require("../en-72f12441.js"),require("../isArrayLikeObject-541cd370.js"),require("../canvas-constants-6bc0dd7f.js"),require("react-resize-detector"),require("../keyboard-utils-75346513.js"),require("../common-canvas-utils-6a327226.js"),require("./tooltip.js"),require("react-portal"),require("@carbon/react"),require("uuid"),require("react-inlinesvg"),require("../bucket-9-ec902462.js"),require("../icon-e7b672ac.js"),require("../bucket-3-425f53cc.js"),require("../canvas-logger-45fa2be6.js"),require("../context-menu-wrapper-a0fc1308.js"),require("react-dom"),require("./command-stack.js"),require("immutable"),require("redux"),require("jsonschema"),require("@elyra/pipeline-schemas"),exports.CommonCanvas=e.commonCanvas,exports.CanvasController=r.CanvasController;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../common-canvas-a12b2116.js"),r=require("../canvas-controller-98ea28eb.js");require("../createClass-df7b07d6.js"),require("../inherits-74e481d1.js"),require("react"),require("react-redux"),require("react-intl"),require("../get-ce68a4b3.js"),require("../toolbar-f58a9942.js"),require("../iconPropTypes-4cbeb95d-7a1b2520.js"),require("prop-types"),require("../datarecord-metadata-v3-schema-df671574.js"),require("../en-72f12441.js"),require("../isArrayLikeObject-541cd370.js"),require("../canvas-constants-6bc0dd7f.js"),require("react-resize-detector"),require("../keyboard-utils-75346513.js"),require("../common-canvas-utils-6a327226.js"),require("./tooltip.js"),require("react-portal"),require("@carbon/react"),require("uuid"),require("react-inlinesvg"),require("../bucket-9-ec902462.js"),require("../icon-e7b672ac.js"),require("../bucket-3-425f53cc.js"),require("../canvas-logger-45fa2be6.js"),require("../context-menu-wrapper-a0fc1308.js"),require("react-dom"),require("./command-stack.js"),require("immutable"),require("redux"),require("jsonschema"),require("@elyra/pipeline-schemas"),exports.CommonCanvas=e.commonCanvas,exports.CanvasController=r.CanvasController;
 //# sourceMappingURL=canvas.js.map

package/dist/lib/properties.es.js

@@ -1,2 +1,2 @@
-export{c as CommonProperties,P as PropertiesController}from"../common-properties-5d7d30a3.js";export{F as FlexibleTable}from"../flexible-table-6fa3dba7.js";export{F as FieldPicker}from"../index-a62b6faf.js";export{clem}from"./properties/clem.es.js";export{getPythonHints}from"./properties/getPythonHints.es.js";import"../createClass-a140e270.js";import"../inherits-860188e5.js";import"react";import"../en-872b9ff3.js";import"../isArrayLikeObject-058fae1a.js";import"../get-0aeefae2.js";import"../canvas-constants-3e720cc5.js";import"../common-canvas-utils-cc218b20.js";import"../bucket-9-7ad0e1b8.js";import"../iconPropTypes-4cbeb95d-f4b5dc39.js";import"prop-types";import"../datarecord-metadata-v3-schema-bb227243.js";import"react-resize-detector";import"@carbon/react";import"react-portal";import"react-intl";import"react-redux";import"react-dom";import"../icon-5f32b619.js";import"react-inlinesvg";import"../bucket-3-64d04e07.js";import"uuid";import"./tooltip.es.js";import"redux";import"seedrandom";import"./command-stack.es.js";import"immutable";import"date-fns";import"../toolbar-aa394d30.js";import"../keyboard-utils-18c50c59.js";import"@codemirror/view";import"@codemirror/commands";import"codemirror";import"@codemirror/state";import"@codemirror/language";import"@codemirror/lang-python";import"@codemirror/lang-sql";import"@codemirror/lang-javascript";import"@codemirror/autocomplete";import"jsonschema";import"react-virtualized";import"react-draggable";
+export{c as CommonProperties,P as PropertiesController}from"../common-properties-b829036e.js";export{F as FlexibleTable}from"../flexible-table-6fa3dba7.js";export{F as FieldPicker}from"../index-a62b6faf.js";export{clem}from"./properties/clem.es.js";export{getPythonHints}from"./properties/getPythonHints.es.js";import"../createClass-a140e270.js";import"../inherits-860188e5.js";import"react";import"../en-872b9ff3.js";import"../isArrayLikeObject-058fae1a.js";import"../get-0aeefae2.js";import"../canvas-constants-3e720cc5.js";import"../common-canvas-utils-cc218b20.js";import"../bucket-9-7ad0e1b8.js";import"../iconPropTypes-4cbeb95d-f4b5dc39.js";import"prop-types";import"../datarecord-metadata-v3-schema-bb227243.js";import"react-resize-detector";import"@carbon/react";import"react-portal";import"react-intl";import"react-redux";import"react-dom";import"../icon-5f32b619.js";import"react-inlinesvg";import"../bucket-3-64d04e07.js";import"uuid";import"./tooltip.es.js";import"redux";import"seedrandom";import"./command-stack.es.js";import"immutable";import"date-fns";import"../toolbar-aa394d30.js";import"../keyboard-utils-18c50c59.js";import"@codemirror/view";import"@codemirror/commands";import"codemirror";import"@codemirror/state";import"@codemirror/language";import"@codemirror/lang-python";import"@codemirror/lang-sql";import"@codemirror/lang-javascript";import"@codemirror/autocomplete";import"jsonschema";import"react-virtualized";import"react-draggable";
 //# sourceMappingURL=properties.es.js.map

package/dist/lib/properties.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../common-properties-5a47972a.js"),r=require("../flexible-table-290fc108.js"),i=require("../index-632c879a.js"),o=require("./properties/clem.js"),t=require("./properties/getPythonHints.js");require("../createClass-df7b07d6.js"),require("../inherits-74e481d1.js"),require("react"),require("../en-72f12441.js"),require("../isArrayLikeObject-541cd370.js"),require("../get-ce68a4b3.js"),require("../canvas-constants-6bc0dd7f.js"),require("../common-canvas-utils-6a327226.js"),require("../bucket-9-ec902462.js"),require("../iconPropTypes-4cbeb95d-7a1b2520.js"),require("prop-types"),require("../datarecord-metadata-v3-schema-df671574.js"),require("react-resize-detector"),require("@carbon/react"),require("react-portal"),require("react-intl"),require("react-redux"),require("react-dom"),require("../icon-e7b672ac.js"),require("react-inlinesvg"),require("../bucket-3-425f53cc.js"),require("uuid"),require("./tooltip.js"),require("redux"),require("seedrandom"),require("./command-stack.js"),require("immutable"),require("date-fns"),require("../toolbar-f58a9942.js"),require("../keyboard-utils-75346513.js"),require("@codemirror/view"),require("@codemirror/commands"),require("codemirror"),require("@codemirror/state"),require("@codemirror/language"),require("@codemirror/lang-python"),require("@codemirror/lang-sql"),require("@codemirror/lang-javascript"),require("@codemirror/autocomplete"),require("jsonschema"),require("react-virtualized"),require("react-draggable"),exports.CommonProperties=e.commonProperties,exports.PropertiesController=e.PropertiesController,exports.FlexibleTable=r.FlexibleTable,exports.FieldPicker=i.FieldPicker,exports.clem=o.clem,exports.getPythonHints=t.getPythonHints;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../common-properties-629a8ee6.js"),r=require("../flexible-table-290fc108.js"),i=require("../index-632c879a.js"),o=require("./properties/clem.js"),t=require("./properties/getPythonHints.js");require("../createClass-df7b07d6.js"),require("../inherits-74e481d1.js"),require("react"),require("../en-72f12441.js"),require("../isArrayLikeObject-541cd370.js"),require("../get-ce68a4b3.js"),require("../canvas-constants-6bc0dd7f.js"),require("../common-canvas-utils-6a327226.js"),require("../bucket-9-ec902462.js"),require("../iconPropTypes-4cbeb95d-7a1b2520.js"),require("prop-types"),require("../datarecord-metadata-v3-schema-df671574.js"),require("react-resize-detector"),require("@carbon/react"),require("react-portal"),require("react-intl"),require("react-redux"),require("react-dom"),require("../icon-e7b672ac.js"),require("react-inlinesvg"),require("../bucket-3-425f53cc.js"),require("uuid"),require("./tooltip.js"),require("redux"),require("seedrandom"),require("./command-stack.js"),require("immutable"),require("date-fns"),require("../toolbar-f58a9942.js"),require("../keyboard-utils-75346513.js"),require("@codemirror/view"),require("@codemirror/commands"),require("codemirror"),require("@codemirror/state"),require("@codemirror/language"),require("@codemirror/lang-python"),require("@codemirror/lang-sql"),require("@codemirror/lang-javascript"),require("@codemirror/autocomplete"),require("jsonschema"),require("react-virtualized"),require("react-draggable"),exports.CommonProperties=e.commonProperties,exports.PropertiesController=e.PropertiesController,exports.FlexibleTable=r.FlexibleTable,exports.FieldPicker=i.FieldPicker,exports.clem=o.clem,exports.getPythonHints=t.getPythonHints;
 //# sourceMappingURL=properties.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elyra/canvas",
-  "version": "13.15.0",
+  "version": "13.16.0",
   "description": "Elyra common-canvas",
   "main": "dist/common-canvas.js",
   "module": "dist/common-canvas.es.js",
@@ -47,7 +47,7 @@
     "react-portal": "^4.2.1",
     "react-redux": "^8.1.3",
     "react-resize-detector": "^9.1.0",
-    "react-virtualized": "^9.22.2",
+    "react-virtualized": "9.22.5",
     "redux": "^5.0.1",
     "seedrandom": "^3.0.5",
     "uuid": "^8.3.0"

package/src/common-canvas/cc-top-panel.jsx

@@ -30,14 +30,9 @@ class CanvasTopPanel extends React.Component {
 		this.logger.log("render");
 		let topPanel = null;
 
-		let className = "top-panel";
-		if (this.props.toolbarIsOpen) {
-			className += " common-canvas-toolbar-none";
-		}
-
 		if (this.props.topPanelIsOpen) {
 			topPanel = (
-				<div className={className} >
+				<div className={"top-panel"} >
 					{this.props.topPanelContent}
 				</div>
 			);
@@ -54,13 +49,11 @@ CanvasTopPanel.propTypes = {
 
 	// Provided by Redux
 	topPanelIsOpen: PropTypes.bool,
-	topPanelContent: PropTypes.object,
-	toolbarIsOpen: PropTypes.bool
+	topPanelContent: PropTypes.object
 };
 
 const mapStateToProps = (state, ownProps) => ({
 	topPanelIsOpen: state.toppanel.isOpen,
-	topPanelContent: state.toppanel.content,
-	toolbarIsOpen: (state.canvasconfig.enableToolbarLayout === "None")
+	topPanelContent: state.toppanel.content
 });
 export default connect(mapStateToProps)(CanvasTopPanel);

package/src/common-properties/controls/abstract-table.jsx

@@ -744,7 +744,8 @@ export default class AbstractTable extends React.Component {
 					const cell = this.buildChildItem(propertyName, rowIndex, tableState);
 					columns.push(cell);
 				}
-				if (this.props.control.rowSelection === ROW_SELECTION.SINGLE && !this.isReadonlyTable()) {
+				// Do not show delete icon if add_remove_rows is false (default is true)
+				if (this.props.control.rowSelection === ROW_SELECTION.SINGLE && !this.isReadonlyTable() && this.props.addRemoveRows) {
 					const toolTip = PropertyUtils.formatMessage(this.reactIntl, MESSAGE_KEYS.TABLE_DELETEICON_TOOLTIP);
 					const tooltipId = "tooltip-delete-row";
 					const deleteOption = (

package/src/object-model/config-utils.js

@@ -92,6 +92,7 @@ export default class ConfigUtils {
 			enableWYSIWYGComments: false,
 			enableKeyboardNavigation: false,
 			enableAutoLinkOnlyFromSelNodes: false,
+			enableSingleClickAddFromPalette: false,
 			enableContextToolbar: false,
 			enableSaveZoom: "None",
 			enableSnapToGridType: "None",
@@ -105,7 +106,7 @@ export default class ConfigUtils {
 			enableFocusOnMount: true,
 			enableBoundingRectangles: false, // Not documented
 			enableCanvasUnderlay: "None", // Not documented
-			enableParentClass: "", // Not documented
+			enableParentClass: "",
 			enablePositionNodeOnRightFlyoutOpen: false, // May also be an object: { x: 5, y: 5 }
 			emptyCanvasContent: null,
 			dropZoneCanvasContent: null,

package/src/object-model/object-model.js

@@ -1498,8 +1498,8 @@ export default class ObjectModel {
 			} else {
 				this.toggleSelection(objId, augment, pipelineId);
 			}
-		} else if (augment) {
-			this.toggleSelection(objId, augment, pipelineId);
+		} else if (augment || range) {
+			this.toggleSelection(objId, augment || range, pipelineId);
 		}
 	}
 
@@ -1562,60 +1562,116 @@ export default class ObjectModel {
 		this.setSelections([], apiPipeline.pipelineId);
 	}
 
-	findNodesInSubGraph(startNodeId, endNodeId, selection, pipelineId) {
-		const pipeline = this.getAPIPipeline(pipelineId);
-		let retval = false;
+	// Selects a set of nodes which represet all connected nodes from the
+	// current set of selected nodes to the end node passed in. If no
+	// connecting nodes are found, the set of selected nodes remains the same.
+	selectSubGraph(endNodeId, pipelineId) {
+		const selectedObjectIds = this.getSubGraphNodes(endNodeId, pipelineId);
+		this.setSelections(selectedObjectIds, pipelineId);
+	}
 
-		selection.push(startNodeId);
-		if (startNodeId === endNodeId) {
-			retval = true;
-		} else {
-			for (const link of pipeline.getLinks()) {
-				if (link.srcNodeId === startNodeId &&
-					link.srcNodeId !== link.trgNodeId) { // Ignore self-referencing links
-					const newRetval = this.findNodesInSubGraph(link.trgNodeId, endNodeId, selection, pipelineId);
-					if (newRetval !== true) {
-						selection.pop();
+	// Returns an array of node IDs that represent all connected nodes from the
+	// current set of selected nodes to the end node passed in.
+	getSubGraphNodes(endNodeId, pipelineId) {
+		const selectedObjectIds = this.getSelectedObjectIds();
+
+		if (pipelineId === this.getSelectedPipelineId()) {
+			const pipeline = this.getAPIPipeline(pipelineId);
+			const links = pipeline.getLinks();
+			const allPaths = [];
+
+			// Loop through all the currently selected nodes which will be
+			// our start nodes.
+			for (const startNodeId of selectedObjectIds) {
+				const paths = this.getGraphPaths(startNodeId, endNodeId, links);
+				allPaths.push(...paths);
+			}
+
+			// Add to the set of currently selected object IDs any nodes
+			// found that connect from them to the end node.
+			for (const path of allPaths) {
+				for (const nodeId of path) {
+					if (!selectedObjectIds.includes(nodeId)) {
+						selectedObjectIds.push(nodeId);
 					}
-					// This handles the case where there are multiple outward paths.
-					// Some of the outward paths could be true and some false. This
-					// will make sure that the node in the selection list of one of the
-					// paths contains the end nodeId.
-					retval = retval || newRetval;
 				}
 			}
 		}
 
-		return retval;
+		// Make sure the end node is included in the list of selected nodes.
+		if (!selectedObjectIds.includes(endNodeId)) {
+			selectedObjectIds.push(endNodeId);
+		}
+
+		return selectedObjectIds;
 	}
 
-	selectSubGraph(endNodeId, pipelineId) {
-		const selection = [];
-		let selectedObjectIds = [endNodeId];
+	// Returns an array of paths where each path is an array of nodes from
+	// the start node to the end node.
+	getGraphPaths(startNodeId, endNodeId, links) {
+		const visited = new Set();
+		const path = [];
+		const paths = [];
 
-		if (pipelineId === this.getSelectedPipelineId()) {
-			const currentSelectedObjects = this.getSelectedObjectIds();
+		this.getGraphPathForNode(startNodeId, endNodeId, path, visited, paths, links);
 
-			// Get all the nodes in the path from a currently selected object to the end node
-			let foundPath = false;
-			for (const startNodeId of currentSelectedObjects) {
-				foundPath = foundPath || this.findNodesInSubGraph(startNodeId, endNodeId, selection, pipelineId);
-			}
-			if (!foundPath) {
-				// If no subgraph found which is also the case if current selection was empty, just select endNode
-				selection.push(endNodeId);
+		return paths;
+	}
+
+	// Updates the paths array with any new path found where a path is an array
+	// of node IDs that connect the node passed in to the end node. To do this it uses
+	// the path and visited arrays as working arrays.
+	getGraphPathForNode(nodeId, endNodeId, path, visited, paths, links) {
+		if (nodeId === endNodeId) {
+			paths.push([...path, endNodeId]);
+			return;
+		}
+
+		if (visited.has(nodeId)) {
+			// If we've visited this node before, and the node ID is in one of the
+			// currently saved paths, we make the path to this node an additional
+			// path even though it doesn't end at the end node. All nodes in paths
+			//  will get consolidated by our caller so that is not a problem.
+			if (this.isInSavedPath(nodeId, paths)) {
+				paths.push([...path, endNodeId]);
 			}
+			return;
+		}
 
-			// Do not put multiple copies of a nodeId in selected nodeId list.
-			selectedObjectIds = this.getSelectedObjectIds().slice();
-			for (const selected of selection) {
-				if (!this.isSelected(selected, pipelineId)) {
-					selectedObjectIds.push(selected);
-				}
+		visited.add(nodeId);
+		path.push(nodeId);
+
+		const neighbors = this.getNeighbourNodeIDs(nodeId, links);
+
+		for (const neighbor of neighbors) {
+			this.getGraphPathForNode(neighbor, endNodeId, path, visited, paths, links);
+		}
+
+		path.pop();
+	}
+
+	// Returns true if the node ID passed in is in one of the
+	// paths stored in the paths array.
+	isInSavedPath(nodeId, paths) {
+		for (const path of paths) {
+			if (path.includes(nodeId)) {
+				return true;
 			}
 		}
+		return false;
+	}
 
-		this.setSelections(selectedObjectIds, pipelineId);
+	// Returns an array of neighbor nodes for the node identified
+	// by the ID passed in.
+	getNeighbourNodeIDs(nodeId, links) {
+		const neighbors = [];
+
+		links.forEach((l) => {
+			if (l.srcNodeId === nodeId && l.trgNodeId && l.type !== ASSOCIATION_LINK) {
+				neighbors.push(l.trgNodeId);
+			}
+		});
+		return neighbors;
 	}
 
 	// Return true is nodeIds are contiguous.

package/src/palette/palette-content-list-item.jsx

@@ -43,6 +43,7 @@ class PaletteContentListItem extends React.Component {
 
 		this.onDragStart = this.onDragStart.bind(this);
 		this.onDragEnd = this.onDragEnd.bind(this);
+		this.onClick = this.onClick.bind(this);
 		this.onDoubleClick = this.onDoubleClick.bind(this);
 		this.onMouseOver = this.onMouseOver.bind(this);
 		this.onMouseLeave = this.onMouseLeave.bind(this);
@@ -54,12 +55,20 @@ class PaletteContentListItem extends React.Component {
 		// Make sure the tip doesn't appear when starting to drag a node.
 		this.props.canvasController.closeTip();
 
+		// Sets the focus index on the parent palette-content-list so
+		// future key presses that move focus will work correctly.
+		if (this.props.setFocusIndex) {
+			this.props.setFocusIndex();
+		}
+
 		// Prepare the ghost image on mouse down because asynchronous loading of
 		// SVG files will be too slow if this is done in onDragStart.
 		this.ghostData = this.props.canvasController.getGhostNode(this.props.nodeTypeInfo.nodeType);
 	}
 
 	onDragStart(ev) {
+		this.props.canvasController.closeTip();
+
 		// We cannot use the dataTransfer object for the nodeTemplate because
 		// the dataTransfer data is not available during dragOver events so we set
 		// the nodeTemplate into the canvas controller.
@@ -98,19 +107,15 @@ class PaletteContentListItem extends React.Component {
 		this.createAutoNode(true);
 	}
 
-	onMouseOver(ev) {
-		if (!this.props.isDisplaySearchResult && ev.buttons === 0) {
-			const nodeTemplate = this.props.nodeTypeInfo.category.empty_text
-				? { app_data: { ui_data: { label: this.props.nodeTypeInfo.category.empty_text } } }
-				: this.props.nodeTypeInfo.nodeType;
-
-			this.props.canvasController.openTip({
-				id: "paletteTip_" + this.props.nodeTypeInfo.nodeType.op,
-				type: TIP_TYPE_PALETTE_ITEM,
-				targetObj: ev.currentTarget,
-				nodeTemplate: nodeTemplate,
-				category: this.props.nodeTypeInfo.category
-			});
+	onClick() {
+		if (this.props.allowClickToAdd) {
+			this.createAutoNode(true);
+		}
+	}
+
+	onMouseOver(evt) {
+		if (!this.props.isDisplaySearchResult && evt.buttons === 0) {
+			this.displayTip();
 		}
 	}
 
@@ -262,8 +267,30 @@ class PaletteContentListItem extends React.Component {
 		this.setState({ showFullDescription: false });
 	}
 
+	// Sets the focus on this palette (node) item and displays
+	// a tooltip. This is called by the parent palette-content-list
+	// when the user moves focus to a new node using the keyboard, so
+	// we always show a tip for the keyboard user.
 	focus() {
 		this.itemRef.current.focus();
+		this.displayTip();
+	}
+
+	// Display a tip for this palette (node) item.
+	displayTip() {
+		this.props.canvasController.closeTip();
+
+		const nodeTemplate = this.props.nodeTypeInfo.category.empty_text
+			? { app_data: { ui_data: { label: this.props.nodeTypeInfo.category.empty_text } } }
+			: this.props.nodeTypeInfo.nodeType;
+
+		this.props.canvasController.openTip({
+			id: "paletteTip_" + this.props.nodeTypeInfo.nodeType.op,
+			type: TIP_TYPE_PALETTE_ITEM,
+			targetObj: this.itemRef.current,
+			nodeTemplate: nodeTemplate,
+			category: this.props.nodeTypeInfo.category
+		});
 	}
 
 	// Returns true if this item is disabled and should not be draggable or double-clicked
@@ -289,6 +316,7 @@ class PaletteContentListItem extends React.Component {
 		let labelText = get(this.props, "nodeTypeInfo.nodeType.app_data.ui_data.label", "");
 		let draggable = this.isItemDisabled() ? "false" : "true";
 		let icon = null;
+		const ariaDisabled = this.isItemDisabled();
 
 		if (has(this.props.nodeTypeInfo.nodeType, "app_data.ui_data.image")) {
 			let image = this.props.nodeTypeInfo.nodeType.app_data.ui_data.palette_image
@@ -355,6 +383,7 @@ class PaletteContentListItem extends React.Component {
 				tabIndex={this.props.tabIndex}
 				role={"button"}
 				aria-label={labelText}
+				aria-disabled={ariaDisabled}
 				draggable={draggable}
 				className={mainDivClass}
 				onMouseOver={this.onMouseOver}
@@ -363,6 +392,7 @@ class PaletteContentListItem extends React.Component {
 				onMouseDown={this.props.isEditingEnabled ? this.onMouseDown : null}
 				onDragStart={this.props.isEditingEnabled ? this.onDragStart : null}
 				onDragEnd={this.props.isEditingEnabled ? this.onDragEnd : null}
+				onClick={this.props.isEditingEnabled ? this.onClick : null}
 				onDoubleClick={this.props.isEditingEnabled ? this.onDoubleClick : null}
 			>
 				{categoryLabel}
@@ -384,6 +414,8 @@ PaletteContentListItem.propTypes = {
 	tabIndex: PropTypes.number.isRequired,
 	nextNodeInCategory: PropTypes.func,
 	previousNodeInCategory: PropTypes.func,
+	setFocusIndex: PropTypes.func,
+	allowClickToAdd: PropTypes.bool,
 	isEditingEnabled: PropTypes.bool.isRequired,
 	isPaletteWide: PropTypes.bool,
 	isShowRanking: PropTypes.bool

package/src/palette/palette-content-list.jsx

@@ -37,6 +37,10 @@ class PaletteContentList extends React.Component {
 		this.contentItemRefs[this.currentFocusIndex].current.focus();
 	}
 
+	setFocusIndex(idx) {
+		this.currentFocusIndex = idx;
+	}
+
 	nextNodeInCategory(evt) {
 		this.currentFocusIndex++;
 		if (this.currentFocusIndex > this.contentItemRefs.length - 1) {
@@ -68,6 +72,7 @@ class PaletteContentList extends React.Component {
 						nodeTypeInfo={{ nodeType: {}, category: this.props.category }}
 						isDisplaySearchResult={false}
 						canvasController={this.props.canvasController}
+						allowClickToAdd={this.props.allowClickToAdd}
 						isPaletteWide={this.props.isPaletteWide}
 						isEditingEnabled={this.props.isEditingEnabled}
 					/>
@@ -92,6 +97,8 @@ class PaletteContentList extends React.Component {
 						isEditingEnabled={this.props.isEditingEnabled}
 						nextNodeInCategory={this.nextNodeInCategory}
 						previousNodeInCategory={this.previousNodeInCategory}
+						setFocusIndex={this.setFocusIndex.bind(this, idx)}
+						allowClickToAdd={this.props.allowClickToAdd}
 					/>
 				);
 			}
@@ -111,6 +118,7 @@ PaletteContentList.propTypes = {
 	canvasController: PropTypes.object.isRequired,
 	isPaletteWide: PropTypes.bool,
 	isEditingEnabled: PropTypes.bool.isRequired,
+	allowClickToAdd: PropTypes.bool
 };
 
 export default PaletteContentList;

package/src/palette/palette-dialog-content-grid-node.jsx

@@ -37,6 +37,7 @@ class PaletteDialogContentGridNode extends React.Component {
 
 		this.onDragStart = this.onDragStart.bind(this);
 		this.onDragEnd = this.onDragEnd.bind(this);
+		this.onClick = this.onClick.bind(this);
 		this.onDoubleClick = this.onDoubleClick.bind(this);
 		this.onMouseOver = this.onMouseOver.bind(this);
 		this.onMouseLeave = this.onMouseLeave.bind(this);
@@ -72,13 +73,16 @@ class PaletteDialogContentGridNode extends React.Component {
 		this.props.canvasController.nodeTemplateDragEnd();
 	}
 
-	onDoubleClick() {
-		if (this.props.canvasController.createAutoNode) {
-			const nodeTemplate = this.props.canvasController.convertNodeTemplate(this.props.nodeTemplate);
-			this.props.canvasController.createAutoNode(nodeTemplate);
+	onClick() {
+		if (this.props.allowClickToAdd) {
+			this.createAutoNode();
 		}
 	}
 
+	onDoubleClick() {
+		this.createAutoNode();
+	}
+
 	onMouseOver(ev) {
 		if (ev.buttons === 0) {
 			const nodeTemplate = this.props.category.empty_text
@@ -99,6 +103,13 @@ class PaletteDialogContentGridNode extends React.Component {
 		this.props.canvasController.closeTip();
 	}
 
+	createAutoNode() {
+		if (this.props.canvasController.createAutoNode) {
+			const nodeTemplate = this.props.canvasController.convertNodeTemplate(this.props.nodeTemplate);
+			this.props.canvasController.createAutoNode(nodeTemplate);
+		}
+	}
+
 	render() {
 		let label = "";
 		if (has(this.props.nodeTemplate, "app_data.ui_data.label")) {
@@ -147,6 +158,7 @@ class PaletteDialogContentGridNode extends React.Component {
 				onMouseDown={this.props.isEditingEnabled ? this.onMouseDown : null}
 				onDragStart={this.props.isEditingEnabled ? this.onDragStart : null}
 				onDragEnd={this.props.isEditingEnabled ? this.onDragEnd : null}
+				onClick={this.props.isEditingEnabled ? this.onClick : null}
 				onDoubleClick={this.props.isEditingEnabled ? this.onDoubleClick : null}
 				className="palette-dialog-grid-node-outer"
 			>
@@ -167,6 +179,7 @@ PaletteDialogContentGridNode.propTypes = {
 	category: PropTypes.object.isRequired,
 	nodeTemplate: PropTypes.object.isRequired,
 	canvasController: PropTypes.object.isRequired,
+	allowClickToAdd: PropTypes.bool,
 	isEditingEnabled: PropTypes.bool.isRequired
 };
 

package/src/palette/palette-dialog-content-grid.jsx

@@ -38,6 +38,7 @@ class PaletteDialogContentGrid extends React.Component {
 					nodeTemplate={ {} }
 					canvasController={this.props.canvasController}
 					isEditingEnabled={this.props.isEditingEnabled}
+					allowClickToAdd={this.props.allowClickToAdd}
 				/>
 			);
 		} else {
@@ -48,6 +49,7 @@ class PaletteDialogContentGrid extends React.Component {
 						nodeTemplate={this.props.nodeTypes[idx]}
 						canvasController={this.props.canvasController}
 						isEditingEnabled={this.props.isEditingEnabled}
+						allowClickToAdd={this.props.allowClickToAdd}
 					/>
 				);
 			}
@@ -65,6 +67,7 @@ PaletteDialogContentGrid.propTypes = {
 	category: PropTypes.object.isRequired,
 	nodeTypes: PropTypes.array.isRequired,
 	isEditingEnabled: PropTypes.bool.isRequired,
+	allowClickToAdd: PropTypes.bool,
 	canvasController: PropTypes.object.isRequired
 };
 

package/src/palette/palette-dialog-content.jsx

@@ -87,6 +87,7 @@ class PaletteDialogContent extends React.Component {
 					nodeTypes={nodeTypes}
 					canvasController={this.props.canvasController}
 					isEditingEnabled={this.props.isEditingEnabled}
+					allowClickToAdd={this.props.allowClickToAdd}
 				/>)
 			: (
 				<PaletteContentList
@@ -95,6 +96,7 @@ class PaletteDialogContent extends React.Component {
 					canvasController={this.props.canvasController}
 					isPaletteWide
 					isEditingEnabled={this.props.isEditingEnabled}
+					allowClickToAdd={this.props.allowClickToAdd}
 				/>);
 		return (
 			<div className="palette-dialog-content" ref="palettecontent">
@@ -112,6 +114,7 @@ PaletteDialogContent.propTypes = {
 	paletteJSON: PropTypes.object.isRequired,
 	showGrid: PropTypes.bool.isRequired,
 	canvasController: PropTypes.object.isRequired,
+	allowClickToAdd: PropTypes.bool,
 	isEditingEnabled: PropTypes.bool.isRequired
 };
 

package/src/palette/palette-dialog-under.jsx

@@ -542,6 +542,7 @@ class PaletteDialog extends React.Component {
 						showGrid={this.state.showGrid}
 						canvasController={this.props.canvasController}
 						isEditingEnabled={this.props.isEditingEnabled}
+						allowClickToAdd={this.props.allowClickToAdd}
 					/>
 				</div>
 			</nav>
@@ -557,6 +558,7 @@ PaletteDialog.propTypes = {
 	canvasController: PropTypes.object.isRequired,
 	containingDivId: PropTypes.string.isRequired,
 	paletteJSON: PropTypes.object,
+	allowClickToAdd: PropTypes.bool,
 	isEditingEnabled: PropTypes.bool
 };
 

package/src/palette/palette-dialog.jsx

@@ -36,6 +36,7 @@ class PaletteDialog extends React.Component {
 				canvasController={this.props.canvasController}
 				paletteJSON={this.props.paletteJSON}
 				containingDivId={this.props.containingDivId}
+				allowClickToAdd={this.props.allowClickToAdd}
 				isEditingEnabled={this.props.isEditingEnabled}
 			/>);
 	}
@@ -51,11 +52,13 @@ PaletteDialog.propTypes = {
 
 	// Provided by redux
 	paletteJSON: PropTypes.object,
+	allowClickToAdd: PropTypes.bool,
 	isEditingEnabled: PropTypes.bool
 };
 
 const mapStateToProps = (state, ownProps) => ({
 	paletteJSON: state.palette.content,
+	allowClickToAdd: state.canvasconfig.enableSingleClickAddFromPalette,
 	isEditingEnabled: state.canvasconfig.enableEditingActions
 });