feat(card): add ts type definitions

src/components/card/card-column/card-column.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+import * as OptionsHelper from "../../../utils/helpers/options-helper/options-helper";
+
+export interface CardColumnProps {
+  children: React.ReactNode;
+  /** text alignment of the card section text */
+  align?: OptionsHelper.AlignFull;
+}
+
+declare function CardColumn(props: CardColumnProps): JSX.Element;
+
+export default CardColumn;

src/components/card/card-column/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./card-column";

src/components/card/card-footer/card-footer.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { SpaceProps } from "styled-system";
+import * as OptionsHelper from "../../../utils/helpers/options-helper/options-helper";
+
+export interface CardFooterProps extends SpaceProps {
+  children: React.ReactNode;
+  /**
+   * Predefined size of CardFooter for applying padding (small | medium | large).
+   * For more granular control these can be over-ridden by Spacing props from styled-system.
+   */
+  spacing?: OptionsHelper.SizesRestricted;
+}
+
+declare function CardFooter(props: CardFooterProps): JSX.Element;
+
+export default CardFooter;

src/components/card/card-footer/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./card-footer";

src/components/card/card-row/card-row.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { PaddingProps } from "styled-system";
+import * as OptionsHelper from "../../../utils/helpers/options-helper/options-helper";
+
+export interface CardRowProps extends PaddingProps {
+  children: React.ReactNode;
+  /**
+   * Spacing prop is set in Card and defines the padding for the CardRow (the first CardRow has no padding by default).
+   * For more granular control of CardRow padding these can be over-ridden by Padding props from styled-system.
+   */
+   spacing?: OptionsHelper.SizesRestricted;
+}
+
+declare function CardRow(props: CardRowProps): JSX.Element;
+
+export default CardRow;

src/components/card/card-row/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./card-row";

src/components/card/card.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+import * as OptionsHelper from "../../utils/helpers/options-helper/options-helper";
+
+export interface CardProps {
+  /** action to be executed when card is clicked or enter pressed */
+  action?: (ev: React.MouseEvent<HTMLDivElement>) => void;
+  children: React.ReactNode;
+  /** style value for width of card */
+  cardWidth?: string;
+  /** flag to indicate if card is interactive */
+  interactive?: boolean;
+  /** flag to indicate if card is draggable */
+  draggable?: boolean;
+  /** size of card for applying padding (small | medium | large) */
+  spacing?: OptionsHelper.SizesRestricted;
+  dataRole?: string;
+}
+
+declare function Card(props: CardProps): JSX.Element;
+
+export default Card;

src/components/card/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./card";

src/utils/helpers/options-helper/options-helper.d.ts

@@ -288,10 +288,14 @@ export type TintValueType =
 
 export type AlignBinaryType = "left" | "right";
 
+export type AlignFull = "left" | "center" | "right";
+
 export type FormFieldSpacing = 0 | 1 | 2 | 3 | 4 | 5 | 7;
 
 export type SizesType = "small" | "large";
 
+export type SizesRestricted = "small" | "medium" | "large";
+
 export type ThemesBinary = "primary" | "secondary";
 
 export type Positions = "top" | "bottom" | "left" | "right";