Workflow Builder: Steps from apps - https://api.slack.com/workflows/steps

index.js

const config = require("dotenv").config().parsed;
for (const k in config) {
  process.env[k] = config[k];
}

// npm install @slack/bolt@feat-workflow-steps
const { App } = require("@slack/bolt");
const app = new App({
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  token: process.env.SLACK_BOT_TOKEN,
  logLevel: 'debug',
});

app.use(async (args) => {
  const copiedArgs = JSON.parse(JSON.stringify(args));
  copiedArgs.context.botToken = 'xoxb-***';
  if (copiedArgs.context.userToken) {
    copiedArgs.context.userToken = 'xoxp-***';
  }
  copiedArgs.client = {};
  copiedArgs.logger = {};
  args.logger.debug(
    "Dumping request data for debugging...\n\n" +
    JSON.stringify(copiedArgs, null, 2) +
    "\n"
  );
  const result = await args.next();
  args.logger.debug("next() call completed");
  return result;
});

// https://api.slack.com/workflows/steps

// this listner is invoked when a workflow creator adds this app's workflow step
app.action({ callback_id: "helpdesk-request-form-submission", type: "workflow_step_edit" }, async ({ ack, body, client }) => {
  await ack();

  const configView = {
    "type": "workflow_step", // NOT "modal"
    "callback_id": "step-config-view",
    "blocks": [
      {
        "type": "input",
        "block_id": "title",
        "element": {
          "type": "plain_text_input",
          "action_id": "input"
        },
        "label": {
          "type": "plain_text",
          "text": "Title"
        },
        "optional": false
      },
      {
        "type": "input",
        "block_id": "description",
        "element": {
          "type": "plain_text_input",
          "action_id": "input"
        },
        "label": {
          "type": "plain_text",
          "text": "Description"
        },
        "optional": false
      },
      {
        "type": "input",
        "block_id": "category",
        "element": {
          "type": "plain_text_input",
          "action_id": "input"
        },
        "label": {
          "type": "plain_text",
          "text": "Category"
        },
        "optional": true
      }
    ]
  };
  await client.views.open({
    trigger_id: body.trigger_id,
    view: configView,
  })
});

// this listener is invoked when the workflow creator saves the step
app.view("step-config-view", async ({ client, body, ack }) => {
  await ack();

  const stateValues = body.view.state.values;
  await client.workflows.updateStep({
    workflow_step_edit_id: body.workflow_step.workflow_step_edit_id,
    // https://api.slack.com/reference/workflows/workflow_step#input
    inputs: {
      "title": {
        "value": stateValues.title.input.value,
        "skip_variable_replacement": false
      },
      "description": {
        "value": stateValues.description.input.value,
        "skip_variable_replacement": false
      },
      "category": {
        "value": stateValues.category.input.value,
        "skip_variable_replacement": false
      }
    },
    // https://api.slack.com/reference/workflows/workflow_step#output
    outputs: [
      {
        "name": "ticket_url",
        "type": "text",
        "label": "Created Ticket URL"
      },
      {
        "name": "title",
        "type": "text",
        "label": "Title"
      },
      {
        "name": "category",
        "type": "text",
        "label": "Category"
      }
    ]
  });
});

// this lisnter is invoked when an end-user runs the workflow
app.event("workflow_step_execute", async ({ logger, payload, client }) => {
  try {
    await client.workflows.stepCompleted({
      workflow_step_execute_id: payload.workflow_step.workflow_step_execute_id,
      outputs: {
        "ticket_url": "https://www.examle.com/tickets/123",
        "title": payload.workflow_step.inputs.title.value,
        "category": payload.workflow_step.inputs.category.value,
      }
    });
  } catch (e) {
    logger.warn(`Failed to call workflows.stepCompleted API method: ${JSON.stringify(e)}`);
    await client.workflows.stepFailed({
      workflow_step_execute_id: payload.workflow_step.workflow_step_execute_id,
      error: {
        message: `Something went wrong! (${e})`
      }
    });
  }
});

// npm run local
(async () => {
  await app.start(process.env.PORT || 3000);
  console.log("⚡️ Bolt app is running!");
})();

package.json

{
  "name": "wf-step-sample",
  "version": "1.0.0",
  "description": "Slack Workflow Steps Example",
  "main": "index.js",
  "scripts": {
    "local": "node_modules/.bin/nodemon index.js",
    "start": "node index.js"
  },
  "keywords": ["Slack"],
  "author": "@seratch",
  "license": "MIT",
  "dependencies": {
    "@slack/bolt": "^2.1.1-workflowStepsBeta.1",
    "dotenv": "^8.2.0"
  },
  "devDependencies": {
    "nodemon": "^2.0.4"
  }
}

workflow.json

{
  "source_id": "311678893717207293",
  "version": "1",
  "workflow": {
    "name": "Helpdesk Request",
    "blueprint": {
      "version": "1",
      "trigger": {
        "type": "channel_action",
        "id": "1f7d1648-e3f3-4c7f-ab1e-560be3595e73",
        "config": {
          "name": "Helpdesk Request",
          "channels": [
            "C013T0FTKU3"
          ],
          "callback_id": "adc896f4-f0e9-4891-8acd-5fccaa2d7563",
          "description": "Helpdesk Request"
        }
      },
      "steps": [
        {
          "type": "dialog",
          "id": "3859ca5e-ee4c-46f8-9d8f-1529d82aa474",
          "config": {
            "dialog_title": "Helpdesk Request",
            "dialog_elements": [
              {
                "name": "70ad6e49-b0b9-47bd-9f77-e246eaf23ef7",
                "type": "text",
                "label": "Title",
                "subtype": "",
                "optional": false,
                "placeholder": ""
              },
              {
                "name": "55fc9387-1018-41af-9193-4d3cb33af9b8",
                "type": "textarea",
                "label": "Description",
                "optional": false
              },
              {
                "name": "006b5c0c-9857-44eb-abfc-06dae15b4e1d",
                "type": "select",
                "label": "Category",
                "value": "Laptop",
                "options": [
                  {
                    "label": "Laptop",
                    "value": "Laptop"
                  },
                  {
                    "label": "Mobile",
                    "value": "Mobile"
                  },
                  {
                    "label": "Other",
                    "value": "Other"
                  }
                ],
                "optional": true,
                "data_source": "static"
              }
            ],
            "dialog_submit_label": "",
            "delivery_button_label": "Open Form",
            "delivery_message_text": "Hello! To get started, please fill out this form."
          }
        },
        {
          "type": "extension_step",
          "id": "f339635f-17d9-4a68-ad23-0e5126fc0c39",
          "config": {
            "app_action": {
              "name": "Helpdesk Request Form Submission",
              "type": "workflow_step_edit",
              "payload": null,
              "action_id": "Aa017F3PARTM",
              "api_app_id": "A01784YFFJS",
              "call_back_id": ""
            },
            "app_defined_config": {
              "inputs": {
                "title": {
                  "value": "{{3859ca5e-ee4c-46f8-9d8f-1529d82aa474==70ad6e49-b0b9-47bd-9f77-e246eaf23ef7==text}}"
                },
                "category": {
                  "value": "{{3859ca5e-ee4c-46f8-9d8f-1529d82aa474==006b5c0c-9857-44eb-abfc-06dae15b4e1d==text}}"
                },
                "description": {
                  "value": "{{3859ca5e-ee4c-46f8-9d8f-1529d82aa474==55fc9387-1018-41af-9193-4d3cb33af9b8==text}}"
                }
              },
              "outputs": [
                {
                  "name": "ticket_url",
                  "type": "text",
                  "label": "Created Ticket URL"
                },
                {
                  "name": "title",
                  "type": "text",
                  "label": "Title"
                },
                {
                  "name": "category",
                  "type": "text",
                  "label": "Category"
                }
              ]
            }
          }
        },
        {
          "type": "message",
          "id": "b5ebc6db-932c-4e29-94ba-a403b6e1427d",
          "config": {
            "channel": {
              "ref": "1f7d1648-e3f3-4c7f-ab1e-560be3595e73==channel"
            },
            "has_button": false,
            "message_text": "Here is your ticket: {{f339635f-17d9-4a68-ad23-0e5126fc0c39==ticket_url}}\n\nTitle: {{f339635f-17d9-4a68-ad23-0e5126fc0c39==title}}\nCategory: {{f339635f-17d9-4a68-ad23-0e5126fc0c39==category}}"
          }
        }
      ]
    }
  }
}