CrmActionLink | UI components (BETA)

The CrmActionLink component renders a clickable link that can execute a built-in set of CRM actions.

This type of component is useful for enabling your extension to interact with other CRM entities, such as records and engagements. To learn more about how CRM action components work together, check out the CRM action components overview.

ui-extensions-crm-action-link

import { CrmActionLink } from '@hubspot/ui-extensions/crm'; const dealContext = { objectTypeId: "0-3", objectId: 14795354663, }; hubspot.extend(({ context, runServerlessFunction, actions }) => { return ( <> <CrmActionLink actionType="ADD_NOTE" actionContext={dealContext} > Add a note about this deal to the record </CrmActionLink> </> ); });
Prop Type Description
actionType Required String The type of action to perform. See list of available actions for more information.
actionContext Required Object An object containing the CRM object and record context for performing the action. See list of available actions for required context values.
variant 'primary'  (default)| 'light' | 'dark' | 'destructive' The color variation of the link. See the variants section for more information.
onError (errors: string[]) => void An optional callback that will pass any error messages that were generated. Common errors include missing required context values or the user not having sufficient permissions to perform an action.

Variants

Using the variant prop, you can control the color of the link.

  • primary: the default blue (#0091ae).
    design-guidelines-links_4 
  • light: a white link that turns to a lighter shade of blue on hover (#7fd1de).
    design-guidelines-links_3
  • dark: a darker shade of blue (#33475b).
    design-guidelines-links_2
  • destructive: a red link (#f2545b).
    design-guidelines-links_1
 

Related components

Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.