Skip to content

Callbacks

Common Properties provides the following callbacks. These are specified to Common Properties using an object like this:

  const callbacks = {
      applyPropertyChanges: this.applyPropertyChanges,
      closePropertiesDialog: this.closePropertiesEditorDialog,
      propertyListener: this.propertyListener,
      controllerHandler: this.propertiesControllerHandler,
      actionHandler: this.propertyActionHandler,
      buttonHandler: this.buttonHandler,
      buttonIconHandler: this.buttonIconHandler,
      helpClickHandler: this.helpClickHandler,
      titleChangeHandler: this.titleChangeHandler,
      propertiesActionLabelHandler: this.propertiesActionLabelHandler,
      tooltipLinkHandler: this.tooltipLinkHandler
  };

applyPropertyChanges(propertySet, appData, additionalInfo, undoInfo, uiProperties)

Executes when the user clicks OK in the property dialog. This callback allows users to save the current property values.

  • propertySet: The set of current property values
  • appData: (optional) application data that was passed in to propertiesInfo
  • additionalInfo: Object with additional information returned:
    • messages: (optional) An array of messages associated with the nodes current property values.
    • title: The title of the properties editor
  • undoInfo: Object with information needed to undo this apply:
    • properties: Set of property values;
    • messages: (optional) An array of messages associated with the nodes property values.
    • uiProperties: (optional) Set of UI only properties values
  • uiProperties: The set of UI only property values (optional)
applyPropertyChanges(propertySet, appData, additionalInfo, undoInfo, uiProperties) {
  var data = {
    propertySet: propertySet,
    appData: appData,
    additionalInfo: {
        messages: messages,
        title: title
    }
  };
}

closePropertiesDialog(closeSource)

Executes when user clicks Save or Cancel in the property editor dialog. This callback is used to control the visibility of the property editor dialog. closeSource identifies where this call was initiated from. It will equal “apply” if the user clicked on “Save” when no changes were made, or “cancel” if the user clicked on “Cancel”

closePropertiesDialog() {
  this.setState({ showPropertiesDialog: false, propertiesInfo: {} });
}

propertyListener()

Executes when a user property values are updated.

propertyListener(data) {

}

controllerHandler()

Executes when the property controller is created. Returns the property controller. See the Properties Controller page for APIs.

controllerHandler(propertyController) {

}

actionHandler()

Called whenever an action is ran. id and data come from uihints and appData is passed in with propertiesInfo.

actionHandler(id, appData, data) {

}

buttonHandler()

Called when the edit button is clicked on in a readonlyTable control, or if a custom table button is clicked. The callback provides the following data:

  • data: an object that consists of
    • type: of button the click was invoked from.
      • edit is returned from the edit button click of a readonlyTable control.
      • custom_button is returned from the custom button click of a complex type control.
    • propertyId: of the control that was clicked.
    • buttonId: of the button that was clicked from a custom table button.
buttonHandler(data) {

}

buttonIconHandler()

Called when there is a buttons uihints set in the complex_type_info section of the parameter definition. This buttonIconHandler expects a Carbon Icon jsx object as the return value from the callback. This is used to display the Carbon icon in the custom table button. The buttonIconHandler provides the following data:

  • data: an object that consists of
    • type: customButtonIcon
    • propertyId: of the control that was clicked.
    • buttonId: of the button that was clicked from a custom table button.
    • carbonIcon: The name of the Carbon icon specified in the uihints. The corresponding jsx object is expected to be returned in the callback.
buttonIconHandler(data, callbackIcon) {
  if (data.type === "customButtonIcon" && data.carbonIcon === "Edit32") {
    callbackIcon(<Edit32 />);
  }
}

helpClickHandler()

Executes when user clicks the help icon in the property editor dialog. The callback provides the following data:

If no help object is found, no help link will be shown.

titleChangeHandler()

Called on properties title change. This callback can be used to validate the new title and return warning or error message if the new title is invalid. This callback is optional.

In case of error or warning, titleChangeHandler should call callbackFunction with an object having type and message. If the new title is valid, no need to call the callbackFunction. 

titleChangeHandler(title, callbackFunction) {
  // If Title is valid. No need to send anything in callbackFunction
  if (title.length > 15) {
    callbackFunction({
      type: "error",
      message: "Only 15 characters are allowed in title."
    });
  }
}
where:

  • type (string, required): This must be one of two values: “warning” or “error”.
  • message(string, required): Error or warning message. There is no restriction on length of the message.

propertiesActionLabelHandler()

propertiesActionLabelHandler()
This is an optional handler you don’t need to implement anything for it unless you want to. This callback allows your code to override the default tooltip text for the Undo and Redo buttons. The propertiesActionLabelHandler callback, when provided, is called for the save properties action that is performed in Common Properties. This callback should return a string or null. If a string is returned it will be shown in the tooltip for the Undo button in the toolbar preceded by “Undo:” and the string will also appear in the tooltip for the Redo button (when appropriate) preceded by “Redo:”. If null is returned, Common Properties will display the default text Save {node_name} node properties for the Undo and Redo buttons.

tooltipLinkHandler()

Optional callback used for adding a link in properties tooltips. link object must be defined under description in uiHints parameter info. Common Properties internally pass the link object to tooltipLinkHandler callback. This callback must return an object having url and label.

tooltipLinkHandler(link) {
    return { url: "https://www.google.com/", label: "More info" };
}