discord-html-transcripts-fix 1.2.0 → 1.4.0

package/dist/downloader/images.js

@@ -67,10 +67,21 @@ class TranscriptImageDownloader {
             return null;
         });
         if (!response) return undefined;
+        // SECURITY: only accept success responses — avoid embedding HTML/error bodies as images.
+        if (response.statusCode < 200 || response.statusCode >= 300) {
+            this.log('non-2xx status for %s: %d', attachment.id, response.statusCode);
+            try { await response.body.arrayBuffer(); } catch (_e) {}
+            return undefined;
+        }
         const rawMime = response.headers['content-type'];
         const mime = (0, utils_1.safeImageMime)(typeof rawMime === 'string' ? rawMime : '', 'image/png');
         const arr = await response.body.arrayBuffer();
         const buffer = Buffer.from(arr);
+        // SECURITY: enforce post-download size against the configured cap (metadata-only check is insufficient).
+        if (this.maxFileSize && buffer.length > this.maxFileSize * 1024) {
+            this.log('payload exceeded cap for %s (%d > %d)', attachment.id, buffer.length, this.maxFileSize * 1024);
+            return undefined;
+        }
         this.log('fetched %s (%d bytes, mime=%s)', attachment.id, buffer.length, mime);
         if (this.compression) {
             const sharp = this._sharpModule || (this._sharpModule = await __importStar(require('sharp')));

package/dist/generator/index.js

@@ -40,6 +40,7 @@ try {
 function computeStats(messages) {
     let images = 0;
     let humans = new Set();
+    let firstTs = null, lastTs = null;
     for (const m of messages) {
         if (m.attachments && m.attachments.forEach) {
             m.attachments.forEach((a) => {
@@ -47,8 +48,20 @@ function computeStats(messages) {
             });
         }
         if (m.author && !m.author.bot) humans.add(m.author.id);
+        const ts = m.createdAt instanceof Date ? m.createdAt.getTime() : (snowflakeToDate(m.id)?.getTime() || null);
+        if (ts) {
+            if (firstTs === null || ts < firstTs) firstTs = ts;
+            if (lastTs === null || ts > lastTs) lastTs = ts;
+        }
     }
-    return { messageCount: messages.length, participantCount: humans.size, imageCount: images };
+    return {
+        messageCount: messages.length,
+        participantCount: humans.size,
+        imageCount: images,
+        firstTs,
+        lastTs,
+        spanMs: firstTs && lastTs ? lastTs - firstTs : null,
+    };
 }
 
 function snowflakeToDate(id) {
@@ -60,15 +73,16 @@ function snowflakeToDate(id) {
 }
 
 function buildDateSeparators(messages, lang) {
-    // Returns an array same length as messages, each entry: separator string or null
     const seps = new Array(messages.length).fill(null);
     let lastYmd = null;
+    // FIX: use local date (matches what the formatter shows). UTC keys were mismatched with the
+    // local-time formatter output, causing the wrong day label near midnight UTC.
     const fmt = new Intl.DateTimeFormat(lang === 'de' ? 'de-DE' : 'en-US', { weekday: 'long', day: '2-digit', month: 'long', year: 'numeric' });
     for (let i = 0; i < messages.length; i++) {
         const m = messages[i];
         const d = m.createdAt instanceof Date ? m.createdAt : snowflakeToDate(m.id);
         if (!d) continue;
-        const ymd = `${d.getUTCFullYear()}-${d.getUTCMonth()}-${d.getUTCDate()}`;
+        const ymd = `${d.getFullYear()}-${d.getMonth()}-${d.getDate()}`;
         if (ymd !== lastYmd) {
             seps[i] = fmt.format(d);
             lastYmd = ymd;
@@ -122,6 +136,8 @@ async function render(_a) {
             (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: client_1.tocStyles } }),
             (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: client_1.i18nStyles } }),
             (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: client_1.dateSeparatorStyles } }),
+            (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: client_1.markdownStyles } }),
+            (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: client_1.filterPanelStyles } }),
             (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: DiscordImage_1.DiscordAttachmentStyles } }),
             (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: DiscordHighlightedCode_1.DiscordHighlightStyles } }),
             (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: extraStyles } }),
@@ -146,6 +162,9 @@ async function render(_a) {
             (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.lightbox } }),
             (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.toc } }),
             (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.i18nSwitcher } }),
+            (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.filterPanel } }),
+            (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.codeCopyButton } }),
+            (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.permalinkButton } }),
             options.hydrate && (0, jsx_runtime_1.jsx)("script", { dangerouslySetInnerHTML: { __html: client_1.revealSpoiler } }),
         ] })
     ] });
@@ -171,19 +190,37 @@ async function renderToStream(args) {
     return render(Object.assign({}, args, { returnType: 'stream' }));
 }
 
+function formatSpan(ms, lang) {
+    if (!ms || ms < 0) return '';
+    const days = Math.floor(ms / 86400000);
+    const hours = Math.floor((ms % 86400000) / 3600000);
+    const mins = Math.floor((ms % 3600000) / 60000);
+    if (days > 0) return `${days}d ${hours}h`;
+    if (hours > 0) return `${hours}h ${mins}m`;
+    if (mins > 0) return `${mins}m`;
+    return '<1m';
+}
 function StatsFooter({ stats, lang, i18n }) {
     const dict = (i18n && i18n[lang]) || (i18n && i18n.en) || {};
+    const locale = lang === 'de' ? 'de-DE' : 'en-US';
+    const fmtDate = (ms) => new Date(ms).toLocaleString(locale, { dateStyle: 'medium', timeStyle: 'short' });
     return (0, jsx_runtime_1.jsxs)("footer", { className: "dht-stats", children: [
-        (0, jsx_runtime_1.jsx)("span", { "data-i18n": "statsMessages", "data-i18n-params": JSON.stringify({ n: stats.messageCount }), children: (dict.statsMessages || '{n} messages').replace('{n}', stats.messageCount) }),
+        (0, jsx_runtime_1.jsx)("span", { children: (dict.statsMessages || '{n} messages').replace('{n}', stats.messageCount) }),
         ' · ',
-        (0, jsx_runtime_1.jsx)("span", { "data-i18n": "statsParticipants", "data-i18n-params": JSON.stringify({ n: stats.participantCount }), children: (dict.statsParticipants || '{n} participants').replace('{n}', stats.participantCount) }),
+        (0, jsx_runtime_1.jsx)("span", { children: (dict.statsParticipants || '{n} participants').replace('{n}', stats.participantCount) }),
         ' · ',
-        (0, jsx_runtime_1.jsx)("span", { "data-i18n": "statsImages", "data-i18n-params": JSON.stringify({ n: stats.imageCount }), children: (dict.statsImages || '{n} images').replace('{n}', stats.imageCount) }),
+        (0, jsx_runtime_1.jsx)("span", { children: (dict.statsImages || '{n} images').replace('{n}', stats.imageCount) }),
+        stats.firstTs && stats.lastTs && (0, jsx_runtime_1.jsxs)("span", { children: [' · ', fmtDate(stats.firstTs), ' → ', fmtDate(stats.lastTs)] }),
+        stats.spanMs && (0, jsx_runtime_1.jsxs)("span", { children: [' · ', formatSpan(stats.spanMs)] }),
     ] });
 }
 
 const extraStyles = `
-.dht-pinned-indicator{position:absolute;top:6px;right:8px;font-size:12px;opacity:.6}
+/* Ensure the host establishes a positioning context for the absolute pin indicator,
+   and clamp it inside the message box on narrow viewports. */
+.dht-msg-pinned{position:relative}
+.dht-pinned-indicator{position:absolute;top:4px;left:4px;font-size:12px;opacity:.75;pointer-events:none}
+@media (max-width:640px){.dht-pinned-indicator{position:static;display:inline-block;margin-right:4px}}
 .dht-app-badge,.dht-popup-badge{background:#5865F2;color:#fff;font-size:10px;padding:1px 6px;border-radius:4px;margin-left:6px;vertical-align:middle;font-weight:600}
 .dht-edit-marker{color:#949ba4;font-size:11px;margin-left:4px;cursor:help}
 .dht-suppressed{color:#6e727a;font-size:11px;font-style:italic}
@@ -211,7 +248,7 @@ const extraStyles = `
 .dht-edit-history li{margin-top:4px}
 .dht-edit-history time{display:block;color:#6e727a;font-size:10px;margin-bottom:2px}
 .dht-thread-badge{display:inline-block;background:#3f4248;color:#dbdee1;font-size:10px;padding:1px 6px;border-radius:4px;margin-left:6px}
-.dht-thread-badge--locked{background:#dc3545}
+.dht-thread-badge--locked{background:#ED4245}
 .dht-thread-badge--archived{background:#6c757d}
 .dht-gifv{max-width:400px;max-height:300px;border-radius:6px}
 .dht-stats{margin:24px auto;padding:12px;text-align:center;color:#b5bac1;font-size:13px;font-family:"gg sans",sans-serif;border-top:1px solid #2b2d31;max-width:800px}

package/dist/generator/renderers/components/Container.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../../../utils/utils");
 
 function colorToHex(color) {
     if (color == null) return null;
@@ -14,14 +15,18 @@ function colorToHex(color) {
 }
 
 function DiscordContainer({ children, accentColor, spoiler }) {
-    const hex = colorToHex(accentColor);
+    // SECURITY: route accentColor through safeColor so an attacker-controlled
+    // string can't smuggle CSS into the inline borderLeft.
+    const raw = colorToHex(accentColor);
+    const hex = raw ? (0, utils_1.safeColor)(raw, null) : null;
     const style = {
         display: 'flex',
-        width: '500px',
+        width: '100%',
+        maxWidth: '500px',
+        minWidth: 0,
         flexDirection: 'column',
         backgroundColor: '#3f4248',
         padding: '16px',
-        // Use accent color as a left border (Discord's V2 container style)
         borderLeft: hex ? `4px solid ${hex}` : '1px solid #4f5359',
         borderTop: '1px solid #4f5359',
         borderRight: '1px solid #4f5359',
@@ -30,8 +35,9 @@ function DiscordContainer({ children, accentColor, spoiler }) {
         marginBottom: '2px',
         borderRadius: '10px',
         gap: '8px',
+        boxSizing: 'border-box',
     };
-    const node = (0, jsx_runtime_1.jsx)("div", { style: style, children: children });
+    const node = (0, jsx_runtime_1.jsx)("div", { style, children });
     if (spoiler) {
         return (0, jsx_runtime_1.jsx)("span", { className: "discord-spoiler", children: node });
     }

package/dist/generator/renderers/components/Media Gallery.js

@@ -10,11 +10,11 @@ function DiscordMediaGallery({ component }) {
     const imagesToShow = component.items.slice(0, 10);
     const hasMore = component.items.length > 10;
     return ((0, jsx_runtime_1.jsx)("div", { style: (0, utils_1.getGalleryLayout)(count), children: imagesToShow.map((media, idx) => {
-        const img = (0, jsx_runtime_1.jsx)("img", { src: media.media.url, alt: media.description || 'Media content', style: {
-                width: '100%',
-                height: '100%',
-                objectFit: 'cover',
-            } });
+        const url = media.media.url;
+        const isVideo = typeof url === 'string' && /\.(mp4|webm|mov)(\?|$)/i.test(url);
+        const img = isVideo
+            ? (0, jsx_runtime_1.jsx)("video", { src: url, autoPlay: true, loop: true, muted: true, playsInline: true, style: { width: '100%', height: '100%', objectFit: 'cover' } })
+            : (0, jsx_runtime_1.jsx)("img", { src: url, alt: media.description || 'Media content', loading: 'lazy', style: { width: '100%', height: '100%', objectFit: 'cover' } });
         const wrapped = media.spoiler
             ? (0, jsx_runtime_1.jsx)("span", { className: "discord-spoiler", style: { display: 'block', width: '100%', height: '100%' }, children: img })
             : img;

package/dist/generator/renderers/components/Spacing.js

@@ -2,13 +2,25 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const discord_js_1 = require("discord.js");
+
+/**
+ * V2 Separator component. `spacing` is Small (1) or Large (2). `divider` toggles the visual line.
+ * In Discord's UI: Small ≈ 8px, Large ≈ 16px vertical padding. Divider draws a 1px line.
+ */
 function DiscordSeparator({ divider, spacing }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
+    const isLarge = spacing === discord_js_1.SeparatorSpacingSize?.Large || spacing === 2;
+    const pad = isLarge ? 16 : 8;
+    const showLine = divider !== false; // default true in Discord — only false when explicitly set
+    return (0, jsx_runtime_1.jsx)("div", {
+        className: "dht-v2-separator",
+        style: {
             width: '100%',
-            height: divider ? '1px' : '0px',
-            backgroundColor: '#4f5359',
-            margin: spacing === discord_js_1.SeparatorSpacingSize.Large ? '8px 0' : '0',
-        } }));
+            padding: `${pad}px 0`,
+            display: 'flex',
+            alignItems: 'center',
+        },
+        children: showLine ? (0, jsx_runtime_1.jsx)("div", { style: { width: '100%', height: '1px', backgroundColor: 'rgba(79,84,89,0.65)' } }) : null
+    });
 }
 exports.default = DiscordSeparator;
-//# sourceMappingURL=Spacing.js.map
+//# sourceMappingURL=Spacing.js.map

package/dist/generator/renderers/components/section/Section.js

@@ -8,12 +8,22 @@ const components_1 = require("../../components");
 const SectionContent_1 = __importDefault(require("./SectionContent"));
 const SectionAccessory_1 = __importDefault(require("./SectionAccessory"));
 function DiscordSection({ children, accessory, id }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+    return ((0, jsx_runtime_1.jsxs)("div", {
+        style: {
             display: 'flex',
             flexDirection: 'row',
             width: '100%',
             maxWidth: '500px',
-        }, children: [(0, jsx_runtime_1.jsx)(SectionContent_1.default, { children: children }), (0, jsx_runtime_1.jsx)(SectionAccessory_1.default, { children: accessory && (0, jsx_runtime_1.jsx)(components_1.Component, { component: accessory, id: id }) })] }));
+            minWidth: 0,
+            gap: '12px',
+            alignItems: 'flex-start',
+            boxSizing: 'border-box',
+        },
+        children: [
+            (0, jsx_runtime_1.jsx)(SectionContent_1.default, { children }),
+            accessory ? (0, jsx_runtime_1.jsx)(SectionAccessory_1.default, { children: (0, jsx_runtime_1.jsx)(components_1.Component, { component: accessory, id }) }) : null,
+        ]
+    }));
 }
 exports.default = DiscordSection;
-//# sourceMappingURL=Section.js.map
+//# sourceMappingURL=Section.js.map

package/dist/generator/renderers/components/section/SectionAccessory.js

@@ -2,15 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 function SectionAccessory({ children }) {
-    if (!children)
-        return null;
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
+    if (!children) return null;
+    return ((0, jsx_runtime_1.jsx)("div", {
+        style: {
             display: 'flex',
-            width: '100%',
-            maxWidth: '500px',
+            flex: '0 0 auto',
             justifyContent: 'flex-end',
             alignItems: 'center',
-        }, children: children }));
+        },
+        children
+    }));
 }
 exports.default = SectionAccessory;
-//# sourceMappingURL=SectionAccessory.js.map
+//# sourceMappingURL=SectionAccessory.js.map

package/dist/generator/renderers/components/section/SectionContent.js

@@ -2,11 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 function SectionContent({ children }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
+    return ((0, jsx_runtime_1.jsx)("div", {
+        style: {
             display: 'flex',
             flexDirection: 'column',
-            width: '100%',
-        }, children: children }));
+            flex: 1,
+            minWidth: 0, // allow text to shrink/wrap inside flex parent
+            overflowWrap: 'anywhere',
+        },
+        children
+    }));
 }
 exports.default = SectionContent;
-//# sourceMappingURL=SectionContent.js.map
+//# sourceMappingURL=SectionContent.js.map