CardFactory class

const card = CardFactory.heroCard(
     'White T-Shirt',
     ['https://example.com/whiteShirt.jpg'],
     ['buy']
);

Returns a properly formatted array of actions. Supports converting strings to messageBack actions (note: using 'imBack' for now as 'messageBack' doesn't work properly in emulator.)

static function actions(actions: string | CardAction[] | undefined)

Returns an attachment for an adaptive card. The attachment will contain the card and the appropriate contentType.

static function adaptiveCard(card: any)

Adaptive Cards are a new way for bots to send interactive and immersive card content to users. For channels that don't yet support Adaptive Cards natively, the Bot Framework will down render the card to an image that's been styled to look good on the target channel. For channels that support hero cards you can continue to include Adaptive Card actions and they will be sent as buttons along with the rendered version of the card.

For more information about Adaptive Cards and to download the latest SDK, visit adaptivecards.io.

const card = CardFactory.adaptiveCard({
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.0",
  "body": [
      {
         "type": "TextBlock",
         "text": "Default text input"
      }
  ],
  "actions": [
      {
         "type": "Action.Submit",
         "title": "OK"
      }
  ]
});

Returns an attachment for an animation card.

static function animationCard(title: string, media: string | MediaUrl[], buttons?: string | CardAction[], other?: Partial<AnimationCard>)

Returns an attachment for an audio card.

static function audioCard(title: string, media: string | MediaUrl[], buttons?: string | CardAction[], other?: Partial<AudioCard>)

Returns an attachment for a hero card.

static function heroCard(title: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<HeroCard>)

Hero cards tend to have one dominant full width image and the cards text & buttons can usually be found below the image.

const card = CardFactory.heroCard(
     'White T-Shirt',
     ['https://example.com/whiteShirt.jpg'],
     ['buy']
);

Returns an attachment for a hero card.

static function heroCard(title: string, text: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<HeroCard>)

Hero cards tend to have one dominant full width image and the cards text & buttons can usually be found below the image.

const card = CardFactory.heroCard(
     'White T-Shirt',
     ['https://example.com/whiteShirt.jpg'],
     ['buy']
);

Returns a properly formatted array of card images.

static function images(images: string | CardImage[] | undefined)

Returns a properly formatted array of media url objects.

static function media(links: string | MediaUrl[] | undefined)

Returns an attachment for an OAuth card used by the Bot Frameworks Single Sign On (SSO) service.

static function oauthCard(connectionName: string, title: string, text?: string)

Returns an attachment for a receipt card. The attachment will contain the card and the appropriate contentType.

static function receiptCard(card: ReceiptCard)

Returns an attachment for a signin card. For channels that don't natively support signin cards an alternative message will be rendered.

static function signinCard(title: string, url: string, text?: string)

Returns an attachment for a thumbnail card. Thumbnail cards are similar to hero cards but instead of a full width image, they're typically rendered with a smaller thumbnail version of the image on either side and the text will be rendered in column next to the image. Any buttons will typically show up under the card.

static function thumbnailCard(title: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<ThumbnailCard>)

Returns an attachment for a thumbnail card. Thumbnail cards are similar to hero cards but instead of a full width image, they're typically rendered with a smaller thumbnail version of the image on either side and the text will be rendered in column next to the image. Any buttons will typically show up under the card.

static function thumbnailCard(title: string, text: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<ThumbnailCard>)

Returns an attachment for a video card.

static function videoCard(title: string, media: string | MediaUrl[], buttons?: string | CardAction[], other?: Partial<VideoCard>)