import { View } from '@tarojs/components';
import type { MlTextInputProps } from './types';
import { ActiveInput } from './active-input';
import { MlReadonlyInput } from '../ml-readonly-input';
import { useBoolean } from 'mixlea-hooks-react';

export function MlTextInput(props: MlTextInputProps) {
  const [active, { setTrue, setFalse }] = useBoolean();

  return (
    <View className="h-full w-full" onClick={setTrue}>
      {active ? <ActiveInput {...props} onBlur={setFalse} /> : <MlReadonlyInput {...props} />}
    </View>
  );
}