@commercetools-uikit/card
TypeScript icon, indicating that this package has built-in type declarations

19.0.0 • Public • Published

Card

Description

Cards are used to display content and actions on a single topic.

Installation

yarn add @commercetools-uikit/card
npm --save install @commercetools-uikit/card

Additionally install the peer dependencies (if not present)

yarn add react react-router-dom
npm --save install react react-router-dom

Usage

import Card from '@commercetools-uikit/card';

const Example = () => (
  <Card theme="light" type="raised">
    <p>{`You'll never guess where I've been!`}</p>
  </Card>
);

export default Example;

Properties

Props Type Required Default Description
type union
Possible values:
'raised' , 'flat'
'raised' Determines the visual effect of the card. A raised card has a box shadow while a flat card has just a border.
insetScale union
Possible values:
'none' , 's' , 'm' , 'l' , 'xl'
'm' Determines the spacing (padding) that the content should have from the card borders. In case there is no space needed, you can pass none.
theme union
Possible values:
'light' , 'dark'
'light' Determines the background color of the card.
className string Pass a custom CSS class, useful to override the styles.
NOTE: This is not recommended and should only be used for building new components that require special style adjustments.
children ReactNode
onClick Function
See signature.
The callback function to be executed when the Card component is clicked. Prefer this for managing side effects rather than navigation.
to union
Possible values:
string , LocationDescriptor
The URL that the Card should point to. If provided, the Card will be rendered as an anchor element.
isExternalLink boolean A flag to indicate if the Card points to an external source.
isDisabled boolean Indicates that a clickable Card should not allow clicks. This allows consumers to temporarily disable a clickable Card.

Signatures

Signature onClick

() => void

Package Sidebar

Install

npm i @commercetools-uikit/card

Weekly Downloads

11,358

Version

19.0.0

License

MIT

Unpacked Size

40.1 kB

Total Files

12

Last publish

Collaborators

  • emmenko
  • commercetools-admin
  • tdeekens