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"
          }
        }
      }
    }
  ]
}