@fantinodavide/discord-html-transcripts
Version:
A nicely formatted html transcript generator for discord.js.
79 lines • 4.32 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ComponentsV2Wrapper = ComponentsV2Wrapper;
exports.default = ComponentV2Renderer;
const react_1 = __importDefault(require("react"));
const types_1 = require("../../types");
const discord_components_react_1 = require("@derockdev/discord-components-react");
const v2Components_1 = require("./v2Components");
// Discord V2 Component Styles - reserved for future use
// const v2ContentStyles: React.CSSProperties = {
// position: 'relative',
// border: '1px solid #3f4147',
// borderRadius: '8px',
// padding: '16px',
// backgroundColor: '#2f3136',
// overflow: 'hidden',
// };
// const v2ButtonContainerStyles: React.CSSProperties = {
// display: 'flex',
// gap: '8px',
// flexWrap: 'wrap',
// marginTop: '12px',
// };
// Main V2 Components wrapper - use existing discord-components-react structure
function ComponentsV2Wrapper({ components, context }) {
return (react_1.default.createElement(discord_components_react_1.DiscordAttachments, { slot: "components" }, components.map((component, index) => (react_1.default.createElement(ComponentV2Renderer, { key: index, component: component, context: context })))));
}
function ComponentV2Renderer({ component, context }) {
switch (component.type) {
case types_1.ComponentV2Type.Section:
return react_1.default.createElement(SectionRenderer, { component: component, context: context });
case types_1.ComponentV2Type.Container:
return react_1.default.createElement(ContainerRenderer, { component: component, context: context });
case types_1.ComponentV2Type.Separator:
return react_1.default.createElement(SeparatorRenderer, { component: component, context: context });
case types_1.ComponentV2Type.TextDisplay:
return react_1.default.createElement(TextDisplayRenderer, { component: component, context: context });
case types_1.ComponentV2Type.Thumbnail:
return react_1.default.createElement(ThumbnailRenderer, { component: component, context: context });
case types_1.ComponentV2Type.MediaGallery:
return react_1.default.createElement(MediaGalleryRenderer, { component: component, context: context });
default:
return react_1.default.createElement(UnknownComponentRenderer, { component: component });
}
}
function SectionRenderer({ component, context }) {
return (react_1.default.createElement(v2Components_1.V2Section, { text: component.text, accessory: component.accessory ? react_1.default.createElement(ComponentV2Renderer, { component: component.accessory, context: context }) : undefined, context: context }));
}
function ContainerRenderer({ component, context }) {
return (react_1.default.createElement(v2Components_1.V2Container, { accentColor: component.accent_color }, component.children.map((child, index) => (react_1.default.createElement(ComponentV2Renderer, { key: index, component: child, context: context })))));
}
function SeparatorRenderer({ component }) {
return react_1.default.createElement(v2Components_1.V2Separator, { spacing: component.spacing });
}
function TextDisplayRenderer({ component, context }) {
return (react_1.default.createElement(v2Components_1.V2TextDisplay, { content: component.content, style: component.style, context: context }));
}
function ThumbnailRenderer({ component }) {
return (react_1.default.createElement(v2Components_1.V2Thumbnail, { url: component.url, altText: component.alt_text }));
}
function MediaGalleryRenderer({ component }) {
return react_1.default.createElement(v2Components_1.V2MediaGallery, { items: component.items });
}
function UnknownComponentRenderer({ component }) {
return (react_1.default.createElement("div", { className: "discord-v2-unknown-component", style: {
padding: '8px',
backgroundColor: '#ffeaa7',
color: '#2d3436',
borderRadius: '4px',
margin: '4px 0',
fontSize: '0.875rem',
} },
"Unknown component type: ",
component.type));
}
//# sourceMappingURL=componentsV2.js.map