@progress/kendo-vue-buttons 8.2.0 → 8.3.0-develop.2

package/SmartPasteButton/SmartPasteButton.mjs

@@ -0,0 +1,245 @@
+/**
+ * @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
+};

package/SmartPasteButton/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export * from './interfaces';
+export * from './SmartPasteButton';

package/SmartPasteButton/interfaces/SmartPasteButtonHandle.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * Represents the handle of the SmartPasteButton component.
+ */
+export interface SmartPasteButtonHandle {
+    /**
+     * The root DOM element of the SmartPasteButton.
+     */
+    element: HTMLButtonElement | null;
+    /**
+     * Programmatically triggers a click on the SmartPasteButton.
+     */
+    click: () => void;
+}

package/SmartPasteButton/interfaces/SmartPasteButtonProps.d.ts

@@ -0,0 +1,58 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ButtonProps } from '../../Button';
+import { SmartPasteFormField } from './SmartPasteFormField';
+/**
+ * Represents the request data passed in the SmartPasteClickEvent.
+ */
+export interface SmartPasteRequestData {
+    /**
+     * The clipboard content.
+     */
+    content: string;
+    /**
+     * The extracted form fields configuration.
+     */
+    formFields: SmartPasteFormField[];
+}
+/**
+ * Represents the response object used to populate form fields.
+ */
+export interface SmartPasteResponse {
+    /**
+     * A record of field names to their values to populate.
+     */
+    fieldValues: Record<string, any>;
+}
+/**
+ * Represents the click event of the SmartPasteButton.
+ */
+export interface SmartPasteClickEvent {
+    /**
+     * The original DOM event.
+     */
+    event: Event;
+    /**
+     * The request data containing clipboard content and form fields.
+     */
+    requestData: SmartPasteRequestData;
+    /**
+     * A callback function to set the response with field values to populate.
+     */
+    setResponse: (response: SmartPasteResponse) => void;
+}
+/**
+ * Represents the props of the SmartPasteButton component.
+ */
+export interface SmartPasteButtonProps extends ButtonProps {
+    /**
+     * Configures the form fields for smart paste.
+     * When provided, the extracted form configuration is merged with these custom fields.
+     */
+    formFields?: SmartPasteFormField[];
+}

package/SmartPasteButton/interfaces/SmartPasteFormField.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * Represents a form field configuration for the SmartPasteButton.
+ */
+export interface SmartPasteFormField {
+    /**
+     * The field identifier.
+     */
+    field: string;
+    /**
+     * A description of the field.
+     */
+    description: string | null;
+    /**
+     * The type of the field.
+     *
+     * The available options are:
+     * - `string`
+     * - `boolean`
+     * - `number`
+     * - `fixed-choices`
+     * - `kendo-input`
+     */
+    type: 'string' | 'boolean' | 'number' | 'fixed-choices' | 'kendo-input';
+    /**
+     * The allowed values for the field when the type is `fixed-choices`.
+     */
+    allowedValues?: string[];
+}

package/SmartPasteButton/interfaces/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export * from './SmartPasteFormField';
+export * from './SmartPasteButtonProps';
+export * from './SmartPasteButtonHandle';