import { computed, defineComponent, ref, createVNode as _createVNode } from 'vue';
import { generateColor, getColorAlpha } from '../util';
import ColorSteppers from './ColorSteppers';
const colorAlphaInputProps = () => ({
  prefixCls: String,
  value: Object,
  onChange: Function
});
const ColorAlphaInput = defineComponent({
  name: 'ColorAlphaInput',
  inheritAttrs: false,
  props: colorAlphaInputProps(),
  setup(props) {
    const colorAlphaInputPrefixCls = computed(() => `${props.prefixCls}-alpha-input`);
    const internalValue = ref(generateColor(props.value || '#000'));
    const alphaValue = computed(() => props.value || internalValue.value);
    const handleAlphaChange = step => {
      var _a;
      const hsba = alphaValue.value.toHsb();
      hsba.a = (step || 0) / 100;
      const genColor = generateColor(hsba);
      internalValue.value = genColor;
      (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, genColor);
    };
    return () => _createVNode(ColorSteppers, {
      "value": getColorAlpha(alphaValue.value),
      "prefixCls": props.prefixCls,
      "formatter": step => `${step}%`,
      "className": colorAlphaInputPrefixCls.value,
      "onChange": handleAlphaChange
    }, null);
  }
});
export default ColorAlphaInput;