From 63a15cfccbeeac6eb4ff66c135f799d7c24501c3 Mon Sep 17 00:00:00 2001 From: Alexandre Asselin Date: Fri, 19 Apr 2024 10:35:55 -0400 Subject: [PATCH] Add default values to jsdoc --- packages/components/src/Label/src/Label.tsx | 2 +- packages/components/src/Link/src/Link.tsx | 4 +++- packages/components/src/Spinner/src/Spinner.tsx | 1 + packages/components/src/buttons/src/Button.tsx | 4 +++- packages/components/src/errorMessage/src/ErrorMessage.tsx | 3 +-- packages/components/src/helperMessage/src/HelperMessage.tsx | 1 - packages/icons/src/Icon.tsx | 1 + packages/icons/src/RichIcon.tsx | 2 ++ packages/styled-system/src/StyledSystemProvider.tsx | 3 +++ packages/styled-system/src/responsive/BreakpointProvider.tsx | 5 +++++ 10 files changed, 20 insertions(+), 6 deletions(-) diff --git a/packages/components/src/Label/src/Label.tsx b/packages/components/src/Label/src/Label.tsx index e66fada07..3dbb11b1c 100644 --- a/packages/components/src/Label/src/Label.tsx +++ b/packages/components/src/Label/src/Label.tsx @@ -31,7 +31,7 @@ function Label(props:LabelProps, ref: ForwardedRef) { const { stylingProps, ...ownProps } = useStyledSystem(props); const { className, size: sizeProp, children, style, ...otherProps } = ownProps; - const size = useResponsiveValue(sizeProp ?? "md"); + const size = useResponsiveValue(sizeProp) ?? "md"; const classNames = clsx( className, diff --git a/packages/components/src/Link/src/Link.tsx b/packages/components/src/Link/src/Link.tsx index e7258f12c..5cb5d1012 100644 --- a/packages/components/src/Link/src/Link.tsx +++ b/packages/components/src/Link/src/Link.tsx @@ -20,11 +20,13 @@ const DefaultLinkSlot = "link"; export interface LinkProps extends StyledComponentProps{ /** * The visual style of the link. + * @default "primary" */ variant?: "primary" | "secondary"; /** * Size of the link. + * @default "inherit" */ size?: ResponsiveProp<"inherit" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl">; @@ -54,7 +56,7 @@ function Link(props:LinkProps, ref: ForwardedRef) { const { className, children: childrenProp, - size: sizeProp = "inherit", + size: sizeProp, style: styleProp, isQuiet, isExternal, diff --git a/packages/components/src/Spinner/src/Spinner.tsx b/packages/components/src/Spinner/src/Spinner.tsx index 7ee5a8c6b..e4ca44d47 100644 --- a/packages/components/src/Spinner/src/Spinner.tsx +++ b/packages/components/src/Spinner/src/Spinner.tsx @@ -15,6 +15,7 @@ export const GlobalSpinnerCssSelector = "hop-Spinner"; export interface SpinnerProps extends StyledSystemProps, BaseComponentProps { /** * What the Spinner's diameter should be. + * @default "md" */ size?: ResponsiveProp<"sm" | "md" | "lg">; } diff --git a/packages/components/src/buttons/src/Button.tsx b/packages/components/src/buttons/src/Button.tsx index ae4845b41..356cfcfcd 100644 --- a/packages/components/src/buttons/src/Button.tsx +++ b/packages/components/src/buttons/src/Button.tsx @@ -23,11 +23,13 @@ const DefaultButtonSlot = "button"; export interface ButtonProps extends StyledComponentProps { /** * The visual style of the button. + * * @default "primary" */ variant?: "primary" | "secondary" | "danger" | "upsell" | "ghost-primary" | "ghost-secondary" | "ghost-danger"; /** * A button can vary in size. + * @default "md" */ size?: ResponsiveProp<"sm" | "md">; @@ -37,7 +39,7 @@ export interface ButtonProps extends StyledComponentProps { fluid?: ResponsiveProp; // A button can show a loading indicator. - isLoading?:boolean; + isLoading?: boolean; /** A URL to link to. Setting this makes the component render an `a` tag instead of a `button` */ href?: string; diff --git a/packages/components/src/errorMessage/src/ErrorMessage.tsx b/packages/components/src/errorMessage/src/ErrorMessage.tsx index 348075130..19faa5c9f 100644 --- a/packages/components/src/errorMessage/src/ErrorMessage.tsx +++ b/packages/components/src/errorMessage/src/ErrorMessage.tsx @@ -17,7 +17,6 @@ export const GlobalErrorMessageCssSelector = "hop-ErrorMessage"; export interface ErrorMessageProps extends StyledComponentProps, Omit { /** * Whether or not to hide the error message icon. - * @default true */ hideIcon?: boolean; } @@ -27,7 +26,7 @@ function ErrorMessage(props: ErrorMessageProps, ref: ForwardedRef; } diff --git a/packages/components/src/helperMessage/src/HelperMessage.tsx b/packages/components/src/helperMessage/src/HelperMessage.tsx index 4f46cae65..4fb5b89dd 100644 --- a/packages/components/src/helperMessage/src/HelperMessage.tsx +++ b/packages/components/src/helperMessage/src/HelperMessage.tsx @@ -15,7 +15,6 @@ export const GlobalHelperMessageCssSelector = "hop-HelperMessage"; export interface HelperMessageProps extends StyledComponentProps> { /** * Whether or not to hide the helper message icon. - * @default true */ hideIcon?: boolean; } diff --git a/packages/icons/src/Icon.tsx b/packages/icons/src/Icon.tsx index d6332d1f6..130171ab1 100644 --- a/packages/icons/src/Icon.tsx +++ b/packages/icons/src/Icon.tsx @@ -18,6 +18,7 @@ const DefaultIconSlot = "icon"; export interface IconProps extends SlotProps, StyledComponentProps<"svg"> { /** * The size of the icon. + * @default "md" */ size?: ResponsiveProp<"sm" | "md" | "lg">; /** diff --git a/packages/icons/src/RichIcon.tsx b/packages/icons/src/RichIcon.tsx index 6a88cfffd..8cce59d03 100644 --- a/packages/icons/src/RichIcon.tsx +++ b/packages/icons/src/RichIcon.tsx @@ -18,10 +18,12 @@ const DefaultRichIconSlot = "richicon"; export interface RichIconProps extends SlotProps, StyledComponentProps<"svg"> { /** * The visual style of the icon. + * @default "option7" */ variant?: "option1" | "option2" | "option3" | "option4" | "option5" | "option6" | "option7" | "option8"; /** * The size of the icon. + * @default "lg" */ size?: ResponsiveProp<"md" | "lg" | "xl">; /** diff --git a/packages/styled-system/src/StyledSystemProvider.tsx b/packages/styled-system/src/StyledSystemProvider.tsx index c1d176123..3037f7a9d 100644 --- a/packages/styled-system/src/StyledSystemProvider.tsx +++ b/packages/styled-system/src/StyledSystemProvider.tsx @@ -23,17 +23,20 @@ export interface StyledSystemProviderProps extends BreakpointProviderProps, DivP /** * The color scheme to use. + * @default "light" */ colorScheme: ColorSchemeOrSystem; /** * Default color scheme to use when a user preferred color scheme (system) is not available. + * @default "light" */ defaultColorScheme?: ColorScheme; /** * Determines whether token CSS variables should be added to the document's head * By default, it is set to `true`, you should not change it unless you want to manage CSS variables via `.css` files + * @default true */ withCssVariables?: boolean; } diff --git a/packages/styled-system/src/responsive/BreakpointProvider.tsx b/packages/styled-system/src/responsive/BreakpointProvider.tsx index 85368cb39..58d14faf6 100644 --- a/packages/styled-system/src/responsive/BreakpointProvider.tsx +++ b/packages/styled-system/src/responsive/BreakpointProvider.tsx @@ -9,7 +9,12 @@ import { Breakpoints, type Breakpoint } from "./Breakpoints.ts"; export const DefaultUnsupportedMatchMediaBreakpoint: Breakpoint = "lg"; export interface BreakpointProviderProps { + /** The children of the component */ children: ReactNode; + /** + * The breakpoint to use when the browser does not support matchMedia. + * @default "lg" + */ unsupportedMatchMediaBreakpoint?: Breakpoint; }