Update react, add some V2 components for V1 usage

resources/scripts/components/elements/transitions/FadeTransition.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import { Transition } from '@headlessui/react';
+
+type Duration = `duration-${number}`;
+
+interface Props {
+    as?: React.ElementType;
+    duration?: Duration | [ Duration, Duration ];
+    show: boolean;
+    children: React.ReactNode;
+}
+
+export default ({ children, duration, ...props }: Props) => {
+    const [ enterDuration, exitDuration ] = Array.isArray(duration)
+        ? duration
+        : (!duration ? [ 'duration-200', 'duration-100' ] : [ duration, duration ]);
+
+    return (
+        <Transition
+            {...props}
+            enter={`ease-out ${enterDuration}`}
+            enterFrom={'opacity-0'}
+            enterTo={'opacity-100'}
+            leave={`ease-in ${exitDuration}`}
+            leaveFrom={'opacity-100'}
+            leaveTo={'opacity-0'}
+        >
+            {children}
+        </Transition>
+    );
+};