chore: Export correct createAnimatedComponent (#8395)

## Summary

Up to this PR classic `createAnimatedComponent` could only be "imported"
and used by:

```tsx
import Animated from 'react-native-reanimated'

const Test = Animated.createAnimatedComponent(Text)
```

And when user decided to import `createAnimatedComponent` directly it
resulted in importing `createAnimatedComponent` from CSS. It created
issues and confusion.

We've decided to also export classic `createAnimatedComponent` as a
standalone function, so it can be used directly as
`createAnimatedComponent(Text)` and also as
`Animated.createAnimatedComponent(Text)`

This also lead to renaming `createAnimatedComponent` from CSS to
`createCSSAnimatedComponent`, for better clearance.


## Test plan

Author: patrycjakalinska

apps/common-app/src/apps/css/examples/animations/screens/testExamples/Playground.tsx

@@ -5,12 +5,12 @@
 
 import React from 'react';
 import { Text, View } from 'react-native';
-import { createAnimatedComponent, css } from 'react-native-reanimated';
+import { createCSSAnimatedComponent, css } from 'react-native-reanimated';
 
 import { Screen } from '@/apps/css/components';
 import { flex } from '@/theme';
 
-const AnimatedView = createAnimatedComponent(View);
+const AnimatedView = createCSSAnimatedComponent(View);
 
 export default function Playground() {
   return (

packages/react-native-reanimated/src/css/index.ts

@@ -1,5 +1,5 @@
 'use strict';
-export { createAnimatedComponent } from './component';
+export { createAnimatedComponent as createCSSAnimatedComponent } from './component';
 export { cubicBezier, linear, steps } from './easing';
 export * from './stylesheet';
 export type {

packages/react-native-reanimated/src/index.ts

@@ -14,6 +14,7 @@ import * as Animated from './Animated';
 
 export default Animated;
 
+export { createAnimatedComponent } from './Animated';
 export type {
   DecayAnimation,
   DelayAnimation,