sweety-html-transcripts 0.2.0

package/dist/downloader/images.d.ts

@@ -0,0 +1,37 @@
+import type { WebpOptions } from 'sharp';
+import type { APIAttachment, APIMessage, APIMessageSnapshot } from 'discord-api-types/v10';
+import type { Awaitable } from '../adapters/core';
+/**
+ * Callback used to save an image attachment.
+ * The returned string is the URL that will be used in the transcript.
+ *
+ * `undefined` indicates to use the original attachment URL.
+ * `null` indicates to not include the attachment in the transcript.
+ * `string` indicates to use the returned URL as the attachment URL (base64 or remote image).
+ */
+export type ResolveImageCallback = (attachment: APIAttachment, message: APIMessage | APIMessageSnapshot['message']) => Awaitable<string | null | undefined>;
+/**
+ * Builder to build a image saving callback.
+ */
+export declare class TranscriptImageDownloader {
+    private static log;
+    private log;
+    private maxFileSize?;
+    private compression?;
+    /**
+     * Sets the maximum file size for *each* individual image.
+     * @param size The maximum file size in kilobytes
+     */
+    withMaxSize(size: number): this;
+    /**
+     * Sets the compression quality for each image. This requires `sharp` to be installed.
+     * Optionally, images can be converted to WebP format which is smaller in size.
+     * @param quality The quality of the image (1 lowest - 100 highest). Lower quality means smaller file size.
+     * @param convertToWebP Whether to convert the image to WebP format
+     */
+    withCompression(quality?: number, convertToWebP?: boolean, options?: Omit<WebpOptions, 'quality' | 'force'>): this;
+    /**
+     * Builds the image saving callback.
+     */
+    build(): ResolveImageCallback;
+}

package/dist/downloader/images.js

@@ -0,0 +1,119 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TranscriptImageDownloader = void 0;
+const undici_1 = require("undici");
+const debug_1 = __importDefault(require("debug"));
+/**
+ * Builder to build a image saving callback.
+ */
+class TranscriptImageDownloader {
+    constructor() {
+        this.log = TranscriptImageDownloader.log;
+    }
+    /**
+     * Sets the maximum file size for *each* individual image.
+     * @param size The maximum file size in kilobytes
+     */
+    withMaxSize(size) {
+        this.maxFileSize = size;
+        return this;
+    }
+    /**
+     * Sets the compression quality for each image. This requires `sharp` to be installed.
+     * Optionally, images can be converted to WebP format which is smaller in size.
+     * @param quality The quality of the image (1 lowest - 100 highest). Lower quality means smaller file size.
+     * @param convertToWebP Whether to convert the image to WebP format
+     */
+    withCompression(quality = 80, convertToWebP = false, options = {}) {
+        if (quality < 1 || quality > 100)
+            throw new Error('Quality must be between 1 and 100');
+        // try and import sharp
+        Promise.resolve().then(() => __importStar(require('sharp'))).catch((err) => {
+            console.error(err);
+            console.error(`[sweety-html-transcripts] Failed to import 'sharp'. Image compression requires the 'sharp' package to be installed. Either install sharp or remove the compression options.`);
+        });
+        this.compression = { quality, convertToWebP, options };
+        return this;
+    }
+    /**
+     * Builds the image saving callback.
+     */
+    build() {
+        return async (attachment) => {
+            // if the attachment is not an image, return null
+            if (!attachment.width || !attachment.height)
+                return undefined;
+            // if the max file size is set, check if the file size is within the limit
+            if (this.maxFileSize && attachment.size > this.maxFileSize * 1024)
+                return undefined;
+            // fetch the image
+            this.log(`Fetching attachment ${attachment.id}: ${attachment.url}`);
+            const response = await (0, undici_1.request)(attachment.url).catch((err) => {
+                console.error(`[sweety-html-transcripts] Failed to download image for transcript: `, err);
+                return null;
+            });
+            if (!response)
+                return undefined;
+            const mimetype = response.headers['content-type'];
+            const buffer = await response.body.arrayBuffer().then((res) => Buffer.from(res));
+            this.log(`Finished fetching ${attachment.id} (${buffer.length} bytes)`);
+            // if the compression options are set, compress the image
+            if (this.compression) {
+                const sharp = await Promise.resolve().then(() => __importStar(require('sharp')));
+                this.log(`Compressing ${attachment.id} with 'sharp'`);
+                const sharpbuf = await sharp
+                    .default(buffer)
+                    .webp({
+                    quality: this.compression.quality,
+                    force: this.compression.convertToWebP,
+                    effort: 2,
+                    ...this.compression.options,
+                })
+                    .toBuffer({ resolveWithObject: true });
+                this.log(`Finished compressing ${attachment.id} (${sharpbuf.info.size} bytes)`);
+                return `data:image/${sharpbuf.info.format};base64,${sharpbuf.data.toString('base64')}`;
+            }
+            // return the base64 string
+            return `data:${mimetype};base64,${buffer.toString('base64')}`;
+        };
+    }
+}
+exports.TranscriptImageDownloader = TranscriptImageDownloader;
+TranscriptImageDownloader.log = (0, debug_1.default)('sweety-html-transcripts:TranscriptImageDownloader');
+//# sourceMappingURL=images.js.map

package/dist/downloader/images.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"images.js","sourceRoot":"","sources":["../../src/downloader/images.ts"],"names":[],"mappings":"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"}

package/dist/generator/index.d.ts

@@ -0,0 +1,34 @@
+import type { APIGuild, APIRole, APIUser } from 'discord-api-types/v10';
+import type { Awaitable, TranscriptAdapter } from '../adapters/core';
+import type { ResolveImageCallback } from '../downloader/images';
+import type { AllAPIChannel, APIMessageData } from '../utils/channel';
+export type RenderMessageContext = {
+    adapter: TranscriptAdapter<unknown>;
+    messages: APIMessageData[];
+    channel: AllAPIChannel;
+    guild?: APIGuild | null;
+    callbacks: {
+        resolveImageSrc: ResolveImageCallback;
+        resolveChannel: (channelId: string) => Awaitable<AllAPIChannel | null>;
+        resolveUser: (userId: string) => Awaitable<APIUser | null>;
+        resolveRole: (roleId: string) => Awaitable<APIRole | null>;
+    };
+    poweredBy?: boolean;
+    footerText?: string;
+    saveImages: boolean;
+    favicon: 'guild' | string;
+    hydrate: boolean;
+    /** @default false */
+    lightTheme?: boolean;
+    selectMenus?: {
+        /** @default true */
+        includeUsers?: boolean;
+        /** @default true */
+        includeRoles?: boolean;
+        /** @default true */
+        includeChannels?: boolean;
+        /** @default 25 */
+        channelLimits?: number;
+    };
+};
+export default function render(context: RenderMessageContext): Promise<string>;

package/dist/generator/index.js

@@ -0,0 +1,81 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = render;
+const hydrate_1 = require("@derockdev/discord-components-core/hydrate");
+const react_1 = __importDefault(require("react"));
+const static_1 = require("react-dom/static");
+const package_json_1 = require("../../package.json");
+const client_1 = require("../static/client");
+const profiles_1 = require("../utils/profiles");
+const channel_1 = require("../utils/channel");
+const guild_1 = require("../utils/guild");
+const utils_1 = require("../utils/utils");
+const transcript_1 = __importDefault(require("./transcript"));
+const resolveVersion = (version) => version.replace('^', '').replace('~', '');
+const discordComponentsVersion = resolveVersion(package_json_1.devDependencies['@penwin/discord-components-core']);
+async function render(context) {
+    var _a, _b, _c, _d;
+    context.lightTheme ?? (context.lightTheme = false);
+    context.selectMenus ?? (context.selectMenus = {});
+    (_a = context.selectMenus).includeUsers ?? (_a.includeUsers = true);
+    (_b = context.selectMenus).includeRoles ?? (_b.includeRoles = true);
+    (_c = context.selectMenus).includeChannels ?? (_c.includeChannels = true);
+    (_d = context.selectMenus).channelLimits ?? (_d.channelLimits = 25);
+    const { adapter, channel, ...options } = context;
+    const profiles = await (0, profiles_1.buildProfiles)(context);
+    adapter.renderContext.profiles = profiles;
+    // tysom sagiriikeda to fix this <3
+    const stream = await (0, static_1.prerenderToNodeStream)(react_1.default.createElement("html", null,
+        react_1.default.createElement("head", null,
+            react_1.default.createElement("meta", { charSet: "utf-8" }),
+            react_1.default.createElement("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }),
+            react_1.default.createElement("link", { rel: "icon", type: "image/png", href: options.favicon === 'guild'
+                    ? channel_1.channelUtils.isDM(channel) || channel_1.channelUtils.isDirectory(channel)
+                        ? undefined
+                        : ((context.guild ? guild_1.guildUtils.iconURL(context.guild, { size: 16, extension: 'png' }) : undefined) ??
+                            undefined)
+                    : options.favicon }),
+            react_1.default.createElement("title", null, channel_1.channelUtils.isDM(channel) || channel_1.channelUtils.isDirectory(channel) ? 'Direct Messages' : channel.name),
+            react_1.default.createElement("script", { dangerouslySetInnerHTML: {
+                    __html: client_1.scrollToMessage,
+                } }),
+            !options.hydrate && (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement("script", { dangerouslySetInnerHTML: {
+                        __html: `window.$discordMessage={profiles:${JSON.stringify(profiles)}}`,
+                    } }),
+                react_1.default.createElement("script", { type: "module", src: `https://cdn.jsdelivr.net/npm/@penwin/discord-components-core@${discordComponentsVersion}/dist/bundle/index.mjs` }))),
+            react_1.default.createElement("link", { rel: "stylesheet", href: `https://cdn.jsdelivr.net/npm/@penwin/discord-components-core@${discordComponentsVersion}/dist/bundle/styles/base.css` })),
+        react_1.default.createElement("body", { style: {
+                margin: 0,
+                minHeight: '100vh',
+            } },
+            react_1.default.createElement(transcript_1.default, { context: context })),
+        options.hydrate && react_1.default.createElement("script", { dangerouslySetInnerHTML: { __html: client_1.revealSpoiler } })));
+    const markup = await (0, utils_1.streamToString)(stream.prelude);
+    if (options.hydrate) {
+        const result = await (0, hydrate_1.renderToString)(markup, {
+            beforeHydrate: async (document) => {
+                document.defaultView.$discordMessage = {
+                    profiles,
+                };
+                document.defaultView.$discordSelectMenu = {
+                    users: !adapter.renderContext.selectMenu.users?.injectedScript
+                        ? (adapter.renderContext.selectMenu.users?.data ?? [])
+                        : [],
+                    roles: !adapter.renderContext.selectMenu.roles?.injectedScript
+                        ? (adapter.renderContext.selectMenu.roles?.data ?? [])
+                        : [],
+                    channels: !adapter.renderContext.selectMenu.channels?.injectedScript
+                        ? (adapter.renderContext.selectMenu.channels?.data ?? [])
+                        : [],
+                };
+            },
+        });
+        return result.html;
+    }
+    return markup;
+}
+//# sourceMappingURL=index.js.map

package/dist/generator/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/generator/index.tsx"],"names":[],"mappings":"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"}

package/dist/generator/renderers/attachment.d.ts

@@ -0,0 +1,24 @@
+import type { APIAttachment, APIMessageSnapshot } from 'discord-api-types/v10';
+import React from 'react';
+import type { RenderMessageContext } from '..';
+import type { APIMessageData } from '../../utils/channel';
+/**
+ * Renders all attachments for a message
+ * @param message
+ * @param context
+ * @returns
+ */
+export declare function Attachments(props: {
+    message: APIMessageData | APIMessageSnapshot['message'];
+    context: RenderMessageContext;
+}): Promise<React.JSX.Element>;
+/**
+ * Renders one Discord Attachment
+ * @param props - the attachment and rendering context
+ */
+export declare function Attachment({ attachment, context, message, isVoiceMessage, }: {
+    attachment: APIAttachment;
+    context: RenderMessageContext;
+    message: APIMessageData | APIMessageSnapshot['message'];
+    isVoiceMessage?: boolean;
+}): Promise<React.JSX.Element>;

package/dist/generator/renderers/attachment.js

@@ -0,0 +1,133 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Attachments = Attachments;
+exports.Attachment = Attachment;
+const discord_components_react_render_1 = require("@penwin/discord-components-react-render");
+const v10_1 = require("discord-api-types/v10");
+const react_1 = __importDefault(require("react"));
+const utils_1 = require("../../utils/utils");
+function getAttachmentType(attachment) {
+    const type = attachment.content_type?.split('/')?.[0] ?? 'unknown';
+    if (['audio', 'video', 'image'].includes(type))
+        return type;
+    return 'file';
+}
+/**
+ * Renders all attachments for a message
+ * @param message
+ * @param context
+ * @returns
+ */
+async function Attachments(props) {
+    if (props.message.attachments.length === 0)
+        return react_1.default.createElement(react_1.default.Fragment, null);
+    const grouped = {
+        mediaGallery: [],
+        other: [],
+    };
+    for (const attachment of props.message.attachments) {
+        const type = getAttachmentType(attachment);
+        if (type === 'image' || type === 'video') {
+            grouped.mediaGallery.push(attachment);
+        }
+        else {
+            grouped.other.push(attachment);
+        }
+    }
+    const isVoiceMessage = props.message.flags
+        ? (props.message.flags & v10_1.MessageFlags.IsVoiceMessage) === v10_1.MessageFlags.IsVoiceMessage
+        : false;
+    return (react_1.default.createElement(discord_components_react_render_1.DiscordAttachments, { slot: "attachments" },
+        grouped.mediaGallery.length > 0 && (react_1.default.createElement(discord_components_react_render_1.DiscordMediaGallery, null, grouped.mediaGallery.map((attachment, id) => (react_1.default.createElement(Attachment, { attachment: attachment, message: props.message, context: props.context, key: id }))))),
+        grouped.other.map((attachment, id) => (react_1.default.createElement(Attachment, { attachment: attachment, message: props.message, context: props.context, key: id, isVoiceMessage: isVoiceMessage })))));
+}
+const programmingLanguageMimeMap = new Map([
+    ['text/html', 'html'],
+    ['text/css', 'css'],
+    ['text/javascript', 'javascript'],
+    ['application/javascript', 'javascript'],
+    ['application/json', 'json'],
+    ['application/xml', 'xml'],
+    ['image/svg+xml', 'svg'],
+    ['application/xhtml+xml', 'xhtml'],
+    ['application/wasm', 'wasm'],
+    ['text/markdown', 'markdown'],
+    ['text/x-sass', 'sass'],
+    ['text/x-scss', 'scss'],
+    ['text/x-python', 'python'],
+    ['application/x-python-code', 'python'],
+    ['text/x-java-source', 'java'],
+    ['text/x-csharp', 'csharp'],
+    ['text/x-php', 'php'],
+    ['application/x-php', 'php'],
+    ['text/x-ruby', 'ruby'],
+    ['text/x-go', 'go'],
+    ['text/x-rustsrc', 'rust'],
+    ['text/x-kotlin', 'kotlin'],
+    ['text/x-swift', 'swift'],
+    ['text/x-dart', 'dart'],
+    ['text/x-lua', 'lua'],
+    ['text/x-scala', 'scala'],
+    ['application/sql', 'sql'],
+    ['text/x-sh', 'bash'],
+    ['application/x-sh', 'bash'],
+    ['text/x-objectivec', 'objectivec'],
+    ['text/x-perl', 'perl'],
+    ['text/x-pascal', 'pascal'],
+    ['text/x-dsrc', 'd'],
+    ['text/x-groovy', 'groovy'],
+    ['text/x-rsrc', 'r'],
+    ['text/x-vb', 'vbnet'],
+    ['text/x-solidity', 'solidity'],
+    ['text/x-julia', 'julia'],
+    ['text/x-clojure', 'clojure'],
+    ['application/graphql', 'graphql'],
+    ['application/x-yaml', 'yaml'],
+    ['text/x-ini', 'ini'],
+    ['text/plain', 'plaintext'],
+    ['text/uri-list', 'uri'],
+    ['application/diff', 'diff'],
+    ['text/x-dockerfile', 'dockerfile'],
+]);
+/**
+ * Renders one Discord Attachment
+ * @param props - the attachment and rendering context
+ */
+async function Attachment({ attachment, context, message, isVoiceMessage, }) {
+    let url = attachment.url;
+    const type = getAttachmentType(attachment);
+    const attach = ('data' in attachment ? attachment.data : attachment);
+    if (isVoiceMessage) {
+        return react_1.default.createElement(discord_components_react_render_1.DiscordVoiceMessage, { key: attachment.id, href: attachment.url, waveform: attachment.waveform });
+    }
+    if (type === 'image' || type === 'video') {
+        // download it to a data url
+        const downloaded = await context.callbacks.resolveImageSrc(attach, message);
+        if (downloaded !== null) {
+            url = downloaded ?? url;
+        }
+        return (react_1.default.createElement(discord_components_react_render_1.DiscordMediaGalleryItem, { spoiler: (0, utils_1.hasFlag)({ bitfield: attach.flags, flag: 8 }), media: url, key: attachment.id, description: attachment.description, "mime-type": attachment.content_type, width: attachment.width ?? void 0, height: attachment.height ?? void 0 }));
+    }
+    // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+    const mime = attachment.content_type?.split(';')[0];
+    const format = programmingLanguageMimeMap.get(mime);
+    const { size, unit } = (0, utils_1.formatBytes)(attachment.size);
+    if (type === 'audio') {
+        return (react_1.default.createElement(discord_components_react_render_1.DiscordAudioAttachment, { key: attachment.id, href: url, bytes: size, "bytes-unit": unit, name: attachment.filename }));
+    }
+    if (type === 'file') {
+        if (format && size <= 1024 * 1024) {
+            const content = await fetch(attach.url)
+                .then((res) => res.text())
+                .catch(() => null);
+            if (content) {
+                return (react_1.default.createElement(discord_components_react_render_1.DiscordTextFileAttachmentPreviewer, { href: url, name: attachment.filename, language: format, bytes: size, "bytes-unit": unit, key: attachment.id, content: content }));
+            }
+        }
+    }
+    return (react_1.default.createElement(discord_components_react_render_1.DiscordFileAttachment, { type: type, bytes: size, "bytes-unit": unit, name: attachment.filename, key: attachment.id, href: url }));
+}
+//# sourceMappingURL=attachment.js.map

package/dist/generator/renderers/attachment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachment.js","sourceRoot":"","sources":["../../../src/generator/renderers/attachment.tsx"],"names":[],"mappings":";;;;;AA6BA,kCA6CC;AAuDD,gCAyFC;AA1ND,6FAQiD;AAEjD,+CAAqD;AACrD,kDAA0B;AAI1B,6CAAyD;AAEzD,SAAS,iBAAiB,CAAC,UAA+C;IACxE,MAAM,IAAI,GAAG,UAAU,CAAC,YAAY,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC;IACnE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;QAAE,OAAO,IAAuB,CAAC;IAC/E,OAAO,MAAM,CAAC;AAChB,CAAC;AAED;;;;;GAKG;AACI,KAAK,UAAU,WAAW,CAAC,KAGjC;IACC,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,6DAAK,CAAC;IAGzD,MAAM,OAAO,GAAG;QACd,YAAY,EAAE,EAAiB;QAC/B,KAAK,EAAE,EAAiB;KACzB,CAAC;IAEF,KAAK,MAAM,UAAU,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;QACnD,MAAM,IAAI,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC;QAC3C,IAAI,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;YACzC,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACxC,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACjC,CAAC;IACH,CAAC;IAED,MAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK;QACxC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,GAAG,kBAAY,CAAC,cAAc,CAAC,KAAK,kBAAY,CAAC,cAAc;QACrF,CAAC,CAAC,KAAK,CAAC;IAEV,OAAO,CACL,8BAAC,oDAAkB,IAAC,IAAI,EAAC,aAAa;QACnC,OAAO,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,IAAI,CAClC,8BAAC,qDAAmB,QACjB,OAAO,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,CAAC,CAC5C,8BAAC,UAAU,IAAC,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,EAAE,EAAE,GAAI,CAChG,CAAC,CACkB,CACvB;QACA,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,CAAC,CACrC,8BAAC,UAAU,IACT,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,GAAG,EAAE,EAAE,EACP,cAAc,EAAE,cAAc,GAC9B,CACH,CAAC,CACiB,CACtB,CAAC;AACJ,CAAC;AAED,MAAM,0BAA0B,GAAG,IAAI,GAAG,CAAC;IACzC,CAAC,WAAW,EAAE,MAAM,CAAC;IACrB,CAAC,UAAU,EAAE,KAAK,CAAC;IACnB,CAAC,iBAAiB,EAAE,YAAY,CAAC;IACjC,CAAC,wBAAwB,EAAE,YAAY,CAAC;IACxC,CAAC,kBAAkB,EAAE,MAAM,CAAC;IAC5B,CAAC,iBAAiB,EAAE,KAAK,CAAC;IAC1B,CAAC,eAAe,EAAE,KAAK,CAAC;IACxB,CAAC,uBAAuB,EAAE,OAAO,CAAC;IAClC,CAAC,kBAAkB,EAAE,MAAM,CAAC;IAC5B,CAAC,eAAe,EAAE,UAAU,CAAC;IAC7B,CAAC,aAAa,EAAE,MAAM,CAAC;IACvB,CAAC,aAAa,EAAE,MAAM,CAAC;IACvB,CAAC,eAAe,EAAE,QAAQ,CAAC;IAC3B,CAAC,2BAA2B,EAAE,QAAQ,CAAC;IACvC,CAAC,oBAAoB,EAAE,MAAM,CAAC;IAC9B,CAAC,eAAe,EAAE,QAAQ,CAAC;IAC3B,CAAC,YAAY,EAAE,KAAK,CAAC;IACrB,CAAC,mBAAmB,EAAE,KAAK,CAAC;IAC5B,CAAC,aAAa,EAAE,MAAM,CAAC;IACvB,CAAC,WAAW,EAAE,IAAI,CAAC;IACnB,CAAC,gBAAgB,EAAE,MAAM,CAAC;IAC1B,CAAC,eAAe,EAAE,QAAQ,CAAC;IAC3B,CAAC,cAAc,EAAE,OAAO,CAAC;IACzB,CAAC,aAAa,EAAE,MAAM,CAAC;IACvB,CAAC,YAAY,EAAE,KAAK,CAAC;IACrB,CAAC,cAAc,EAAE,OAAO,CAAC;IACzB,CAAC,iBAAiB,EAAE,KAAK,CAAC;IAC1B,CAAC,WAAW,EAAE,MAAM,CAAC;IACrB,CAAC,kBAAkB,EAAE,MAAM,CAAC;IAC5B,CAAC,mBAAmB,EAAE,YAAY,CAAC;IACnC,CAAC,aAAa,EAAE,MAAM,CAAC;IACvB,CAAC,eAAe,EAAE,QAAQ,CAAC;IAC3B,CAAC,aAAa,EAAE,GAAG,CAAC;IACpB,CAAC,eAAe,EAAE,QAAQ,CAAC;IAC3B,CAAC,aAAa,EAAE,GAAG,CAAC;IACpB,CAAC,WAAW,EAAE,OAAO,CAAC;IACtB,CAAC,iBAAiB,EAAE,UAAU,CAAC;IAC/B,CAAC,cAAc,EAAE,OAAO,CAAC;IACzB,CAAC,gBAAgB,EAAE,SAAS,CAAC;IAC7B,CAAC,qBAAqB,EAAE,SAAS,CAAC;IAClC,CAAC,oBAAoB,EAAE,MAAM,CAAC;IAC9B,CAAC,YAAY,EAAE,KAAK,CAAC;IACrB,CAAC,YAAY,EAAE,WAAW,CAAC;IAC3B,CAAC,eAAe,EAAE,KAAK,CAAC;IACxB,CAAC,kBAAkB,EAAE,MAAM,CAAC;IAC5B,CAAC,mBAAmB,EAAE,YAAY,CAAC;CACpC,CAAC,CAAC;AAEH;;;GAGG;AACI,KAAK,UAAU,UAAU,CAAC,EAC/B,UAAU,EACV,OAAO,EACP,OAAO,EACP,cAAc,GAMf;IACC,IAAI,GAAG,GAAG,UAAU,CAAC,GAAG,CAAC;IAEzB,MAAM,IAAI,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC;IAC3C,MAAM,MAAM,GAAG,CAAC,MAAM,IAAI,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAkB,CAAC;IAEtF,IAAI,cAAc,EAAE,CAAC;QACnB,OAAO,8BAAC,qDAAmB,IAAC,GAAG,EAAE,UAAU,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,CAAC,GAAG,EAAE,QAAQ,EAAE,UAAU,CAAC,QAAQ,GAAI,CAAC;IAC1G,CAAC;IAED,IAAI,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;QACzC,4BAA4B;QAC5B,MAAM,UAAU,GAAG,MAAM,OAAO,CAAC,SAAS,CAAC,eAAe,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAE5E,IAAI,UAAU,KAAK,IAAI,EAAE,CAAC;YACxB,GAAG,GAAG,UAAU,IAAI,GAAG,CAAC;QAC1B,CAAC;QACD,OAAO,CACL,8BAAC,yDAAuB,IACtB,OAAO,EAAE,IAAA,eAAO,EAAC,EAAE,QAAQ,EAAE,MAAM,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EACrD,KAAK,EAAE,GAAG,EACV,GAAG,EAAE,UAAU,CAAC,EAAE,EAClB,WAAW,EAAE,UAAU,CAAC,WAAW,eACxB,UAAU,CAAC,YAAY,EAClC,KAAK,EAAE,UAAU,CAAC,KAAK,IAAI,KAAK,CAAC,EACjC,MAAM,EAAE,UAAU,CAAC,MAAM,IAAI,KAAK,CAAC,GACnC,CACH,CAAC;IACJ,CAAC;IAED,kFAAkF;IAClF,MAAM,IAAI,GAAG,UAAU,CAAC,YAAY,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAE,CAAC;IACrD,MAAM,MAAM,GAAG,0BAA0B,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IACpD,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAA,mBAAW,EAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IAEpD,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;QACrB,OAAO,CACL,8BAAC,wDAAsB,IACrB,GAAG,EAAE,UAAU,CAAC,EAAE,EAClB,IAAI,EAAE,GAAG,EACT,KAAK,EAAE,IAAI,gBACC,IAAI,EAChB,IAAI,EAAE,UAAU,CAAC,QAAQ,GACzB,CACH,CAAC;IACJ,CAAC;IAED,IAAI,IAAI,KAAK,MAAM,EAAE,CAAC;QACpB,IAAI,MAAM,IAAI,IAAI,IAAI,IAAI,GAAG,IAAI,EAAE,CAAC;YAClC,MAAM,OAAO,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC;iBACpC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;iBACzB,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;YAErB,IAAI,OAAO,EAAE,CAAC;gBACZ,OAAO,CACL,8BAAC,oEAAkC,IACjC,IAAI,EAAE,GAAG,EACT,IAAI,EAAE,UAAU,CAAC,QAAQ,EACzB,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,IAAI,gBACC,IAAI,EAChB,GAAG,EAAE,UAAU,CAAC,EAAE,EAClB,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;YACJ,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO,CACL,8BAAC,uDAAqB,IACpB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,IAAI,gBACC,IAAI,EAChB,IAAI,EAAE,UAAU,CAAC,QAAQ,EACzB,GAAG,EAAE,UAAU,CAAC,EAAE,EAClB,IAAI,EAAE,GAAG,GACT,CACH,CAAC;AACJ,CAAC"}

package/dist/generator/renderers/components.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { APIMessageComponent } from 'discord-api-types/v10';
+import type { RenderMessageContext } from '..';
+export declare function Component({ component, id, context, }: {
+    component: APIMessageComponent;
+    id: number;
+    context: RenderMessageContext;
+}): Promise<React.JSX.Element>;

package/dist/generator/renderers/components.js

@@ -0,0 +1,179 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Component = Component;
+const discord_components_react_render_1 = require("@penwin/discord-components-react-render");
+const react_1 = __importDefault(require("react"));
+const v10_1 = require("discord-api-types/v10");
+const utils_1 = require("../../utils/utils");
+const content_1 = __importStar(require("./content"));
+const guild_1 = require("../../utils/guild");
+const selectMenuScriptHeader = `(window.$discordSelectMenu ??= {})`;
+const ButtonStyleMapping = {
+    [v10_1.ButtonStyle.Primary]: 'primary',
+    [v10_1.ButtonStyle.Secondary]: 'secondary',
+    [v10_1.ButtonStyle.Success]: 'success',
+    [v10_1.ButtonStyle.Danger]: 'destructive',
+    [v10_1.ButtonStyle.Link]: 'secondary',
+    [v10_1.ButtonStyle.Premium]: 'premium',
+};
+async function Component({ component, id, context, }) {
+    switch (component.type) {
+        case v10_1.ComponentType.Button:
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordButton, { key: id, type: 'style' in component ? ButtonStyleMapping[component.style] : 'secondary', url: 'url' in component ? component.url : undefined, emoji: 'emoji' in component ? (0, utils_1.parseDiscordEmoji)(component.emoji) : undefined, disabled: component.disabled }, 'label' in component ? component.label : undefined));
+        case v10_1.ComponentType.ActionRow: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordActionRow, { key: id }, component.components.map((component, id) => (react_1.default.createElement(Component, { component: component, id: id, key: id, context: context })))));
+        }
+        case v10_1.ComponentType.Container: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordContainer, { key: id, spoiler: component.spoiler },
+                react_1.default.createElement(discord_components_react_render_1.DiscordComponentsColumn, null, component.components.map((component, id) => (react_1.default.createElement(Component, { component: component, id: id, key: id, context: context }))))));
+        }
+        case v10_1.ComponentType.Thumbnail: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordThumbnail, { key: id, media: component.media.proxy_url ?? component.media.url, spoiler: component.spoiler }));
+        }
+        case v10_1.ComponentType.Section: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordSection, { key: id },
+                react_1.default.createElement(discord_components_react_render_1.DiscordSectionComponents, null, component.components.map((component, id) => (react_1.default.createElement(Component, { component: component, id: id, key: id, context: context })))),
+                react_1.default.createElement(Component, { component: component.accessory, id: id, key: id, context: context })));
+        }
+        case v10_1.ComponentType.TextDisplay: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordTextDisplay, { key: id },
+                react_1.default.createElement(content_1.default, { content: component.content, context: { ...context, type: content_1.RenderType.EMBED } })));
+        }
+        case v10_1.ComponentType.Separator: {
+            return react_1.default.createElement(discord_components_react_render_1.DiscordSeparator, { key: id, spacing: component.spacing, divider: component.divider });
+        }
+        case v10_1.ComponentType.File: {
+            const resolvedFileComponent = component;
+            const { size, unit } = (0, utils_1.formatBytes)(resolvedFileComponent.size);
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordFileAttachment, { key: id, name: resolvedFileComponent.name, bytes: size, "bytes-unit": unit, href: component.file.proxy_url ?? component.file.url, spoiler: component.spoiler }));
+        }
+        case v10_1.ComponentType.MediaGallery: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordMediaGallery, { key: id }, component.items.map((item, id) => (react_1.default.createElement(discord_components_react_render_1.DiscordMediaGalleryItem, { key: `${id}-${component.id}`, media: item.media.proxy_url ?? item.media.url, "mime-type": item.media.content_type, spoiler: item.spoiler, description: item.description ?? void 0, width: item.media.width ?? void 0, height: item.media.height ?? void 0 })))));
+        }
+        case v10_1.ComponentType.StringSelect:
+        case v10_1.ComponentType.SelectMenu: {
+            return (react_1.default.createElement(discord_components_react_render_1.DiscordStringSelectMenu, { disabled: component.disabled, placeholder: component.placeholder }, component.options.map((option, id) => (react_1.default.createElement(discord_components_react_render_1.DiscordStringSelectMenuOption, { key: id, label: option.label, description: option.description, emojiName: option.emoji?.name, emoji: option.emoji && (0, utils_1.parseDiscordEmoji)(option.emoji), selected: option.default })))));
+        }
+        case v10_1.ComponentType.ChannelSelect:
+        case v10_1.ComponentType.RoleSelect:
+        case v10_1.ComponentType.MentionableSelect:
+        case v10_1.ComponentType.UserSelect: {
+            const isMentionable = component.type === v10_1.ComponentType.MentionableSelect;
+            const isUser = component.type === v10_1.ComponentType.UserSelect;
+            const isRole = component.type === v10_1.ComponentType.RoleSelect;
+            const isChannel = component.type === v10_1.ComponentType.ChannelSelect;
+            const containsUsers = (isMentionable || isUser) && context.selectMenus?.includeUsers;
+            const containsRoles = isRole && context.selectMenus?.includeRoles;
+            const containsChannels = isChannel && context.selectMenus?.includeChannels;
+            const scripts = [];
+            if (containsUsers && !context.adapter.renderContext.selectMenu.users) {
+                context.adapter.renderContext.selectMenu.users = {
+                    data: Object.entries(context.adapter.renderContext.profiles).map(([id, profile]) => ({
+                        identifier: id,
+                        discriminator: profile.discriminator,
+                        avatarUrl: profile.avatar,
+                        username: profile.author,
+                        globalName: profile.displayName ?? profile.globalName,
+                        bot: profile.bot,
+                        verified: profile.verified,
+                    })),
+                    injectedScript: !context.hydrate,
+                };
+                // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+                !context.hydrate &&
+                    scripts.push(react_1.default.createElement("script", { key: 'users-script', dangerouslySetInnerHTML: {
+                            __html: `${selectMenuScriptHeader}.users = ${JSON.stringify(context.adapter.renderContext.selectMenu.users.data)}`,
+                        } }));
+            }
+            if (containsRoles && !context.adapter.renderContext.selectMenu.roles && context.guild?.id) {
+                const data = [];
+                const roles = await context.adapter.resolveGuildRoles(context.guild?.id);
+                for (const role of roles) {
+                    if (role.id === context.guild?.id)
+                        continue;
+                    data.push({
+                        identifier: role.id,
+                        name: role.name,
+                        color: (0, utils_1.convertToHEX)(role.color),
+                        iconUrl: (role.icon && guild_1.guildUtils.roleIcon(role.id, role.icon)) ?? void 0,
+                        memberCount: 0,
+                        showMemberCount: false,
+                    });
+                }
+                context.adapter.renderContext.selectMenu.roles = {
+                    data,
+                    injectedScript: !context.hydrate,
+                };
+                // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+                !context.hydrate &&
+                    scripts.push(react_1.default.createElement("script", { key: 'roles-script', dangerouslySetInnerHTML: {
+                            __html: `${selectMenuScriptHeader}.roles = ${JSON.stringify(context.adapter.renderContext.selectMenu.roles.data)}`,
+                        } }));
+            }
+            if (containsChannels && !context.adapter.renderContext.selectMenu.channels && context.guild?.id) {
+                const data = [];
+                const channels = await context.adapter.resolveGuildChannels(context.guild?.id);
+                for (const channel of channels) {
+                    if (data.length >= (context.selectMenus?.channelLimits ?? 25))
+                        break;
+                    if ('name' in channel && channel.name) {
+                        data.push({
+                            identifier: channel.id,
+                            name: channel.name,
+                            type: channel.type,
+                        });
+                    }
+                }
+                context.adapter.renderContext.selectMenu.channels = {
+                    data,
+                    injectedScript: !context.hydrate,
+                };
+                // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+                !context.hydrate &&
+                    scripts.push(react_1.default.createElement("script", { key: 'channels-script', dangerouslySetInnerHTML: {
+                            __html: `${selectMenuScriptHeader}.channels = ${JSON.stringify(context.adapter.renderContext.selectMenu.channels.data)}`,
+                        } }));
+            }
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                scripts,
+                react_1.default.createElement(discord_components_react_render_1.DiscordSelectMenuPortal, { key: id, disabled: component.disabled, placeholder: component.placeholder, type: isMentionable ? 'mentionable' : isUser ? 'user' : isRole ? 'role' : 'channel', "default-identifier": component.default_values?.[0].id, "default-type": component.default_values?.[0].type })));
+        }
+    }
+}
+//# sourceMappingURL=components.js.map