import { SerializableValue } from '@bit-ui-libs/common';
import { createContext } from 'react';
import { StyleProp, View, ViewStyle } from 'react-native';

export type RadioButtonGroupProps = {
  onValueChange: (name: SerializableValue) => void;
  name: SerializableValue;
  children: React.ReactNode;
  style?: StyleProp<ViewStyle>;
};

export type RadioButtonContextType = {
  name: SerializableValue;
  onValueChange: (name: SerializableValue) => void;
};

export const RadioButtonContext = createContext<RadioButtonContextType>(null as any);

export function RadioButtonGroup(props: RadioButtonGroupProps) {
  const { name, onValueChange, children, style } = props;
  return (
    <RadioButtonContext.Provider value={{ name, onValueChange }}>
      <View accessibilityRole="radiogroup" style={style}>
        {children}
      </View>
    </RadioButtonContext.Provider>
  );
}