import "@vendr-org/connect-sdk/style.css";
import { VendrCard } from "@vendr-org/connect-sdk"

<VendrCard 
  configId="7e6017fc-d7eb-4688-a254-a4921f3ca29d" 
  companyId="d31e2ffe-7eba-4672-8e5b-9b10c0fb58d5" 
  productId="22eb0e24-f7e3-4524-9d60-b52325e234b8" />
import "@vendr-org/connect-sdk/style.css";
import { VendrCard } from "@vendr-org/connect-sdk"

<VendrCard 
  configId="7e6017fc-d7eb-4688-a254-a4921f3ca29d" 
  companyId="d31e2ffe-7eba-4672-8e5b-9b10c0fb58d5" 
  productId="22eb0e24-f7e3-4524-9d60-b52325e234b8" />

Props

data-config-id
string
required
React: configId

A unique identifier for the action link as configured in the Partner Dashboard

data-company-id
string
React: companyId

The id of the company to display the card for.

Required if not set on the action link configuration in the Partner Dashboard, otherwise it will default to the company for the product on the action link configuration.

data-product-id
string
React: productId

Optional and will default to the product on the action link configuration in Partner Dashboard.

If set will override the product on the action link configuration. data-company-id is required if this is set.

style
CSS

Custom CSS to style the card container and also set the width and height of the card.