discord-message-transcript 1.0.0

package/dist/index.js

@@ -0,0 +1,120 @@
+export { ReturnType } from "./types/types.js";
+export { ReturnFormat } from "discord-message-transcript-base";
+import { AttachmentBuilder } from "discord.js";
+import { Json } from "./renderers/json/json.js";
+import { fetchMessages } from "./core/fetchMessages.js";
+import { ReturnType } from "./types/types.js";
+import { output } from "./core/output.js";
+import { ReturnTypeBase, ReturnFormat, outputBase, CustomError } from "discord-message-transcript-base";
+import { returnTypeMapper } from "./core/mappers.js";
+/**
+ * Creates a transcript of a Discord channel's messages.
+ * Depending on the `returnType` option, this function can return an `AttachmentBuilder`,
+ * a `string` (for HTML or JSON), a `Buffer`, a `Stream`, or an `Uploadable` object.
+ *
+ * @param channel The Discord text-based channel (e.g., `TextChannel`, `DMChannel`) to create a transcript from.
+ * @param options Configuration options for creating the transcript. See {@link CreateTranscriptOptions} for details.
+ * @returns A promise that resolves to the transcript in the specified format.
+ */
+export async function createTranscript(channel, options = {}) {
+    try {
+        if (!channel.isDMBased()) {
+            const permissions = channel.permissionsFor(channel.client.user);
+            if (!permissions || (!permissions.has("ViewChannel") || !permissions.has('ReadMessageHistory'))) {
+                throw new CustomError(`Channel selected, ${channel.name} with id: ${channel.id}, can't be used to create a transcript because the bot doesn't have permission for View the Channel or Read the Message History. Add the permissions or choose another channel!`);
+            }
+        }
+        const artificialReturnType = options.returnType == ReturnType.Attachment ? ReturnTypeBase.Buffer : options.returnType ? returnTypeMapper(options.returnType) : ReturnTypeBase.Buffer;
+        const { fileName = null, includeAttachments = true, includeButtons = true, includeComponents = true, includeEmpty = false, includeEmbeds = true, includePolls = true, includeReactions = true, includeV2Components = true, localDate = 'en-GB', quantity = 0, returnFormat = ReturnFormat.JSON, saveImages = false, selfContained = false, timeZone = 'UTC', watermark = true, } = options;
+        const checkedFileName = (fileName ?? `Transcript-${channel.isDMBased() ? "DirectMessage" : channel.name}-${channel.id}`);
+        const internalOptions = {
+            fileName: checkedFileName,
+            includeAttachments,
+            includeButtons,
+            includeComponents,
+            includeEmpty,
+            includeEmbeds,
+            includePolls,
+            includeReactions,
+            includeV2Components,
+            localDate,
+            quantity,
+            returnFormat,
+            returnType: artificialReturnType,
+            saveImages,
+            selfContained,
+            timeZone,
+            watermark
+        };
+        const jsonTranscript = channel.isDMBased() ? new Json(null, channel, internalOptions) : new Json(channel.guild, channel, internalOptions);
+        let lastMessageID;
+        const authors = new Map();
+        const mentions = {
+            channels: new Map(),
+            roles: new Map(),
+            users: new Map(),
+        };
+        while (true) {
+            const { messages, end } = await fetchMessages(channel, internalOptions, authors, mentions, lastMessageID);
+            jsonTranscript.addMessages(messages);
+            lastMessageID = messages[messages.length - 1]?.id;
+            if (end || (jsonTranscript.messages.length >= quantity && quantity != 0)) {
+                break;
+            }
+        }
+        jsonTranscript.sliceMessages(quantity);
+        jsonTranscript.setAuthors(Array.from(authors.values()));
+        jsonTranscript.setMentions({ channels: Array.from(mentions.channels.values()), roles: Array.from(mentions.roles.values()), users: Array.from(mentions.users.values()) });
+        const result = await output(await jsonTranscript.toJson());
+        if (!options.returnType || options.returnType == "attachment") {
+            if (!(result instanceof Buffer)) {
+                throw new CustomError("Expected buffer from output when *attachment* returnType is used.");
+            }
+            const fileExtension = returnFormat == "HTML" ? ".html" : ".json";
+            return new AttachmentBuilder(result, { name: internalOptions.fileName + fileExtension });
+        }
+        return result;
+    }
+    catch (error) {
+        if (error instanceof Error) {
+            throw new CustomError(`Error creating transcript: ${error.stack}`);
+        }
+        const unknowErrorMessage = String(error);
+        throw new CustomError(`Unknown error: ${unknowErrorMessage}`);
+    }
+}
+/**
+ * Converts a JSON transcript string into an HTML transcript.
+ * Depending on the `returnType` option, this function can return an `AttachmentBuilder`,
+ * a `string`, a `Buffer`, a `Stream`, or an `Uploadable`  object.
+ *
+ * @param jsonString The JSON string representing the transcript data.
+ * @param options Configuration options for converting the transcript. See {@link ConvertTranscriptOptions} for details.
+ * @returns A promise that resolves to the HTML transcript in the specified format.
+ */
+export async function renderHTMLFromJSON(jsonString, options = {}) {
+    try {
+        const json = JSON.parse(jsonString);
+        json.options.returnFormat = ReturnFormat.HTML;
+        json.options.selfContained = options?.selfContained ?? false;
+        json.options.watermark = options.watermark ?? json.options.watermark;
+        const officialReturnType = options?.returnType ?? ReturnType.Attachment;
+        if (officialReturnType == ReturnType.Attachment)
+            json.options.returnType = ReturnTypeBase.Buffer;
+        const result = await outputBase(json);
+        if (officialReturnType == ReturnType.Attachment) {
+            if (!(result instanceof Buffer)) {
+                throw new CustomError("Expected buffer from outputBase when *attachment* returnType is used.");
+            }
+            return new AttachmentBuilder(result, { name: json.options.fileName + ".html" });
+        }
+        return result;
+    }
+    catch (error) {
+        if (error instanceof Error) {
+            throw new CustomError(`Error converting JSON to HTML: ${error.stack}`);
+        }
+        const unknowErrorMessage = String(error);
+        throw new CustomError(`Unknown error: ${unknowErrorMessage}`);
+    }
+}

package/dist/renderers/html/clientRenderer.js

@@ -0,0 +1,73 @@
+"use strict";
+document.addEventListener('DOMContentLoaded', () => {
+    const transcriptDataElement = document.getElementById('transcript-data');
+    if (!transcriptDataElement) {
+        console.error('Missing transcript data element.');
+        return;
+    }
+    const data = JSON.parse(transcriptDataElement.textContent);
+    const authorMap = new Map(data.authors.map(author => [author.id, author]));
+    document.querySelectorAll('.messageDiv[data-author-id]').forEach(messageDiv => {
+        const authorId = messageDiv.dataset.authorId;
+        const author = authorMap.get(authorId);
+        if (!author) {
+            console.warn(`Author not found for message with ID: ${messageDiv.id} and author ID: ${authorId}`);
+            return;
+        }
+        const avatarImg = messageDiv.querySelector('.messageImg');
+        if (avatarImg)
+            avatarImg.src = author.avatarURL;
+        const usernameH3 = messageDiv.querySelector('.messageUsername');
+        if (usernameH3) {
+            usernameH3.textContent = author.member?.displayName ?? author.displayName;
+            usernameH3.style.color = author.member?.displayHexColor ?? '#dbdee1';
+        }
+        const badgesDiv = messageDiv.querySelector('.badges');
+        if (badgesDiv) {
+            badgesDiv.innerHTML = ''; // Clear existing placeholders
+            if (author.bot) {
+                const badge = document.createElement('p');
+                badge.className = 'badge';
+                badge.textContent = 'APP';
+                badgesDiv.appendChild(badge);
+            }
+            if (author.system) {
+                const badge = document.createElement('p');
+                badge.className = 'badge';
+                badge.textContent = 'SYSTEM';
+                badgesDiv.appendChild(badge);
+            }
+            if (author.guildTag) {
+                const badge = document.createElement('p');
+                badge.className = 'badgeTag';
+                badge.textContent = author.guildTag;
+                badgesDiv.appendChild(badge);
+            }
+        }
+    });
+    // Handle existing client-side event listeners
+    document.addEventListener('click', function (event) {
+        const spoiler = event.target.closest('.spoilerMsg, .spoilerAttachment');
+        if (spoiler && !spoiler.classList.contains('revealed')) {
+            event.preventDefault();
+            event.stopPropagation();
+            spoiler.classList.add('revealed');
+        }
+        const selectorInput = event.target.closest('.selectorInput');
+        document.querySelectorAll('.selector').forEach(selector => {
+            if (!selector.contains(event.target)) {
+                selector.classList.remove('active');
+            }
+        });
+        if (selectorInput) {
+            const selector = selectorInput.closest('.selector');
+            if (selector) {
+                selector.classList.toggle('active');
+            }
+        }
+    });
+    // Initial highlighting
+    if (window.hljs) {
+        hljs.highlightAll();
+    }
+});

package/dist/renderers/html/css.d.ts

@@ -0,0 +1,11 @@
+export declare const DEFAULT_CSS = "\nbody {\n    background-color: #313338;\n    color: #dbdee1;\n    font-family: \"Whitney\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n}\nheader {\n    height: fit-content;\n    border-bottom: 2px solid black;\n    margin-top: 2rem;\n    padding-left: 2rem;\n    padding-bottom: 1rem;\n    display: flex;\n    flex-direction: column;\n    display: flex;\n    flex-direction: row;\n}\na {\n    text-decoration: none;\n    color: #1E90FF;\n}\np {\n    margin: 0;\n}\nh4 {\n    margin: 0;\n}\ncode {\n    border: 1px solid #202225;\n    border-radius: 0.25rem;\n}\nblockquote {\n    margin: 0.5rem 0;\n    border-left: 0.25rem solid #4f545c;\n    padding: 0.4rem 0.6rem;\n    border-radius: 0.25rem;\n    color: #9f9fa6;\n}\n.line {\n    display: flex;\n    align-items: baseline;\n    gap: 0.5rem\n}\n.badge {\n    background-color: #5865f2;\n    color: white;\n    font-weight: 600;\n    font-size: 80%;\n    padding: 0.1rem 0.35rem;\n    border-radius: 0.25rem;\n    letter-spacing: 0.03rem;\n    height: fit-content;\n    width: fit-content;\n    align-self: flex-start;\n}\n.badgeTag {\n    background-color: #747F8D50;\n    color: white;\n    font-weight: 600;\n    font-size: 70%;\n    padding: 0.1rem 0.35rem;\n    border-radius: 0.25rem;\n    letter-spacing: 0.03rem;\n    height: fit-content;\n    width: fit-content;\n    align-self: center;\n}\n.mention {\n    background-color: #5664fa41;\n    padding: 0.2rem;\n    border-radius: 0.25rem;\n    transition: background-color 0.2s ease;\n}\n.mention:hover {\n    background-color: #5664fa7e;\n}\n";
+export declare const MESSAGE_CSS = "\n.messageDiv {\n    display: flex;\n    flex-direction: column;\n    gap: 0.2rem;\n    padding: 0.5rem;\n    border-radius: 1rem;\n}\n.messageDiv.highlight, .messageDiv:hover {\n    background-color: #40434b;\n    transition: background-color 0.3s ease-in-out;\n}\n.messageBotton {\n    display: flex;\n    flex-direction: row;\n    gap: 1rem;\n    padding: 0.5rem;\n    border-radius: 0.25rem;\n}\n.messageImg {\n    width: 3.5rem; \n    height: 3.5rem; \n    border-radius: 50%;\n}\n.messageDivRight {\n    display: flex;\n    flex-direction: column;\n    gap: 0.25rem\n}\n.messageUser {\n    display: flex;\n    flex-direction: row;\n    gap: 0.75rem;\n}\n.messageUsername {\n    margin: 0;\n}\n.messageTimeStamp {\n    color: #999999;\n    font-size: 77.5%;\n    align-self: center;\n}\n.messageContent {\n    line-height: 1.5;\n}\n.pList {\n    white-space: pre-wrap;\n}\n.subtext {\n    font-size: 85%;\n    color: #808080;\n}\n.spoilerMsg {\n    display: inline-block;\n    background-color: #202225;\n    color: #202225;\n    padding: 0 0.2rem;\n    border-radius: 0.2rem;\n    cursor: pointer;\n    transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;\n}\n.spoilerMsg.revealed {\n    background-color: transparent;\n    color: inherit;\n}\n.messageReply {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    font-size: 0.8rem;\n    color: #b5bac1;\n    cursor: pointer;\n    margin-left: 2rem;\n}\n.messageReplySvg {\n    flex-shrink: 0;\n    width: 2.25rem;\n    height: 2.25rem;\n    color: #b5bac1;\n}\n.messageReplyImg {\n    width: 1.75rem;\n    height: 1.75rem;\n    border-radius: 50%;\n    flex-shrink: 0;\n}\n.messageReplyAuthor {\n    font-weight: 600;\n    color: #dbdee1;\n    margin-right: 0.3rem;\n}\n.badgeReply {\n    background-color: #5865f2;\n    color: white;\n    font-weight: 600;\n    font-size: 70%;\n    padding: 0.1rem 0.3rem;\n    border-radius: 0.25rem;\n    letter-spacing: 0.03rem;\n    height: fit-content;\n    align-self: center;\n    flex-shrink: 0;\n}\n.messageReplyText {\n    flex-grow: 1;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    color: #b5bac1;\n    font-size: 0.75rem;\n}\n";
+export declare const EMBED_CSS = "\n.embed {\n    background-color: #2b2d31;\n    border: 0.15rem solid #2b2d31;\n    border-left: 0.25rem solid;\n    border-radius: 0.25rem;\n    padding: 0.5rem 0.75rem;\n    margin-top: 0.5rem;\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n    max-width: 520px;\n}\n.embed a {\n    color: #00aff4;\n    text-decoration: none;\n}\n.embed a:hover {\n    text-decoration: underline;\n}\n.embedHeader {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    gap: 0.5rem;\n}\n.embedHeaderRight {\n    display: flex;\n    flex-direction: column;\n    gap: 0.25rem;\n}\n.embedHeaderRightAuthor {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    font-size: 0.875rem;\n    font-weight: 500;\n    color: #ffffff;\n}\n.embedHeaderRightAuthorImg {\n    width: 1.5rem;\n    height: 1.5rem;\n    border-radius: 50%;\n}\n.embedHeaderRightAuthorName {\n    color: #ffffff;\n    font-weight: 500;\n}\n.embedHeaderRightTitle {\n    font-size: 1rem;\n    font-weight: bold;\n    color: #ffffff;\n}\n.embedHeaderThumbnail {\n    max-width: 80px;\n    max-height: 80px;\n    object-fit: contain;\n    border-radius: 0.25rem;\n    flex-shrink: 0;\n}\n.embedDescription {\n    font-size: 0.875rem;\n    color: #dcddde;\n}\n.embedFields {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 0.5rem;\n}\n.embedFieldsField {\n    flex: 1;\n    min-width: 150px;\n}\n.embedFieldsFieldTitle {\n    font-size: 0.75rem;\n    font-weight: bold;\n    color: #ffffff;\n    margin-bottom: 0.25rem;\n}\n.embedFieldsFieldValue {\n    font-size: 0.875rem;\n    color: #dcddde;\n}\n.embedImage {\n    margin-top: 0.5rem;\n    max-width: 100%;\n    height: auto;\n}\n.embedImage img {\n    max-width: 100%;\n    max-height: 300px;\n    object-fit: contain;\n    border-radius: 0.25rem;\n}\n.embedFooter {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    font-size: 0.75rem;\n    color: #999999;\n    margin-top: 0.5rem;\n}\n.embedFooterImg {\n    width: 1.25rem;\n    height: 1.25rem;\n    border-radius: 50%;\n}\n.embedFooterText {\n    color: #999999;\n}\n";
+export declare const ATTACHMENT_CSS = "\n.attachmentImage, .attachmentVideo {\n    max-width: 400px;\n    height: auto;\n    border-radius: 0.25rem;\n    margin-top: 0.5rem;\n}\n.attachmentAudio {\n    width: 300px;\n    margin-top: 0.5rem;\n}\n.attachmentFile {\n    background-color: #2b2d31;\n    border: 1px solid #202225;\n    border-radius: 0.75rem;\n    padding: 0.75rem;\n    display: flex;\n    align-items: center;\n    gap: 0.75rem;\n    max-width: 400px;\n    margin-top: 0.5rem;\n    width: fit-content;\n}\n.attachmentFileIcon {\n    width: 2.5rem;\n    height: 2.5rem;\n    fill: #b9bbbe;\n    flex-shrink: 0;\n}\n.attachmentFileInfo {\n    display: flex;\n    flex-direction: column;\n    gap: 0.1rem;\n    overflow: hidden;\n    flex-grow: 1;\n}\n.attachmentFileName {\n    color: #ffffff;\n    text-decoration: none;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.attachmentFileSize {\n    font-size: 0.75rem;\n    color: #72767d;\n}\n.attachmentDownload {\n    display: block;\n    flex-shrink: 0;\n}\n.attachmentDownloadIcon {\n    width: 1.5rem;\n    height: 1.5rem;\n    fill: #b9bbbe;\n    transition: fill 0.2s ease;\n}\n.attachmentDownload:hover .attachmentDownloadIcon {\n    fill: #ffffff;\n}\n.spoilerAttachment {\n    position: relative;\n    display: inline-block;\n    border-radius: 0.5rem;\n    overflow: hidden;\n    cursor: pointer;\n}\n.spoilerAttachment .spoilerAttachmentContent {\n    filter: blur(64px);\n    pointer-events: none;\n    transition: filter 0.2s ease;\n}\n.spoilerAttachment .spoilerAttachmentOverlay {\n    position: absolute;\n    inset: 0;\n    background: rgba(32, 34, 37, 0.85);\n    color: #fff;\n    font-weight: 600;\n    letter-spacing: 0.05em;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 2;\n    user-select: none;\n}\n.spoilerAttachment.revealed .spoilerAttachmentContent {\n    filter: none;\n    pointer-events: auto;\n}\n.spoilerAttachment.revealed .spoilerAttachmentOverlay {\n    display: none;\n}\n";
+export declare const ACTIONROW_CSS = "\n.actionRow {\n    display: flex;\n    gap: 0.5rem;\n    margin-top: 0.5rem;\n}\n";
+export declare const BUTTON_CSS = "\n.button {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    padding: 0rem 0.8rem;\n    height: 2.5rem;\n    border-radius: 0.6rem;\n    color: white;\n    font-weight: 600;\n    cursor: pointer;\n    transition: filter 0.2s ease;\n}\n.button:hover {\n    filter: brightness(1.1);\n}\n.buttonEmoji {\n    font-size: 1.25rem;\n}\n.buttonLabel {\n    font-size: 0.875rem;\n}\n.buttonLink {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    color: white;\n    font-weight: 600;\n}\n.buttonLinkIcon {\n    width: 1.25rem;\n    height: 1.25rem;\n}\n";
+export declare const COMPONENTS_CSS = "\n.selector {\n    width: 100%;\n    position: relative;\n}\n.selectorInput {\n    background-color: #2b2d31;\n    border: 1px solid #202225;\n    border-radius: 0.75rem;\n    padding: 0.75rem;\n    min-width: 17.5rem;\n    cursor: pointer;\n    user-select: none;\n}\n.selectorInputText {\n    color: #808080;\n}\n.selectorOptionMenu {\n    display: none; \n    position: absolute;\n    top: 100%;\n    left: 0;\n    width: 100%;\n    background-color: #2b2d31;\n    border: 1px solid #202225;\n    border-radius: 1rem;\n    margin-top: 0.25rem;\n    padding: 0.5rem;\n    z-index: 10;\n    box-sizing: border-box;\n}\n.selector.active .selectorOptionMenu {\n    display: block;\n}\n.selectorOption {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    padding: 0.75rem;\n    border-radius: 0.75rem;\n    cursor: pointer;\n    transition: background-color 0.2s ease;\n}\n.selectorOption:hover {\n    background-color: #4f545c;\n}\n.selectorOptionEmoji {\n    font-size: 1.25rem;\n}\n.selectorOptionRight {\n    display: flex;\n    flex-direction: column;\n}\n.selectorOptionTitle {\n    font-weight: 500;\n}\n.selectorOptionDesc {\n    font-size: 0.75rem;\n    color: #808080;\n}\n";
+export declare const COMPONENTSV2_CSS = "\n.mediaGallery {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 0.35rem;\n    width: 20rem;\n    height: 20rem;\n    border: 1px solid #202225\n    padding: 0.35rem;\n    overflow: hidden;\n}\n.mediaGalleryItem {\n    flex-grow: 1;\n    flex-basis: 6rem;\n    min-width: 0;\n    display: flex;\n}\n.mediaGalleryImg {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n}\n";
+export declare const POLL_CSS = "\n.pollDiv {\n    background-color: #2b2d31;\n    border-radius: 0.5rem;\n    padding: 1rem;\n    margin-top: 0.5rem;\n    max-width: 420px;\n}\n.pollQuestion {\n    font-size: 1.1rem;\n    font-weight: bold;\n    margin-bottom: 1rem;\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n}\n.pollAnswers {\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n}\n.pollAnswer {\n    background-color: #3a3c42;\n    border-radius: 0.3rem;\n    padding: 0.75rem;\n    cursor: pointer;\n    border: 1px solid transparent;\n    transition: border-color 0.2s ease;\n    position: relative;\n    overflow: hidden;\n}\n.pollAnswer:hover {\n    border-color: #4d515a;\n}\n.pollAnswerBar {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    background-color: #5664fa7a;\n    border-radius: 0.2rem;\n    z-index: 1;\n}\n.pollAnswerContent {\n    position: relative;\n    z-index: 2;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n}\n.pollAnswerDetails {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n}\n.pollAnswerEmoji {\n    font-size: 1.25rem;\n}\n.pollAnswerText {\n    font-weight: 500;\n}\n.pollAnswerVotes {\n    font-size: 0.8rem;\n    color: #b5bac1;\n    font-weight: bold;\n}\n.pollFooter {\n    margin-top: 1rem;\n    font-size: 0.75rem;\n    color: #949ba4;\n}\n";
+export declare const POLL_RESULT_EMBED_CSS = "\n.pollResultEmbed {\n    background-color: #2b2d31;\n    border-radius: 0.5rem;\n    padding: 1rem;\n    margin-top: 0.5rem;\n    border: 1px solid #3a3c42;\n    min-width: 25rem;\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n}\n.pollResultEmbedWinner {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    font-size: 1rem;\n    font-weight: 600;\n    margin-bottom: 0.4rem;\n}\n.pollResultEmbedCheckmark {\n    color: #57f287;\n    font-size: 1.1em;\n}\n.pollResultEmbedSubtitle {\n    font-size: 0.9rem;\n    color: #b5bac1;\n}\n.pollResultEmbedButtonDiv {\n    margin-right: 0.5rem;\n    margin-left: 1rem;\n    align-self: center;\n}\n.pollResultEmbedButton {\n    background-color: black;\n    color: white;\n    padding: 0.5rem 1rem;\n    border-radius: 0.3rem;\n    text-decoration: none;\n    font-weight: 500;\n    transition: background-color 0.2s ease;\n    cursor: pointer;\n}\n.pollResultEmbedButton:hover {\n    filter: brightness(1.1);\n}\n";
+export declare const REACTIONS_CSS = "\n.reactionsDiv {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 0.5rem;\n    margin-top: 0.5rem;\n}\n.reaction {\n    align-items: center;\n    background-color: #2b2d31;\n    border: 1px solid #3a3c42;\n    border-radius: 1rem;\n    padding: 0.25rem 0.6rem;\n    font-size: 1rem;\n    color: #dcddde;\n    font-weight: bold;\n    cursor: pointer;\n}\n.reaction:hover {\n    filter: brightness(1.1);\n}\n";