Skip to content

feat: add native sticker pack send support#201797

Open
sergiooak wants to merge 5 commits into
wwebjs:mainfrom
sergiooak:feat/sticker-pack
Open

feat: add native sticker pack send support#201797
sergiooak wants to merge 5 commits into
wwebjs:mainfrom
sergiooak:feat/sticker-pack

Conversation

@sergiooak

@sergiooak sergiooak commented Jun 14, 2026

Copy link
Copy Markdown

Description

Adds support for sending a native sticker pack via sendMessage. Pass a MessageMedia[] array with sendMediaAsStickerPack: true and the library will:

  1. Convert each media item to a WebP sticker (image or video)
  2. Embed per-sticker EXIF metadata (pack id, name, publisher, emoji categories)
  3. Pack everything into a zip with a tray icon (defaults to the first sticker, or a custom image via stickerPackTrayIcon)
  4. Generate an auto-generated 2×2 grid chat-card thumbnail using a new browser-side canvas utility
  5. Upload the zip and thumbnail to WhatsApp's CDN (thumbnail is re-encrypted with the pack's media key so the recipient can render the preview)
  6. Send the message as a native sticker-pack type
image image

New sendMessage options:

Option Type Description
sendMediaAsStickerPack boolean Send a MessageMedia[] as a sticker pack
stickerPackName string Pack name (required)
stickerPackPublisher string Publisher name
stickerPackId string Pack ID (defaults to a random UUID)
stickerPackTrayIcon MessageMedia | null Custom tray icon; defaults to the first sticker

Internal refactor: the pre-existing formatToWebpSticker single-sticker path now shares the new _writeStickerExif, _mediaToWebp, and _inspectWebpSticker helpers, eliminating duplicated EXIF-building code.

Related Issue(s)

#3614 3614

Testing Summary

Test Details

  • Sent sticker packs of 1, 2, 3, and 4+ stickers from images and verified they install and display correctly in WhatsApp on both sender and receiver sides.
  • Verified the auto-generated 2×2 grid thumbnail renders correctly in the chat card preview.
  • Verified the custom tray icon option (stickerPackTrayIcon) replaces the default first-sticker icon.
  • Ran npm test — all existing tests pass.

Environment

  • Machine OS: Windows 11

  • Phone OS:

  • Library Version: 1.34.7

  • WhatsApp Web Version: 2.3000.1041450038

  • Browser Type and Version: Chrome 149.0.7827

  • Node Version: 26.2.0

Type of Change

  • Dependency change (archiver moved from optionalDependencies to dependencies)
  • Bug fix
  • New feature (non-breaking change that adds functionality)
  • Breaking change
  • Non-code change

Checklist

  • My code follows the style guidelines of this project.
  • All new and existing tests pass (npm test).
  • Typings (e.g. index.d.ts) have been updated if necessary.
  • Usage examples (e.g. example.js) / documentation have been updated if applicable.

sergiooak and others added 4 commits June 14, 2026 20:17
co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
adds sendMediaAsStickerPack option to sendMessage, accepting a
messagemedia[] array. Stickers are converted to webp, packed into a
zip with a tray icon, uploaded via the WhatsApp Web upload manager,
and sent as a native sticker-pack message with an auto-generated
grid thumbnail.

internal helpers (_mediaToWebp, _writeStickerExif, _inspectWebpSticker,
_zip) are shared with the existing single-sticker path, eliminating
duplicated EXIF-building code.

co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
adds STICKER_PACK to MessageTypes enum, MessageMedia[] to MessageContent,
and five new fields to MessageSendOptions: sendMediaAsStickerPack,
stickerpackname, stickerPackPublisher, stickerPackId, stickerPackTrayIcon.

co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@github-actions github-actions Bot added dependencies Dependency updates api changes API modifications typings Type definitions utility Utility code labels Jun 14, 2026
@sergiooak sergiooak changed the title Feat/sticker pack feat: add native sticker pack send support Jun 14, 2026
- Replace generated DiceBear image URLs
- Add real Sticker.ly sticker assets to pack demo
- Keep native sticker pack creation flow unchanged
@guidecopas

Copy link
Copy Markdown

nice.

@lindionez lindionez left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Image Work!

@sergiooak

Copy link
Copy Markdown
Author

C.c @purpshell, @tuyuribr3 and @alechkos

Comment thread example.js
}
} else if (msg.body === '!pack') {
const urls = [
'https://sticker-ly-api.sergiooak.com.br/file/sticker_pack/MGU8sA927ahRF7KMT9dluA/PTHH2U/42/-588087217.png',

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please use github urls (from inside this rep) ( you can create files as examples, one or two test images)

Comment thread package.json
"node": ">=18.0.0"
},
"optionalDependencies": {
"archiver": "7.0.1",

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would still make archiver optional, can you include it outsite src/util/Util.js#7 ? ( Only inside the function we need it ? )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

api changes API modifications dependencies Dependency updates typings Type definitions utility Utility code

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants