"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _vue = require("vue");
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _useMergedState3 = _interopRequireDefault(require("../../_util/hooks/useMergedState"));
var _select = _interopRequireDefault(require("../../select"));
var _interface = require("../interface");
var _ColorAlphaInput = _interopRequireDefault(require("./ColorAlphaInput"));
var _ColorHexInput = _interopRequireDefault(require("./ColorHexInput"));
var _ColorHsbInput = _interopRequireDefault(require("./ColorHsbInput"));
var _ColorRgbInput = _interopRequireDefault(require("./ColorRgbInput"));
var BaseSelectOptions = [_interface.ColorFormat.hex, _interface.ColorFormat.hsb, _interface.ColorFormat.rgb].map(function (format) {
  return {
    value: format,
    label: format.toLocaleUpperCase()
  };
});
var ColorInput = (0, _vue.defineComponent)({
  name: 'ColorInput',
  props: ['prefixCls', 'format', 'formatOptions', 'onFormatChange', 'value', 'onChange'],
  setup: function setup(props) {
    var _useMergedState = (0, _useMergedState3.default)(props.format, {
        onChange: props.onFormatChange
      }),
      _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
      colorFormat = _useMergedState2[0],
      setColorFormat = _useMergedState2[1];
    var selectOptions = (0, _vue.computed)(function () {
      return props.formatOptions ? BaseSelectOptions.filter(function (option) {
        return props.formatOptions.includes(option.value);
      }) : BaseSelectOptions;
    });
    var colorInputPrefixCls = (0, _vue.computed)(function () {
      return "".concat(props.prefixCls, "-input");
    });
    var handleFormatChange = function handleFormatChange(newFormat) {
      setColorFormat(newFormat);
    };
    var steppersNode = (0, _vue.computed)(function () {
      var inputProps = {
        value: props.value,
        prefixCls: props.prefixCls,
        onChange: props.onChange
      };
      switch (colorFormat.value) {
        case _interface.ColorFormat.hsb:
          return (0, _vue.createVNode)(_ColorHsbInput.default, inputProps, null);
        case _interface.ColorFormat.rgb:
          return (0, _vue.createVNode)(_ColorRgbInput.default, inputProps, null);
        case _interface.ColorFormat.hex:
        default:
          return (0, _vue.createVNode)(_ColorHexInput.default, inputProps, null);
      }
    });
    return function () {
      var _selectOptions$value, _selectOptions$value2, _selectOptions$value3, _selectOptions$value4;
      return (0, _vue.createVNode)("div", {
        "class": "".concat(colorInputPrefixCls.value, "-container")
      }, [((_selectOptions$value = selectOptions.value) === null || _selectOptions$value === void 0 ? void 0 : _selectOptions$value.length) > 1 ? (0, _vue.createVNode)(_select.default, {
        "value": colorFormat.value,
        "bordered": false,
        "dropdownMatchSelectWidth": 68,
        "placement": "bottomRight",
        "onChange": handleFormatChange,
        "class": "".concat(props.prefixCls, "-format-select"),
        "size": "small",
        "options": selectOptions.value
      }, null) : !!((_selectOptions$value2 = selectOptions.value) !== null && _selectOptions$value2 !== void 0 && _selectOptions$value2.length) && (0, _vue.createVNode)("div", {
        "class": "".concat(props.prefixCls, "-format-single")
      }, [(_selectOptions$value3 = selectOptions.value) === null || _selectOptions$value3 === void 0 ? void 0 : (_selectOptions$value4 = _selectOptions$value3[0]) === null || _selectOptions$value4 === void 0 ? void 0 : _selectOptions$value4.label]), (0, _vue.createVNode)("div", {
        "class": colorInputPrefixCls.value
      }, [steppersNode.value]), (0, _vue.createVNode)(_ColorAlphaInput.default, {
        "prefixCls": props.prefixCls,
        "value": props.value,
        "onChange": props.onChange
      }, null)]);
    };
  }
});
var _default = ColorInput;
exports.default = _default;