import type { BaseElementProps } from './types';
import type { InputNumberProps as AntInputNumberProps } from 'antd';
import { Form, InputNumber as AntInputNumber } from 'antd';
import type { FC } from 'react';

const { Item: FormItem } = Form;

type InputNumberProps = AntInputNumberProps<number>;

function InputNumber({
  setValue,
  status,
  validateStatus,
  help,
  ...props
}: BaseElementProps<number>) {
  function handleChange(value: number | null) {
    if (value) {
      setValue(value);
    } else {
      setValue(0);
    }
  }

  return (
    <FormItem hasFeedback help={help} validateStatus={validateStatus}>
      <AntInputNumber
        disabled={status === 'Disabled'}
        onChange={handleChange}
        // eslint-disable-next-line react/forbid-component-props
        style={{
          width: '100%',
        }}
        {...props}
      />
    </FormItem>
  );
}

export default InputNumber as FC<InputNumberProps>;

export function createFormatter(options: Intl.NumberFormatOptions) {
  const format = Intl.NumberFormat('ru', options).format;
  const defaultFormat = Intl.NumberFormat('ru').format;

  return ((value, { userTyping }) => {
    if (userTyping) {
      if (options.minimumFractionDigits && options.minimumFractionDigits <= 2) {
        return defaultFormat(value || 0);
      }

      return value || 0;
    }

    return format(value || 0);
  }) as NonNullable<InputNumberProps['formatter']>;
}