topic Re: CRM Card Actions in APIs & Integrations

CRM Card Actions

hafizusama — Wed, 11 Jun 2025 11:38:07 GMT

Hi everyone,

I'm currently building a HubSpot UI Extension and would appreciate some guidance regarding the use of the Preview button.

I'm using the following code to render the button:

import { CrmCardActions } from "@hubspot/ui-extensions/crm"; <CrmCardActions

actionConfigs={[

{

type: 'action-library-button',

label: 'Preview',

actionType: 'PREVIEW_OBJECT',

actionContext: { objectTypeId: '0-3', objectId: 14795354663, }, tooltipText: 'Preview this deal record.',

} ]} />

This successfully displays the Preview button, but it's positioned only at the top of the card. I would like to position it more centrally within the card, but I haven't been able to find a way to do so.

Additionally, is it possible to use the Preview button more than once within a single UI Extension card?

Any insights or suggestions would be greatly appreciated.

Thank you!

Re: CRM Card Actions

Jaycee_Lewis — Wed, 11 Jun 2025 21:13:53 GMT

Hi, @hafizusama 👋 Thanks for the great question! I'd like to invite some of our community experts to the conversation – hey @evaldas @nickdeckerdevs1 @Anton have you worked with modifying this component recently? Or added multiple buttons to a single card?

Thank you very much for taking a look! —Jaycee

Re: CRM Card Actions

nickdeckerdevs1 — Thu, 12 Jun 2025 14:26:36 GMT

You need to check out the flex area -- you can use this to position your content.
https://developers.hubspot.com/docs/reference/ui-components/standard-components/flex

I'd also suggest checking out the examples here so you can get a better idea of how this is all used
https://developers.hubspot.com/docs/guides/crm/ui-extensions/sample-extensions/overview

Re: CRM Card Actions

hafizusama — Thu, 12 Jun 2025 14:55:44 GMT

Thanks @Jaycee_Lewis for the appreciation and tagging other experts for help. 🙂

Re: CRM Card Actions

Jaycee_Lewis — Thu, 12 Jun 2025 15:09:17 GMT

Thanks @nickdeckerdevs1 🙌 — Jaycee

Re: CRM Card Actions

nickdeckerdevs1 — Thu, 12 Jun 2025 15:11:31 GMT

Apologies if I haven't been very reactive to these tags. I'm in the process of merging deckerdevs with Impulse Creative and I have a lot of wrapping up to do. I'll also be going on a summer tour of Florida with my 8yo to do his summer bucket list items so I'll be a bit away from here for the next week and a half, and then starting at Impulse on June 23rd -- so please continue to tag me where you see fit and I'll do my best to help out.

Re: CRM Card Actions

Jaycee_Lewis — Thu, 12 Jun 2025 15:38:35 GMT

You're a legend @nickdeckerdevs1 🙌 No worries at all. Sent you a DM — Jaycee

Re: CRM Card Actions

zataara — Fri, 27 Jun 2025 21:59:54 GMT

I was able to resolve this using the <CrmActionButton> component. You can use multiple of them inside your UI Extension. Here's an example where I used in in a <Table>.

<TableCell> <CrmActionButton actionType="PREVIEW_OBJECT" actionContext={{ objectTypeId: dictionary.objects.userDefined.ordered_product, objectId: product.id, }} variant="secondary" size="xs" > Preview </CrmActionButton> </TableCell>

Docs: https://developers.hubspot.com/docs/reference/ui-components/crm-action-components/crm-action-button

Re: CRM Card Actions

Jaycee_Lewis — Fri, 27 Jun 2025 22:31:40 GMT

Thank you very much @BMacMahon 🙌 — Jaycee

Re: CRM Card Actions

UsamaHM — Fri, 11 Jul 2025 11:29:12 GMT

Hi @zataara,

I hope you're doing well. I regret the delayed response — I was tied up with other priority tasks at the time.

You are right — I managed to achieve it using CRM action buttons instead of CRM card actions.

Thank you so much! 🙂