discord-html-transcripts-fix 1.0.0

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

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DiscordButton = DiscordButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function DiscordButton({ type, url, emoji, children }) {
+    return ((0, jsx_runtime_1.jsxs)("a", { href: url, target: "_blank", className: `discord-button discord-button-${type}`, children: [emoji && ((0, jsx_runtime_1.jsx)("span", { style: { display: 'flex', alignItems: 'center' }, children: (0, jsx_runtime_1.jsx)("img", { src: emoji, alt: "emoji", style: { width: '16px', height: '16px', marginRight: '8px' } }) })), (0, jsx_runtime_1.jsx)("span", { style: { display: 'flex', alignItems: 'center' }, children: children }), url && ((0, jsx_runtime_1.jsx)("span", { style: { marginLeft: '8px', display: 'flex', alignItems: 'center' }, children: (0, jsx_runtime_1.jsxs)("svg", { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none", viewBox: "0 0 24 24", children: [(0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M15 2a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v6a1 1 0 1 1-2 0V4.41l-4.3 4.3a1 1 0 1 1-1.4-1.42L19.58 3H16a1 1 0 0 1-1-1Z" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M5 2a3 3 0 0 0-3 3v14a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-6a1 1 0 1 0-2 0v6a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h6a1 1 0 1 0 0-2H5Z" })] }) }))] }));
+}
+exports.default = DiscordButton;
+//# sourceMappingURL=Button.js.map

package/dist/generator/renderers/components/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/Button.tsx"],"names":[],"mappings":";;AASA,sCAyBC;;AAzBD,SAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAsB;IAC9E,OAAO,CACL,+BAAG,IAAI,EAAE,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,SAAS,EAAE,iCAAiC,IAAI,EAAE,aAC7E,KAAK,IAAI,CACR,iCAAM,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,YACpD,gCAAK,GAAG,EAAE,KAAK,EAAE,GAAG,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,GAAI,GACxF,CACR,EACD,iCAAM,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAG,QAAQ,GAAQ,EACxE,GAAG,IAAI,CACN,iCAAM,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,YACvE,iCAAK,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,aACvG,iCACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,gHAAgH,GAClH,EACF,iCACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,0IAA0I,GAC5I,IACE,GACD,CACR,IACC,CACL,CAAC;AACJ,CAAC;AAED,kBAAe,aAAa,CAAC"}

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

@@ -0,0 +1,5 @@
+import React from 'react';
+declare function DiscordContainer({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export default DiscordContainer;

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

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+function DiscordContainer({ children }) {
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
+            display: 'flex',
+            width: '500px',
+            flexDirection: 'column',
+            backgroundColor: '#3f4248',
+            padding: '16px',
+            border: '1px solid #4f5359',
+            marginTop: '2px',
+            marginBottom: '2px',
+            borderRadius: '10px',
+            gap: '8px',
+        }, children: children }));
+}
+exports.default = DiscordContainer;
+//# sourceMappingURL=Container.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/Container.tsx"],"names":[],"mappings":";;;AAEA,SAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAiC;IACnE,OAAO,CACL,gCACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,KAAK,EAAE,OAAO;YACd,aAAa,EAAE,QAAQ;YACvB,eAAe,EAAE,SAAS;YAC1B,OAAO,EAAE,MAAM;YACf,MAAM,EAAE,mBAAmB;YAC3B,SAAS,EAAE,KAAK;YAChB,YAAY,EAAE,KAAK;YACnB,YAAY,EAAE,MAAM;YACpB,GAAG,EAAE,KAAK;SACX,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,gBAAgB,CAAC"}

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

@@ -0,0 +1,6 @@
+export type CodeBlockProps = {
+    content: string;
+    language?: string;
+};
+export declare const DiscordHighlightStyles = "\n  .hljs-ansi-control-sequence {\n  \tdisplay: none;\n  }\n\n  .hljs-ansi-style-bold {\n\t  font-weight: 700;\n  }\n\n  .hljs-ansi-style-underline {\n  \ttext-decoration: underline;\n  }\n\n  .hljs-ansi-foreground-black .hljs-ansi-background-black,\n  .hljs-ansi-foreground-black .hljs-ansi-background-blue,\n  .hljs-ansi-foreground-black .hljs-ansi-background-cyan,\n  .hljs-ansi-foreground-black .hljs-ansi-background-green,\n  .hljs-ansi-foreground-black .hljs-ansi-background-magenta,\n  .hljs-ansi-foreground-black .hljs-ansi-background-red,\n  .hljs-ansi-foreground-black .hljs-ansi-background-white,\n  .hljs-ansi-foreground-black .hljs-ansi-background-yellow {\n  \tcolor: #073642;\n  }\n\n  .hljs-ansi-foreground-red {\n\tcolor: #dc322f;\n  }\n\n  .hljs-ansi-foreground-green {\n\tcolor: #859900;\n  }\n\n  .hljs-ansi-foreground-yellow {\n\tcolor: #b58900;\n  }\n\n  .hljs-ansi-foreground-blue {\n\tcolor: #268bd2;\n  }\n\n  .hljs-ansi-foreground-magenta {\n\tcolor: #d33682;\n  }\n\n  .hljs-ansi-foreground-cyan {\n\tcolor: #2aa198;\n  }\n\n  .hljs-ansi-foreground-white {\n\tcolor: var(--interactive-active);\n  }\n\n  .hljs-ansi-foreground-white .hljs-ansi-background-black,\n  .hljs-ansi-foreground-white .hljs-ansi-background-blue,\n  .hljs-ansi-foreground-white .hljs-ansi-background-cyan,\n  .hljs-ansi-foreground-white .hljs-ansi-background-green,\n  .hljs-ansi-foreground-white .hljs-ansi-background-magenta,\n  .hljs-ansi-foreground-white .hljs-ansi-background-red,\n  .hljs-ansi-foreground-white .hljs-ansi-background-white,\n  .hljs-ansi-foreground-white .hljs-ansi-background-yellow {\n\tcolor: #eee8d5;\n  }\n\n  .hljs-ansi-background-black {\n\tbackground-color: #002b36;\n  }\n\n  .hljs-ansi-background-red {\n\tbackground-color: #cb4b16;\n  }\n\n  .hljs-ansi-background-green {\n\tbackground-color: #586e75;\n  }\n\n  .hljs-ansi-background-yellow {\n\tbackground-color: #657b83;\n  }\n\n  .hljs-ansi-background-blue {\n\tbackground-color: #839496;\n  }\n\n  .hljs-ansi-background-magenta {\n\tbackground-color: #6c71c4;\n  }\n\n  .hljs-ansi-background-cyan {\n\tbackground-color: #93a1a1;\n  }\n\n  .hljs-ansi-background-white {\n\tbackground-color: #fdf6e3;\n  }\n\n  .hljs-doctag,\n  .hljs-keyword,\n  .hljs-meta .hljs-keyword,\n  .hljs-template-tag,\n  .hljs-template-variable,\n  .hljs-type,\n  .hljs-variable.language_ {\n\tcolor: #ff7b72;\n  }\n\n  .hljs-title,\n  .hljs-title.class_,\n  .hljs-title.class_.inherited__,\n  .hljs-title.function_ {\n\tcolor: #d2a8ff;\n  }\n\n  .hljs-attr,\n  .hljs-attribute,\n  .hljs-literal,\n  .hljs-meta,\n  .hljs-number,\n  .hljs-operator,\n  .hljs-selector-attr,\n  .hljs-selector-class,\n  .hljs-selector-id,\n  .hljs-variable {\n\tcolor: #79c0ff;\n  }\n\n  .hljs-meta .hljs-string,\n  .hljs-regexp,\n  .hljs-string {\n\tcolor: #a5d6ff;\n  }\n\n  .hljs-built_in,\n  .hljs-symbol {\n\tcolor: #ffa657;\n  }\n\n  .hljs-code,\n  .hljs-comment,\n  .hljs-formula {\n\tcolor: #8b949e;\n  }\n\n  .hljs-name,\n  .hljs-quote,\n  .hljs-selector-pseudo,\n  .hljs-selector-tag {\n\tcolor: #7ee787;\n  }\n\n  .hljs-subst {\n\tcolor: #c9d1d9;\n  }\n\n  .hljs-section {\n\tcolor: #1f6feb;\n\tfont-weight: 700;\n  }\n\n  .hljs-bullet {\n\tcolor: #f2cc60;\n  }\n\n  .hljs-emphasis {\n\tcolor: #c9d1d9;\n\tfont-style: italic;\n  }\n\n  .hljs-strong {\n\tcolor: #c9d1d9;\n\tfont-weight: 700;\n  }\n\n  .hljs-addition {\n\tcolor: #aff5b4;\n\tbackground-color: #033a16;\n  }\n\n  .hljs-deletion {\n\tcolor: #ffdcd7;\n\tbackground-color: #67060c;\n  }\n";
+export declare function DiscordHighlightedCode(props: CodeBlockProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,199 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DiscordHighlightStyles = void 0;
+exports.DiscordHighlightedCode = DiscordHighlightedCode;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const highlight_js_1 = __importDefault(require("highlight.js"));
+// styles from https://github.com/cherryblossom000/discord-syntax-highlighting/tree/main
+exports.DiscordHighlightStyles = `
+  .hljs-ansi-control-sequence {
+  	display: none;
+  }
+
+  .hljs-ansi-style-bold {
+	  font-weight: 700;
+  }
+
+  .hljs-ansi-style-underline {
+  	text-decoration: underline;
+  }
+
+  .hljs-ansi-foreground-black .hljs-ansi-background-black,
+  .hljs-ansi-foreground-black .hljs-ansi-background-blue,
+  .hljs-ansi-foreground-black .hljs-ansi-background-cyan,
+  .hljs-ansi-foreground-black .hljs-ansi-background-green,
+  .hljs-ansi-foreground-black .hljs-ansi-background-magenta,
+  .hljs-ansi-foreground-black .hljs-ansi-background-red,
+  .hljs-ansi-foreground-black .hljs-ansi-background-white,
+  .hljs-ansi-foreground-black .hljs-ansi-background-yellow {
+  	color: #073642;
+  }
+
+  .hljs-ansi-foreground-red {
+	color: #dc322f;
+  }
+
+  .hljs-ansi-foreground-green {
+	color: #859900;
+  }
+
+  .hljs-ansi-foreground-yellow {
+	color: #b58900;
+  }
+
+  .hljs-ansi-foreground-blue {
+	color: #268bd2;
+  }
+
+  .hljs-ansi-foreground-magenta {
+	color: #d33682;
+  }
+
+  .hljs-ansi-foreground-cyan {
+	color: #2aa198;
+  }
+
+  .hljs-ansi-foreground-white {
+	color: var(--interactive-active);
+  }
+
+  .hljs-ansi-foreground-white .hljs-ansi-background-black,
+  .hljs-ansi-foreground-white .hljs-ansi-background-blue,
+  .hljs-ansi-foreground-white .hljs-ansi-background-cyan,
+  .hljs-ansi-foreground-white .hljs-ansi-background-green,
+  .hljs-ansi-foreground-white .hljs-ansi-background-magenta,
+  .hljs-ansi-foreground-white .hljs-ansi-background-red,
+  .hljs-ansi-foreground-white .hljs-ansi-background-white,
+  .hljs-ansi-foreground-white .hljs-ansi-background-yellow {
+	color: #eee8d5;
+  }
+
+  .hljs-ansi-background-black {
+	background-color: #002b36;
+  }
+
+  .hljs-ansi-background-red {
+	background-color: #cb4b16;
+  }
+
+  .hljs-ansi-background-green {
+	background-color: #586e75;
+  }
+
+  .hljs-ansi-background-yellow {
+	background-color: #657b83;
+  }
+
+  .hljs-ansi-background-blue {
+	background-color: #839496;
+  }
+
+  .hljs-ansi-background-magenta {
+	background-color: #6c71c4;
+  }
+
+  .hljs-ansi-background-cyan {
+	background-color: #93a1a1;
+  }
+
+  .hljs-ansi-background-white {
+	background-color: #fdf6e3;
+  }
+
+  .hljs-doctag,
+  .hljs-keyword,
+  .hljs-meta .hljs-keyword,
+  .hljs-template-tag,
+  .hljs-template-variable,
+  .hljs-type,
+  .hljs-variable.language_ {
+	color: #ff7b72;
+  }
+
+  .hljs-title,
+  .hljs-title.class_,
+  .hljs-title.class_.inherited__,
+  .hljs-title.function_ {
+	color: #d2a8ff;
+  }
+
+  .hljs-attr,
+  .hljs-attribute,
+  .hljs-literal,
+  .hljs-meta,
+  .hljs-number,
+  .hljs-operator,
+  .hljs-selector-attr,
+  .hljs-selector-class,
+  .hljs-selector-id,
+  .hljs-variable {
+	color: #79c0ff;
+  }
+
+  .hljs-meta .hljs-string,
+  .hljs-regexp,
+  .hljs-string {
+	color: #a5d6ff;
+  }
+
+  .hljs-built_in,
+  .hljs-symbol {
+	color: #ffa657;
+  }
+
+  .hljs-code,
+  .hljs-comment,
+  .hljs-formula {
+	color: #8b949e;
+  }
+
+  .hljs-name,
+  .hljs-quote,
+  .hljs-selector-pseudo,
+  .hljs-selector-tag {
+	color: #7ee787;
+  }
+
+  .hljs-subst {
+	color: #c9d1d9;
+  }
+
+  .hljs-section {
+	color: #1f6feb;
+	font-weight: 700;
+  }
+
+  .hljs-bullet {
+	color: #f2cc60;
+  }
+
+  .hljs-emphasis {
+	color: #c9d1d9;
+	font-style: italic;
+  }
+
+  .hljs-strong {
+	color: #c9d1d9;
+	font-weight: 700;
+  }
+
+  .hljs-addition {
+	color: #aff5b4;
+	background-color: #033a16;
+  }
+
+  .hljs-deletion {
+	color: #ffdcd7;
+	background-color: #67060c;
+  }
+`;
+function DiscordHighlightedCode(props) {
+    const highlighted = props.language
+        ? highlight_js_1.default.highlight(props.content, { language: props.language })
+        : highlight_js_1.default.highlightAuto(props.content);
+    return (0, jsx_runtime_1.jsx)("discord-code", { multiline: true, className: "theme-dark hljs", dangerouslySetInnerHTML: { __html: highlighted.value } });
+}
+//# sourceMappingURL=DiscordHighlightedCode.js.map

package/dist/generator/renderers/components/DiscordHighlightedCode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DiscordHighlightedCode.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/DiscordHighlightedCode.tsx"],"names":[],"mappings":";;;;;;AA+LA,wDAMC;;AArMD,gEAAgC;AAOhC,wFAAwF;AAC3E,QAAA,sBAAsB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqLrC,CAAC;AAEF,SAAgB,sBAAsB,CAAC,KAAqB;IAC1D,MAAM,WAAW,GAAG,KAAK,CAAC,QAAQ;QAChC,CAAC,CAAC,sBAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC;QAC7D,CAAC,CAAC,sBAAI,CAAC,aAAa,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAEtC,OAAO,yCAAc,SAAS,QAAC,SAAS,EAAC,iBAAiB,EAAC,uBAAuB,EAAE,EAAE,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,GAAI,CAAC;AACxH,CAAC"}

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

@@ -0,0 +1,6 @@
+export type DiscordImageAttachmentProps = {
+    url: string;
+    alt?: string;
+};
+export declare const DiscordAttachmentStyles = "\n  .discord-attachment-container {\n    display: block;\n    position: relative;\n    max-width: min(100%, 525px);\n  }\n\n  .discord-attachment-container > img {\n    max-width: 100%;\n    border-radius: 8px;\n  }\n";
+export declare function DiscordImageAttachment(props: DiscordImageAttachmentProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DiscordAttachmentStyles = void 0;
+exports.DiscordImageAttachment = DiscordImageAttachment;
+const jsx_runtime_1 = require("react/jsx-runtime");
+exports.DiscordAttachmentStyles = `
+  .discord-attachment-container {
+    display: block;
+    position: relative;
+    max-width: min(100%, 525px);
+  }
+
+  .discord-attachment-container > img {
+    max-width: 100%;
+    border-radius: 8px;
+  }
+`;
+function DiscordImageAttachment(props) {
+    return ((0, jsx_runtime_1.jsx)("div", { slot: "attachments", className: "discord-attachment-container", children: (0, jsx_runtime_1.jsx)("img", { src: props.url, alt: props.alt }) }));
+}
+//# sourceMappingURL=DiscordImage.js.map

package/dist/generator/renderers/components/DiscordImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DiscordImage.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/DiscordImage.tsx"],"names":[],"mappings":";;;AAoBA,wDAMC;;AAnBY,QAAA,uBAAuB,GAAG;;;;;;;;;;;CAWtC,CAAC;AAEF,SAAgB,sBAAsB,CAAC,KAAkC;IACvE,OAAO,CACL,gCAAK,IAAI,EAAC,aAAa,EAAC,SAAS,EAAC,8BAA8B,YAC9D,gCAAK,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,GAAI,GACnC,CACP,CAAC;AACJ,CAAC"}

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

@@ -0,0 +1,5 @@
+import type { MediaGalleryComponent } from 'discord.js';
+declare function DiscordMediaGallery({ component }: {
+    component: MediaGalleryComponent;
+}): import("react/jsx-runtime").JSX.Element | null;
+export default DiscordMediaGallery;

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

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("./utils");
+function DiscordMediaGallery({ component }) {
+    if (!component.items || component.items.length === 0) {
+        return null;
+    }
+    const count = component.items.length;
+    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) => ((0, jsx_runtime_1.jsxs)("div", { style: (0, utils_1.getImageStyle)(idx, count), children: [(0, jsx_runtime_1.jsx)("img", { src: media.media.url, alt: media.description || 'Media content', style: {
+                        width: '100%',
+                        height: '100%',
+                        objectFit: 'cover',
+                    } }), hasMore && idx === imagesToShow.length - 1 && ((0, jsx_runtime_1.jsxs)("div", { style: {
+                        position: 'absolute',
+                        top: 0,
+                        left: 0,
+                        width: '100%',
+                        height: '100%',
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        backgroundColor: 'rgba(0, 0, 0, 0.7)',
+                        color: 'white',
+                        fontSize: '20px',
+                        fontWeight: 'bold',
+                    }, children: ["+", component.items.length - 10] }))] }, idx))) }));
+}
+exports.default = DiscordMediaGallery;
+//# sourceMappingURL=Media%20Gallery.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Media Gallery.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/Media Gallery.tsx"],"names":[],"mappings":";;;AACA,mCAA0D;AAE1D,SAAS,mBAAmB,CAAC,EAAE,SAAS,EAAwC;IAC9E,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACrD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC;IACrC,MAAM,YAAY,GAAG,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAClD,MAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,CAAC;IAE5C,OAAO,CACL,gCAAK,KAAK,EAAE,IAAA,wBAAgB,EAAC,KAAK,CAAC,YAChC,YAAY,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,CAChC,iCAAe,KAAK,EAAE,IAAA,qBAAa,EAAC,GAAG,EAAE,KAAK,CAAC,aAC7C,gCACE,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,EACpB,GAAG,EAAE,KAAK,CAAC,WAAW,IAAI,eAAe,EACzC,KAAK,EAAE;wBACL,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,SAAS,EAAE,OAAO;qBACnB,GACD,EACD,OAAO,IAAI,GAAG,KAAK,YAAY,CAAC,MAAM,GAAG,CAAC,IAAI,CAC7C,iCACE,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,GAAG,EAAE,CAAC;wBACN,IAAI,EAAE,CAAC;wBACP,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,OAAO,EAAE,MAAM;wBACf,UAAU,EAAE,QAAQ;wBACpB,cAAc,EAAE,QAAQ;wBACxB,eAAe,EAAE,oBAAoB;wBACrC,KAAK,EAAE,OAAO;wBACd,QAAQ,EAAE,MAAM;wBAChB,UAAU,EAAE,MAAM;qBACnB,kBAEC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,IACzB,CACP,KA7BO,GAAG,CA8BP,CACP,CAAC,GACE,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,mBAAmB,CAAC"}

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

@@ -0,0 +1,7 @@
+import { type MessageActionRowComponent, ComponentType } from 'discord.js';
+declare function DiscordSelectMenu({ component, }: {
+    component: Exclude<MessageActionRowComponent, {
+        type: ComponentType.Button;
+    }>;
+}): import("react/jsx-runtime").JSX.Element;
+export default DiscordSelectMenu;

package/dist/generator/renderers/components/Select Menu.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const discord_js_1 = require("discord.js");
+const utils_1 = require("../../../utils/utils");
+const utils_2 = require("./utils");
+function DiscordSelectMenu({ component, }) {
+    const isStringSelect = component.type === discord_js_1.ComponentType.StringSelect;
+    const placeholder = component.placeholder || (0, utils_2.getSelectTypeLabel)(component.type);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "discord-select-menu", children: [(0, jsx_runtime_1.jsx)("div", { style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: placeholder }), (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', alignItems: 'center', marginLeft: '8px' }, children: (0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M7 10L12 15L17 10H7Z" }) }) }), isStringSelect && component.options && component.options.length > 0 && ((0, jsx_runtime_1.jsx)("div", { style: {
+                    display: 'none',
+                    position: 'absolute',
+                    top: '44px',
+                    left: '0',
+                    width: '100%',
+                    backgroundColor: '#2b2d31',
+                    borderRadius: '4px',
+                    zIndex: 10,
+                    border: '1px solid #1e1f22',
+                    maxHeight: '320px',
+                    overflowY: 'auto',
+                }, children: component.options.map((option, idx) => ((0, jsx_runtime_1.jsxs)("div", { style: {
+                        padding: '8px 12px',
+                        cursor: 'pointer',
+                        display: 'flex',
+                        alignItems: 'center',
+                        borderBottom: idx < component.options.length - 1 ? '1px solid #1e1f22' : 'none',
+                    }, children: [option.emoji && (0, jsx_runtime_1.jsx)("span", { style: { marginRight: '8px' }, children: (0, utils_1.parseDiscordEmoji)(option.emoji) }), (0, jsx_runtime_1.jsx)("span", { children: option.label })] }, idx))) }))] }));
+}
+exports.default = DiscordSelectMenu;
+//# sourceMappingURL=Select%20Menu.js.map

package/dist/generator/renderers/components/Select Menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select Menu.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/Select Menu.tsx"],"names":[],"mappings":";;;AAAA,2CAA2E;AAC3E,gDAAyD;AACzD,mCAA6C;AAE7C,SAAS,iBAAiB,CAAC,EACzB,SAAS,GAGV;IACC,MAAM,cAAc,GAAG,SAAS,CAAC,IAAI,KAAK,0BAAa,CAAC,YAAY,CAAC;IACrE,MAAM,WAAW,GAAG,SAAS,CAAC,WAAW,IAAI,IAAA,0BAAkB,EAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IAEhF,OAAO,CACL,iCAAK,SAAS,EAAC,qBAAqB,aAClC,gCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAG,WAAW,GAAO,EACvG,gCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,YACtE,gCAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,YAC7C,iCAAM,IAAI,EAAC,cAAc,EAAC,CAAC,EAAC,sBAAsB,GAAG,GACjD,GACF,EACL,cAAc,IAAI,SAAS,CAAC,OAAO,IAAI,SAAS,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,CACtE,gCACE,KAAK,EAAE;oBACL,OAAO,EAAE,MAAM;oBACf,QAAQ,EAAE,UAAU;oBACpB,GAAG,EAAE,MAAM;oBACX,IAAI,EAAE,GAAG;oBACT,KAAK,EAAE,MAAM;oBACb,eAAe,EAAE,SAAS;oBAC1B,YAAY,EAAE,KAAK;oBACnB,MAAM,EAAE,EAAE;oBACV,MAAM,EAAE,mBAAmB;oBAC3B,SAAS,EAAE,OAAO;oBAClB,SAAS,EAAE,MAAM;iBAClB,YAEA,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,CACtC,iCAEE,KAAK,EAAE;wBACL,OAAO,EAAE,UAAU;wBACnB,MAAM,EAAE,SAAS;wBACjB,OAAO,EAAE,MAAM;wBACf,UAAU,EAAE,QAAQ;wBACpB,YAAY,EAAE,GAAG,GAAG,SAAS,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM;qBAChF,aAEA,MAAM,CAAC,KAAK,IAAI,iCAAM,KAAK,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,YAAG,IAAA,yBAAiB,EAAC,MAAM,CAAC,KAAK,CAAC,GAAQ,EAC9F,2CAAO,MAAM,CAAC,KAAK,GAAQ,KAVtB,GAAG,CAWJ,CACP,CAAC,GACE,CACP,IACG,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,iBAAiB,CAAC"}

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

@@ -0,0 +1,6 @@
+import { SeparatorSpacingSize } from 'discord.js';
+declare function DiscordSeparator({ divider, spacing }: {
+    divider: boolean;
+    spacing: SeparatorSpacingSize;
+}): import("react/jsx-runtime").JSX.Element;
+export default DiscordSeparator;

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

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const discord_js_1 = require("discord.js");
+function DiscordSeparator({ divider, spacing }) {
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
+            width: '100%',
+            height: divider ? '1px' : '0px',
+            backgroundColor: '#4f5359',
+            margin: spacing === discord_js_1.SeparatorSpacingSize.Large ? '8px 0' : '0',
+        } }));
+}
+exports.default = DiscordSeparator;
+//# sourceMappingURL=Spacing.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Spacing.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/Spacing.tsx"],"names":[],"mappings":";;;AAAA,2CAAkD;AAElD,SAAS,gBAAgB,CAAC,EAAE,OAAO,EAAE,OAAO,EAAuD;IACjG,OAAO,CACL,gCACE,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;YAC/B,eAAe,EAAE,SAAS;YAC1B,MAAM,EAAE,OAAO,KAAK,iCAAoB,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;SAC/D,GACD,CACH,CAAC;AACJ,CAAC;AAED,kBAAe,gBAAgB,CAAC"}

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

@@ -0,0 +1,4 @@
+declare function DiscordThumbnail({ url }: {
+    url: string;
+}): import("react/jsx-runtime").JSX.Element;
+export default DiscordThumbnail;

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

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+function DiscordThumbnail({ url }) {
+    return ((0, jsx_runtime_1.jsx)("img", { src: url, alt: "Thumbnail", style: {
+            width: '85px',
+            height: '85px',
+            objectFit: 'cover',
+            borderRadius: '8px',
+        } }));
+}
+exports.default = DiscordThumbnail;
+//# sourceMappingURL=Thumbnail.js.map

package/dist/generator/renderers/components/Thumbnail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Thumbnail.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/Thumbnail.tsx"],"names":[],"mappings":";;;AAAA,SAAS,gBAAgB,CAAC,EAAE,GAAG,EAAmB;IAChD,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,GAAG,EAAC,WAAW,EACf,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,OAAO;YAClB,YAAY,EAAE,KAAK;SACpB,GACD,CACH,CAAC;AACJ,CAAC;AAED,kBAAe,gBAAgB,CAAC"}

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

@@ -0,0 +1,8 @@
+import { type ReactNode } from 'react';
+export type TranscriptHeaderProps = {
+    guildName: string;
+    channelName: string;
+    guildIcon?: string;
+    children?: ReactNode;
+};
+export declare function TranscriptHeader(props: TranscriptHeaderProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TranscriptHeader = TranscriptHeader;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function TranscriptHeader(props) {
+    // If guild has no icon, we take first letter of guild name words
+    // i.e. Guild A -> GA
+    // and OneWordGuildName -> O
+    const split = props.guildName.split(' ');
+    const placeholder = split.length > 1 ? split[0][0] + split[1][0] : split[0][0];
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "discord-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "discord-header-icon", children: props.guildIcon ? ((0, jsx_runtime_1.jsx)("img", { src: props.guildIcon, alt: "guild icon" })) : ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("span", { children: placeholder }) })) }), (0, jsx_runtime_1.jsxs)("div", { className: "discord-header-text", children: [(0, jsx_runtime_1.jsx)("div", { className: "discord-header-text-guild", children: props.guildName }), (0, jsx_runtime_1.jsxs)("div", { className: "discord-header-text-channel", children: ["#", props.channelName] }), props.children] })] }));
+}
+//# sourceMappingURL=TranscriptHeader.js.map

package/dist/generator/renderers/components/TranscriptHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TranscriptHeader.js","sourceRoot":"","sources":["../../../../src/generator/renderers/components/TranscriptHeader.tsx"],"names":[],"mappings":";;AASA,4CAyBC;;AAzBD,SAAgB,gBAAgB,CAAC,KAA4B;IAC3D,iEAAiE;IACjE,qBAAqB;IACrB,4BAA4B;IAC5B,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACzC,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE/E,OAAO,CACL,iCAAK,SAAS,EAAC,gBAAgB,aAC7B,gCAAK,SAAS,EAAC,qBAAqB,YACjC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CACjB,gCAAK,GAAG,EAAE,KAAK,CAAC,SAAS,EAAE,GAAG,EAAC,YAAY,GAAG,CAC/C,CAAC,CAAC,CAAC,CACF,0CACE,2CAAO,WAAW,GAAQ,GACtB,CACP,GACG,EACN,iCAAK,SAAS,EAAC,qBAAqB,aAClC,gCAAK,SAAS,EAAC,2BAA2B,YAAE,KAAK,CAAC,SAAS,GAAO,EAClE,iCAAK,SAAS,EAAC,6BAA6B,kBAAG,KAAK,CAAC,WAAW,IAAO,EACtE,KAAK,CAAC,QAAQ,IACX,IACF,CACP,CAAC;AACJ,CAAC"}

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { ButtonComponent, ThumbnailComponent } from 'discord.js';
+interface DiscordSectionProps {
+    children: React.ReactNode;
+    accessory?: ButtonComponent | ThumbnailComponent;
+    id: number;
+}
+declare function DiscordSection({ children, accessory, id }: DiscordSectionProps): import("react/jsx-runtime").JSX.Element;
+export default DiscordSection;

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

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+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: {
+            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 }) })] }));
+}
+exports.default = DiscordSection;
+//# sourceMappingURL=Section.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Section.js","sourceRoot":"","sources":["../../../../../src/generator/renderers/components/section/Section.tsx"],"names":[],"mappings":";;;;;;AAEA,iDAA6C;AAC7C,sEAA8C;AAC9C,0EAAkD;AAQlD,SAAS,cAAc,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,EAAuB;IACtE,OAAO,CACL,iCACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,KAAK;YACpB,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,OAAO;SAClB,aAED,uBAAC,wBAAc,cAAE,QAAQ,GAAkB,EAC3C,uBAAC,0BAAgB,cAAE,SAAS,IAAI,uBAAC,sBAAS,IAAC,SAAS,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,GAAI,GAAoB,IAC3F,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,cAAc,CAAC"}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+interface SectionAccessoryProps {
+    children?: React.ReactNode;
+}
+declare function SectionAccessory({ children }: SectionAccessoryProps): import("react/jsx-runtime").JSX.Element | null;
+export default SectionAccessory;

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

@@ -0,0 +1,16 @@
+"use strict";
+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: {
+            display: 'flex',
+            width: '100%',
+            maxWidth: '500px',
+            justifyContent: 'flex-end',
+            alignItems: 'center',
+        }, children: children }));
+}
+exports.default = SectionAccessory;
+//# sourceMappingURL=SectionAccessory.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SectionAccessory.js","sourceRoot":"","sources":["../../../../../src/generator/renderers/components/section/SectionAccessory.tsx"],"names":[],"mappings":";;;AAMA,SAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAyB;IAC3D,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,OAAO,CACL,gCACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,OAAO;YACjB,cAAc,EAAE,UAAU;YAC1B,UAAU,EAAE,QAAQ;SACrB,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,gBAAgB,CAAC"}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+interface SectionContentProps {
+    children: React.ReactNode;
+}
+declare function SectionContent({ children }: SectionContentProps): import("react/jsx-runtime").JSX.Element;
+export default SectionContent;

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

@@ -0,0 +1,12 @@
+"use strict";
+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: {
+            display: 'flex',
+            flexDirection: 'column',
+            width: '100%',
+        }, children: children }));
+}
+exports.default = SectionContent;
+//# sourceMappingURL=SectionContent.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SectionContent.js","sourceRoot":"","sources":["../../../../../src/generator/renderers/components/section/SectionContent.tsx"],"names":[],"mappings":";;;AAMA,SAAS,cAAc,CAAC,EAAE,QAAQ,EAAuB;IACvD,OAAO,CACL,gCACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,KAAK,EAAE,MAAM;SACd,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,kBAAe,cAAc,CAAC"}

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

@@ -0,0 +1,21 @@
+export declare const containerStyle: {
+    display: "grid";
+    gap: string;
+    width: string;
+    maxWidth: string;
+    borderRadius: string;
+    overflow: "hidden";
+};
+export declare const baseImageStyle: {
+    overflow: "hidden";
+    position: "relative";
+    background: string;
+};
+export declare const ButtonStyleMapping: {
+    readonly 1: "primary";
+    readonly 2: "secondary";
+    readonly 3: "success";
+    readonly 4: "destructive";
+    readonly 5: "secondary";
+};
+export declare const globalStyles = "\n  .discord-container {\n    display: grid;\n    gap: 4px;\n    width: 100%;\n    max-width: 500px;\n    border-radius: 8px;\n    overflow: hidden;\n  }\n\n  .discord-base-image {\n    overflow: hidden;\n    position: relative;\n    background: #2b2d31;\n  }\n\n  .discord-button {\n    color: #ffffff !important;\n    padding: 2px 16px;\n    border-radius: 8px;\n    text-decoration: none !important;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 14px;\n    font-weight: 500;\n    height: 32px;\n    min-height: 32px;\n    min-width: 60px;\n    cursor: pointer;\n    font-family: Whitney, \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n    text-align: center;\n    box-sizing: border-box;\n    border: none;\n    outline: none;\n    transition: background-color 0.2s ease;\n  }\n\n  .discord-button-primary {\n    background-color: hsl(234.935 calc(1*85.556%) 64.706% /1);\n  }\n\n  .discord-button-secondary {\n    background-color: hsl(240 calc(1*4%) 60.784% /0.12156862745098039);\n  }\n\n  .discord-button-success {\n    background-color: hsl(145.97 calc(1*100%) 26.275% /1);\n  }\n\n  .discord-button-destructive {\n    background-color: hsl(355.636 calc(1*64.706%) 50% /1);\n  }\n\n  .discord-select-menu {\n    margin-top: 2px;\n    margin-bottom: 2px;\n    position: relative;\n    width: 100%;\n    max-width: 500px;\n    height: 40px;\n    background-color: #2b2d31;\n    border-radius: 4px;\n    color: #b5bac1;\n    cursor: pointer;\n    font-family: Whitney, \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n    font-size: 14px;\n    display: flex;\n    align-items: center;\n    padding: 0 8px;\n    justify-content: space-between;\n    box-sizing: border-box;\n    border: 1px solid #1e1f22;\n  }\n\n  .discord-header {\n  \tdisplay: flex;\n  \tflex-direction: row;\n  \tmax-height: 5rem;\n  \tpadding: 0.5rem;\n  \tgap: 0.5rem;\n  \tborder-bottom: 1px solid rgba(79, 84, 92, 0.48);\n  }\n\n  .discord-header-icon {\n  \tfloat: left;\n  \twidth: 5rem;\n  }\n\n  .discord-header-icon > div {\n  \tbackground-color: rgb(79, 84, 92);\n  \tborder-radius: 50%;\n  \twidth: 5rem;\n  \theight: 5rem;\n  \ttext-align: center;\n  \talign-items: center;\n  \tjustify-content: center;\n  \tdisplay: flex;\n  \tfont-size: xx-large;\n  }\n\n  .discord-header-icon > img {\n  \tborder-radius: 50%;\n  \twidth: auto;\n  \theight: 100%;\n  }\n\n  .discord-header-text {\n    flex-grow: 1;\n  }\n\n  .discord-header-text-guild {\n  \tfont-size: 1.5rem;\n  \tfont-weight: bold;\n  }\n\n  .reply-inline {\n    white-space: collapse;\n  }\n";