Skip to content

Actions

Description

Display a list of action buttons

Attributes

  • tile=actions
  • title
  • options:
    • layout: grid | tile | round | buttons | _whitelabel_ | hekabio | hekabio-tiles | hekabio-buttons. layout can be from one of following options.
  • body: [only for hekabio layout type]
  • styles: styles for root component
  • classes: classes for root component
  • actions: [Array of objects]
    • condition: valid rule
    • title: action button text
    • description: additional instructions within action button
    • target: post | form | behavior | close | parent | wiki | navigate | script | page
      • post and form act as menu actions
      • close will close the page
      • navigate can transfer to the next page
    • options: configuration based on different layout and requirements
    • behavior: share | dispatch | healthyio
    • params: [only for behavior target]
    • values: [only for behavior target]
    • onComplete: close
    • boxShadow: based on layout
    • background: background style
    • foreground: foreground style
    • backgroundImage: image
    • icon: based on layout
    • variant: based on layout
    • color: based on layout
    • size: based on layout
    • clz
    • baseClz
    • classes
    • styles
    • mapping: Mapping data with custom and dynamic data source [object type]
      • from: default value to display
      • to: path for a map with dynamic source
      • template: provide a template string

Target options clearance

post

Same as Shortcut options

form

Same as Shortcut options

behavior

Properties

  • behavior:Enumeration - share | dispatch

close

Closes the form.

Data mapping

Data can be transferred from the layout source to the destination.

Example:

"mapping": [
    {
      "from": "projectId",
      "to": "data.project"
    }
  ]

Example

{
  "tile": "actions",
  "options": {
    "layout": "component"
  },
  "actions": [
    {
      "title": "Message board",
      "description": "Post to your team message board.",
      "target": "post",
      "color": "#FFF000",
      "icon": "chat",
      "options": {
        "swimlane": "938f2942-d956-4d35-8244-a53b675c6536"
      }
    },
    {
      "title": "Require a response",
      "description": "Create a post that requires a response.",
      "target": "behavior",
      "color": "#FFF000",
      "icon": "send",
      "behavior": "dispatch",
      "values": {
        "title": "Require a response",
        "behavior": "dispatch"
      },
      "params": {
        "tracker": "7ba9a7b5-c5c8-420e-8c49-58e2c962205d"
      }
    }
  ]
}

Example2

 {
  "tile": "actions",
  "options": {
    "layout": "component"
  },
  "classes": {
    "row": "d-flex justify-content-between",
    "root": ""
  },
  "styles": {
    "row": {
      "margin": "0 -11px"
    }
  },
  "actions": [
    {
      "title": "Action Test",
      "styles": {
        "root": {
          "backgroundColor": "#FE7300",
          "color": "#E9ECBE",
          "height": "55px",
          "width": "100%",
          "borderRadius": "5px",
          "margin": "5px 24px"
        },
        "title": {
          "fontSize": "20px"
        }
      },
      "classes": {
        "root": "py-2 px-4",
        "title": "m-0 header"
      },
      "target": "form",
      "options": {
        "id": "c10737cd-a506-4afb-beeb-5111c08994ea",
        "tracker": "7ba9a7b5-c5c8-420e-8c49-58e2c962205d",
        "data": {},
        "styles": {
          "edit": {
            "backgroundColor": "#FE7300"
          }
        }
      }
    }
  ]
}