tessl/npm-slack--types

Comprehensive TypeScript type definitions for building Slack applications and integrations with the Node Slack SDK

1.11x

Overview

Eval results

Files

Block Kit Framework

Name: tessl/npm-slack--types
Rating: 0.94 (1 reviews)
Author: tessl

Block Kit is Slack's UI framework for building rich, interactive interfaces. This module provides TypeScript definitions for all Block Kit components including blocks, elements, and composition objects.

Capabilities

Block Types

Core block components that serve as containers for content and interactive elements.

/**
 * Base interface for all blocks
 */
interface Block {
  type: string;
  block_id?: string;
}

/**
 * Union of all known block types
 */
type KnownBlock = ActionsBlock | ContextBlock | DividerBlock | FileBlock | HeaderBlock | ImageBlock | InputBlock | MarkdownBlock | RichTextBlock | SectionBlock | VideoBlock;

/**
 * Helper union including generic Block interface
 */
type AnyBlock = KnownBlock | Block;

Section Block

The most commonly used block for displaying text content with optional accessories.

interface SectionBlock extends Block {
  type: 'section';
  text?: TextObject;
  fields?: TextObject[];
  accessory?: SectionBlockAccessory;
  expand?: boolean;
}

type SectionBlockAccessory = Button | Checkboxes | Datepicker | ImageElement | MultiSelect | Overflow | RadioButtons | Select | Timepicker | WorkflowButton;

Usage Example:

import { SectionBlock, PlainTextElement } from "@slack/types";

const section: SectionBlock = {
  type: "section",
  text: {
    type: "plain_text",
    text: "Choose your preferred meeting time:",
    emoji: true
  },
  accessory: {
    type: "timepicker",
    action_id: "time_select",
    initial_time: "14:00"
  }
};

Actions Block

Container for interactive elements like buttons and select menus.

interface ActionsBlock extends Block {
  type: 'actions';
  elements: ActionsBlockElement[];
}

type ActionsBlockElement = Button | Checkboxes | Datepicker | DateTimepicker | MultiSelect | Overflow | RadioButtons | Select | Timepicker | WorkflowButton | RichTextInput;

Input Block

Form input block for collecting user data in modals and App Home.

interface InputBlock extends Block {
  type: 'input';
  label: PlainTextElement;
  hint?: PlainTextElement;
  optional?: boolean;
  element: InputBlockElement;
  dispatch_action?: boolean;
}

type InputBlockElement = Checkboxes | Datepicker | DateTimepicker | EmailInput | FileInput | MultiSelect | NumberInput | PlainTextInput | RadioButtons | RichTextInput | Select | Timepicker | URLInput;

Header Block

Large, bold text for section headers.

interface HeaderBlock extends Block {
  type: 'header';
  text: PlainTextElement;
}

Divider Block

Visual separator element.

interface DividerBlock extends Block {
  type: 'divider';
}

Image Block

Display images with optional titles.

type ImageBlock = {
  type: 'image';
  alt_text: string;
  title?: PlainTextElement;
} & Block & (UrlImageObject | SlackFileImageObject);

Context Block

Contextual information with images and text.

interface ContextBlock extends Block {
  type: 'context';
  elements: ContextBlockElement[];
}

type ContextBlockElement = ImageElement | TextObject;

Rich Text Block

WYSIWYG rich text content with formatting and interactive elements.

interface RichTextBlock extends Block {
  type: 'rich_text';
  elements: RichTextBlockElement[];
}

type RichTextBlockElement = RichTextSection | RichTextList | RichTextQuote | RichTextPreformatted;

Video Block

Embedded video player with thumbnail and metadata.

interface VideoBlock extends Block {
  type: 'video';
  video_url: string;
  thumbnail_url: string;
  alt_text: string;
  title: PlainTextElement;
  title_url?: string;
  author_name?: string;
  provider_name?: string;
  provider_icon_url?: string;
  description?: PlainTextElement;
}

File Block

Display remote files in messages.

interface FileBlock extends Block {
  type: 'file';
  source: string;
  external_id: string;
}

Markdown Block

AI-friendly markdown content rendering.

interface MarkdownBlock extends Block {
  type: 'markdown';
  text: string;
}

Composition Objects

Text Objects

type TextObject = PlainTextElement | MrkdwnElement;

interface PlainTextElement {
  type: 'plain_text';
  text: string;
  emoji?: boolean;
}

interface MrkdwnElement {
  type: 'mrkdwn';
  text: string;
  verbatim?: boolean;
}

Options and Option Groups

type Option = MrkdwnOption | PlainTextOption;

interface PlainTextOption {
  text: PlainTextElement;
  value?: string;
  url?: string;
  description?: PlainTextElement;
}

interface MrkdwnOption {
  text: MrkdwnElement;
  value?: string;
  url?: string;
  description?: PlainTextElement;
}

interface OptionGroup {
  label: PlainTextElement;
  options: Option[];
}

Confirmation Dialog

interface ConfirmationDialog {
  title?: PlainTextElement;
  text: PlainTextElement | MrkdwnElement;
  confirm?: PlainTextElement;
  deny?: PlainTextElement;
  style?: ColorScheme;
}

// Deprecated alias
interface Confirm extends ConfirmationDialog {}

Dispatch Action Configuration

interface DispatchActionConfig {
  trigger_actions_on?: ('on_enter_pressed' | 'on_character_entered')[];
}

Image Objects

interface UrlImageObject {
  image_url: string;
}

interface SlackFileImageObject {
  slack_file: SlackFile;
}

type SlackFile = SlackFileViaUrl | SlackFileViaId;

interface SlackFileViaUrl {
  url: string;
}

interface SlackFileViaId {
  id: string;
}

Conversation Filter

type ConversationFilter = 
  | (BaseConversationFilter & Required<Pick<BaseConversationFilter, 'include'>>)
  | (BaseConversationFilter & Required<Pick<BaseConversationFilter, 'exclude_bot_users'>>)
  | (BaseConversationFilter & Required<Pick<BaseConversationFilter, 'exclude_external_shared_channels'>>);

interface BaseConversationFilter {
  include?: [ConversationType, ...ConversationType[]];
  exclude_external_shared_channels?: boolean;
  exclude_bot_users?: boolean;
}

Extension Mixins

Reusable interface mixins for common block and element behaviors:

interface Actionable {
  type: string;
  action_id?: string;
}

interface Confirmable {
  confirm?: ConfirmationDialog;
}

interface Dispatchable {
  dispatch_action_config?: DispatchActionConfig;
}

interface Focusable {
  focus_on_load?: boolean;
}

interface MaxItemsSelectable {
  max_selected_items?: number;
}

interface Placeholdable {
  placeholder?: PlainTextElement;
}

interface URLRespondable {
  response_url_enabled?: boolean;
}

interface RichTextBorderable {
  border?: 0 | 1;
}

interface RichTextStyleable {
  style?: {
    bold?: boolean;
    code?: boolean;
    italic?: boolean;
    strike?: boolean;
  };
}

Utility Types

type ColorScheme = 'primary' | 'danger';
type ConversationType = 'im' | 'mpim' | 'private' | 'public';

Install with Tessl CLI

npx tessl i tessl/npm-slack--types