fix: some components are exported anonymously, which confuses TS some…

…how (#130)

When we do `export default forwardRef(function Component(...))` the generated type definitions
confuse TS, since all the components exported that way share the same _default namespace, thus the
need to do: `const ComponentName = forwardRef(function ComponentName(...)); export default
ComponentName`

src/core/Dialog/index.tsx

@@ -16,7 +16,7 @@ interface ExtraProps {
 
 export type DialogProps = RawDialogProps & ExtraProps;
 
-export default forwardRef<HTMLDivElement, DialogProps>(function Dialog(
+const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(
   props,
   ref
 ): JSX.Element {
@@ -35,3 +35,5 @@ export default forwardRef<HTMLDivElement, DialogProps>(function Dialog(
     </DialogContext.Provider>
   );
 });
+
+export default Dialog;

src/core/DialogActions/index.tsx

@@ -4,8 +4,10 @@ import { ExtraProps, StyledDialogActions } from "./style";
 
 export type DialogActionsProps = ExtraProps & RawDialogActionsProps;
 
-export default forwardRef<HTMLDivElement, DialogActionsProps>(
+const DialogActions = forwardRef<HTMLDivElement, DialogActionsProps>(
   function DialogActions(props, ref) {
     return <StyledDialogActions ref={ref} {...props} />;
   }
 );
+
+export default DialogActions;

src/core/DialogPaper/index.tsx

@@ -5,7 +5,7 @@ import { StyledPaper } from "./style";
 
 export { PaperProps as DialogPaperProps };
 
-export default forwardRef<unknown, PaperProps>(function DialogPaper(
+const DialogPaper = forwardRef<unknown, PaperProps>(function DialogPaper(
   props,
   ref
 ): JSX.Element {
@@ -15,3 +15,5 @@ export default forwardRef<unknown, PaperProps>(function DialogPaper(
     </DialogContext.Consumer>
   );
 });
+
+export default DialogPaper;

src/core/DialogTitle/components/CloseButton/index.tsx

@@ -18,7 +18,7 @@ const SDS_SIZE_TO_ICON_SIZE = {
   xs: "s",
 };
 
-export default forwardRef<HTMLButtonElement, IconButtonProps>(
+const CloseButton = forwardRef<HTMLButtonElement, IconButtonProps>(
   function CloseButton(props, ref) {
     return (
       <DialogContext.Consumer>
@@ -46,3 +46,5 @@ export default forwardRef<HTMLButtonElement, IconButtonProps>(
     );
   }
 );
+
+export default CloseButton;

src/core/DialogTitle/index.tsx

@@ -11,7 +11,7 @@ export interface DialogTitleProps extends ExtraProps, RawDialogTitleProps {
   onClose?: () => void;
 }
 
-export default forwardRef(function DialogTitle(
+const DialogTitle = forwardRef(function DialogTitle(
   props: DialogTitleProps,
   ref
 ): JSX.Element {
@@ -29,3 +29,5 @@ export default forwardRef(function DialogTitle(
     </StyledDialogTitle>
   );
 });
+
+export default DialogTitle;

src/core/Icon/index.tsx

@@ -7,7 +7,7 @@ export type { IconNameToSizes };
 export type IconProps<IconName extends keyof IconNameToSizes> =
   ExtraProps<IconName>;
 
-export default forwardRef(function Icon<IconName extends keyof IconNameToSizes>(
+const Icon = forwardRef(function Icon<IconName extends keyof IconNameToSizes>(
   { sdsIcon, sdsSize, sdsType }: IconProps<IconName>,
   ref: ForwardedRef<HTMLDivElement | null>
 ): JSX.Element | null {
@@ -50,3 +50,5 @@ export default forwardRef(function Icon<IconName extends keyof IconNameToSizes>(
 
   return null;
 });
+
+export default Icon;

src/core/Link/index.tsx

@@ -1,17 +1,19 @@
 import React, { ForwardedRef, forwardRef } from "react";
 import { LinkProps, StyledLink } from "./style";
 
-const Link = (props: LinkProps, ref: ForwardedRef<HTMLAnchorElement>) => {
-  const { sdsStyle } = props;
-  let underline: LinkProps["underline"];
+const Link = forwardRef(
+  (props: LinkProps, ref: ForwardedRef<HTMLAnchorElement>) => {
+    const { sdsStyle } = props;
+    let underline: LinkProps["underline"];
 
-  if (sdsStyle === "default") {
-    underline = "none";
-  }
+    if (sdsStyle === "default") {
+      underline = "none";
+    }
 
-  return <StyledLink {...props} underline={underline} ref={ref} />;
-};
+    return <StyledLink {...props} underline={underline} ref={ref} />;
+  }
+);
 
 export { LinkProps };
 
-export default forwardRef(Link);
+export default Link;

src/core/Tooltip/index.tsx

@@ -16,7 +16,7 @@ export { TooltipProps };
  * wrap the children in a `<span>` tag.
  * https://mui.com/components/tooltips/#disabled-elements
  */
-export default forwardRef(function Tooltip(
+const Tooltip = forwardRef(function Tooltip(
   props: TooltipProps,
   ref
 ): JSX.Element {
@@ -138,3 +138,5 @@ function mergeClass({
 
   return propClassName ? `${propClassName} ${className}` : className;
 }
+
+export default Tooltip;

src/core/Tooltip/style.ts

@@ -82,7 +82,7 @@ export const tooltipCss = (props: ExtraProps): string => {
     ${sdsStyle === "dark" || inverted ? dark(props) : light(props)}
     ${width === "wide" && sdsStyle === "light" && wide()}
     
-    ${followCursor === true && tableStyles(props)};
+    ${followCursor === true && tableStyles(props)}
 
     border: ${borders?.gray["300"]};
     box-shadow: ${shadows?.m};