1  import React from 'react'
 2  import { Box, Text } from 'ink'
 3  import { getTheme } from '../../utils/theme.js'
 4  import { applyMarkdown } from '../../utils/markdown.js'
 5  import {
 6    ThinkingBlock,
 7    ThinkingBlockParam,
 8  } from '@anthropic-ai/sdk/resources/index.mjs'
 9  
10  type Props = {
11    param: ThinkingBlock | ThinkingBlockParam
12    addMargin: boolean
13  }
14  
15  export function AssistantThinkingMessage({
16    param: { thinking },
17    addMargin = false,
18  }: Props): React.ReactNode {
19    if (!thinking) {
20      return null
21    }
22  
23    return (
24      <Box
25        flexDirection="column"
26        gap={1}
27        marginTop={addMargin ? 1 : 0}
28        width="100%"
29      >
30        <Text color={getTheme().secondaryText} italic>
31          ✻ Thinking…
32        </Text>
33        <Box paddingLeft={2}>
34          <Text color={getTheme().secondaryText} italic>
35            {applyMarkdown(thinking)}
36          </Text>
37        </Box>
38      </Box>
39    )
40  }