ControlBlock

React component. Contains multiple control buttons

Example

../../_images/controlblock.png
import { ActionResult, EvaError } from "@eva-ics/webengine";
import {
  ControlBlock,
  ControlButtonDisplay,
  ControlButtonKind
} from "@eva-ics/webengine-react";

const on_success = (result: ActionResult) => {
  console.log(`action success: {result.uuid}`);
};

const on_fail = (err: EvaError) => {
  console.log(`action failed: {error.message}`);
};

const MyBlock = () => {
  const buttons: Array<ControlButtonDisplay> = [
    {
      oid: "unit:tests/door",
      label: "Gate 1"
    },
    {
      oid: "unit:tests/door_remote",
      label: "Gate 2"
    },
    {
      oid: "unit:tests/srx",
      label: "SRX",
      kind: ControlButtonKind.Value,
      input_size: 5
    },
    {
      oid: "lmacro:m1",
      label: "M1",
      busy: "unit:tests/sr1"
    }
  ];
  return (
    <>
      <ControlBlock
        title="Gate controls"
        buttons={buttons}
        on_success={on_success}
        on_fail={on_fail}
      />
    </>
  );
};

Parameters

name

type

required

description

buttons

Array<ControlButtonDisplay>

yes

buttons to display

title

string

no

block title

on_success

(result: ActionResult) => void

no

called on action success

on_fail

(err: EvaError) => void

no

called on action fail

engine

Eva

no

WebEngine object (if no default set)

Types

ControlButtonKind

enum ControlButtonKind {
  Toggle = "toggle",
  Value = "value",
  Run = "run"
}

Interfaces

ControlButtonDisplay

interface ControlButtonDisplay {
  oid: string;
  params?: object; // used by ControlButtonRun only
  busy?: string; // used by ControlButtonRun only
  label?: string;
  kind?: ControlButtonKind;
  input_size?: number; // used by ControlButtonValue only
  position?: CanvasPosition; // used by Canvas only
  css_class?: string;
}

CSS classes

name

description

div.eva.button.block

primary block container

div.eva.button.block_container

internal block container