// import React from 'react';

// class VibrancyView extends React.Component {
//   render() {
//     console.error('VibrancyView is not implemented on harmony');
//     return null;
//   }
// }

// export default VibrancyView;

import React, { forwardRef } from 'react';
import { StyleSheet, ViewProps, ViewStyle, View } from 'react-native';
import NativeBlurView from '../fabric/BlurViewNativeComponentHarmony';

type BlurType =
  | 'dark'
  | 'light'
  | 'thickMaterialDark'
  | 'thinMaterialDark'
  | 'thickMaterialLight'
  | 'thinMaterialLight';

export type VibrancyViewProps = ViewProps & {
  blurType?: BlurType;
  blurAmount?: number;
};

const VibrancyView = forwardRef<View, VibrancyViewProps>(
  ({ blurType = 'dark', blurAmount = 10, style, ...rest }, ref) => (
    <NativeBlurView
      ref={ref}
      style={StyleSheet.compose(styles.transparent, style)}
      blurType={blurType}
      blurAmount={blurAmount}
      {...rest}
    />
  )
);

const styles = StyleSheet.create<{ transparent: ViewStyle }>({
  transparent: { backgroundColor: 'transparent' },
});

export default VibrancyView;