@progress/kendo-vue-inputs
Version:
80 lines (79 loc) • 1.95 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { defineComponent as s, createVNode as o } from "vue";
import { parseColor as i } from "./utils/color-parser.mjs";
import { isPresent as r } from "./utils/misc.mjs";
import { TextBox as h } from "../textbox/TextBox.mjs";
const x = /* @__PURE__ */ s({
name: "KendoHexInput",
emits: {
hexchange: null,
blur: null,
focus: null
},
props: {
tabIndex: Number,
hex: String,
disabled: Boolean,
id: String,
size: String
},
computed: {
isHexValid() {
return !!i(this.currentHex, "rgba");
}
},
data() {
return {
currentHex: this.$props.hex,
originalHex: this.$props.hex
};
},
mounted() {
this._input = this.$refs.input._input;
},
watch: {
hex: function(e) {
this.currentHex = e;
}
},
render() {
return o(h, {
id: this.$props.id,
value: this.currentHex,
onInput: this.onChange,
onChange: this.onChange,
onFocus: this.onFocus,
onBlur: this.onBlur,
valid: this.isHexValid,
disabled: this.$props.disabled,
size: this.$props.size,
tabIndex: this.tabIndex,
ref: "input"
}, null);
},
methods: {
onChange(e) {
const t = e.target.value, n = i(t, "rgba");
this.currentHex = t, r(n) && this.$emit("hexchange", {
hex: t,
value: n,
event: e
});
},
onBlur(e) {
r(i(this.hex, "rgba")) || (this.currentHex = this.originalHex), this.$emit("blur", e);
},
onFocus(e) {
this.$emit("focus", e);
}
}
});
export {
x as HexInput
};