Modify node version and fix eslint prettier errors

Author: Hector Arce De Las Heras

package.json

@@ -20,7 +20,7 @@
   "module": "./dist/esm/index.js",
   "types": "./dist/esm/index.d.ts",
   "engines": {
-    "node": ">=21.1.0",
+    "node": ">=20.x",
     "npm": ">=7.0.0"
   },
   "files": [

src/components/backToTop/backToTopControlled.tsx

@@ -25,9 +25,13 @@ const BackToTopControlledComponent = React.forwardRef(
 
     const innerRef = React.useRef<HTMLButtonElement | null>(null);
 
-    React.useImperativeHandle(ref, () => {
-      return innerRef?.current as HTMLButtonElement;
-    }, []);
+    React.useImperativeHandle(
+      ref,
+      () => {
+        return innerRef?.current as HTMLButtonElement;
+      },
+      []
+    );
 
     const { state, setRef } = useManageState({
       states: Object.values(BackToTopStateType) as States,

src/components/header/hook/useHeaderShadow.ts

@@ -17,9 +17,13 @@ type HeaderShadowReturnValues = {
 export const useHeaderShadow = ({ ref, shadow }: HeaderShadowProps): HeaderShadowReturnValues => {
   const headerRef = useRef<HTMLElement | null>(null);
 
-  useImperativeHandle(ref, () => {
-    return headerRef?.current as HTMLDivElement;
-  }, []);
+  useImperativeHandle(
+    ref,
+    () => {
+      return headerRef?.current as HTMLDivElement;
+    },
+    []
+  );
 
   useEffect(() => {
     if (!headerRef.current) {

src/components/icon/iconStandAlone.tsx

@@ -27,6 +27,7 @@ const IconComplexComponent = (
 
   React.useEffect(() => {
     (async () => {
+      // eslint-disable-next-line n/no-unsupported-features/node-builtins
       const res = await fetch(icon);
       let response = '';
       if (res) {

src/components/listOptions/listOptionsStandAlone.tsx

@@ -39,9 +39,13 @@ export const ListOptionsStandAlone = React.forwardRef(
     const [focus, setFocus, listEl] = useRoveFocus(props.roveFocus ?? roveFocusProps);
     const _id = useId();
 
-    React.useImperativeHandle(ref, () => {
-      return listEl.current as HTMLDivElement;
-    }, []);
+    React.useImperativeHandle(
+      ref,
+      () => {
+        return listEl.current as HTMLDivElement;
+      },
+      []
+    );
 
     const id = props.id ?? _id;
     const isSelection = type === ListOptionsType.SELECTION;

src/components/option/option.tsx

@@ -20,9 +20,13 @@ export const OptionComponent = React.forwardRef(
     const [hover, setHover] = React.useState(false);
     const [focused, setFocused] = React.useState(false);
 
-    React.useImperativeHandle(ref, () => {
-      return innerRef.current as HTMLElement;
-    }, []);
+    React.useImperativeHandle(
+      ref,
+      () => {
+        return innerRef.current as HTMLElement;
+      },
+      []
+    );
 
     React.useEffect(() => {
       if (focus) {

src/components/pillSelector/pillSelectorControlled.tsx

@@ -38,9 +38,13 @@ const PillSelectorControlledComponent = React.forwardRef(
       }
     };
 
-    React.useImperativeHandle(ref, () => {
-      return measuredRef.current as HTMLDivElement;
-    }, []);
+    React.useImperativeHandle(
+      ref,
+      () => {
+        return measuredRef.current as HTMLDivElement;
+      },
+      []
+    );
 
     React.useEffect(() => {
       let resizeObserver: ResizeObserver;

src/components/pillSelector/pillSelectorStandAlone.tsx

@@ -30,9 +30,13 @@ const PillSelectorStandAloneComponent = (
 
   const isPillSelected = props.pillSelected?.length !== 0;
 
-  React.useImperativeHandle(ref, () => {
-    return listEl.current as HTMLDivElement;
-  }, []);
+  React.useImperativeHandle(
+    ref,
+    () => {
+      return listEl.current as HTMLDivElement;
+    },
+    []
+  );
 
   return (
     <PillSelectorWrapper

src/components/thirdPartyAnimation/thirdPartyAnimation.tsx

@@ -22,9 +22,13 @@ const ThirdPartyAnimationComponent = <V extends string | unknown>(
   const { thirdPartyAnimationData } = variantTheme;
   const element = React.useRef<HTMLDivElement>(null);
 
-  React.useImperativeHandle(ref, () => {
-    return element.current as HTMLDivElement;
-  }, []);
+  React.useImperativeHandle(
+    ref,
+    () => {
+      return element.current as HTMLDivElement;
+    },
+    []
+  );
 
   React.useEffect(() => {
     if (element.current) {

src/components/tooltip/tooltipUnControlled.tsx

@@ -29,9 +29,13 @@ const TooltipUnControlledComponent = React.forwardRef(
       styleTooltipAsModal: styles.tooltipAsModal,
     });
 
-    React.useImperativeHandle(ref, () => {
-      return labelRef.current as HTMLDivElement;
-    }, []);
+    React.useImperativeHandle(
+      ref,
+      () => {
+        return labelRef.current as HTMLDivElement;
+      },
+      []
+    );
 
     const { showTooltip, hideTooltip, allowFocusOpenTooltip, open } = useTooltip<V>({
       labelRef,