diff --git a/src/components/Libraries/DocumentList/DocumentItem.tsx b/src/components/Libraries/DocumentList/DocumentItem.tsx
index 3217cd8e2..122a69dd2 100644
--- a/src/components/Libraries/DocumentList/DocumentItem.tsx
+++ b/src/components/Libraries/DocumentList/DocumentItem.tsx
@@ -1,4 +1,14 @@
-import { Checkbox, CheckboxProps, Flex, IconButton, Stack, Text, Tooltip, useDisclosure } from '@chakra-ui/react';
+import {
+  Checkbox,
+  CheckboxProps,
+  Flex,
+  HStack,
+  IconButton,
+  Stack,
+  Text,
+  Tooltip,
+  useDisclosure,
+} from '@chakra-ui/react';
 import { AuthorList } from '@/components/AllAuthorsModal';
 import { ItemResourceDropdowns } from '@/components/ResultList/Item';
 import { APP_DEFAULTS } from '@/config';
@@ -16,6 +26,7 @@ import { getFormattedNumericPubdate, unwrapStringValue } from '@/utils/common/fo
 import { noop } from '@/utils/common/noop';
 import { IDocsEntity } from '@/api/search/types';
 import { LibraryIdentifier } from '@/api/biblib/types';
+import { ChevronDownIcon } from '@chakra-ui/icons';
 
 export interface IItemProps {
   doc: IDocsEntity;
@@ -60,7 +71,7 @@ export const DocumentItem = (props: IItemProps): ReactElement => {
     pub?.length > APP_DEFAULTS.RESULT_ITEM_PUB_CUTOFF ? pub.slice(0, APP_DEFAULTS.RESULT_ITEM_PUB_CUTOFF) + '...' : pub;
 
   // annotation / abstract
-  const { isOpen, onClose, onOpen } = useDisclosure();
+  const { isOpen, onClose, onOpen, onToggle } = useDisclosure();
 
   // citations
   const cite = useNormCite ? (
@@ -108,13 +119,23 @@ export const DocumentItem = (props: IItemProps): ReactElement => {
             <Text as={MathJax} dangerouslySetInnerHTML={{ __html: unwrapStringValue(title) }} />
           </SimpleLink>
           <Flex alignItems="start" ml={1}>
-            <Tooltip label="Show annotation">
+            <Tooltip label={isOpen ? 'Hide annotation' : 'Show annotation'}>
               <IconButton
-                aria-label="Show annotation"
-                icon={<PencilSquareIcon width="18px" height="18px" />}
+                aria-label={isOpen ? 'Hide annotation' : 'Show annotation'}
+                aria-expanded={isOpen}
+                icon={
+                  <HStack spacing="1px" align="center">
+                    <PencilSquareIcon width="18px" height="18px" />
+                    <ChevronDownIcon
+                      boxSize="14px"
+                      transform={isOpen ? 'rotate(180deg)' : 'rotate(0deg)'}
+                      transition="transform 0.2s ease"
+                    />
+                  </HStack>
+                }
                 variant="link"
                 size="xs"
-                onClick={onOpen}
+                onClick={onToggle}
               />
             </Tooltip>
             {!isClient || hideResources ? null : <ItemResourceDropdowns doc={doc} defaultCitation={defaultCitation} />}