Button

The Button interface represents a clickable UI component. When a user clicks the button, a specified action is executed.

Example:

Done

import { query, Button } from 'lakelib';

new Button({
  root: query('.button-root'),
  name: 'done',
  type: 'primary',
  text: 'Done',
  onClick: () => {
    console.log('clicked');
  },
}).render();

Cancel

import { query, Button } from 'lakelib';

new Button({
  root: query('.button-root'),
  name: 'cancel',
  text: 'Cancel',
  onClick: () => {
    console.log('clicked');
  },
}).render();

Open

import { query, Button } from 'lakelib';

new Button({
  root: query('.button-root'),
  name: 'open',
  icon: icons.get('open'),
  tooltip: 'Open',
  onClick: () => {
    console.log('clicked');
  },
}).render();

Save

import { query, Button } from 'lakelib';

new Button({
  root: query('.button-root'),
  name: 'save',
  icon: icons.get('save'),
  text: 'Save',
  onClick: () => {
    console.log('clicked');
  },
}).render();

Constructor

Creates a new Button instance. It receives a key-value object with the following properties as its parameter.

root

Specifies the element to which the button will be appended.

Type: Nodes

name

Specifies the unique name for the button.

Type: string

onClick

Specifies the callback function executed when the button is clicked.

Type: function

type Optional

Specifies the button style.

Type: 'primary' | 'default'

Default: default

icon Optional

Specifies an icon to be displayed on the button.

Type: HTML string

text Optional

Specifies the text label displayed on the button.

Type: string

tooltip Optional

Specifies the tooltip text shown when the user hovers over the button.

Type: string

tabIndex Optional

Specifies the tab order of the button.

Type: number

Instance properties

node Read only

The button element.

• Type: Nodes

Example:

const buttonNode = button.node;

Instance methods

render()

Renders the button to the DOM.

• Parameters:

  None.

• Return value:

  None.

Example:

button.render();