"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _vue = require("vue");
var _input = _interopRequireDefault(require("../../input"));
var _util = require("../util");
var hexReg = /(^#[\da-f]{6}$)|(^#[\da-f]{8}$)/i;
var isHexString = function isHexString(hex) {
  return hexReg.test("#".concat(hex));
};
var ColorHexInput = (0, _vue.defineComponent)({
  name: 'ColorHexInput',
  props: ['prefixCls', 'value', 'onChange'],
  setup: function setup(props) {
    var _props$value;
    var colorHexInputPrefixCls = (0, _vue.computed)(function () {
      return "".concat(props.prefixCls, "-hex-input");
    });
    var hexValue = (0, _vue.ref)((_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.toHex());
    (0, _vue.watch)(function () {
      return props.value;
    }, function (val) {
      var hex = val === null || val === void 0 ? void 0 : val.toHex();
      if (isHexString(hex) && val) {
        hexValue.value = (0, _util.toHexFormat)(hex);
      }
    }, {
      immediate: true
    });
    var handleHexChange = function handleHexChange(e) {
      var originValue = e.target.value;
      hexValue.value = (0, _util.toHexFormat)(originValue);
      if (isHexString((0, _util.toHexFormat)(originValue, true))) {
        var _props$onChange;
        (_props$onChange = props.onChange) === null || _props$onChange === void 0 ? void 0 : _props$onChange.call(props, (0, _util.generateColor)(originValue));
      }
    };
    return function () {
      return (0, _vue.createVNode)(_input.default, {
        "class": colorHexInputPrefixCls.value,
        "value": hexValue.value.toUpperCase(),
        "prefix": "#",
        "onChange": handleHexChange,
        "size": "small"
      }, null);
    };
  }
});
var _default = ColorHexInput;
exports.default = _default;