Published

Card

import { Card } from "@wfp/react";

() => {
  return <Card />;
};

Prop	Default	Description	Value
className `string`	–	A custom class name string to be appended to the default class list of the Card component, allowing for additional styling through CSS.
children `ReactNode`	–	The content to be displayed within the Card component. This can include text, images, or other React components, effectively making `Card` a container.
kind `"elevated" \|"outlined" \|"regular"`	–	Determines the visual style of the Card. `elevated`: The Card will have a shadow to create a raised, three-dimensional effect. `outlined`: The Card will have a border without a shadow, indicating boundaries with a flat appearance. `regular`: Default style.
withFocus `boolean`	–	If `true`, the Card will have focus styling to indicate it is the current focus target of user interaction. Primarily used for accessibility and improved user experience.	withFocus
disabled `boolean`	–	If `true`, the Card will be rendered in a disabled state, typically affecting interactivity and potentially visual appearance to indicate that user actions are not currently available.	disabled
style `CSSProperties`	–	Inline CSS styles to apply directly to the card component. Useful for applying specific styles without the need to define additional CSS classes.