"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _vue = require("vue");
var _color = require("../color");
var _input = _interopRequireDefault(require("../../input"));
require("../../_util/EventInterface");
var _util = require("../util");
const colorHexInputProps = () => ({
  prefixCls: String,
  value: Object,
  onChange: Function
});
const hexReg = /(^#[\da-f]{6}$)|(^#[\da-f]{8}$)/i;
const isHexString = hex => hexReg.test(`#${hex}`);
const ColorHexInput = (0, _vue.defineComponent)({
  name: 'ColorHexInput',
  inheritAttrs: false,
  props: colorHexInputProps(),
  setup(props) {
    const colorHexInputPrefixCls = (0, _vue.computed)(() => `${props.prefixCls}-hex-input`);
    const hexValue = (0, _vue.ref)(props.value ? (0, _color.toHexFormat)(props.value.toHexString()) : undefined);
    (0, _vue.watch)(() => props.value, nextValue => {
      if (nextValue) {
        hexValue.value = (0, _color.toHexFormat)(nextValue.toHexString());
      }
    }, {
      immediate: true,
      flush: 'post'
    });
    const handleHexChange = e => {
      var _a;
      const originValue = e.target.value;
      hexValue.value = (0, _color.toHexFormat)(originValue);
      if (isHexString((0, _color.toHexFormat)(originValue, true))) {
        (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, (0, _util.generateColor)(originValue));
      }
    };
    return () => {
      return (0, _vue.createVNode)(_input.default, {
        "class": colorHexInputPrefixCls.value,
        "value": hexValue.value,
        "prefix": "#",
        "onChange": handleHexChange,
        "size": "small"
      }, null);
    };
  }
});
var _default = exports.default = ColorHexInput;