# @atlaskit/dropdown-menu: DropdownItem is any and onClick is not working

**URL:** <https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317>\
**Category:** Atlassian Ecosystem Design\
**Tags:** atlaskit\
**Created:** [March 18, 2021, 11:58am UTC](https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317 "2021-03-18T11:58:22Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![anon86326603](https://avatars.discourse-cdn.com/v4/letter/a/f17d59/32.png) [@anon86326603](https://community.developer.atlassian.com/u/anon86326603)\
**Post date:** [March 18, 2021, 11:58am UTC](https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317/1 "2021-03-18T11:58:22Z")

</div>

Hey guys,

I hope I am right here with my question / issue… I have a react application written in typescript where I want to use `Dropdown` component. I encountered two problems here:

1. The `DropdownItem` component is of type `any`
2. It seems that the onClick-event is not working. I try to register an event handler on it but this gets never called. I created a codesandbox where you can take a look on: [CodeSanbox](https://codesandbox.io/s/naughty-thunder-4yvjg?file=/src/App.tsx)

Can you help me here? Many thanks in advance,  
Nick

---

<div class="post-metadata">

**Author:** ![Grzegorz.Tanczyk](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/grzegorz.tanczyk/32/43651_2.png) [@Grzegorz.Tanczyk](https://community.developer.atlassian.com/u/Grzegorz.Tanczyk)\
**Post date:** [March 18, 2021, 1:48pm UTC](https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317/2 "2021-03-18T13:48:55Z")

</div>

It’s broken in fact. I was using `onMouseDown` as a workaround, but this is not perfect from user point of view.

---

<div class="post-metadata">

**Author:** ![anon86326603](https://avatars.discourse-cdn.com/v4/letter/a/f17d59/32.png) [@anon86326603](https://community.developer.atlassian.com/u/anon86326603)\
**Post date:** [March 18, 2021, 1:54pm UTC](https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317/3 "2021-03-18T13:54:26Z")

</div>

Thanks! As a workaround this is helpful. But you are right, this is not perfect…

It seems that this is related to the used styled-components version. In the official code sandboxes from the documentation an old version of styled-components (3.2.6) is used. There it works… But unfortunately not with the latest ones (e.g. 5.2.1)

---

<div class="post-metadata">

**Author:** ![LoganLee](https://avatars.discourse-cdn.com/v4/letter/l/b5ac83/32.png) [@LoganLee](https://community.developer.atlassian.com/u/LoganLee)\
**Post date:** [October 29, 2021, 8:52am UTC](https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317/4 "2021-10-29T08:52:40Z")

</div>

it is bloody annoying.

no guide line or error for it .

they should fix it

---

<div class="post-metadata">

**Author:** ![nhac.tat.nguyen](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhac.tat.nguyen/32/39032_2.png) [@nhac.tat.nguyen](https://community.developer.atlassian.com/u/nhac.tat.nguyen)\
**Post date:** [November 2, 2021, 9:54am UTC](https://community.developer.atlassian.com/t/atlaskit-dropdown-menu-dropdownitem-is-any-and-onclick-is-not-working/46317/5 "2021-11-02T09:54:14Z")

</div>

It is already a document about these peer dependencies here: [Atlaskit by Atlassian](https://atlaskit.atlassian.com/get-started)

 ![image](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/4/f/4f552b33548e57d265ad11b108806e2239a479c7.png)