Releases: elyra-ai/canvas
release_10.8.0
Feature Enhancements
Common Canvas
-
#640 Allow outputs from exit binding nodes (PR #641)
Common-canvas now supports thealt_outputs
property for exit binding nodes which was recently added to the pipeline-flow schema definition:
https://github.com/elyra-ai/pipeline-schemas/blob/534d396277e4e243c5cbbf5b6840f816a9c02c78/common-pipeline/pipeline-flow/pipeline-flow-v3-schema.json#L375
This allows host applications to specify a set of alternative output ports for exit binding nodes without breaking the convention that exit binding nodes should not have any outputs. The alternative outputs can be used for directing error data to another part of the flow. -
#654 Support external pipeline flow (PR #655)
Common-canvas now supports external pipeline flows. That is, a supernode in a flow can now refer to a pipeline that exists in a pipeline flow that is different to the one where the the super node exists. This has been supported by the schema for a long time but was not supported by common-canvas until now.
The host application needs to co-operate with common-canvas to provide external pipeline flows when needed. This is done through thebefore EditActionHandler
callback method.
External pipeline flows are lazy-loaded so they are only requested when common-canvas needs them for display to the user.
See the wiki documentation for details:
https://github.com/elyra-ai/canvas/wiki/2.9-External-Subflows-support
Common Properties
-
#624 Update carbon version to 10.34.0 (#649)
Carbon components are updated to version 10.34.0. Please note Number Input steppers will be hidden in the table controls. -
#652 Updated notification panel styling (#653)
Removed arrow and spacing between toolbar and notification panel
Notification header using typography $productive-heading-02
Toolbar button shows blue bottom-border when notification panel is open
Issues Resolved
#654 Support external pipeline flows (#655)
#640 Allow outputs from exit binding node (#641)
#661 Fixed translations in multiselect control (#662)
#652 Updated notification panel styling (#653)
#650 Remove padding when action is hidden (#651)
#624 Update carbon version to 10.34.0 (#649)
release_10.7.0
Feature Enhancements
General
#647 Up to date translated string have been added.
Common Canvas
#638 Some preliminary changes to enhance performance. This is mainly a refactoring of the code that display nodes and comments which improves performance when refreshing a canvas with a large number of nodes. These changes will facilitate future performance enhancements.
Common Properties
#510 A fix for the enum_filter
for the multiselect
control
Issues Resolved
#647 Updating the translated strings in all languages (#648)
#638 Performance improvements for node handling code (#639)
#510 multiselect filter enum workaround (#646)
release_10.6.0
Feature Enhancements
Common Properties
#642 Added two new configuration options in propertiesConfig object which will allow consumers to set maximum characters allowed in string controls. These values will be applied to all single-line and multi-line string controls.
maxLengthForMultiLineControls (number) - maximum characters allowed for multi-line string controls like textarea. default: 1024
maxLengthForSingleLineControls (number) - maximum characters allowed for single-line string controls like textfield. default: 128
Note - If char_limit is specified in uiHints for any control, it will override the value of maxLengthForMultiLineControls and maxLengthForSingleLineControls.
Added maxLength for single-line and multi-line control methods in properties-controller.
To set these values in Test harness -
Issues Resolved
#642 Added config options maxLengthForMultiLineControls and maxLengthForSingleLineControls in propertiesConfig (#643)
#644 Removed padding in Moveable row tables (#645)
#634 Fix issue where hidden values need to be revalidated (#635)
release_10.5.0
Feature Enhancements
Common-canvas
-
#612 Improve palette search
In 10.5.0, the palette search function in common canvas has been completely replaced. Features of the new design are:
- When the user enters search text in the search field, the palette immediately refreshes on each keystroke to show a result set of nodes matching to the text entered.
- For each node, the following text is searched: the category label, the node label and the node description
- If the user enters more than one word (separated by a space) the words entered are searched for independently in the category label, node label and description of each node. This means words can be entered in any order and the same result set is found.
- Occurrences of search words are highlighted in the category and node labels and the description.
- The nodes in the result set are ranked in order of importance where the occurrence of multiple words and the occurrence of search words in the node label give greater weight to the ranking. Nodes with the same ranking are displayed in the same order they would appear in the categories of the palette.
- If the search text is deleted from the search field the palette returns to its traditional
category layout
display. - A
debounce
architecture is used so the user can rapidly make key presses while typing a search string without overwhelming the system. - Descriptions longer than 150 characters are truncated with a
Show more
button. Long descriptions are truncated so that the first occurrence of any of the search words is displayed. In other words, if the first occurrence if one of the search words is at character 200 the beginning of the description will be truncated so the highlighted word is displayed. - When the
Show more
button has been clicked and the long description displayed, aShow less
button will be shown. - For performance of display reasons, result sets are restricted to 10 nodes.
Warning: Some of the internal class names for elements of the palette have changed. If you need more details let me (Craig Tomlyn) know.
Palette search in action:
Examples of truncated node descriptions:
Common-properties
-
#622 When heading is enabled, show help button in heading
In common-properties, the right-side flyout heading is optional. A help icon will be shown if host applications provide a help object in the
paramDef
orformData
.When the heading is enabled, a help icon is added in the heading -
When heading is disabled, help icon is added next to edit title icon -
-
#628 Support "light" option in common-properties
Common-properties now support a
light
option that changes the carbon controls being used to light mode.
Thelight
option is enabled by default.
To disable thelight
option, host applications can set<CommonProperties light={false} />
When the
light
option is disabled, the background color will be same as the carbon theme background.
When thelight
option is enabled, the background color is $ui-01.The difference is appearance for the light option disabled (Left side image) and enabled (Right side image) is shown below:
The light option can be configured in the test harness
Issues Resolved
#628 Support light option in common-properties (#629)
#630 Palette search string including spaces adds extra characters (#631)
#622 When heading is enabled, show help button in heading (#623)
#625 Remove uneeded npm module from package.json (#626)
#612 Improve palette search (#621)
release_10.4.1
Patch release
- Only fixes in this release - use this in preference to 10.4.0.
Common-canvas
#617 Double image displayed after image field in node updated
A regression in 10.3.0 caused a double image to be displayed on the canvas when a node's image field was updated either through the canvas controller API or by loading a new pipeline flow document with an updated image. This has been fixed in this patch release.
Common-properties
#619 Updated row checkbox labels in virtualized table
Host applications that import the Flexible Table component directly will see a regression in version 10.2.0: the common-properties panel will not load and the following error will be seen in console:
Cannot read property 'getReactIntl' of undefined.
This regression issue is fixed in version 10.4.1. This was caused because Virtualized tables currently have checkboxes in headers and each row. In 10.2.0, labels were added to the checkboxes for screen readers. In 10.4.1, the labels for checkboxes in rows have been updated. There is no change in header checkbox labels. Host applications don't need to make any changes for this to work.
Row checkbox labels will be generated based on the table name.
For example -
Checkbox in the first row will have this label: Select row 1 from Table Input
Checkbox in the second row will have this label: Select row 2 from Table Input
Issues Resolved
#619 Using table name in row checkbox labels (#620)
#617 Double image displayed after image field in node updated (#618)
release_10.4.0
Feature Enhancements
Common-canvas
-
#604 Previously only one category of the palette could be open at a time. In 10.4.0 each category of the palette can be opened independently of the others. This is the new way it behaves. It doesn't need to be switched with a config property.
Common-properties
-
#599 Table rows, table headers, and buttons above tables have been reduced to 32px height.
Table labels (like 'Sort by' in the example below) now use Text Panel style. -
#608 Empty tables, with an [Add +] button defined, will now show the following message with a button below it which allows the user to add the first row to the table.
To begin, click {button_label} [Button]
The button will have the same label as the
Add Button
displayed above the table, when the table contains some rows.The button label, displayed with the empty-table message, will change depending upon the control type, just as currently the labels of the buttons that appear above the table change. The examples below show the different possible button labels.
For List, structurelisteditor controls:
For Selectcolumns, Structuretable, Fieldpicker controls:
The empty-table message can be customized by the host application on a table by table basis by specifying the following in the resources for the parameter definition.
{parameter-id}.empty.table.text
For example -
"resources": { "list_string.empty.table.text": "This is a custom empty text for list." }
-
#613 Redo expression validation button to provide callback to consuming application.
For this change a new optional
validationHandler
callback was added to the common-properties callbacks properties. When the callback is provided aValidate
link is added to the expression control. When clicked thevalidationHandler
callback is called:validationHandler(controller, propertyId, value, appData, callback)
When validation is complete the callback function should be called passing back a message object.
For example:callback({ type: "error", text: "Failed validating expression" });
-
#609 Add configuration settings to have condition logic treat hidden/disabled properties as null or false
Host applications may now treat the actual values of parameters as
null
in condition handling. To enable this 2 new configuration options are available:propertiesConfig: { conditionHiddenPropertyHandling: PropTypes.oneOf(["null", "value"]), conditionDisabledPropertyHandling: PropTypes.oneOf(["null", "value"]) }
These both default to
value
and when set to "null" when a parameter is hidden and/or disabled the condition logic will treat those values as "null".
Issues resolved
#615 Fixed action image alignment issue in properties (#616)
#608 When table is empty, show customizable text and Add button (#611)
#613 Fix expression validation handling (#614)
#609 Condition handling config options (#610)
#606 Detached links incorrectly highlighted when node is dragged over… (#607)
#604 Allow multiple palette sections to be open at the same time (#605)
#599 Table rows and headers are 32px tall and table title in Text panel style (#603)
release_10.3.0
Feature Enhancements
Common-canvas
-
#568 A new canvas configuration property has been added called
enableHighlightUnavailableNodes
. When set to true, as the user begins to drag a new connection, common-canvas sets a new class calledd3-node-unavailable
on all nodes that cannot accept that new connection as input. This can be used to gray-out/disable nodes that cannot be connected. The default styling will do this provided you have SVG icons in your nodes.
-
#601 A new canvas config property has been added called
enableAutoLinkOnlyFromSelNodes
. When set to true the auto-add function (where double clicking a node in the palette automatically adds it to the canvas) will only link up nodes when a node is selected on the canvas and then, only if the selected node can be linked to the node that was double clicked. -
#586 By default the Cut/Copy/Paste actions in the Browser's
Edit
menu are supported by common-canvas. This includes the keyboard input for those actions. Some host applications want to disable the Browser's Edit menu Cut/Copy/Paste, including keyboard input for them, so there is now a new canvas config property calledenableBrowserEditMenu
which defaults to true. If set to false this will prevent the actions in theEdit
menu from acting on common-canvas. This will not prevent those actions working in the canvas when, say, invoked with the toolbar or canvas context menus, but this property can be used if the keyboard input for those actions into the canvas is disabled for common-canvas using the keyboard config object. -
#598 Some host applications do not show a node outline (the rectangle that makes up the background of the node) by styling it as transparent. For those applications the in-place expanded supernode frame was invisible. In 10.3.0, when the supernode is expanded the supernode frame is styled using a class called
d3-node-supernode-expanded
so that it can be styled separately from the regular node style. When this is done the expanded supernode frame will show up for those applications that have a transparent node outline:
Common-properties
-
#557 Host applications can disable the move row buttons in tables by calling the
setDisableRowMoveButtons()
method in the common properties controller. This method accepts an array of objects containing property IDs. The move row buttons will be disabled for all tables whose property IDs are passed in the array. See the [wiki for details](https://github.com/elyra-ai/canvas/wiki/3.6-Common-Properties-Controller#disable-move-row-buttons-methods for the new methods added to the properties controller.)For example -
setDisableRowMoveButtons([{"name": "list_string"}, {"name": "list_string_error"}])
This function can be tested in the test harness:
- Enter the array you want to pass as the parameter for the the method.
- After selecting any row in the table, the move row buttons will be disabled.
-
#584 A new
propertiesConfig
option calledapplyPropertiesWithoutEdit
is now available which allows host applications using common-properties to always have theapplyPropertyChanges
callback called even when no changes are made. -
#565 - Common-properties will now ensure complex types parameters of type "object", with a default value, will be set correctly, if no current_parameters are defined.
Issues resolved
#601 When no node is selected on the Canvas, palette double-click sho… (#602)
#598 Minor supernode enhancements (#600)
#596 Supernode icon doesn't show in palette when icon === useDefaultIcon (#597)
#594 Palette node template cardinality max of zero insertable into link (#595)
#591 Add 'Download Palette' button to test harness (#593)
#572 Supernode's sub-flow nodes highlighting on hover (#581)
#584 Add config option to always apply changes (#585)
#590 Column headers should not use text-transform (#592)
#586 Allow host application to disable the Browser's Edit menu (#589)
#578 Allow nodes to be dragged long distances in fullscreen mode (#580)
#576 Prevent max cardinality being exceeded when node is dragged onto… (#577)
#582 Using sentence style for column headers (#583)
#505 Update custom condition example to handle undefined strings (#575)
#557 Support disable move row buttons in table (#558)
#573 Log a warning if the control is undefined when validating conditions (#574)
#568 Allow nodes to be disabled when a new or existing link is being … (#569)
#570 Prefix https for properties schema validator (#571)
#565 Complex types default objects (#566)
#563 Remove check for json_schema with http in schema validation code (#564)
#559 Cannot add new nodes after dropping a node on a link (#560)
#561 Node label is highlighted when node if double clicked (#562)
release_10.2.0
Feature Enhancements
Common-canvas
-
The behavior of
enableDisplayFullLabelOnHover
has been fixed when multi-line node labels have been specified using thenodeLayout.labelSingleLine = false
canvas configuration option. When the mouse pointer is hovered over the node label it shows the full label wrapped to the width of the label container specified bynodeLayout.labelWidth
canvas configuration option.
-
The number of characters for a node label can now be limited using the
labelMaxCharacters
config variable. For example like this:const canvasConfig = { nodeLayout: { labelMaxCharacters: 64 } }
This will prevent the user from entering more than 64 characters for the node label. If an existing label in the pipelineFlow, or one specified through the canvas controller API, is longer than 64 characters it will be displayed in full but the user will not be able to edit it except by removing characters until it is less than 64 characters in length.
-
With editable labels, by default, the user will not be able to press the return key to enter a new line character in the node label. The label will wrap at the width of the label container specified by the
nodeLayout.labelWidth
canvas configuration option. Preventing newline characters being inserted into node labels will prevent presentation problems of node labels in other parts of the UI which are unable to display labels containing newline characters. If necessary, the ability for the user to enter newline characters can be switched on by the host applications using this config option:const canvasConfig = { nodeLayout: { labelAllowReturnKey: true } }
-
By default common-canvas adds arrow heads to straight line links. If the default arrow head is not acceptable the arrow head can now be customized by specifying an SVG path string for the
canvasLayout.dataLinkArrowHead
config option. There is no error checking of the path so make sure you get it right! Common canvas will make sure the arrow head is rotated to point in the direction of the link line. Specify it like this:const canvasConfig = { canvasLayout: { dataLinkArrowHead: "M -5 5 L 0 0 -5 -5", } }
This path above will display a similar arrow head to the default one but a bit smaller.
Default size:
Specified size:
-
The pipeline-flow-v3-schema.json schema file has been upgraded to use
https
instead ofhttp
in the URL's embedded in the schema. This prevent security scan issues for applications using the schemas. This change affects thejson_schema
field in pipelineFlow documents. If you are setting thejson_schema
field in flow documents your application generates then make sure you set it withhttps
like this:myPiplineFlow.json_schema = "https://api.dataplatform.ibm.com/schemas/common-pipeline/pipeline-flow/pipeline-flow-v3-schema.json";
Documents containing
http
will be accepted by common-canvas and will validate successfully for now but it is best if you alter this in your code now.
Common-properties
-
#436 Persist properties editor size (#486)
Currently the host application can control the width of the common-properties panel by specifyingin theuiHints
in theeditor_size
property. In 10.2.0, host applications can pass a new property calledinitialEditorSize
in thepropertiesInfo
object. IfinitialEditorSize
is greater thaneditor_size
, common-properties will useinitialEditorSize
for the width of the panel.initialEditorSize
can have a value of "small", "medium", "large", or null. -
#466 Added checkbox labels in virtualized table (#467)
Virtualized tables currently have checkboxes in headers and each row. In 10.2.0 labels have been added to the checkboxes for screen readers. You don't need to do anything for this to work, they are added automatically. The labels will be generated based on the text in the first column to the right of the checkboxes unless that column is an index column in which case it will be the next column to the right.
For example, in the image below the label for the header checkbox will beSelect all Values
and the label for the second row will beSelect row 2, list item 2
which maps to the standard format for accessibility.In this example, the column next to checkbox column is an Index column (which has "operation": "index"), so common-properties uses the next column for labeling.
The checkbox in the header will have this label:Select all Field
The checkbox in the first row will have this label:Select row 1, Age
Issues resolved
#553 Oneofselect, multiselect, selectschema, selectcolumn controls are accessible (#554)
#551 Allow multiple association links between nodes (#552)
#466 Added checkbox labels in virtualized table (#467)
#549 Links Name and other attrs not copied and pasted from clipboard (#550)
#436 Persist properties editor size (#486)
#547 Change common-canvas to use https instad of http for schemas (#548)
#543 Change styling when enableDisplayFullLabelOnHover when name is l… (#544)
#545 Text decoration class name not updated correctly (#546)
#541 Connecting nodes in in-place supernode doesn't work (#542)
#539 Allow customization of arrow heads (#540)
#537 Allow for customization of node name max length (#538)
#505 handle undefined default textinput (#532)
#535 Remove hover from outline and put it on node groups (#536)
#533 Maximum cardinality of 0 on input port ignored (#534)
#528 Wide labels with closely positiond nodes doesn't display edit icon (#529)
#530 Moving mouse pointer rapidly over nodes leaves the edit icons on display (#531)
release_10.1.0
Feature Enhancements
General
- Carbon components have been updated to the latest version v10.29.0
[email protected]
[email protected]
carbon/[email protected]
carbon/[email protected]
Make sure you do an npm install
Common-canvas
-
Data Link arrow heads are now displayed with a new angle style with straight line links:
-
There is a new canvas config option:
enableLinkReplaceOnNewConnection
. When switched totrue
this allows connections into nodes, where the cardinality on the input node is maxed out, to be replaced with a new connection. Like this:
-
Connection can now be made to a port positioned away from its associated node:
-
Connections to input ports where the cardinality is maxed out (where the number of connections to it equals the port's maximum cardinality) are no longer allowed and the connection will not be made. That was a bug and has now been fixed.
-
New connections from output ports whose cardinality is maxed out will not now show the dragged line so the connection cannot even be started. Previously the connection could be started but would not be created on mouse up.
- The canvas config option
enableHightlightNodeOnNewLinkDrag
had a typo (with a 't' in the word 'Highlight'). This has been corrected. The old spelling is still supported but won't be supportd in the next major version so it is best to fix it now if you use that option.
Common-properties
- Just bug fixes
Issues resolved
#526 Build minor version (#527)
#523 Implement new arrow head (#524)
#503 The config option enableHightlightNodeOnNewLinkDrag has a typo (#525)
#519 With an old canvas document load the replace link feature doesn't work (#521)
#511 Support multiple enum_filter conditions on a parameter (#512)
#515 Remove text from textPanel label and description (#516)
#504 Upgrade carbon components to v10.29.0 (#506)
#517 Connected nodes should not highlight link with enableInsertNodeD… (#518)
#513 Add new action to allow consumers to replace a link instead of reject it (#514)
#508 Connection allowed to node with maxed out input port cardinality on target node (#509)
#498 Upgrade lodash to secure version (#499)
#497 Expression and code controls are accessible (#500)
#501 Connection not made to ports positioned away from node (#502)
#484 Readonly, ReadonlyTable, Timestamp controls are accessible (#485)
release_10.0.1
Feature Enhancements
None - just bug fixes
Issues resolved
#495 Design changes needed for editable labels (#496)
#493 Icons not visible in dark mode (#494)
#491 Fix center positioning for node elements in example Streams application (#492)
#489 Node Format Type option in test harness not working (#490)