@arkyn/components 1.3.22 → 1.3.23

package/src/components/Select/index.tsx

@@ -65,6 +65,20 @@ function Select(props: SelectProps) {
     }
   }
 
+  function handleChangeValue(option: { label: string; value: string }) {
+    const { label, value } = option;
+
+    if (selectedValue !== value) setSelectedValue(value);
+    else setSelectedValue("");
+
+    if (onSelect) onSelect({ label, value });
+    if (closeOnSelect) {
+      ref.current.blur();
+      setIsFocused(false);
+      console.log("fecha");
+    }
+  }
+
   const currentValue =
     typeof baseValue === "string" ? baseValue : selectedValue;
 
@@ -125,27 +139,26 @@ function Select(props: SelectProps) {
         />
 
         {isFocused && (
-          <ul
+          <div
             className="arkyn_select_content"
             style={{ overflow: "auto", maxHeight: optionMaxHeight }}
           >
             {filteredOptions.map(({ label, value }) => (
-              <li
+              <div
                 key={value}
-                className={currentValue === value ? "active" : ""}
-                onClick={() => {
-                  if (selectedValue !== value) setSelectedValue(value);
-                  else setSelectedValue("");
-                  onSelect && onSelect({ label, value });
-                  closeOnSelect && setTimeout(() => handleBlur(), 100);
-                }}
+                onClick={() => handleChangeValue({ label, value })}
+                className={
+                  currentValue === value
+                    ? "arkyn_select_option active"
+                    : "arkyn_select_option"
+                }
               >
                 {label} <Check />
-              </li>
+              </div>
             ))}
 
             {filteredOptions.length <= 0 && <p>Sem opções disponíveis</p>}
-          </ul>
+          </div>
         )}
 
         {!isLoading && (

package/src/components/Select/styles.css

@@ -222,7 +222,7 @@
   background-color: var(--secondary-50);
 }
 
-.arkyn_select_content > li {
+.arkyn_select_content .arkyn_select_option {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -233,12 +233,12 @@
   color: var(--secondary-500);
 }
 
-.arkyn_select.md .arkyn_select_content > li {
+.arkyn_select.md .arkyn_select_content .arkyn_select_option {
   font-size: 14px;
   padding: 8px 16px;
 }
 
-.arkyn_select.lg .arkyn_select_content > li {
+.arkyn_select.lg .arkyn_select_content .arkyn_select_option {
   font-size: 16px;
   padding: 8px 16px;
 }
@@ -253,30 +253,30 @@
   color: var(--secondary-500);
 }
 
-.arkyn_select_content > li svg {
+.arkyn_select_content .arkyn_select_option svg {
   height: 20px;
   width: 20px;
   color: var(--primary-500);
   display: none;
 }
 
-.arkyn_select_content > li:hover {
+.arkyn_select_content .arkyn_select_option:hover {
   cursor: pointer;
   background-color: var(--secondary-100);
 }
 
-.arkyn_select_content > li:not(:last-child) {
+.arkyn_select_content .arkyn_select_option:not(:last-child) {
   border-bottom: 1px solid var(--secondary-300);
 }
 
-.arkyn_select_content > li.active {
+.arkyn_select_content .arkyn_select_option.active {
   font-weight: 600;
 
   color: var(--secondary-900);
   background-color: var(--secondary-100);
 }
 
-.arkyn_select_content > li.active svg {
+.arkyn_select_content .arkyn_select_option.active svg {
   display: unset;
 }
 

package/src/hooks/useAutomation.ts

@@ -17,7 +17,8 @@ function useAutomation() {
   useEffect(() => {
     const showToast =
       typeof actionData?.message === "string" &&
-      typeof actionData?.success === "boolean";
+      typeof actionData?.success === "boolean" &&
+      actionData.message !== "";
 
     if (showToast) {
       if (actionData?.success) successToast(actionData?.message);

package/src/utils/generateIcon.tsx

@@ -1,5 +1,4 @@
 import type { LucideIcon } from "lucide-react";
-import React from "react";
 
 function GenerateIcon(iconSize: number, Icon?: LucideIcon) {
   if (!Icon) return <></>;