55:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 56:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 4e:["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"clsx@^2.1.1"}] 4f:["$","li","react-markdown@^10.1.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/react-markdown","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"react-markdown@^10.1.0"}]]}]}] 50:["$","li","remark-gfm@^4.0.1",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/remark-gfm","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"remark-gfm@^4.0.1"}]]}]}] 51:["$","li","tailwind-merge@^3.6.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/tailwind-merge","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"tailwind-merge@^3.6.0"}]]}]}] 52:["$","li","@tiptap/markdown",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40tiptap%2Fmarkdown","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@tiptap/markdown"}]]}]}] 53:["$","$L55",null,{"namespace":"@emend","registryDependencies":["button","checkbox","label","message-scroller","popover","textarea","tooltip","badge","select","bubble","marker","message"]}] 57:T5176,"use client" import type { EmendActionId, EmendConversationMessage, EmendRunOptions, } from "@emend/ai" import type { UseEditorAiOptions, UseEditorAiResult } from "@emend/ai/react" import { useEditorAi } from "@emend/ai/react" import AiChat02Icon from "@hugeicons/core-free-icons/AiChat02Icon" import BubbleChatAddIcon from "@hugeicons/core-free-icons/BubbleChatAddIcon" import Clock01Icon from "@hugeicons/core-free-icons/Clock01Icon" import ArrowDown01Icon from "@hugeicons/core-free-icons/ArrowDown01Icon" import ArrowLeft01Icon from "@hugeicons/core-free-icons/ArrowLeft01Icon" import Cancel01Icon from "@hugeicons/core-free-icons/Cancel01Icon" import Delete02Icon from "@hugeicons/core-free-icons/Delete02Icon" import { HugeiconsIcon } from "@hugeicons/react" import { Bubble, BubbleContent } from "@/components/ui/bubble" import { Button } from "@/components/ui/button" import { Message, MessageContent } from "@/components/ui/message" import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, useMessageScroller, useMessageScrollerScrollable, } from "@/components/ui/message-scroller" import { Popover, PopoverContent, PopoverTitle, PopoverTrigger, } from "@/components/ui/popover" import { Tooltip, TooltipContent, TooltipTrigger, } from "@/components/ui/tooltip" import { cn } from "@/lib/utils" import { useEffect, useLayoutEffect, useState, type ReactNode } from "react" import { AiAssistantComposer, type AiAssistantPolicy, } from "./ai-assistant-composer" import { AiAssistantMessage, AnswerBubble } from "./ai-assistant-message" import { useAssistantHistory, type AssistantThread, } from "./use-assistant-history" export interface AssistantMessage extends EmendConversationMessage { readonly id: string readonly requestId: string } export interface AiAssistantProps { readonly editor: UseEditorAiOptions["editor"] readonly transport: UseEditorAiOptions["transport"] readonly policy?: AiAssistantPolicy readonly open?: boolean readonly onOpenChange?: (open: boolean) => void readonly defaultOpen?: boolean readonly storageKey?: string readonly inline?: boolean readonly className?: string readonly panelClassName?: string readonly triggerIcon?: ReactNode } export interface AiAssistantViewProps { readonly editor: UseEditorAiOptions["editor"] readonly session: UseEditorAiResult readonly policy?: AiAssistantPolicy readonly open?: boolean readonly onOpenChange?: (open: boolean) => void readonly defaultOpen?: boolean readonly storageKey?: string readonly inline?: boolean readonly className?: string readonly panelClassName?: string readonly triggerIcon?: ReactNode } export function AiAssistant({ editor, transport, policy, open, onOpenChange, defaultOpen, storageKey, inline, className, panelClassName, triggerIcon, }: AiAssistantProps) { const session = useEditorAi({ editor, transport, previewMode: "inline" }) return ( ) } export function AiAssistantView(props: AiAssistantViewProps) { return } function AiAssistantPanel({ editor, session, policy, open, onOpenChange, defaultOpen = false, storageKey = "emend:ai-assistant:v1", inline = false, className, panelClassName, triggerIcon, }: AiAssistantViewProps) { const [localOpen, setLocalOpen] = useState(defaultOpen) const isOpen = open ?? localOpen const [historyOpen, setHistoryOpen] = useState(false) const [threadId, setThreadId] = useState("") const { threads, saveThread, deleteThread, storageNotice } = useAssistantHistory(storageKey) const [messages, setMessages] = useState([]) const [hiddenRequestId, setHiddenRequestId] = useState( session.activeRequest?.requestId ?? null ) const request = session.activeRequest const showCurrentTurn = request !== null && request.requestId !== hiddenRequestId const requestLabel = request ? getRequestLabel(request) : "" const assistantContent = getAssistantContent(session) const currentRequestArchived = request !== null && messages.some((message) => message.requestId === request.requestId) const lastMessage = messages[messages.length - 1] const currentUserStored = lastMessage?.role === "user" && lastMessage.requestId.startsWith("local-") && lastMessage.content === requestLabel const currentTurn = showCurrentTurn && request && !currentRequestArchived ? createTurn(request.requestId, requestLabel, assistantContent).slice( currentUserStored ? 1 : 0 ) : [] const visibleMessages = [...messages, ...currentTurn] const detachedError = messages.length > 0 && (request === null || currentRequestArchived) ? (session.error ?? session.reviewError) : null const busy = session.state === "submitting" || session.state === "streaming" const snapshot = JSON.stringify(visibleMessages) useEffect(() => { if (!threadId || busy) return saveThread({ id: threadId, messages: JSON.parse(snapshot) as AssistantMessage[], }) }, [threadId, busy, snapshot, saveThread]) function changeOpen(nextOpen: boolean) { setLocalOpen(nextOpen) onOpenChange?.(nextOpen) } function archiveCurrentTurn(nextMessage?: AssistantMessage) { if ((!request || currentTurn.length === 0) && !nextMessage) return setMessages((current) => { const archived = request && currentTurn.length > 0 && !current.some((message) => message.requestId === request.requestId) ? [...current, ...currentTurn] : current return nextMessage ? [...archived, nextMessage] : archived }) } const chatSession: UseEditorAiResult = { ...session, run: (actionId, options) => { if (!threadId) setThreadId(crypto.randomUUID()) const userMessage = createUserMessage( getMessageLabel(actionId, options?.instruction) ) const history = visibleMessages.map(({ role, content }) => ({ role, content, })) archiveCurrentTurn(userMessage) return session.run(actionId, { ...options, messages: [ ...history, { role: "user", content: userMessage.content, }, ], }) }, regenerate: () => { archiveCurrentTurn() return session.regenerate() }, accept: (confirmDocumentReplacement) => { archiveCurrentTurn() return session.accept(confirmDocumentReplacement) }, reject: () => { archiveCurrentTurn() return session.reject() }, } function startNewChat(thread?: AssistantThread) { // Leaving mid-stream stops the turn, so only completed turns are saved. const completedMessages = busy && lastMessage?.role === "user" ? messages.slice(0, -1) : messages if (threadId) saveThread({ id: threadId, messages: busy ? completedMessages : visibleMessages, }) setMessages(thread?.messages ?? []) setThreadId(thread?.id ?? crypto.randomUUID()) setHistoryOpen(false) if (request) setHiddenRequestId(request.requestId) if (session.state === "submitting" || session.state === "streaming") { session.stop() } else if (session.pendingProposal) { session.reject() } else if (request?.interactionMode === "ask") { session.dismissInformationalResult() } } function deleteChat(thread: AssistantThread) { if (thread.id === threadId) { setMessages([]) setThreadId(crypto.randomUUID()) if (request) setHiddenRequestId(request.requestId) setHistoryOpen(true) if (busy) { session.stop() } else if (session.pendingProposal) { session.reject() } else if (request?.interactionMode === "ask") { session.dismissInformationalResult() } } deleteThread(thread.id) } const title = historyOpen ? "Chat history" : visibleMessages.length ? "AI Assistant" : "New chat" const content = ( <>

{inline ? (

{title}

) : ( {title} )}

setHistoryOpen(!historyOpen)} /> } > {historyOpen ? "Back to chat" : "Chat history"} startNewChat()} /> } > New chat

{storageNotice && (

{storageNotice}

)} {historyOpen ? (

Your latest 20 chats, saved in this browser.

{threads.length === 0 && (

Your conversations will appear here.

)} {threads.map((thread) => { const title = thread.messages.find((message) => message.role === "user") ?.content ?? "New chat" return (

) })}

) : visibleMessages.length === 0 && !detachedError ? (

How can I help you today?

Ask anything about your document, or select text to edit it.

) : ( <>

{visibleMessages.map((message) => { const currentAssistant = showCurrentTurn && !currentRequestArchived && message.role === "assistant" && message.requestId === request?.requestId return ( {message.role === "user" ? ( {message.content} ) : currentAssistant ? ( ) : ( {message.content} )} ) })} {detachedError && ( {detachedError.message} )}

)} ) if (inline) { if (!isOpen) return null return ( ) } return ( { if ( details.reason === "outside-press" || details.reason === "focus-out" ) { details.cancel() return } changeOpen(nextOpen) }} modal={false} > } > {triggerIcon ?? ( )} {content} ) } function AssistantStreamScroll({ content, active, }: { content: string active: boolean }) { const { scrollToEnd } = useMessageScroller() const { end: awayFromEnd } = useMessageScrollerScrollable() useLayoutEffect(() => { if (active && !awayFromEnd) scrollToEnd({ behavior: "auto" }) }, [active, awayFromEnd, content, scrollToEnd]) return null } function getRequestLabel( request: NonNullable ) { return getMessageLabel(request.actionId, request.instruction) } function createTurn( requestId: string, requestLabel: string, assistantContent: string ): AssistantMessage[] { return [ { id: `user-${requestId}`, requestId, role: "user", content: requestLabel, }, { id: `assistant-${requestId}`, requestId, role: "assistant", content: assistantContent, }, ] } function createUserMessage(content: string): AssistantMessage { const requestId = `local-${crypto.randomUUID()}` return { id: `user-${requestId}`, requestId, role: "user", content, } } function getMessageLabel( actionId: EmendActionId, instruction?: EmendRunOptions["instruction"] ) { if (instruction) return instruction const labels: Record = { improve: "Improve the selected writing", shorten: "Shorten the selected writing", expand: "Make the selected writing longer", "fix-grammar": "Fix grammar and spelling", } return labels[actionId] ?? actionId.replaceAll("-", " ") } function getAssistantContent(session: UseEditorAiResult) { const error = session.error?.message ?? session.reviewError?.message if (session.activeRequest?.interactionMode === "ask") { return ( session.informationalMarkdown || session.streamedMarkdown || error || "No response was received." ) } return ( session.proposalMarkdown || session.pendingProposal?.content.value || session.streamedMarkdown || error || "No response was received." ) } 58:T2a04,"use client" import { setEmendSelectionDecoration } from "@emend/ai/tiptap" import type { UseEditorAiOptions, UseEditorAiResult } from "@emend/ai/react" import CancelCircleIcon from "@hugeicons/core-free-icons/CancelCircleIcon" import CheckmarkCircle01Icon from "@hugeicons/core-free-icons/CheckmarkCircle01Icon" import Copy01Icon from "@hugeicons/core-free-icons/Copy01Icon" import InformationCircleIcon from "@hugeicons/core-free-icons/InformationCircleIcon" import Refresh01Icon from "@hugeicons/core-free-icons/Refresh01Icon" import ReloadIcon from "@hugeicons/core-free-icons/ReloadIcon" import TextCheckIcon from "@hugeicons/core-free-icons/TextCheckIcon" import { HugeiconsIcon, type IconSvgElement } from "@hugeicons/react" import { AiMarkdown } from "@/components/emend/_shared/ai-markdown" import { Bubble, BubbleContent } from "@/components/ui/bubble" import { Button } from "@/components/ui/button" import { Checkbox } from "@/components/ui/checkbox" import { Label } from "@/components/ui/label" import { Marker, MarkerContent, MarkerIcon } from "@/components/ui/marker" import { Message, MessageContent, MessageFooter } from "@/components/ui/message" import { Textarea } from "@/components/ui/textarea" import { Tooltip, TooltipContent, TooltipTrigger, } from "@/components/ui/tooltip" import { useEffect, useState } from "react" export function AiAssistantMessage({ editor, session, }: { readonly editor: UseEditorAiOptions["editor"] readonly session: UseEditorAiResult }) { const [confirmation, setConfirmation] = useState({ key: "", checked: false }) const request = session.activeRequest const pendingProposal = session.pendingProposal const proposalMarkdown = session.proposalMarkdown ?? pendingProposal?.content.value ?? "" const confirmationKey = `${pendingProposal?.id ?? ""}:${proposalMarkdown}` const confirmDocumentReplacement = confirmation.key === confirmationKey && confirmation.checked const preparation = session.preparation const isRunning = session.state === "submitting" || session.state === "streaming" const isAsk = request?.interactionMode === "ask" const isEdit = pendingProposal?.request.interactionMode === "edit" const isBlocked = isEdit && preparation?.kind === "blocked" const isPlainTextFallback = isEdit && preparation?.kind === "plain-text-fallback" const proposalRenderedInline = isEdit && Boolean(session.editorState?.previewKind) const visibleError = session.error ?? session.reviewError const canRetry = !session.stale && !isRunning && (session.state === "error" || session.state === "aborted") && session.error?.retryable === true const canRegenerate = Boolean(request) && !isRunning const canApply = isEdit && !session.stale && session.streamCompleted && preparation?.kind !== "blocked" && (preparation?.kind === "supported-markdown" || preparation?.kind === "plain-text-fallback") && (!preparation.requiresDocumentConfirmation || confirmDocumentReplacement) useEffect( () => () => { setEmendSelectionDecoration(editor, null) }, [editor] ) function highlightTarget(active: boolean) { const range = request?.targetRange setEmendSelectionDecoration(editor, active && range ? range : null) } const status = isRunning ? isAsk ? "Thinking…" : "Writing a suggestion…" : null return ( highlightTarget(true)} onMouseLeave={() => highlightTarget(false)} onFocusCapture={() => highlightTarget(true)} onBlurCapture={(event) => { if (!event.currentTarget.contains(event.relatedTarget)) { highlightTarget(false) } }} > {status && !session.streamedMarkdown && ( {status} )} {visibleError && ( {visibleError.message} )} {isRunning && isAsk && session.streamedMarkdown && ( {session.streamedMarkdown} )} {isAsk && !isRunning && ( {session.informationalMarkdown || session.streamedMarkdown} )} {!isRunning && !isAsk && !isEdit && visibleError && ( {session.streamedMarkdown || "No response was received."} )} {isRunning && !isAsk && session.streamedMarkdown && ( {status} )} {isEdit && (

{proposalRenderedInline ? ( {session.stale ? "The document changed, so this suggestion is out of date." : "The suggested change is shown in your document."} ) : (

                  session.setProposalMarkdown(event.target.value)
                }
              />
            )}

            {isBlocked && preparation.kind === "blocked" && (
              <Bubble variant="destructive">
                <BubbleContent role="alert">
                  {preparation.error.message}
                </BubbleContent>
              </Bubble>
            )}

            {preparation &&
              preparation.kind !== "blocked" &&
              preparation.requiresDocumentConfirmation &&
              !session.stale && (
                <Label className="items-start rounded-xl border border-destructive/30 bg-destructive/10 p-3 leading-normal font-normal">
                  <Checkbox
                    className="mt-1"
                    checked={confirmDocumentReplacement}
                    onCheckedChange={(checked) =>
                      setConfirmation({
                        key: confirmationKey,
                        checked,
                      })
                    }
                  />
                  Confirm replacing the whole document.
                </Label>
              )}

            {!isRunning && (
              <div className="flex items-center gap-2">
                <Button
                  type="button"
                  size="sm"
                  disabled={!canApply}
                  onClick={() => session.accept(confirmDocumentReplacement)}
                >
                  <HugeiconsIcon icon={CheckmarkCircle01Icon} size={14} />
                  {isPlainTextFallback ? "Apply as plain text" : "Accept"}
                </Button>
                <Button
                  type="button"
                  size="sm"
                  variant="outline"
                  onClick={() => session.reject()}
                >
                  <HugeiconsIcon icon={CancelCircleIcon} size={14} />
                  Reject
                </Button>
              </div>
            )}
          </div>
        )}
        {!isRunning && (
          <MessageFooter className="-mt-1 gap-0.5 px-0">
            <MessageAction
              label="Copy"
              icon={Copy01Icon}
              disabled={!session.copy()}
              onClick={() => void copySession(session)}
            />
            {canRetry && (
              <MessageAction
                label="Retry"
                icon={ReloadIcon}
                onClick={() => void session.retry()}
              />
            )}
            {canRegenerate && (
              <MessageAction
                label="Regenerate"
                icon={Refresh01Icon}
                onClick={() => void session.regenerate()}
              />
            )}
            {preparation && preparation.warnings.length > 0 && (
              <Tooltip>
                <TooltipTrigger
                  render={
                    <Button
                      variant="ghost"
                      size="icon-xs"
                      type="button"
                      aria-label="View proposal warnings"
                    />
                  }
                >
                  <HugeiconsIcon icon={InformationCircleIcon} size={14} />
                </TooltipTrigger>
                <TooltipContent>
                  {preparation.warnings.map((warning) => (
                    <p key={warning.code}>{warning.message}</p>
                  ))}
                </TooltipContent>
              </Tooltip>
            )}
          </MessageFooter>
        )}
      </MessageContent>
    </Message>
  )
}

export function AnswerBubble({ children }: { readonly children: string }) {
  return (
    <Bubble variant="ghost" className="w-full">
      <BubbleContent>
        <AiMarkdown>{children}</AiMarkdown>
      </BubbleContent>
    </Bubble>
  )
}

function MessageAction({
  label,
  icon,
  disabled,
  onClick,
}: {
  readonly label: string
  readonly icon: IconSvgElement
  readonly disabled?: boolean
  readonly onClick: () => void
}) {
  return (
    <Tooltip>
      <TooltipTrigger
        render={
          <Button
            variant="ghost"
            size="icon-xs"
            type="button"
            aria-label={label}
            disabled={disabled}
            onClick={onClick}
          />
        }
      >
        <HugeiconsIcon icon={icon} size={14} />
      </TooltipTrigger>
      <TooltipContent>{label}</TooltipContent>
    </Tooltip>
  )
}

async function copySession(session: UseEditorAiResult) {
  const value = session.copy()
  if (!value || !navigator.clipboard) return
  await navigator.clipboard.writeText(value).catch(() => undefined)
}
59:T8e89,"use client"

import {
  DEFAULT_REQUEST_LIMITS,
  type EmendContextScope,
  type EmendMutationOperation,
  type EmendTargetScope,
} from "@emend/ai"
import { setEmendSelectionDecoration } from "@emend/ai/tiptap"
import {
  Add01Icon,
  ArrowUp01Icon,
  BookAIcon,
  BookOpenTextIcon,
  Cancel01Icon,
  CursorTextIcon,
  Edit02Icon,
  File01Icon,
  FileEditIcon,
  MagicWand01Icon,
  HappyIcon,
  TextAlignLeftIcon,
  TextIndent01Icon,
  TextSelectionIcon,
  StopIcon,
  TypeCursorIcon,
  UnfoldLessIcon,
} from "@hugeicons/core-free-icons"
import { HugeiconsIcon } from "@hugeicons/react"
import { useEditorState } from "@tiptap/react"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import {
  Select,
  SelectContent,
  SelectGroup,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select"
import { Textarea } from "@/components/ui/textarea"
import { cn } from "@/lib/utils"
import { useEffect, useId, useLayoutEffect, useRef, useState } from "react"
import {
  type UseEditorAiOptions,
  type UseEditorAiResult,
} from "@emend/ai/react"

const actions = [
  {
    actionId: "improve",
    command: "improve",
    label: "Improve",
    icon: MagicWand01Icon,
    description: "Make the selected writing clearer.",
    targetScope: "selection",
    contextScope: "selection",
    mutationOperation: "replace-selection",
  },
  {
    actionId: "shorten",
    command: "shorten",
    label: "Shorten",
    icon: UnfoldLessIcon,
    description: "Make the selected writing more concise.",
    targetScope: "selection",
    contextScope: "selection",
    mutationOperation: "replace-selection",
  },
  {
    actionId: "expand",
    command: "longer",
    label: "Longer",
    icon: TextIndent01Icon,
    description: "Add useful detail to the selected writing.",
    targetScope: "selection",
    contextScope: "selection",
    mutationOperation: "replace-selection",
  },
  {
    actionId: "fix-grammar",
    command: "fix-grammar",
    label: "Fix grammar",
    icon: BookAIcon,
    description: "Correct grammar and spelling.",
    targetScope: "selection",
    contextScope: "selection",
    mutationOperation: "replace-selection",
  },
  {
    actionId: "tone",
    command: "tone",
    label: "Tone",
    icon: HappyIcon,
    description: "Find the right voice for your writing.",
    targetScope: "selection",
    contextScope: "selection",
    mutationOperation: "replace-selection",
  },
  {
    actionId: "custom",
    command: "custom",
    label: "Custom instruction",
    icon: TypeCursorIcon,
    description: "Tell emend what to do.",
    targetScope: null,
    contextScope: null,
    mutationOperation: null,
  },
] as const

type QuickAction = Exclude<(typeof actions)[number], { actionId: "custom" }>
const quickActions: QuickAction[] = actions.filter(
  (action): action is QuickAction => action.actionId !== "custom"
)

const changes = [
  {
    operation: "replace-selection",
    targetScope: "selection",
    label: "Replace Selection",
  },
  {
    operation: "replace-current-block",
    targetScope: "current-block",
    label: "Replace Current block",
  },
  {
    operation: "replace-document",
    targetScope: "document",
    label: "Replace Document",
  },
  {
    operation: "insert-at-cursor",
    targetScope: "selection",
    label: "Insert at cursor",
  },
] as const satisfies readonly {
  readonly operation: EmendMutationOperation
  readonly targetScope: EmendTargetScope
  readonly label: string
}[]

type ComposerActionId = (typeof actions)[number]["actionId"]
type ComposerChange = (typeof changes)[number]

const defaultContextScopes: readonly EmendContextScope[] = [
  "selection",
  "current-block",
  "document",
]
const defaultMutationOperations: readonly EmendMutationOperation[] =
  changes.map(({ operation }) => operation)

export interface AiAssistantPolicy {
  readonly allowedContextScopes?: readonly EmendContextScope[]
  readonly defaultContextScope?: "adaptive" | EmendContextScope
  readonly allowContextOverride?: boolean
  readonly allowedMutationOperations?: readonly EmendMutationOperation[]
  readonly defaultMutationOperation?: "adaptive" | EmendMutationOperation
  readonly allowMutationOverride?: boolean
}

export interface AiAssistantComposerProps {
  readonly editor: UseEditorAiOptions["editor"]
  readonly session: UseEditorAiResult
  readonly policy?: AiAssistantPolicy
  readonly className?: string
  readonly suggestions?: boolean
}

export function AiAssistantComposer({
  editor,
  session,
  policy,
  className,
  suggestions = false,
}: AiAssistantComposerProps) {
  const menuId = useId()
  const rootRef = useRef<HTMLDivElement>(null)
  const inputRef = useRef<HTMLTextAreaElement>(null)
  const [tone, setTone] = useState("warm and conversational")
  const [draft, setDraft] = useState("")
  const [selectedActionId, setSelectedActionId] =
    useState<ComposerActionId | null>(null)
  const [plusOpen, setPlusOpen] = useState(false)
  const [dismissed, setDismissed] = useState(false)
  const [selectionDecorationActive, setSelectionDecorationActive] =
    useState(false)
  const [active, setActive] = useState(0)
  const [chosenContext, setChosenContext] =
    useState<EmendContextScope>("document")
  const [contextTouched, setContextTouched] = useState(false)
  const [chosenChange, setChosenChange] =
    useState<EmendMutationOperation | null>(null)
  const [changeTouched, setChangeTouched] = useState(false)
  const selection = useEditorState({
    editor,
    selector: ({ editor: currentEditor }) => {
      if (!currentEditor) {
        return { collapsed: true, from: 0, hasText: false, to: 0 }
      }
      const { empty, from, to } = currentEditor.state.selection
      return {
        collapsed: empty,
        from,
        hasText:
          !empty && currentEditor.state.doc.textBetween(from, to).length > 0,
        to,
      }
    },
  }) ?? { collapsed: true, from: 0, hasText: false, to: 0 }

  const selectedAction = actions.find(
    (action) => action.actionId === selectedActionId
  )
  const builtInSelected =
    selectedAction !== undefined && selectedAction.actionId !== "custom"
  const token =
    dismissed || selectedActionId !== null ? null : parseSlashToken(draft)
  const menuOpen = plusOpen || token !== null
  const query = plusOpen ? "" : (token?.query ?? "")
  const rows = actions.filter(
    (action) =>
      action.command.includes(query) ||
      action.label.toLowerCase().includes(query)
  )
  const activeOptionId =
    menuOpen && rows[active]
      ? `${menuId}-option-${rows[active].actionId}`
      : undefined
  const isCustom = selectedActionId === "custom"
  const isAsk = selectedActionId === null && draft.trim().length > 0
  const inputValue = builtInSelected ? selectedAction.label : draft
  const allowedContextScopes =
    policy?.allowedContextScopes ?? defaultContextScopes
  const allowedMutationOperations =
    policy?.allowedMutationOperations ?? defaultMutationOperations
  const configuredContext = policy?.defaultContextScope ?? "adaptive"
  const adaptiveContext =
    selection.hasText && selectedActionId !== null
      ? allowedContextScopes.includes("selection")
        ? "selection"
        : allowedContextScopes.includes("document")
          ? "document"
          : (allowedContextScopes[0] ?? null)
      : allowedContextScopes.includes("document")
        ? "document"
        : (allowedContextScopes[0] ?? null)
  const policyContext =
    configuredContext === "adaptive"
      ? adaptiveContext
      : allowedContextScopes.includes(configuredContext)
        ? configuredContext
        : null
  const contextOverride =
    policy?.allowContextOverride !== false &&
    contextTouched &&
    allowedContextScopes.includes(chosenContext)
      ? chosenContext
      : null
  const contextScope = builtInSelected
    ? selectedAction.contextScope
    : (contextOverride ?? policyContext)
  const configuredMutation = policy?.defaultMutationOperation ?? "adaptive"
  const adaptiveMutation =
    selection.hasText && allowedMutationOperations.includes("replace-selection")
      ? "replace-selection"
      : null
  const policyMutation =
    configuredMutation === "adaptive"
      ? adaptiveMutation
      : allowedMutationOperations.includes(configuredMutation)
        ? configuredMutation
        : null
  const mutationOverride =
    policy?.allowMutationOverride !== false &&
    changeTouched &&
    chosenChange !== null &&
    allowedMutationOperations.includes(chosenChange)
      ? chosenChange
      : null
  const mutationOperation = builtInSelected
    ? selectedAction.mutationOperation
    : (mutationOverride ?? policyMutation)
  const change = changes.find(
    (candidate) => candidate.operation === mutationOperation
  )
  const showContextControl =
    (isAsk || isCustom) &&
    policy?.allowContextOverride !== false &&
    allowedContextScopes.length > 1
  const showChangeControl =
    isCustom &&
    policy?.allowMutationOverride !== false &&
    allowedMutationOperations.length > 1
  const builtInAllowed =
    !builtInSelected ||
    (selectedAction !== undefined &&
      selectedAction.contextScope !== null &&
      selectedAction.mutationOperation !== null &&
      allowedContextScopes.includes(selectedAction.contextScope) &&
      allowedMutationOperations.includes(selectedAction.mutationOperation))
  const requestInProgress =
    session.state === "submitting" || session.state === "streaming"
  const instruction = isCustom || isAsk ? draft.trim() : ""
  const instructionTooLong =
    instruction.length > DEFAULT_REQUEST_LIMITS.maxInstructionLength
  const askBlockReason = getAskBlockReason({
    contextScope,
    editorReady: Boolean(editor && !editor.isDestroyed),
    hasSelection: selection.hasText,
    instruction,
    instructionTooLong,
    pendingProposal: session.pendingProposal !== null,
    requestInProgress,
  })
  const editBlockReason = getEditBlockReason({
    change,
    contextScope,
    editorReady: Boolean(editor && !editor.isDestroyed),
    hasSelection: selection.hasText,
    instruction,
    instructionTooLong,
    pendingProposal: session.pendingProposal !== null,
    policyAllowsAction: builtInAllowed,
    requestInProgress,
    selectedActionId,
    selectionCollapsed: selection.collapsed,
  })

  useEffect(() => {
    // eslint-disable-next-line react-hooks/set-state-in-effect
    setActive(0)
  }, [menuOpen, query])

  useLayoutEffect(() => {
    setEmendSelectionDecoration(
      editor,
      selectionDecorationActive && selection.hasText
        ? { from: selection.from, to: selection.to }
        : null
    )
  }, [
    editor,
    selection.from,
    selection.hasText,
    selection.to,
    selectionDecorationActive,
    session.editorState?.activeProposalId,
    session.editorState?.revisionCounter,
  ])

  useEffect(
    () => () => {
      setEmendSelectionDecoration(editor, null)
    },
    [editor]
  )

  useLayoutEffect(() => {
    const input = inputRef.current
    if (!input) return

    const minHeight = 64
    const maxHeight = 82
    input.style.height = "0px"
    const contentHeight = inputValue ? input.scrollHeight : minHeight
    input.style.height = `${Math.min(Math.max(contentHeight, minHeight), maxHeight)}px`
    input.style.overflowY = contentHeight > maxHeight ? "auto" : "hidden"
  }, [inputValue])

  useEffect(() => {
    const close = (event: PointerEvent) => {
      if (isInsideComposer(rootRef.current, event.target)) return
      setSelectionDecorationActive(false)
      if (!menuOpen) return
      setPlusOpen(false)
      setDismissed(true)
    }
    document.addEventListener("pointerdown", close)
    return () => document.removeEventListener("pointerdown", close)
  }, [menuOpen])

  function closeMenu() {
    setPlusOpen(false)
  }

  function clearAction() {
    setSelectedActionId(null)
    setDraft("")
    setDismissed(false)
    requestAnimationFrame(() => inputRef.current?.focus())
  }

  function resetRequest() {
    setDraft("")
    setSelectedActionId(null)
    setChosenContext("document")
    setContextTouched(false)
    setChosenChange(null)
    setChangeTouched(false)
    setDismissed(false)
    closeMenu()
  }

  function pick(action: (typeof actions)[number]) {
    if (action.actionId === "custom") {
      if (token) setDraft(draft.slice(0, token.start).trimEnd())
    } else {
      setDraft("")
    }
    setSelectedActionId(action.actionId)
    setPlusOpen(false)
    setDismissed(false)
    requestAnimationFrame(() => inputRef.current?.focus())
  }

  function runRequest() {
    if (selectedActionId === null) {
      if (askBlockReason || !contextScope) return
      void session.run("custom", {
        interactionMode: "ask",
        targetScope: contextScope,
        contextScope,
        mutationOperation: null,
        instruction,
      })
      resetRequest()
      return
    }

    if (editBlockReason || !selectedAction || !contextScope) return
    const actionChange =
      selectedAction.actionId === "custom" && change
        ? {
            targetScope: change.targetScope,
            mutationOperation: change.operation,
          }
        : selectedAction
    if (!actionChange?.targetScope || !actionChange.mutationOperation) return

    void session.run(
      selectedAction.actionId === "tone" ? "custom" : selectedAction.actionId,
      {
        interactionMode: "edit",
        targetScope: actionChange.targetScope,
        contextScope,
        mutationOperation: actionChange.mutationOperation,
        ...(selectedAction.actionId === "custom"
          ? { instruction }
          : selectedAction.actionId === "tone"
            ? {
                instruction: `Rewrite the selection in a ${tone} tone. Preserve its meaning.`,
              }
            : {}),
      }
    )
    resetRequest()
  }

  return (
    <div
      ref={rootRef}
      data-ai-composer
      onFocusCapture={() => setSelectionDecorationActive(true)}
      onBlurCapture={(event) => {
        if (!isInsideComposer(event.currentTarget, event.relatedTarget)) {
          setSelectionDecorationActive(false)
        }
      }}
      className={cn("w-full space-y-2", className)}
    >
      <div className="relative">
        {menuOpen && (
          <div
            id={menuId}
            role="listbox"
            aria-label="AI writing actions"
            className="relative z-20 mb-2 max-h-[min(240px,30dvh)] max-w-lg overflow-y-auto rounded-xl border border-border bg-popover p-1 text-popover-foreground shadow-md"
          >
            {rows.map((action, index) => {
              const actionAllowed =
                action.actionId === "custom"
                  ? allowedContextScopes.length > 0 &&
                    allowedMutationOperations.length > 0
                  : allowedContextScopes.includes(action.contextScope) &&
                    allowedMutationOperations.includes(action.mutationOperation)

              return (
                <Button
                  key={action.actionId}
                  id={`${menuId}-option-${action.actionId}`}
                  type="button"
                  role="option"
                  aria-selected={index === active}
                  variant="ghost"
                  disabled={!actionAllowed}
                  onMouseDown={(event) => event.preventDefault()}
                  onMouseEnter={() => setActive(index)}
                  onClick={() => pick(action)}
                  className={cn(
                    "relative z-10 min-h-10 w-full justify-start gap-2.5 rounded-lg px-2 text-left font-normal active:translate-y-0",
                    index === active && "bg-accent text-accent-foreground"
                  )}
                >
                  <span className="flex size-5.5 shrink-0 items-center justify-center text-muted-foreground">
                    <HugeiconsIcon icon={action.icon} size={14} />
                  </span>
                  <span className="shrink-0 text-[12.5px] font-medium text-foreground">
                    {action.label}
                  </span>
                  <span className="min-w-0 flex-1 truncate text-[12px] text-muted-foreground">
                    {actionAllowed
                      ? action.description
                      : "Unavailable under the Composer policy."}
                  </span>
                </Button>
              )
            })}
            {rows.length === 0 && (
              <div className="flex h-9 items-center px-2 text-[12px] text-muted-foreground">
                No actions match “{query}”
              </div>
            )}
          </div>
        )}

        <div
          className={cn(
            "relative isolate flex max-w-lg flex-col gap-1.5 overflow-hidden rounded-3xl border border-border/60 bg-card p-1.5 text-card-foreground shadow-md focus-within:border-border",
            "max-w-none shadow-none",
            "rounded-2xl p-2.5"
          )}
        >
          <div className="grid grid-cols-[28px_minmax(0,1fr)_auto_28px] items-end gap-x-1 gap-y-1.5">
            <Button
              type="button"
              variant="ghost"
              size="icon-sm"
              aria-label="Choose an AI action"
              aria-expanded={menuOpen}
              aria-controls={menuId}
              onClick={() => {
                setPlusOpen((current) => !current)
                setDismissed(false)
                inputRef.current?.focus()
              }}
              className={cn(
                "justify-self-start rounded-full text-muted-foreground",
                menuOpen && "bg-accent text-accent-foreground",
                "col-start-1 row-start-2"
              )}
            >
              <HugeiconsIcon icon={Add01Icon} size={16} strokeWidth={2} />
            </Button>

            {builtInSelected ? (
              <div
                className={cn(
                  "min-w-0 overflow-hidden",
                  "col-span-full col-start-1 row-start-1 flex flex-col items-start gap-1 px-1"
                )}
              >
                <Badge
                  variant="secondary"
                  className="h-6 max-w-full gap-1 pr-1 text-[12px]"
                >
                  <span data-icon="inline-start">
                    <HugeiconsIcon icon={selectedAction.icon} size={12} />
                  </span>
                  {selectedAction.label}
                  <Button
                    type="button"
                    variant="ghost"
                    size="icon-xs"
                    aria-label={`Clear ${selectedAction.label} action`}
                    title="Remove action"
                    onClick={clearAction}
                    className="-mr-0.5 size-4 rounded-full"
                  >
                    <HugeiconsIcon icon={Cancel01Icon} size={10} />
                  </Button>
                </Badge>
                <span className="min-w-0 text-[12px] text-muted-foreground">
                  {selectedAction.description}
                </span>
              </div>
            ) : (
              <Textarea
                ref={inputRef}
                rows={1}
                value={inputValue}
                disabled={!editor || requestInProgress}
                onChange={(event) => {
                  setDraft(event.target.value)
                  setDismissed(false)
                  setPlusOpen(false)
                }}
                onKeyDown={(event) => {
                  if (menuOpen && rows.length > 0) {
                    if (event.key === "ArrowDown" || event.key === "ArrowUp") {
                      event.preventDefault()
                      setActive(
                        (current) =>
                          (current +
                            (event.key === "ArrowDown" ? 1 : rows.length - 1)) %
                          rows.length
                      )
                      return
                    }
                    if (
                      (event.key === "Enter" && !event.shiftKey) ||
                      event.key === "Tab"
                    ) {
                      event.preventDefault()
                      pick(rows[active]!)
                      return
                    }
                  }
                  if (event.key === "Escape" && menuOpen) {
                    event.stopPropagation()
                    setDismissed(true)
                    closeMenu()
                    return
                  }
                  if (
                    event.key === "Enter" &&
                    !event.shiftKey &&
                    !event.nativeEvent.isComposing
                  ) {
                    event.preventDefault()
                    runRequest()
                  }
                }}
                placeholder={
                  isCustom
                    ? "Tell emend what to change…"
                    : "Ask emend or choose an action…"
                }
                aria-label="AI instruction"
                role="combobox"
                aria-autocomplete="list"
                aria-controls={menuId}
                aria-expanded={menuOpen}
                aria-activedescendant={activeOptionId}
                className={cn(
                  "min-h-7 min-w-0 resize-none border-0 bg-transparent px-1 py-1.25 text-[13px] leading-4.5 wrap-anywhere shadow-none focus-visible:ring-0 disabled:bg-transparent md:text-[13px] dark:bg-transparent dark:disabled:bg-transparent",
                  "col-span-full col-start-1 row-start-1"
                )}
              />
            )}

            <div
              className={cn(
                "col-start-3 flex min-w-0 flex-wrap items-center justify-end gap-1",
                "row-start-2"
              )}
            >
              {selectedActionId === "tone" && (
                <Select
                  value={tone}
                  onValueChange={(value) => value && setTone(value)}
                >
                  <SelectTrigger
                    aria-label="Writing tone"
                    size="sm"
                    className="max-w-48 border-0 text-xs shadow-none"
                  >
                    <SelectValue />
                  </SelectTrigger>
                  <SelectContent data-ai-composer-portal>
                    <SelectGroup>
                      <SelectItem value="warm and conversational">
                        Friendly
                      </SelectItem>
                      <SelectItem value="professional">Professional</SelectItem>
                      <SelectItem value="confident">Confident</SelectItem>
                      <SelectItem value="straightforward">
                        Straightforward
                      </SelectItem>
                    </SelectGroup>
                  </SelectContent>
                </Select>
              )}
              {showContextControl && (
                <Select
                  value={contextOverride}
                  disabled={!editor || requestInProgress}
                  onValueChange={(value) => {
                    if (!value) return
                    setChosenContext(value as EmendContextScope)
                    setContextTouched(true)
                  }}
                >
                  <SelectTrigger
                    aria-label="AI read context"
                    title={
                      contextScope
                        ? `Read context: ${scopeLabel(contextScope)}`
                        : "Choose AI read context"
                    }
                    size="sm"
                    className={cn(
                      "border-0 bg-transparent text-[11px] shadow-none hover:bg-accent data-[size=sm]:rounded-full dark:bg-transparent dark:hover:bg-accent",
                      contextOverride !== null
                        ? "max-w-32 px-2"
                        : "size-7 justify-center gap-0 p-0 [&>svg:last-child]:hidden"
                    )}
                  >
                    {contextOverride !== null ? (
                      <SelectValue>{scopeLabel(chosenContext)}</SelectValue>
                    ) : (
                      <HugeiconsIcon icon={BookOpenTextIcon} size={14} />
                    )}
                  </SelectTrigger>
                  <SelectContent
                    data-ai-composer-portal
                    align="end"
                    className="min-w-48"
                  >
                    <SelectGroup>
                      {allowedContextScopes.includes("selection") && (
                        <SelectItem
                          value="selection"
                          disabled={!selection.hasText}
                        >
                          <HugeiconsIcon icon={TextSelectionIcon} size={15} />
                          {selection.hasText
                            ? "Selection"
                            : "Selection (select text)"}
                        </SelectItem>
                      )}
                      {allowedContextScopes.includes("current-block") && (
                        <SelectItem value="current-block">
                          <HugeiconsIcon icon={TextAlignLeftIcon} size={15} />
                          Current block
                        </SelectItem>
                      )}
                      {allowedContextScopes.includes("document") && (
                        <SelectItem value="document">
                          <HugeiconsIcon icon={File01Icon} size={15} />
                          Document
                        </SelectItem>
                      )}
                    </SelectGroup>
                  </SelectContent>
                </Select>
              )}

              {showChangeControl && (
                <Select
                  value={mutationOverride}
                  disabled={!editor || requestInProgress}
                  onValueChange={(value) => {
                    if (!value) return
                    setChosenChange(value as EmendMutationOperation)
                    setChangeTouched(true)
                  }}
                >
                  <SelectTrigger
                    aria-label="AI change target"
                    title={
                      change
                        ? `Change target: ${change.label}`
                        : "Choose AI change target"
                    }
                    size="sm"
                    className={cn(
                      "border-0 bg-transparent text-[11px] shadow-none hover:bg-accent data-[size=sm]:rounded-full dark:bg-transparent dark:hover:bg-accent",
                      mutationOverride !== null && change
                        ? "max-w-40 px-2"
                        : "size-7 justify-center gap-0 p-0 [&>svg:last-child]:hidden"
                    )}
                  >
                    {mutationOverride !== null && change ? (
                      <SelectValue>{change.label}</SelectValue>
                    ) : (
                      <HugeiconsIcon icon={Edit02Icon} size={14} />
                    )}
                  </SelectTrigger>
                  <SelectContent
                    data-ai-composer-portal
                    align="end"
                    className="min-w-52"
                  >
                    <SelectGroup>
                      {changes
                        .filter((candidate) =>
                          allowedMutationOperations.includes(
                            candidate.operation
                          )
                        )
                        .map((candidate) => (
                          <SelectItem
                            key={candidate.operation}
                            value={candidate.operation}
                            disabled={
                              (candidate.operation === "replace-selection" &&
                                !selection.hasText) ||
                              (candidate.operation === "insert-at-cursor" &&
                                !selection.collapsed)
                            }
                          >
                            <ChangeTargetIcon operation={candidate.operation} />
                            {candidate.label}
                          </SelectItem>
                        ))}
                    </SelectGroup>
                  </SelectContent>
                </Select>
              )}
            </div>

            <Button
              type="button"
              size="icon-sm"
              aria-label={
                requestInProgress
                  ? "Stop"
                  : builtInSelected
                    ? `Create ${selectedAction.label} proposal`
                    : isCustom
                      ? "Create custom proposal"
                      : "Send Ask request"
              }
              title={
                requestInProgress
                  ? "Stop response"
                  : selectedActionId === null
                    ? (askBlockReason ?? "Ask without changing the document")
                    : (editBlockReason ?? "Create proposal")
              }
              disabled={
                !requestInProgress &&
                (selectedActionId === null
                  ? askBlockReason !== null
                  : editBlockReason !== null)
              }
              onClick={requestInProgress ? session.stop : runRequest}
              className="col-start-4 row-start-2 rounded-full"
            >
              <HugeiconsIcon
                icon={requestInProgress ? StopIcon : ArrowUp01Icon}
                size={16}
                strokeWidth={2.4}
              />
            </Button>
          </div>
        </div>
      </div>

      {suggestions && !menuOpen && !selectedActionId && !draft && (
        <div className="flex flex-col items-start gap-1.5 pt-3">
          {[quickActions.slice(0, 3), quickActions.slice(3)].map(
            (row, rowIndex) => (
              <div key={rowIndex} className="flex flex-wrap gap-1.5">
                {row.map((action) => {
                  const actionAllowed =
                    selection.hasText &&
                    allowedContextScopes.includes(action.contextScope) &&
                    allowedMutationOperations.includes(action.mutationOperation)

                  return (
                    <Button
                      key={action.actionId}
                      type="button"
                      size="sm"
                      variant="outline"
                      disabled={!actionAllowed}
                      title={
                        actionAllowed
                          ? action.description
                          : !selection.hasText
                            ? "Select text in the draft to use this action."
                            : "Unavailable under the current assistant policy."
                      }
                      onClick={() => pick(action)}
                      className="rounded-full font-normal"
                    >
                      <HugeiconsIcon icon={action.icon} size={14} />
                      {action.label}
                    </Button>
                  )
                })}
              </div>
            )
          )}
          {!selection.hasText && (
            <p className="px-1 text-xs text-muted-foreground">
              Select text in your draft to use a writing action.
            </p>
          )}
        </div>
      )}
      {session.pendingProposal === null && (
        <ComposerHelp
          contextScope={contextScope}
          blockReason={
            selectedActionId === null ? askBlockReason : editBlockReason
          }
          hasRequest={isAsk || selectedActionId !== null}
          instructionLength={instruction.length}
          isCustom={isCustom}
        />
      )}
    </div>
  )
}

function parseSlashToken(
  draft: string
): { readonly query: string; readonly start: number } | null {
  const match = /(^|\s)\/([\w-]*)$/.exec(draft)
  if (!match) return null
  return {
    query: match[2]!.toLowerCase(),
    start: match.index + match[1]!.length,
  }
}

function isInsideComposer(
  root: HTMLElement | null,
  target: EventTarget | null
) {
  if (!(target instanceof Node)) return false
  if (root?.contains(target)) return true
  return (
    target instanceof Element &&
    target.closest("[data-ai-composer-portal]") !== null
  )
}

function getAskBlockReason(input: {
  readonly contextScope: EmendContextScope | null
  readonly editorReady: boolean
  readonly hasSelection: boolean
  readonly instruction: string
  readonly instructionTooLong: boolean
  readonly pendingProposal: boolean
  readonly requestInProgress: boolean
}): string | null {
  if (!input.editorReady) return "The editor is still mounting."
  if (input.requestInProgress) return "Wait for the current request to finish."
  if (input.pendingProposal) return "Review the current proposal first."
  if (!input.instruction) return "Enter a prompt."
  if (input.instructionTooLong) return "The instruction is too long."
  if (!input.contextScope) return "Choose what emend may read."
  if (input.contextScope === "selection" && !input.hasSelection) {
    return "Select text before using Selection context."
  }
  return null
}

function getEditBlockReason(input: {
  readonly change: ComposerChange | undefined
  readonly contextScope: EmendContextScope | null
  readonly editorReady: boolean
  readonly hasSelection: boolean
  readonly instruction: string
  readonly instructionTooLong: boolean
  readonly pendingProposal: boolean
  readonly policyAllowsAction: boolean
  readonly requestInProgress: boolean
  readonly selectedActionId: ComposerActionId | null
  readonly selectionCollapsed: boolean
}): string | null {
  if (!input.editorReady) return "The editor is still mounting."
  if (input.requestInProgress) return "Wait for the current request to finish."
  if (input.pendingProposal) return "Review the current proposal first."
  if (!input.selectedActionId) return "Choose an action."
  if (!input.policyAllowsAction) {
    return "This action is unavailable under the Composer policy."
  }
  if (!input.contextScope) return "Choose what emend may read."
  if (input.contextScope === "selection" && !input.hasSelection) {
    return "Select text before using Selection context."
  }
  if (input.selectedActionId === "custom") {
    if (!input.instruction) return "Enter a custom instruction."
    if (input.instructionTooLong) return "The instruction is too long."
  }
  if (!input.change) return "Choose how emend should change the document."
  if (input.change.operation === "replace-selection" && !input.hasSelection) {
    return "Select text before replacing the Selection."
  }
  if (
    input.change.operation === "insert-at-cursor" &&
    !input.selectionCollapsed
  ) {
    return "Collapse the selection before inserting at the cursor."
  }
  return null
}

function ComposerHelp({
  contextScope,
  blockReason,
  hasRequest,
  instructionLength,
  isCustom,
}: {
  readonly contextScope: EmendContextScope | null
  readonly blockReason: string | null
  readonly hasRequest: boolean
  readonly instructionLength: number
  readonly isCustom: boolean
}) {
  if (!hasRequest) return null

  if (
    isCustom &&
    instructionLength > DEFAULT_REQUEST_LIMITS.maxInstructionLength
  ) {
    return (
      <p className="px-2 text-xs text-destructive" role="alert">
        Keep the instruction within{" "}
        {DEFAULT_REQUEST_LIMITS.maxInstructionLength} characters.
      </p>
    )
  }
  if (blockReason) {
    return <p className="px-2 text-xs text-muted-foreground">{blockReason}</p>
  }
  if (contextScope === "document") {
    return (
      <p className="px-2 text-xs text-muted-foreground">
        Uses your document as context.
      </p>
    )
  }
  return null
}

function scopeLabel(scope: EmendContextScope): string {
  if (scope === "current-block") return "Current block"
  return scope === "selection" ? "Selection" : "Document"
}

function ChangeTargetIcon({
  operation,
}: {
  readonly operation: EmendMutationOperation
}) {
  const icon =
    operation === "replace-selection"
      ? TextSelectionIcon
      : operation === "replace-current-block"
        ? TextAlignLeftIcon
        : operation === "replace-document"
          ? FileEditIcon
          : CursorTextIcon

  return <HugeiconsIcon icon={icon} size={15} />
}
5a:Tc29,"use client"

import { useCallback, useEffect, useState } from "react"
import type { AssistantMessage } from "./ai-assistant"

export interface AssistantThread {
  readonly id: string
  readonly updatedAt: number
  readonly messages: AssistantMessage[]
}

const maxStorageLength = 1_000_000

function isThread(value: unknown): value is AssistantThread {
  if (!value || typeof value !== "object") return false
  const thread = value as AssistantThread
  return (
    typeof thread.id === "string" &&
    Number.isFinite(thread.updatedAt) &&
    Array.isArray(thread.messages) &&
    thread.messages.every(
      (message) =>
        message &&
        typeof message.id === "string" &&
        typeof message.requestId === "string" &&
        (message.role === "user" || message.role === "assistant") &&
        typeof message.content === "string"
    )
  )
}

export function useAssistantHistory(storageKey: string) {
  const [threads, setThreads] = useState<AssistantThread[]>([])
  const [loadedKey, setLoadedKey] = useState<string | null>(null)
  const [storageNotice, setStorageNotice] = useState<string | null>(null)

  useEffect(() => {
    try {
      const stored = localStorage.getItem(storageKey)
      const parsed: unknown = stored ? JSON.parse(stored) : []
      if (!Array.isArray(parsed) || !parsed.every(isThread))
        throw new Error("Invalid history")
      // eslint-disable-next-line react-hooks/set-state-in-effect
      setThreads(parsed.slice(0, 20))
    } catch {
      setThreads([])
      setStorageNotice(
        "Saved history is unavailable. You can still chat in this session."
      )
    }
    setLoadedKey(storageKey)
  }, [storageKey])

  useEffect(() => {
    if (loadedKey !== storageKey) return
    try {
      const serialized = JSON.stringify(threads)
      if (serialized.length > maxStorageLength)
        throw new Error("History is full")
      localStorage.setItem(storageKey, serialized)
    } catch {
      // eslint-disable-next-line react-hooks/set-state-in-effect
      setStorageNotice(
        "This chat could not be saved. Browser storage may be full or unavailable."
      )
    }
  }, [threads, loadedKey, storageKey])

  const saveThread = useCallback(
    (thread: Pick<AssistantThread, "id" | "messages">) => {
      if (thread.messages.length === 0) return
      setThreads((current) => {
        const existing = current.find((item) => item.id === thread.id)
        if (
          existing &&
          JSON.stringify(existing.messages) === JSON.stringify(thread.messages)
        )
          return current
        const next = [
          { ...thread, updatedAt: Date.now() },
          ...current.filter((item) => item.id !== thread.id),
        ].slice(0, 20)
        while (
          next.length > 1 &&
          JSON.stringify(next).length > maxStorageLength
        )
          next.pop()
        return next
      })
    },
    []
  )

  const deleteThread = useCallback((id: string) => {
    setThreads((current) => current.filter((thread) => thread.id !== id))
  }, [])

  return { threads, saveThread, deleteThread, storageNotice }
}
5b:T351b,/*
 * Copyright (c) 2023 shadcn.
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 */

/*
 * shadcn/typeset
 * https://ui.shadcn.com/docs/typeset.
 */

@layer components {
  .typeset {
    --typeset-font-body: inherit;
    --typeset-font-heading: var(--font-heading);
    --typeset-font-mono: var(--font-mono);
    --typeset-size: 1em;
    --typeset-leading: 1.75;
    --typeset-flow: 1.25em;
  }
}

@layer components {
  .typeset {
    font-family: var(--typeset-font-body);
    font-size: calc(var(--typeset-size) * 1.125);
    line-height: var(--typeset-leading);
    color: var(--color-foreground, currentColor);
    overflow-wrap: break-word;
    margin-trim: block-start;

    @media (min-width: 48rem), print {
      font-size: var(--typeset-size);
    }

    --typeset-muted: var(
      --color-muted-foreground,
      color-mix(in oklab, currentColor 60%, transparent)
    );
    --typeset-rule: var(
      --color-border,
      color-mix(in oklab, currentColor 20%, transparent)
    );
  }

  .typeset
    *:not(
      :where(
        .not-typeset,
        [data-not-typeset],
        .not-typeset *,
        [data-not-typeset] *
      )
    ) {
    /* Paragraphs. */
    &:where(p) {
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
    }

    /* Headings. */
    &:where(h1, h2, h3, h4, h5, h6) {
      color: var(--color-foreground, currentColor);
      font-family: var(--typeset-font-heading);
      font-weight: 600;
      margin-block-end: 0;
    }
    &:where(h1) {
      font-size: 1.75em;
      line-height: 1.3;
      margin-block-start: var(--typeset-flow);
    }
    &:where(h2) {
      font-size: 1.25em;
      line-height: 1.4;
      margin-block-start: calc(var(--typeset-flow) * 1.4);
    }
    &:where(h3) {
      font-size: 1.125em;
      line-height: 1.45;
      margin-block-start: var(--typeset-flow);
    }
    &:where(h4) {
      font-size: 1em;
      line-height: 1.5;
      margin-block-start: var(--typeset-flow);
    }
    &:where(h5) {
      font-size: 0.875em;
      line-height: 1.5;
      font-weight: 500;
      color: var(--typeset-muted);
      margin-block-start: calc(var(--typeset-flow) / 0.875);
    }
    &:where(h6) {
      font-size: 0.8125em;
      line-height: 1.5;
      font-weight: 500;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--typeset-muted);
      margin-block-start: calc(var(--typeset-flow) / 0.8125);
    }
    /* Anchors. */
    &:where([id]) {
      scroll-margin-block-start: var(--typeset-flow);
    }

    /* Headings own the space below them. */
    &:where(h1 + *, h2 + *, h3 + *, h4 + *, h5 + *, h6 + *) {
      margin-block-start: 1em;
    }
    &:where(:is(h1, h2, h3, h4) :is(code)) {
      font-size: 0.9em;
    }

    /* Links. */
    &:where(a) {
      color: inherit;
      font-weight: 500;
      text-decoration-line: underline;
      text-decoration-color: color-mix(in oklab, currentColor 30%, transparent);
    }
    &:where(a:hover) {
      text-decoration-color: currentColor;
    }
    &:where(a:focus-visible) {
      outline: 2px solid var(--color-ring, currentColor);
      outline-offset: 2px;
      border-radius: 0.125em;
    }
    &:where(:is(h1, h2, h3, h4, h5, h6) :is(a)) {
      font-weight: inherit;
    }

    /* Inline semantics. */
    &:where(strong, b) {
      font-weight: 600;
    }
    &:where(:is(h1, h2, h3, h4) :is(strong, b)) {
      font-weight: 600;
    }
    &:where(mark) {
      background-color: color-mix(
        in oklab,
        oklch(0.86 0.17 95) 40%,
        transparent
      );
      color: inherit;
      padding: 0.05em 0.15em;
      border-radius: 0.2em;
    }
    &:where(abbr[title]) {
      text-decoration-line: underline;
      text-decoration-style: dotted;
      text-underline-offset: 0.2em;
      cursor: help;
    }
    &:where(del, s) {
      color: var(--typeset-muted);
      text-decoration-line: line-through;
    }
    &:where(sup, sub) {
      font-size: 0.75em;
      line-height: 0;
      position: relative;
      vertical-align: baseline;
    }
    &:where(sup) {
      top: -0.5em;
    }
    &:where(sub) {
      bottom: -0.25em;
    }
    &:where(sup a) {
      text-decoration-line: none;
      font-weight: 500;
    }

    /* Lists. */
    &:where(ul) {
      list-style-type: disc;
    }
    &:where(ol) {
      list-style-type: decimal;
    }
    &:where(ul ul) {
      list-style-type: circle;
    }
    &:where(ul ul ul) {
      list-style-type: square;
    }
    &:where(ol[type="a" i]) {
      list-style-type: lower-alpha;
    }
    &:where(ol[type="i" i]) {
      list-style-type: lower-roman;
    }
    &:where(ol[type="A" s]) {
      list-style-type: upper-alpha;
    }
    &:where(ol[type="I" s]) {
      list-style-type: upper-roman;
    }
    &:where(ul, ol) {
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
      padding-inline-start: 1.5em;
    }
    &:where(li) {
      margin-block-start: 0.5em;
      padding-inline-start: 0.4em;
    }
    &:where(li > p, li > ul, li > ol) {
      margin-block-start: 0.5em;
    }
    &:where(ul > li)::marker {
      color: var(--typeset-muted);
    }
    &:where(ol > li)::marker {
      color: var(--typeset-muted);
    }

    /* GFM task lists. */
    &:where(ul.contains-task-list) {
      list-style-type: none;
      padding-inline-start: 0.25em;
    }
    &:where(li.task-list-item > input[type="checkbox"]) {
      margin-inline-end: 0.5em;
      vertical-align: -0.1em;
      accent-color: var(--color-primary, currentColor);
    }

    /* Disclosures. */
    &:where(details) {
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
    }
    &:where(summary) {
      cursor: pointer;
      font-weight: 500;
    }
    &:where(summary)::marker {
      color: var(--typeset-muted);
    }

    /* Keyboard keys. */
    &:where(kbd) {
      font-family: inherit;
      font-size: 0.85em;
      font-weight: 500;
      border: 1px solid var(--typeset-rule);
      border-block-end-width: 2px;
      border-radius: min(calc(var(--radius, 0.5em) * 0.6), 0.35em);
      padding: 0.0625em 0.35em;
    }

    /* Definition lists. */
    &:where(dl) {
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
    }
    &:where(dt) {
      font-weight: 500;
      margin-block-start: 1em;
    }
    &:where(dt + dt) {
      margin-block-start: 0.25em;
    }
    &:where(dd) {
      margin-block-start: 0.25em;
      margin-inline-start: 0;
      padding-inline-start: 1em;
      color: var(--typeset-muted);
    }

    /* Inline code. */
    &:where(:not(pre) > code) {
      background-color: var(
        --color-muted,
        color-mix(in oklab, currentColor 8%, transparent)
      );
      font-family: var(--typeset-font-mono);
      font-size: 0.85em;
      border-radius: min(calc(var(--radius, 0.5em) * 0.6), 0.35em);
      padding: 0.125em 0.3em;
    }

    /* Code blocks. */
    &:where(pre) {
      background-color: var(
        --color-muted,
        color-mix(in oklab, currentColor 8%, transparent)
      );
      font-family: var(--typeset-font-mono);
      font-size: 0.875em;
      line-height: 1.5;
      tab-size: 2;
      direction: ltr;
      border-radius: var(--radius, 0.5em);
      padding: 0.75em 1em;
      overflow-x: auto;
      margin-block-start: calc(var(--typeset-flow) / 0.875);
      margin-block-end: 0;
    }
    &:where(pre code) {
      background-color: transparent;
      font-family: inherit;
      font-size: inherit;
      padding: 0;
      border-radius: 0;
    }

    /* Blockquote. */
    &:where(blockquote) {
      border-inline-start: 2px solid var(--typeset-rule);
      padding-inline-start: 1em;
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
      margin-inline: 0;
    }

    /* Dividers. */
    &:where(hr) {
      border: 0;
      border-block-start: 1px solid var(--typeset-rule);
      margin-block-start: calc(var(--typeset-flow) * 2.4);
      margin-block-end: 0;
    }
    &:where(hr + h1, hr + h2, hr + h3, hr + h4) {
      margin-block-start: var(--typeset-flow);
    }

    /* GFM footnotes. */
    &:where(.footnotes, [data-footnotes]) {
      margin-block-start: calc(var(--typeset-flow) * 2);
      border-block-start: 1px solid var(--typeset-rule);
      padding-block-start: var(--typeset-flow);
      font-size: 0.875em;
      color: var(--typeset-muted);
    }

    /* Math. */
    &:where(math[display="block"]) {
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
      overflow-x: auto;
      overflow-y: hidden;
      padding-block: 0.25em;
    }

    /* Media. */
    &:where(img, video) {
      border-radius: var(--radius, 0.5em);
      max-width: 100%;
      height: auto;
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
    }
    &:where(p img) {
      margin-block-start: 0;
    }
    &:where(figure) {
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
      margin-inline: 0;
    }
    &:where(figcaption, caption) {
      color: var(--typeset-muted);
      font-size: 0.875em;
      text-align: center;
      margin-block-start: calc(0.75em / 0.875);
    }
    &:where(caption) {
      caption-side: bottom;
    }

    /* Tables. Separators sit on cells, not tr:last-child: append-safe.
       Bare tables stay real tables (keep their semantics) and wrap to fit. */
    &:where(table) {
      max-width: 100%;
      font-size: 1em;
      line-height: 1.5;
      font-variant-numeric: tabular-nums;
      border-collapse: separate;
      border-spacing: 0;
      border-block-end: 1px solid var(--typeset-rule);
      margin-block-start: var(--typeset-flow);
      margin-block-end: 0;
    }

    /* Horizontal scroll for any wide block. Wrap it and the wrapper owns the
       flow margin. Tables shrink to fit, so widen the table to make it scroll
       instead of compress. */
    &:where(.typeset-scroll) {
      overflow-x: auto;
      margin-block-start: var(--typeset-flow);
    }
    &:where(.typeset-scroll > *) {
      margin-block-start: 0;
    }
    &:where(.typeset-scroll table) {
      width: max-content;
      max-width: none;
    }
    &:where(thead th) {
      font-weight: 500;
      text-align: start;
      white-space: nowrap;
      padding: 0.65em 1em;
    }
    &:where(:is(tbody, tfoot) :is(td, th)) {
      padding: 0.75em 1em;
      text-align: start;
      vertical-align: top;
      border-block-start: 1px solid var(--typeset-rule);
    }
    &:where(tbody th, tfoot th) {
      font-weight: 500;
    }
    &:where(th:first-child, td:first-child) {
      padding-inline-start: 0;
    }
    &:where(th[align="center"], td[align="center"]) {
      text-align: center;
    }
    &:where(th[align="right"], td[align="right"]) {
      text-align: end;
    }

    /* Blocks inside list items keep the list's tighter rhythm. */
    &:where(li > blockquote, li > table, li > figure) {
      margin-block-start: 0.5em;
    }
    &:where(li > pre) {
      margin-block-start: calc(0.5em / 0.875);
    }

    @media print {
      &:where(pre, table, blockquote, figure) {
        break-inside: avoid;
      }
      &:where(h1, h2, h3, h4) {
        break-after: avoid;
      }
    }

    /* Forced colors strips the code background, so give it a border. */
    @media (forced-colors: active) {
      &:where(:not(pre) > code) {
        border: 1px solid;
      }
    }
  }

  /* First child adds no space above. Last so it wins ties. */
  .typeset
    > :where(:first-child):not(
      :where(
        .not-typeset,
        [data-not-typeset],
        .not-typeset *,
        [data-not-typeset] *
      )
    ),
  .typeset
    > :where(:first-child)
    > :where(:first-child):not(
      :where(
        .not-typeset,
        [data-not-typeset],
        .not-typeset *,
        [data-not-typeset] *
      )
    ),
  .typeset
    :where(
      li > :first-child,
      blockquote > :first-child,
      td > :first-child,
      th > :first-child,
      dd > :first-child,
      figure > :first-child,
      figure > picture > img
    ):not(
      :where(
        .not-typeset,
        [data-not-typeset],
        .not-typeset *,
        [data-not-typeset] *
      )
    ) {
    margin-block-start: 0;
  }
}

/* Chat preset: follows the panel's text size and keeps headings compact. */
@layer components {
  .typeset-chat {
    --typeset-size: 1em;
    --typeset-leading: 1.6;
    --typeset-flow: 0.75em;
    font-size: var(--typeset-size);
  }

  .typeset-chat :where(h1, h2) {
    font-size: 1.125em;
    line-height: 1.45;
  }
}
5c:T4ff,/*
 * Copyright (c) 2023 shadcn.
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 */

import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}
54:["$","$L56",null,{"files":[{"path":"registry/components/ai-assistant/ai-assistant.tsx","content":"$57","type":"registry:component","target":"components/emend/ai-assistant/ai-assistant.tsx"},{"path":"registry/components/ai-assistant/ai-assistant-message.tsx","content":"$58","type":"registry:component","target":"components/emend/ai-assistant/ai-assistant-message.tsx"},{"path":"registry/components/ai-assistant/index.ts","content":"export {\n  AiAssistant,\n  AiAssistantView,\n  type AiAssistantProps,\n  type AiAssistantViewProps,\n} from \"./ai-assistant\"\nexport type { AiAssistantPolicy } from \"./ai-assistant-composer\"\n","type":"registry:component","target":"components/emend/ai-assistant/index.ts"},{"path":"registry/components/ai-assistant/ai-assistant-composer.tsx","content":"$59","type":"registry:component","target":"components/emend/ai-assistant/ai-assistant-composer.tsx"},{"path":"registry/components/ai-assistant/use-assistant-history.ts","content":"$5a","type":"registry:component","target":"components/emend/ai-assistant/use-assistant-history.ts"},{"path":"registry/components/_shared/ai-markdown.tsx","content":"\"use client\"\n\nimport { cn } from \"@/lib/utils\"\nimport ReactMarkdown, { type Components } from \"react-markdown\"\nimport remarkGfm from \"remark-gfm\"\nimport \"./typeset.css\"\n\nconst components: Components = {\n  a: ({ href, children }) => (\n    <a href={href} target=\"_blank\" rel=\"noopener noreferrer\">\n      {children}\n    </a>\n  ),\n  table: ({ children }) => (\n    <div className=\"typeset-scroll\">\n      <table>{children}</table>\n    </div>\n  ),\n}\n\nexport function AiMarkdown({\n  children,\n  className,\n}: {\n  readonly children: string\n  readonly className?: string\n}) {\n  return (\n    <div className={cn(\"typeset typeset-chat\", className)}>\n      <ReactMarkdown remarkPlugins={[remarkGfm]} components={components}>\n        {children}\n      </ReactMarkdown>\n    </div>\n  )\n}\n","type":"registry:component","target":"components/emend/_shared/ai-markdown.tsx"},{"path":"registry/components/_shared/typeset.css","content":"$5b","type":"registry:file","target":"components/emend/_shared/typeset.css"},{"path":"packages/ui/src/lib/utils.ts","content":"$5c","type":"registry:lib","target":"lib/utils.ts"}],"className":"h-[70svh] min-h-80"}]
</article></body></html>