remix-nlux/packages/js/core/src/sections/chat/conversation/conversation.render.ts

Remix IDE NLUX integration. Remix IDE is the leading IDE for building and deploying smart contracts on Ethereum. NLUX is a JavaScript and React library for building conversational AI experiences.

import {AnyAiMsg} from '@shared/types/anyAiMsg';
import {CompRenderer} from '../../../types/comp';
import {
    CompConversationActions,
    CompConversationElements,
    CompConversationEvents,
    CompConversationProps,
} from './conversation.types';

export const renderConversation: CompRenderer<
    CompConversationProps<AnyAiMsg>, CompConversationElements, CompConversationEvents, CompConversationActions
> = ({appendToRoot}) => {

    const segmentsContainer = document.createElement('div') as HTMLElement;
    segmentsContainer.classList.add('nlux-chatSegments-container');
    appendToRoot(segmentsContainer);

    return {
        elements: {
            segmentsContainer,
        },
        actions: {},
    };
};