Add run shortcut action

src/actions.ts

@@ -25,6 +25,7 @@ import GetFromList from "~/actions/get-from-list";
 import SetName from "~/actions/set-name";
 import Output from "~/actions/output";
 import CopyToClipboard from "~/actions/copy-to-clipboard";
+import RunShortcut from "~/actions/run-shortcut";
 
 interface ActionDefinitions {
     [key: string]: ActionDefinition
@@ -71,6 +72,7 @@ export let actions: ActionDefinitions = {
     'setitemname': SetName,
     'output': Output,
     'setclipboard': CopyToClipboard,
+    'runworkflow': RunShortcut,
 };
 
 export function actionText(value: string): HTMLElement {

src/actions/run-shortcut.ts

@@ -0,0 +1,24 @@
+import {renderActionHeader, renderParameters} from "~/render";
+import {actions} from "~/actions";
+import {renderValue} from "~/value";
+
+interface RunShortcutParameters {
+    WFInput: string | object
+    WFWorkflow: string | object
+    output: string | object
+}
+
+export default {
+    title: "Run",
+    icon: "",
+    render: (container: HTMLElement, params: RunShortcutParameters) => {
+        container.classList.add('sp-shortcut-action');
+
+        const action = renderActionHeader(actions['runworkflow'], renderValue(params['WFInput'], 'Informational message'));
+        action.appendChild(renderParameters(actions['alert'], {
+            'Input': params['WFInput'],
+        }));
+
+        return action;
+    }
+}

src/render.ts

@@ -134,7 +134,7 @@ export function renderActionIcon(icon: string = 'gear', color?: string, backgrou
     const actionIcon = document.createElement('div');
     actionIcon.className = 'sp-action-icon';
     if (background) {
-        actionIcon.style.background = background;
+        actionIcon.style.backgroundColor = background;
     }
     if (color) {
         actionIcon.style.color = color;

src/style.css

@@ -1,4 +1,5 @@
 @import "glyphs.css";
+@import "action-icons.css";
 
 @media (prefers-color-scheme: dark) {
     :root {
@@ -33,34 +34,6 @@
         border: 1px solid #303030;
     }
 
-    .sp-container .sp-comment-action {
-        background: #2a2416 !important;
-    }
-
-    .sp-container .sp-comment-action .sp-action-icon {
-        color: #fed709 !important;
-        background: #2a2416 !important;
-    }
-
-    .sp-container .sp-comment-action .sp-action-icon,
-    .sp-container .sp-comment-action .sp-action-title {
-        color: #fed709 !important;
-    }
-
-    .sp-container .sp-nothing-action .sp-action-icon {
-        color: white !important;
-    }
-
-    .sp-container .sp-date-action .sp-action-icon:not(.sp-variable-icon) {
-        color: #ff453a !important;
-        background: #3d2622 !important;
-    }
-
-    .sp-container .sp-blue-action .sp-action-icon:not(.sp-variable-icon) {
-        color: #0b84ff !important;
-        background: #202d3b !important;
-    }
-
     .sp-container .sp-output-action .sp-output-surface-behavior {
         color: #9f9f9d !important;
     }
@@ -198,34 +171,17 @@
     border-radius: 0.25rem;
     box-sizing: border-box;
     padding: 0.30rem;
-    background: #c7c7c7;
+    background-color: #c7c7c7;
     user-select: none;
     pointer-events: none;
     line-height: 0;
+    background-size: contain;
 }
 
 .sp-container .sp-action-icon i {
     font-size: 1.2rem;
 }
 
-.sp-container .sp-date-action .sp-action-icon:not(.sp-variable-icon) {
-    color: #ff3b2f !important;
-    background: #ffeeee !important;
-}
-
-.sp-container .sp-blue-action .sp-action-icon:not(.sp-variable-icon) {
-    color: #007aff !important;
-    background: #eaf1ff !important;
-}
-
-.sp-container .sp-comment-action {
-    background: #fbf5e8;
-}
-
-.sp-container .sp-comment-action .sp-action-title {
-    color: #ffbf00;
-}
-
 .sp-container .sp-output-action .sp-output-surface-behavior {
     text-align: left;
     font-weight: bold;

src/value.ts

@@ -75,6 +75,9 @@ function renderObjectValue(container: HTMLElement, value?: any) {
     } else if (value.Variable) {
         varName = value.Variable.Value.VariableName;
         varType = value.Variable.Value.Type;
+    } else if (value.workflowName) {
+        container.innerText = value.workflowName;
+        return;
     } else {
         container.innerText = '[Unsupported Object]';
         return;