gbs-add-block 0.0.42 → 0.0.44

package/README.md

@@ -1,4 +1,4 @@
-# GBS Building Blocks 2.0 (v0.0.42)
+# GBS Building Blocks 2.0 (v0.0.44)
 
 Latest and upgraded version of GBS building blocks with headless UI and removed dependencies.
 
@@ -6,7 +6,7 @@ Latest and upgraded version of GBS building blocks with headless UI and removed
 
 For detailed documentation on usage and props, Please visit: [Building Block Documentation v2.0](https://blackmax-designs.gitbook.io/building-block-v2.0)
 
-## What's New 🎉 (Ver 0.0.42)
+## What's New 🎉 (Ver 0.0.44)
 
 - Refactored Code for Better Readability and removed dependency for Toast
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gbs-add-block",
-  "version": "0.0.42",
+  "version": "0.0.44",
   "description": "React Component Library",
   "files": [
     "index.js",

package/source/components/formrenderer/SelectHandles.tsx

@@ -92,7 +92,7 @@ export default function SelectHandles({
     }
   }, [item?.name, dependencyMap, formRef]);
 
-  const handleSelect = (value: string, key: string) => {
+  const handleSelect = (value: string | undefined, key: string) => {
     if (!formRef?.current) return;
 
     let input = formRef.current.querySelector(
@@ -106,7 +106,9 @@ export default function SelectHandles({
       formRef.current.appendChild(input);
     }
 
-    input.value = value;
+    if (value) {
+      input.value = value;
+    }
     const event = new Event("change", { bubbles: true });
     input.dispatchEvent(event);
   };
@@ -123,7 +125,7 @@ export default function SelectHandles({
         name={item?.name}
         items={options}
         selectedItem={item?.value ?? ""}
-        onSelect={(value: string) => {
+        onSelect={(value: string | undefined) => {
           item?.name && handleSelect(value, item.name);
           setRequirementError &&
             setRequirementError((prevErrors) =>

package/source/components/toast/ToastComponent.tsx

@@ -1,6 +1,7 @@
 import React, { useEffect } from "react";
 import { Toast } from "./types";
 import { useToastStore } from "./toastStore";
+import ToastIcon from "./ToastIcon";
 
 interface ToastProps {
   toast: Toast;
@@ -13,11 +14,11 @@ const bgColors = {
   warning: "bg-yellow-50 hover:bg-yellow-100",
 } as const;
 
-const iconColors = {
-  default: "text-gray-800",
-  success: "text-green-600",
-  error: "text-red-600",
-  warning: "text-yellow-600",
+const toastAnimation = {
+  default: "",
+  error: "animate-shake animate-once animate-duration-200",
+  success: "animate-jump-in animate-once animate-duration-200",
+  warning: "animate-jump-in animate-once animate-duration-200",
 } as const;
 
 const CloseButton = ({ onDismiss }: { onDismiss: () => void }) => (
@@ -41,57 +42,6 @@ const CloseButton = ({ onDismiss }: { onDismiss: () => void }) => (
   </button>
 );
 
-const ToastIcon = ({ type }: { type: Toast["type"] }) => {
-  if (!type) return null;
-
-  return (
-    <div className={`h-5 w-5 ${iconColors[type]}`}>
-      {type === "success" && (
-        <svg
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="2"
-        >
-          <path
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            d="M5 13l4 4L19 7"
-          />
-        </svg>
-      )}
-      {type === "error" && (
-        <svg
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="2"
-        >
-          <path
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            d="M6 18L18 6M6 6l12 12"
-          />
-        </svg>
-      )}
-      {type === "warning" && (
-        <svg
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="2"
-        >
-          <path
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
-          />
-        </svg>
-      )}
-    </div>
-  );
-};
-
 export function ToastComponent({ toast }: ToastProps) {
   const { dismiss } = useToastStore();
   const handleDismiss = () => dismiss(toast.id);
@@ -121,9 +71,10 @@ export function ToastComponent({ toast }: ToastProps) {
     <div
       className={`
         ${bgColors[toast.type || "default"]}
+        ${toastAnimation[toast.type || "default"]}
         transform transition-all duration-300 ease-in-out
         pointer-events-auto relative flex w-full items-center justify-between
-        overflow-hidden rounded-lg border p-4 shadow-lg
+        overflow-hidden rounded-full border px-4 py-3 shadow-lg
       `}
       role="alert"
     >

package/source/components/toast/ToastIcon.tsx

@@ -0,0 +1,61 @@
+import { Toast } from "./types";
+
+const ToastIcon = ({ type }: { type: Toast["type"] }) => {
+  if (!type) return null;
+
+  const iconColors = {
+    default: "text-gray-800",
+    success: "text-green-600",
+    error: "text-red-600",
+    warning: "text-yellow-600",
+  } as const;
+
+  return (
+    <div className={`h-5 w-5 ${iconColors[type]}`}>
+      {type === "success" && (
+        <svg
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          strokeWidth="2"
+        >
+          <path
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            d="M5 13l4 4L19 7"
+          />
+        </svg>
+      )}
+      {type === "error" && (
+        <svg
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          strokeWidth="2"
+        >
+          <path
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            d="M6 18L18 6M6 6l12 12"
+          />
+        </svg>
+      )}
+      {type === "warning" && (
+        <svg
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          strokeWidth="2"
+        >
+          <path
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
+          />
+        </svg>
+      )}
+    </div>
+  );
+};
+
+export default ToastIcon;

package/source/components/uploader/index.tsx

@@ -182,6 +182,11 @@ export const FileUploader = ({
       return rest;
     });
 
+    // Reset file input to allow re-selecting the same file
+    if (fileInputRef.current) {
+      fileInputRef.current.value = "";
+    }
+
     if (onChange) onChange(updatedFiles);
   };