chore: Rename tooltip.tooltip prop to tooltip.content

app/components/Avatar/AvatarWithPresence.tsx

@@ -34,7 +34,7 @@ function AvatarWithPresence({
   return (
     <>
       <Tooltip
-        tooltip={
+        content={
           <Centered>
             <strong>{user.name}</strong> {isCurrentUser && `(${t("You")})`}
             {status && (

app/components/ConnectionStatus.tsx

@@ -42,7 +42,7 @@ function ConnectionStatus() {
   return ui.multiplayerStatus === "connecting" ||
     ui.multiplayerStatus === "disconnected" ? (
     <Tooltip
-      tooltip={
+      content={
         message ? (
           <Centered>
             <strong>{message.title}</strong>

app/components/DocumentCard.tsx

@@ -145,7 +145,7 @@ function DocumentCard(props: Props) {
           {canUpdatePin && (
             <Actions dir={document.dir} gap={4}>
               {!isDragging && pin && (
-                <Tooltip tooltip={t("Unpin")}>
+                <Tooltip content={t("Unpin")}>
                   <PinButton onClick={handleUnpin} aria-label={t("Unpin")}>
                     <CloseIcon />
                   </PinButton>

app/components/DocumentListItem.tsx

@@ -107,7 +107,7 @@ function DocumentListItem(
           )}
           {document.isDraft && showDraft && (
             <Tooltip
-              tooltip={t("Only visible to you")}
+              content={t("Only visible to you")}
               delay={500}
               placement="top"
             >

app/components/LocaleTime.tsx

@@ -79,7 +79,7 @@ const LocaleTime: React.FC<Props> = ({
         });
 
   return (
-    <Tooltip tooltip={tooltipContent} delay={tooltipDelay} placement="bottom">
+    <Tooltip content={tooltipContent} delay={tooltipDelay} placement="bottom">
       <time dateTime={dateTime}>{children || content}</time>
     </Tooltip>
   );

app/components/Notifications/Notifications.tsx

@@ -58,13 +58,13 @@ function Notifications(
           </Text>
           <Text color="textSecondary" as={Flex} gap={8}>
             {notifications.approximateUnreadCount > 0 && (
-              <Tooltip delay={500} tooltip={t("Mark all as read")}>
+              <Tooltip delay={500} content={t("Mark all as read")}>
                 <Button action={markNotificationsAsRead} context={context}>
                   <MarkAsReadIcon />
                 </Button>
               </Tooltip>
             )}
-            <Tooltip delay={500} tooltip={t("Settings")}>
+            <Tooltip delay={500} content={t("Settings")}>
               <Button action={navigateToNotificationSettings} context={context}>
                 <SettingsIcon />
               </Button>

app/components/Sharing/OtherAccess.tsx

@@ -83,7 +83,7 @@ export const OtherAccess = observer(({ document, children }: Props) => {
             image={<Avatar model={document.createdBy} showBorder={false} />}
             title={document.createdBy.name}
             actions={
-              <AccessTooltip tooltip={t("Created the document")}>
+              <AccessTooltip content={t("Created the document")}>
                 {t("Can edit")}
               </AccessTooltip>
             }
@@ -103,7 +103,7 @@ export const OtherAccess = observer(({ document, children }: Props) => {
             subtitle={t("Other workspace members may have access")}
             actions={
               <AccessTooltip
-                tooltip={t(
+                content={t(
                   "This document may be shared with more workspace members through a parent document or collection you do not have access to"
                 )}
               />
@@ -117,10 +117,10 @@ export const OtherAccess = observer(({ document, children }: Props) => {
 
 const AccessTooltip = ({
   children,
-  tooltip,
+  content,
 }: {
   children?: React.ReactNode;
-  tooltip?: string;
+  content?: string;
 }) => {
   const { t } = useTranslation();
 
@@ -129,7 +129,7 @@ const AccessTooltip = ({
       <Text type="secondary" size="small">
         {children}
       </Text>
-      <Tooltip tooltip={tooltip ?? t("Access inherited from collection")}>
+      <Tooltip content={content ?? t("Access inherited from collection")}>
         <QuestionMarkIcon size={18} />
       </Tooltip>
     </Flex>

app/components/Sharing/PublicAccess.tsx

@@ -111,7 +111,7 @@ function PublicAccess({ document, share, sharedParent }: Props) {
     : share?.url ?? "";
 
   const copyButton = (
-    <Tooltip tooltip={t("Copy public link")} delay={500} placement="top">
+    <Tooltip content={t("Copy public link")} delay={500} placement="top">
       <CopyToClipboard text={shareUrl} onCopy={handleCopied}>
         <NudeButton type="button" disabled={!share} style={{ marginRight: 3 }}>
           <CopyIcon color={theme.placeholder} size={18} />

app/components/Sharing/SharePopover.tsx

@@ -228,7 +228,7 @@ function SharePopover({
     ) : null
   ) : (
     <Tooltip
-      tooltip={t("Copy link")}
+      content={t("Copy link")}
       delay={500}
       placement="top"
       key="copy-link"

app/components/Sidebar/App.tsx

@@ -76,7 +76,7 @@ function AppSidebar() {
                 }
               >
                 <Tooltip
-                  tooltip={t("Toggle sidebar")}
+                  content={t("Toggle sidebar")}
                   shortcut={`${metaDisplay}+.`}
                   delay={500}
                 >

app/components/Sidebar/Settings.tsx

@@ -43,7 +43,7 @@ function SettingsSidebar() {
         onClick={returnToApp}
       >
         <Tooltip
-          tooltip={t("Toggle sidebar")}
+          content={t("Toggle sidebar")}
           shortcut={`${metaDisplay}+.`}
           delay={500}
         >

app/components/Sidebar/components/CollectionLink.tsx

@@ -162,7 +162,7 @@ const CollectionLink: React.FC<Props> = ({
               !isDraggingAnyCollection && (
                 <Fade>
                   <NudeButton
-                    tooltip={{ tooltip: t("New doc"), delay: 500 }}
+                    tooltip={{ content: t("New doc"), delay: 500 }}
                     action={createDocument}
                     context={context}
                     hideOnActionDisabled

app/components/Sidebar/components/DocumentLink.tsx

@@ -354,7 +354,7 @@ function InnerDocumentLink(
                   !isDraggingAnyDocument ? (
                     <Fade>
                       {can.createChildDocument && (
-                        <Tooltip tooltip={t("New doc")} delay={500}>
+                        <Tooltip content={t("New doc")} delay={500}>
                           <NudeButton
                             type={undefined}
                             aria-label={t("New nested document")}

app/components/Sidebar/components/HistoryNavigation.tsx

@@ -43,12 +43,12 @@ function HistoryNavigation(props: React.ComponentProps<typeof Flex>) {
 
   return (
     <Navigation gap={4} {...props}>
-      <Tooltip tooltip={t("Go back")} delay={500}>
+      <Tooltip content={t("Go back")} delay={500}>
         <NudeButton onClick={() => Desktop.bridge.goBack()}>
           <Back $active={back} />
         </NudeButton>
       </Tooltip>
-      <Tooltip tooltip={t("Go forward")} delay={500}>
+      <Tooltip content={t("Go forward")} delay={500}>
         <NudeButton onClick={() => Desktop.bridge.goForward()}>
           <Forward $active={forward} />
         </NudeButton>

app/components/Star.tsx

@@ -44,7 +44,7 @@ function Star({ size, document, collection, color, ...rest }: Props) {
       context={context}
       hideOnActionDisabled
       tooltip={{
-        tooltip: target.isStarred ? t("Unstar document") : t("Star document"),
+        content: target.isStarred ? t("Unstar document") : t("Star document"),
         delay: 500,
       }}
       action={

app/components/Tooltip.tsx

@@ -6,11 +6,13 @@ import { s } from "@shared/styles";
 import useMobile from "~/hooks/useMobile";
 
 export type Props = Omit<TippyProps, "content" | "theme"> & {
-  tooltip?: React.ReactChild | React.ReactChild[];
+  /** The content to display in the tooltip. */
+  content?: React.ReactChild | React.ReactChild[];
+  /** A keyboard shortcut to display next to the content */
   shortcut?: React.ReactNode;
 };
 
-function Tooltip({ shortcut, tooltip, delay = 50, ...rest }: Props) {
+function Tooltip({ shortcut, content: tooltip, delay = 50, ...rest }: Props) {
   const isMobile = useMobile();
 
   let content = <>{tooltip}</>;