@progress/kendo-vue-buttons
Version:
246 lines (245 loc) • 6.91 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { defineComponent as x, createVNode as g, isVNode as F } from "vue";
import { getDefaultSlots as v, getKendoPasteEventTarget as T, dispatchKendoPasteEvent as B, validatePackage as w } from "@progress/kendo-vue-common";
import { KendoSmartPaste as A } from "@progress/kendo-smartpaste-common";
import { Button as S } from "../Button.mjs";
import { pasteSparkleIcon as N } from "@progress/kendo-svg-icons";
import { packageMetadata as O } from "../package-metadata.mjs";
function $(e) {
return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !F(e);
}
const L = [".k-input", ".k-picker", ".k-checkbox", ".k-radio", ".k-switch", ".k-rating", ".k-slider"], M = (e) => {
const t = e.querySelector("input, select, textarea");
return (t == null ? void 0 : t.getAttribute("name")) || (t == null ? void 0 : t.getAttribute("id")) || e.getAttribute("id") || null;
}, V = (e, t) => {
const r = e.element, n = r instanceof HTMLInputElement || r instanceof HTMLSelectElement || r instanceof HTMLTextAreaElement ? r : r.querySelector("input, select, textarea");
if (n) {
if (n instanceof HTMLSelectElement) {
const i = Array.from(n.querySelectorAll("option")), s = i.find((a) => a.textContent === t) || i.find((a) => {
var l;
return (l = a.textContent) == null ? void 0 : l.includes(t);
});
s && (n.selectedIndex = i.indexOf(s));
} else if (n instanceof HTMLInputElement && n.type === "date") {
const i = new Date(t);
n.value = isNaN(i.getTime()) ? t : i.toISOString().split("T")[0];
} else
n.value = t;
n.dispatchEvent(new CustomEvent("input", {
bubbles: !0,
detail: {
fromSmartComponents: !0
}
})), n.dispatchEvent(new CustomEvent("change", {
bubbles: !0,
detail: {
fromSmartComponents: !0
}
}));
}
}, R = /* @__PURE__ */ x({
name: "KendoSmartPasteButton",
emits: {
click: (e) => !0
},
props: {
disabled: {
type: Boolean,
default: void 0
},
fillMode: {
type: String,
default: "solid"
},
rounded: {
type: String,
default: "medium"
},
size: {
type: String,
default: "medium"
},
svgIcon: {
type: Object,
default: () => N
},
themeColor: String,
formFields: Array,
togglable: {
type: Boolean,
default: !1
},
selected: {
type: Boolean,
default: void 0
},
icon: String,
iconClass: String,
imageUrl: String,
imageAlt: String,
tabIndex: Number,
id: String,
type: {
type: String,
default: "button"
},
role: String,
ariaLabel: String,
ariaPressed: Boolean,
title: String,
dir: String,
iconSize: String
},
created() {
w(O), this.smartPasteInstance = null;
},
methods: {
getSmartPasteInstance() {
return this.getButtonElement() ? (this.smartPasteInstance || (this.smartPasteInstance = new A({
getElement: () => this.getButtonElement(),
customInputs: L.map((t) => ({
identifier: t
})),
getSmartPasteField: (t) => {
const r = M(t.element);
return r ? {
...t,
field: r
} : t;
},
setKendoInputValue: V
})), this.smartPasteInstance) : null;
},
getButtonElement() {
var t;
const e = this.$refs.buttonRef;
return (t = e == null ? void 0 : e.$el) != null ? t : null;
},
extractFormConfig() {
const e = this.getSmartPasteInstance();
if (!e)
return this.$props.formFields;
const r = e.extractFormConfig().reduce((o, n) => o.some((i) => i.field === n.field) ? o : [...o, n], []);
return this.$props.formFields ? this.$props.formFields.map((o) => {
const n = r.find((i) => i.field === o.field);
if (n) {
const i = {
...n,
...o,
element: n.element
};
return n.type === "kendo-input" && (i.type = "kendo-input"), i;
}
return o;
}) : r;
},
async extractClipboard() {
try {
return await navigator.clipboard.readText();
} catch {
return "";
}
},
populateFormFieldsInternal(e, t) {
if (!e || !t)
return;
const r = Object.entries(e).reduce((i, [s, a]) => (a != null && (i[s] = a), i), {}), o = this.getButtonElement();
if (o) {
const i = T(o);
B(i, r);
}
const n = this.getSmartPasteInstance();
n && n.populateFormFields({
fieldValues: r
}, t);
},
async handleClick(e) {
if (this.$props.disabled)
return;
const t = await this.extractClipboard(), r = this.extractFormConfig(), o = r == null ? void 0 : r.map((s) => {
var c, u, m;
const {
element: a,
...l
} = s, d = (c = this.$props.formFields) == null ? void 0 : c.find((f) => f.field === l.field);
return {
...l,
type: (u = d == null ? void 0 : d.type) != null ? u : l.type,
field: l.field || "",
allowedValues: (m = l.allowedValues) != null ? m : []
};
}), i = {
event: e,
requestData: {
content: t,
formFields: o
},
setResponse: (s) => {
s != null && s.fieldValues && this.populateFormFieldsInternal(s.fieldValues, r);
}
};
this.$emit("click", i);
}
},
render() {
const e = v(this), {
disabled: t,
fillMode: r,
rounded: o,
size: n,
svgIcon: i,
themeColor: s,
togglable: a,
selected: l,
icon: d,
iconClass: c,
imageUrl: u,
imageAlt: m,
tabIndex: f,
id: h,
type: b,
role: y,
ariaLabel: E,
ariaPressed: I,
title: C,
dir: P,
iconSize: k
} = this.$props, p = {
ref: "buttonRef",
disabled: t,
fillMode: r,
rounded: o,
size: n,
svgIcon: i,
themeColor: s,
togglable: a,
selected: l,
icon: d,
iconClass: c,
imageUrl: u,
imageAlt: m,
tabIndex: f,
id: h,
type: b,
role: y,
ariaLabel: E,
ariaPressed: I,
title: C,
dir: P,
iconSize: k,
onClick: this.handleClick
};
return e ? g(S, p, $(e) ? e : {
default: () => [e]
}) : g(S, p, null);
}
});
export {
R as SmartPasteButton
};