@arkyn/components 1.3.9 → 1.3.11

package/dist/hooks/useAutomation.js

@@ -1,13 +1,25 @@
 import { useActionData } from "@remix-run/react";
 import { useContext, useEffect } from "react";
 import { ModalContext } from "../context/ModalContext";
+import { useToast } from "./useToast";
 function useAutomation() {
     const actionData = useActionData();
     const { closeModal } = useContext(ModalContext);
+    const { successToast, errorToast } = useToast();
     useEffect(() => {
         const closeModalKey = actionData?.closeModalKey;
         if (closeModalKey)
             closeModal(closeModalKey);
     }, [actionData]);
+    useEffect(() => {
+        const showToast = typeof actionData?.message === "string" &&
+            typeof actionData?.success === "boolean";
+        if (showToast) {
+            if (actionData?.success)
+                successToast(actionData?.message);
+            else
+                errorToast(actionData?.message);
+        }
+    }, [actionData]);
 }
 export { useAutomation };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arkyn/components",
-  "version": "1.3.9",
+  "version": "1.3.11",
   "main": "./dist/bundle.js",
   "types": "./dist/index.d.ts",
   "author": "Lucas Gonçalves",

package/src/components/Input/index.tsx

@@ -10,7 +10,7 @@ import "./styles.css";
 function Input(props: InputProps) {
   if (props.type === "currency") return <CurrencyInput {...props} />;
   if (props.type === "masked") return <MaskedInput {...props} />;
-  if (props.type === "cpf-cpnj") return <CpfCnpjInput {...props} />;
+  if (props.type === "cpf-cnpj") return <CpfCnpjInput {...props} />;
   return <SimpleInput {...props} />;
 }
 

package/src/components/Select/getConfig.tsx

@@ -19,6 +19,7 @@ function getConfig(props: SelectProps, isFocused: boolean) {
     title,
     style,
     isSearchable = false,
+    closeOnSelect = true,
     ...rest
   } = props;
 
@@ -41,6 +42,7 @@ function getConfig(props: SelectProps, isFocused: boolean) {
     onFocus,
     onBlur,
     title,
+    closeOnSelect,
     style,
     isSearchable,
     iconSize: iconSize,

package/src/components/Select/index.tsx

@@ -39,6 +39,7 @@ function Select(props: SelectProps) {
     onSelect,
     options,
     optionMaxHeight,
+    closeOnSelect,
     ...rest
   } = getConfig({ ...props, id, isError }, isFocused);
 
@@ -136,6 +137,7 @@ function Select(props: SelectProps) {
                   if (selectedValue !== value) setSelectedValue(value);
                   else setSelectedValue("");
                   onSelect && onSelect({ label, value });
+                  closeOnSelect && setTimeout(() => handleBlur(), 100);
                 }}
               >
                 {label} <Check />

package/src/hooks/useAutomation.ts

@@ -2,15 +2,28 @@ import { useActionData } from "@remix-run/react";
 import { useContext, useEffect } from "react";
 
 import { ModalContext } from "../context/ModalContext";
+import { useToast } from "./useToast";
 
 function useAutomation() {
   const actionData = useActionData<any>();
   const { closeModal } = useContext(ModalContext);
+  const { successToast, errorToast } = useToast();
 
   useEffect(() => {
     const closeModalKey = actionData?.closeModalKey;
     if (closeModalKey) closeModal(closeModalKey);
   }, [actionData]);
+
+  useEffect(() => {
+    const showToast =
+      typeof actionData?.message === "string" &&
+      typeof actionData?.success === "boolean";
+
+    if (showToast) {
+      if (actionData?.success) successToast(actionData?.message);
+      else errorToast(actionData?.message);
+    }
+  }, [actionData]);
 }
 
 export { useAutomation };