# Button onPress not working

**URL:** <https://forums.creativeclouddeveloper.com/t/button-onpress-not-working/8611>\
**Category:** InDesign\
**Tags:** react, uxp, spectrum\
**Created:** [October 31, 2024, 4:06am UTC](https://forums.creativeclouddeveloper.com/t/button-onpress-not-working/8611 "2024-10-31T04:06:44Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![YulianD](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/yuliand/32/4013_2.png) [@YulianD](https://forums.creativeclouddeveloper.com/u/YulianD)\
**Post date:** [October 31, 2024, 4:06am UTC](https://forums.creativeclouddeveloper.com/t/button-onpress-not-working/8611/1 "2024-10-31T04:06:44Z")

</div>

I have created a blank project with the UXP Developer Tools. And I have only added a Spectrum React Button. But the onPress event does not work, only the onClick works.

```auto
import React from "react";

import { WC } from "./WC.jsx";

import "./Home.css";
import { Button, Provider, darkTheme } from "@adobe/react-spectrum";

export const Home = () => {
  const handleXDButton = () => {
    console.log("WORK");
  };
  return (
    <div>
      <WC>
        <Provider theme={darkTheme} colorScheme="dark">
          <p className="display">
            Congratulations! You just created your first React Plugin.
          </p>
          <Button variant="primary" onPress={handleXDButton}>
            XD
          </Button>
        </Provider>
      </WC>
    </div>
  );
};

```

---

<div class="post-metadata">

**Author:** ![sttk3](https://avatars.discourse-cdn.com/v4/letter/s/958977/32.png) [@sttk3](https://forums.creativeclouddeveloper.com/u/sttk3)\
**Post date:** [October 31, 2024, 6:24am UTC](https://forums.creativeclouddeveloper.com/t/button-onpress-not-working/8611/2 "2024-10-31T06:24:15Z")

</div>

```auto
import { Button, Provider, darkTheme } from "@adobe/react-spectrum";

```

Perhaps UXP does not support **React Spectrum**. If it is **Spectrum Web Components** , you can use it with a lot of effort.

And UXP is generally based on the context of web development and uses onClick.

---

<div class="post-metadata">

**Author:** ![YulianD](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/yuliand/32/4013_2.png) [@YulianD](https://forums.creativeclouddeveloper.com/u/YulianD)\
**Post date:** [October 31, 2024, 12:34pm UTC](https://forums.creativeclouddeveloper.com/t/button-onpress-not-working/8611/3 "2024-10-31T12:34:53Z")

</div>

what you mean is that although adobe in its UXP Developer Tools gives the option to create a react based project, it does not ensure compatibility with its own Spectrum react components?  
Actually all this has me very confused, the Adobe documentation for this is terrible! Can you recommend me the right way to set up a project to develop a plugin for InDesign?

---

<div class="post-metadata">

**Author:** ![sttk3](https://avatars.discourse-cdn.com/v4/letter/s/958977/32.png) [@sttk3](https://forums.creativeclouddeveloper.com/u/sttk3)\
**Post date:** [October 31, 2024, 11:51pm UTC](https://forums.creativeclouddeveloper.com/t/button-onpress-not-working/8611/4 "2024-10-31T23:51:00Z")

</div>

> it does not ensure compatibility with its own Spectrum react components?

This is true. Perhaps what you are calling ‘Spectrum react components’ is [React Spectrum](https://react-spectrum.adobe.com/react-spectrum/index.html). But this is not ensured to work.

UXP is like a browser, but a bit different, and some of its features are not supported. Therefore, it often doesn’t work.

If you want to use Spectrum Web Components instead of React Spectrum, the following documentation and templates are available.

#### Documentation

- [UXP for InDesign \> References \> UXP API \> Spectrum UXP Reference \> Spectrum Web Components | Adobe Developer](https://developer.adobe.com/indesign/uxp/reference/uxp-api/reference-spectrum/swc/)
- [List of the components and their variants (adobe/swc-uxp-wrappers) | GitHub](https://github.com/adobe/swc-uxp-wrappers/tree/main?tab=readme-ov-file#spectrum-web-components-uxp-wrappers)
- [Spectrum Web Components | Adobe Open Source](https://opensource.adobe.com/spectrum-web-components/)
- [@swc-uxp-wrappers/create-swc-uxp-react-app | npm](https://www.npmjs.com/package/@swc-uxp-wrappers/create-swc-uxp-react-app)

#### Template

- [InDesign React-based SWC starter plugin (since UXP v7.3 / InDesign 2024) | Adobe Developer](https://github.com/AdobeDocs/uxp-indesign-samples/tree/main/plugins/swc-uxp-react-starter)
- [@swc-uxp-wrappers/create-swc-uxp-react-app (since UXP v8.0 / InDesign 2025) | npm](https://github.com/AdobeDocs/uxp-indesign-samples/tree/main/plugins/swc-uxp-react-starter)
