import { createVNode as _createVNode } from "vue";
import InputNumber from '../../input-number';
import { computed, defineComponent, ref } from 'vue';
import { initDefaultProps } from '../../_util/props-util';
import classNames from '../../_util/classNames';
const colorSteppersProps = () => ({
  prefixCls: String,
  value: Number,
  min: Number,
  max: Number,
  onChange: Function,
  className: String,
  prefix: Function,
  formatter: Function
});
const ColorSteppers = defineComponent({
  name: 'ColorSteppers',
  inheritAttrs: false,
  props: initDefaultProps(colorSteppersProps(), {
    min: 0,
    max: 100
  }),
  setup(props) {
    const colorSteppersPrefixCls = computed(() => `${props.prefixCls}-steppers`);
    const internalValue = ref(0);
    const stepValue = computed(() => !Number.isNaN(props.value) ? props.value : internalValue.value);
    return () => {
      const {
        className,
        min,
        max,
        formatter,
        onChange
      } = props;
      return _createVNode(InputNumber, {
        "class": classNames(colorSteppersPrefixCls.value, className),
        "min": min,
        "max": max,
        "value": stepValue.value,
        "formatter": formatter,
        "size": "small",
        "onChange": step => {
          internalValue.value = Number(step) || 0;
          onChange === null || onChange === void 0 ? void 0 : onChange(Number(step));
        }
      }, null);
    };
  }
});
export default ColorSteppers;