chore(popover): update docs to clarify autoFocus usage (uber#4457)

Autofocus should always be managed via Popover's autoFocus prop, rather than by adding the autofocus attribute directly to Popover's contents.
imnotjames · Aug 16, 2021 · b3ea875 · b3ea875
1 parent ccbcf28
commit b3ea875
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/documentation-site/components/yard/config/popover.ts b/documentation-site/components/yard/config/popover.ts
@@ -116,7 +116,7 @@ const PopoverConfig: TConfig = {
       value: true,
       type: PropTypes.Boolean,
       description:
-        'If true, focus will shift to the first interactive element within the popover.',
+        "If true, focus will shift to the first interactive element within the popover. Avoid adding autofocus directly to the popover's contents, as this will cause unexpected behavior.",
       hidden: true,
     },
     accessibilityType: {

diff --git a/documentation-site/pages/components/popover.mdx b/documentation-site/pages/components/popover.mdx
@@ -42,6 +42,9 @@ content view after being triggered by a click-event (or hover) such as a button,
 icon. Popovers can contain range of content from simple text strings to inputs, or lightly
 structured content and imagery/illustration. It’s usage depends on the context.
 
+Note that autofocus should be managed using Popover's autoFocus prop. Avoid adding autofocus
+directly to Popover's contents, as this will cause unexpected behavior.
+
 ## When to use
 
 - Describe the difference between visually similar elements.