EkoButton

EkoButton is an abstract class for a button which can be extended to provide custom functionality or look & feel.
Some of the methods specified here can be overridden to tailor for required behaviors.
See the guide on customizing UI components and the live example.

Note: All Eko button components such as EkoDecisionButton & EkoParallelButton extend this class.
Note: This component exposes it’s root element as a react ref property this.containerRef.

See: EkoDecisionButton, EkoParallelButton
Example

export default class EkoButton extends React.Component {
    // Invokes all the Handlers defined on this button.
    // Override to implement any custom functionality.
    clickHandler() {...}

    // The return value of this function is used to set which CSS classes will be present in the DOM
    // for the root element of this component (default is 'ekoButton').
    getClassnames() {
        return 'ekoButton';
    }

    // The return value of this function will be used as the content of this component.
    // It can be either a string or a React component (default is the 'text' value from the config).
    getContent() { ... }
}

Example

// Creating a component that extends EkoButton:

import EkoUIComponents from 'EkoUIComponents';

export default class MyButton extends EkoUIComponents.EkoButton {
    clickHandler() {
        super.clickHandler();
        alert('button clicked');
    }

    getClassnames() {
        return `${super.getClassnames()} myButtonWrapperClass`;
    }

     getContent() {
        return (<div className="myButton">{super.getContent()}</div>)
    }
}

Properties

containerRef : object
property

A React ref for the root element of this component

Methods

ekoUIComponents.EkoButton.clickHandler()
method

This handler gets called on click,
Override to implement any custom functionality.

ekoUIComponents.EkoButton.getClassnames() ⇒ string
method

The return value of this function is used to set which CSS classes will be present in the DOM
for the root element of this component.

Returns: string - A string of space-delimited classes. Default is ‘ekoButton’

ekoUIComponents.EkoButton.getContent() ⇒ object | string
method

The return value of this function will be used as the content of this component.
It can be either a string or a React component.

Returns: object | string - a string or a react component representing the content of this component.

Rate this page: X
Tell us more!