import { html, nothing } from "lit";
import { when } from "lit/directives/when.js";
import { renderGeneratedContentContainer } from "./generated-content-container.js";
import { renderRetryPrompt } from "./retry-prompt.js";
import { renderShowButton } from "./show-button.js";
import { renderSourceCitations } from "./source-citations.js";
import { renderGeneratingAnswerLabel } from "./render-generating-answer-label.js";
import "../atomic-icon/atomic-icon.js";
const renderAnswerContent = ({ props })=>{
    const { i18n, generatedAnswer, collapsible, renderFeedbackAndCopyButtonsSlot, renderCitationsSlot, onRetry, onClickShowButton } = props;
    const { answer, isStreaming, citations, answerContentFormat, expanded, error } = generatedAnswer;
    const hasRetryableError = error?.isRetryable === true;
    return html`
    <div>
      ${hasRetryableError ? renderRetryPrompt({
        props: {
            onClick: onRetry,
            buttonLabel: i18n.t('retry'),
            message: i18n.t('retry-stream-message')
        }
    }) : nothing}
      ${!hasRetryableError ? renderGeneratedContentContainer({
        props: {
            answer,
            answerContentFormat,
            isStreaming: !!isStreaming
        }
    })(html`
            ${renderSourceCitations({
        props: {
            label: i18n.t('citations'),
            isVisible: !!citations?.length
        }
    })(renderCitationsSlot())}
          `) : nothing}
      ${when(!hasRetryableError && (collapsible ? expanded : true), ()=>html`
          <div class="mt-4" part="feedback-and-copy-buttons">
            ${renderFeedbackAndCopyButtonsSlot()}
          </div>
        `)}
      ${!hasRetryableError ? html`
            <div part="generated-answer-footer" class="mt-6">
              ${renderGeneratingAnswerLabel({
        props: {
            i18n,
            isStreaming: !!isStreaming,
            collapsible
        }
    })}
              ${collapsible && !isStreaming ? renderShowButton({
        props: {
            i18n,
            onClick: onClickShowButton,
            isCollapsed: !expanded
        }
    }) : nothing}
            </div>
          ` : nothing}
    </div>
  `;
};
export { renderAnswerContent };
