diff --git a/.changeset/heavy-eggs-deliver.md b/.changeset/heavy-eggs-deliver.md new file mode 100644 index 00000000000..642e05a34b3 --- /dev/null +++ b/.changeset/heavy-eggs-deliver.md @@ -0,0 +1,6 @@ +--- +'@clerk/clerk-js': patch +'@clerk/types': patch +--- + +Add `menuButtonEllipsis` element descriptor. diff --git a/packages/clerk-js/src/ui/customizables/elementDescriptors.ts b/packages/clerk-js/src/ui/customizables/elementDescriptors.ts index 3e0101c9e37..3ebc8557552 100644 --- a/packages/clerk-js/src/ui/customizables/elementDescriptors.ts +++ b/packages/clerk-js/src/ui/customizables/elementDescriptors.ts @@ -222,6 +222,7 @@ export const APPEARANCE_KEYS = containsAllElementsConfigKeys([ 'selectOption', 'menuButton', + 'menuButtonEllipsis', 'menuList', 'menuItem', diff --git a/packages/clerk-js/src/ui/elements/ThreeDotsMenu.tsx b/packages/clerk-js/src/ui/elements/ThreeDotsMenu.tsx index 6e55ba7c2dc..d6e5d411319 100644 --- a/packages/clerk-js/src/ui/elements/ThreeDotsMenu.tsx +++ b/packages/clerk-js/src/ui/elements/ThreeDotsMenu.tsx @@ -1,7 +1,7 @@ import type { MenuId } from '@clerk/types'; import type { LocalizationKey } from '../customizables'; -import { Button, Icon } from '../customizables'; +import { Button, descriptors, Icon } from '../customizables'; import { ThreeDots } from '../icons'; import { Menu, MenuItem, MenuList, MenuTrigger } from './Menu'; @@ -33,6 +33,7 @@ export const ThreeDotsMenu = (props: ThreeDotsMenuProps) => { })} variant='ghost' colorScheme='neutral' + elementDescriptor={[descriptors.menuButton, descriptors.menuButtonEllipsis]} > ; menuButton: WithOptions; + menuButtonEllipsis: WithOptions; menuList: WithOptions; menuItem: WithOptions;