feat(types): add Card, Carousel, and Alert block types

[srtaalej]

Summary

• Adds CardBlock — a rich display block for structured content (hero image, icon, title, subtitle, body, actions)
• Adds CarouselBlock — a horizontally scrollable collection of card blocks (1–10 cards)
• Adds AlertBlock — a prominent notice block with severity levels (default, info, warning, error, success)

All three interfaces are added to the KnownBlock discriminated union in blocks.ts and automatically barrel-exported via index.ts. Type tests cover happy paths, sad paths, and union assignability.

Why draft?

The AlertBlock uses type: 'alert' per the docs, but the Slack API currently rejects it at runtime:

{'ok': False, 'error': 'invalid_blocks', 'errors': ['Unsupported block type: alert [json-pointer:/blocks/0]'],
 'response_metadata': {'messages': ['[ERROR] Unsupported block type: alert [json-pointer:/blocks/0]']}}

This may indicate the block type isn't fully rolled out server-side yet. Keeping in draft until confirmed available.

Test plan

Test app.js

import { App, LogLevel } from '@slack/bolt';
import { config } from 'dotenv';
import { registerListeners } from './listeners/index.js';

config();

/** Initialization */
const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  socketMode: true,
  appToken: process.env.SLACK_APP_TOKEN,
  logLevel: LogLevel.DEBUG,
});

/** Register Listeners */
registerListeners(app);

/** Start the Bolt App */
(async () => {
  try {
    await app.start();
    app.logger.info('⚡️ Bolt app is running!');

    await app.client.chat.postMessage({
      channel: '#test-blockkit-new-types',
      text: 'New Block Kit types demo',
      blocks: [
        {
          type: 'carousel',
          elements: [
            {
              type: 'card',
              hero_image: { type: 'image', image_url: 'https://picsum.photos/seed/a/400/200', alt_text: 'Card 1 hero' },
              title: { type: 'mrkdwn', text: 'Card Block' },
              subtitle: { type: 'mrkdwn', text: 'Rich structured content' },
              body: { type: 'mrkdwn', text: 'Recommendations, results, or work items.' },
              actions: [{ type: 'button', text: { type: 'plain_text', text: 'Learn more' }, action_id: 'card_1_btn' }],
            },
            {
              type: 'card',
              hero_image: { type: 'image', image_url: 'https://picsum.photos/seed/b/400/200', alt_text: 'Card 2 hero' },
              title: { type: 'mrkdwn', text: 'Alert Block' },
              subtitle: { type: 'mrkdwn', text: 'Prominent notices' },
              body: { type: 'mrkdwn', text: 'Warnings, status updates, and more.' },
              actions: [{ type: 'button', text: { type: 'plain_text', text: 'Learn more' }, action_id: 'card_2_btn' }],
            },
            {
              type: 'card',
              hero_image: { type: 'image', image_url: 'https://picsum.photos/seed/c/400/200', alt_text: 'Card 3 hero' },
              title: { type: 'mrkdwn', text: 'Carousel Block' },
              subtitle: { type: 'mrkdwn', text: 'Scrollable card collections' },
              body: { type: 'mrkdwn', text: 'Up to 10 cards, side by side.' },
              actions: [{ type: 'button', text: { type: 'plain_text', text: 'Learn more' }, action_id: 'card_3_btn' }],
            },
          ],
        },
        // {
        //   type: 'alert',
        //   text: { type: 'mrkdwn', text: 'This is an alert block test' },
        //   level: 'warning',
        // },
      ],
    });
    app.logger.info('Sent block kit demo message');
  } catch (error) {
    app.logger.error('Failed to start the app', error);
  }
})();

• tsd type tests for all three block types (happy + sad paths)
• KnownBlock union assignability tests
• npm run build and npm test pass for @slack/types
• Integration test: send a message with CardBlock to Slack
• Integration test: send a message with CarouselBlock to Slack
• Integration test: send a message with AlertBlock to Slack (currently failing — see above)

[changeset-bot]

⚠️ No Changeset found

Latest commit: c90b23d

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 87.41%. Comparing base (62c5a3f) to head (c90b23d).
✅ All tests successful. No failed tests found.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #2567   +/-   ##
=======================================
  Coverage   87.41%   87.41%           
=======================================
  Files          62       62           
  Lines       10251    10251           
  Branches      415      415           
=======================================
  Hits         8961     8961           
  Misses       1269     1269           
  Partials       21       21           

Flag	Coverage Δ
cli-hooks	87.41% <ø> (ø)
cli-test	87.41% <ø> (ø)
logger	87.41% <ø> (ø)
oauth	87.41% <ø> (ø)
socket-mode	87.41% <ø> (ø)
web-api	87.41% <ø> (ø)
webhook	87.41% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.