chore: rabbit-review

Author: tractorss

src/lib/button/ButtonIcon.tsx

@@ -6,19 +6,28 @@ const ButtonIcon: React.FC<
   Pick<ButtonProps, "Icon" | "icon" | "isDisabled" | "isLoading" | "variant">
 > = ({ Icon, icon, isDisabled, isLoading, variant }) => {
   const isSecondary = variant === "secondary";
-  return icon
-    ? !isLoading && icon
-    : Icon && (
-        <Icon
-          className={cn(
-            "button-svg",
-            "mr-2 size-4",
-            "fill-klerosUIComponentsWhiteBackground",
-            isLoading && ["invisible"],
-            isSecondary && ["fill-klerosUIComponentsPrimaryBlue"],
-            isDisabled && ["fill-klerosUIComponentsStroke"],
-          )}
-        />
-      );
+  return icon ? (
+    isLoading ? (
+      <span
+        className={cn("button-svg", "mr-2 size-4", "invisible")}
+        aria-hidden
+      />
+    ) : (
+      icon
+    )
+  ) : (
+    Icon && (
+      <Icon
+        className={cn(
+          "button-svg",
+          "mr-2 size-4",
+          "fill-klerosUIComponentsWhiteBackground",
+          isLoading && ["invisible"],
+          isSecondary && ["fill-klerosUIComponentsPrimaryBlue"],
+          isDisabled && ["fill-klerosUIComponentsStroke"],
+        )}
+      />
+    )
+  );
 };
 export default ButtonIcon;

src/lib/form/file-uploader.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import UploadIcon from "../../assets/svgs/form/upload-icon.svg";
 import SuccessIcon from "../../assets/svgs/status-icons/success.svg";
 import ErrorIcon from "../../assets/svgs/status-icons/error.svg";
@@ -48,6 +48,10 @@ function FileUploader({
     selectedFile,
   );
 
+  useEffect(() => {
+    setFileSelected(selectedFile);
+  }, [selectedFile]);
+
   return (
     <div className={cn("box-border h-fit w-50", className)}>
       <DropZone
@@ -81,7 +85,8 @@ function FileUploader({
             const file = await item.getFile();
             const validated = validationFunction?.(file) ?? true;
             if (!validated) return;
-            setFileSelected(file);
+            if (selectedFile === undefined) setFileSelected(file);
+
             callback(file);
           }
         }}
@@ -94,7 +99,7 @@ function FileUploader({
               const file = e[0];
               const validated = validationFunction?.(file) ?? true;
               if (!validated) return;
-              setFileSelected(file);
+              if (selectedFile === undefined) setFileSelected(file);
               callback(file);
             }
           }}

src/lib/progress/timeline/custom.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import Bullet, { StateProp, VariantProp } from "./bullet";
 import { cn } from "../../../utils";
 
-interface TimelineItem extends VariantProp, StateProp {
+export interface TimelineItem extends VariantProp, StateProp {
   title: string;
   party: string | React.ReactElement;
   subtitle: string;

src/lib/progress/timeline/index.tsx

@@ -10,7 +10,7 @@ export interface TimelineItem extends SideProp, VariantProp {
 }
 
 export interface TimelineProps {
-  items: TimelineItem[];
+  items: [TimelineItem, ...TimelineItem[]];
   className?: string;
 }
 

src/lib/tooltip/index.tsx

@@ -44,7 +44,10 @@ function Tooltip({
   return (
     <TooltipTrigger {...{ delay }} {...props}>
       <Focusable>
-        <div {...props.wrapperProps} role="button">
+        <div
+          {...props.wrapperProps}
+          role={props?.wrapperProps?.role ?? "button"}
+        >
           {children}
         </div>
       </Focusable>