Implement twemoji for buttons

Author: BobDotCom

packages/react/src/components/DiscordButton.tsx

@@ -2,15 +2,17 @@ import React, { ReactElement } from 'react'
 import { PropsWithSlot } from '../util'
 import OutboundLinkIcon from './OutboundLinkIcon'
 import '@discord-message-components/core/dist/styles/discord-button.css'
+import Twemoji from 'react-twemoji'
 
 export type DiscordButtonProps = {
 	disabled?: boolean
 	image?: string
 	type?: string
 	url?: string
+	emoji?: string
 } & PropsWithSlot
 
-export default function DiscordButton({ children, disabled, image, type = 'primary', url }: DiscordButtonProps): ReactElement {
+export default function DiscordButton({ children, disabled, image, type = 'primary', url, emoji }: DiscordButtonProps): ReactElement {
 	return type === 'link' && url && !disabled
 		? (
 			<a
@@ -20,6 +22,7 @@ export default function DiscordButton({ children, disabled, image, type = 'prima
 				rel="noopener noreferrer"
 			>
 				{image && <img className="discord-button-emoji" src={image} alt="" />}
+				{emoji && <Twemoji options={{ className: 'discord-button-emoji' }}>{emoji}</Twemoji>}
 				{children}
 				<OutboundLinkIcon />
 			</a>