Tooltip: User defined id for aria-describedBy (#1561)

Author: harish-prakash

index.d.ts

@@ -3108,6 +3108,10 @@ export interface TooltipProps {
    * The appearance of the Tooltip.
    */
   appearance?: TooltipAppearance
+  /**
+   * The id of the tooltip.
+   */
+  id?: string
   /**
    * The position the Tooltip is on.
    */

src/tooltip/src/Tooltip.js

@@ -22,7 +22,7 @@ const Tooltip = memo(function Tooltip(props) {
     statelessProps = emptyProps
   } = props
 
-  const id = useId('evergreen-tooltip')
+  const id = useId('evergreen-tooltip', props.id)
   const [isShown, setIsShown] = useState(propIsShown || false)
   const [isShownByTarget, setIsShownByTarget] = useState(false)
   const closeTimer = useRef(undefined)
@@ -153,6 +153,11 @@ Tooltip.propTypes = {
    */
   appearance: PropTypes.oneOf(['default', 'card']),
 
+  /**
+   * The id of the tooltip.
+   */
+  id: PropTypes.string,
+
   /**
    * The position the Popover is on.
    */