diff --git a/src/Alert/index.tsx b/src/Alert/index.tsx index 9e2ffdde..2c435d48 100644 --- a/src/Alert/index.tsx +++ b/src/Alert/index.tsx @@ -15,7 +15,7 @@ interface AlertProps { /** Variant of Alert to use */ kind?: "info" | "error" | "success" | "warn"; /** Override the default icon of the alert */ - icon?: IconName | null; + icon?: IconName | string | null; /** Message content of the Alert */ children?: React.ReactNode | string; } diff --git a/src/Button/index.tsx b/src/Button/index.tsx index a65b675d..863dd9e6 100644 --- a/src/Button/index.tsx +++ b/src/Button/index.tsx @@ -7,11 +7,11 @@ import type { IconName } from "../types/Icon.types"; interface ButtonProps { /** Renders the button label */ - label: string; + label?: string; // must be optional until `children` is removed /** style of button to render */ kind?: "primary" | "secondary" | "tonal" | "negative" | "menu" | "plain"; /** Click callback, with event object passed as argument */ - onClick?: (e: React.MouseEvent) => void; + onClick?: (e) => void; /** * The html element to render as the root node of `Button`. * diff --git a/src/ContentCard/index.tsx b/src/ContentCard/index.tsx index e1b4877a..29e49e3c 100644 --- a/src/ContentCard/index.tsx +++ b/src/ContentCard/index.tsx @@ -34,7 +34,7 @@ interface ContentCardProps { * Amount of border radius to add on all sides of card. */ radiusSize?: "s" | "m" | "l"; - onClick?: () => void; + onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void; /** * Only applicable for `toggle` type. * Renders card in visually selected state with appropriate attributes. @@ -70,11 +70,12 @@ const ContentCard = ({ props.role = "button"; props.onClick = onClick; props.tabIndex = "0"; - props.onKeyUp = ({ key }) => { + props.onKeyUp = (e) => { + const { key } = e; // space and Enter should be accepted for both // toggle and button types if (key === "Enter" || key === " ") { - onClick(); + onClick(e); } }; } diff --git a/src/Dialog/index.tsx b/src/Dialog/index.tsx index 3a2fda3c..648fcbef 100644 --- a/src/Dialog/index.tsx +++ b/src/Dialog/index.tsx @@ -29,7 +29,7 @@ export interface DialogProps { /** Scrollable contents of the Dialog */ children: React.ReactNode; /** Heading in the top of the Dialog */ - title: string; + title?: string; /** Optional notification content to render pinned under the header */ notification?: React.ReactNode; /** Contents of Dialog footer, typically reserved for action buttons */ @@ -42,7 +42,7 @@ export interface DialogProps { * Callback to handle user taking an action to dismiss the modal * (click outside, Escape key, click close button) */ - onUserDismiss: () => void; + onUserDismiss?: () => void; /** * Sets a custom modal width. * Use the full CSS value with the unit (e.g. "400px") @@ -50,6 +50,7 @@ export interface DialogProps { width?: string; /** Optional value for `data-testid` attribute */ testId?: string; + id?: string; } /** @@ -61,7 +62,7 @@ export interface DialogProps { const Dialog = ({ isOpen = false, onUserDismiss = noop, - title, + title = "", headerStyle = "bordered", children, notification, diff --git a/src/RadioButtons/index.tsx b/src/RadioButtons/index.tsx index 283412c8..e40d3df2 100644 --- a/src/RadioButtons/index.tsx +++ b/src/RadioButtons/index.tsx @@ -2,16 +2,10 @@ import React, { useState, useEffect } from "react"; import cc from "classcat"; import Error from "../Error"; -type OptionType = - | { - value: string; - details?: string; - } - | string; - interface RadioButtonsProps { /** Map of label strings to input values * + * TODO: restore this type when we can do it in a non-breaking way * ``` * type OptionType = { * value: string; @@ -20,7 +14,7 @@ interface RadioButtonsProps { * | string; * ``` * */ - options: Record; + options?: object; /** name of radiogroup */ name: string; /** initially selected option by input value (uncontrolled) */