@progress/kendo-vue-upload/UploadAddButton.mjs

TODO

/**
 * @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 v, ref as s, inject as x, createVNode as o, isVNode as S } from "vue";
import { guid as B, classNames as k, setRef as y } from "@progress/kendo-vue-common";
import { provideLocalizationService as N } from "@progress/kendo-vue-intl";
import { select as u, messages as c, selectSingle as r } from "./messages/main.mjs";
import { UploadInput as L } from "./UploadInput.mjs";
import { Button as j } from "@progress/kendo-vue-buttons";
function w(e) {
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !S(e);
}
const $ = /* @__PURE__ */ v({
  name: "KendoVueUploadAddButton",
  props: {
    addButtonIndex: Number,
    navigationIndex: Number,
    notFocusedIndex: Number,
    tabIndex: Number,
    async: Object,
    multiple: Boolean,
    disabled: Boolean,
    accept: String,
    id: String,
    ariaLabelledBy: String,
    ariaDescribedBy: String
  },
  inject: {
    kendoLocalizationService: {
      default: null
    }
  },
  emits: {
    add: null,
    click: null
  },
  setup() {
    const e = s(null), t = s(null), n = x("kendoLocalizationService", {});
    return {
      elementRef: e,
      uploadInputRef: t,
      kendoLocalizationService: n
    };
  },
  created() {
    this.uploadInputId = B();
  },
  mounted() {
    this.element = this.elementRef, this.uploadInput = this.uploadInputRef;
  },
  watch: {
    navigationIndex: function(e, t) {
      this._prevNavigationIndex = t;
    }
  },
  updated() {
    const {
      navigationIndex: e,
      addButtonIndex: t,
      notFocusedIndex: n
    } = this.$props;
    e !== this._prevNavigationIndex && this._prevNavigationIndex !== n && e === t && this.element && this.element.focus();
  },
  methods: {
    focus() {
      this.element && this.element.focus();
    },
    onClick() {
      this.actionElement() && this.actionElement().click(), this.$emit("click", this.$props.addButtonIndex);
    },
    onAdd(e) {
      this.$emit("add", e);
    },
    onInputMouseDown(e) {
      this.element && (e.preventDefault(), this.element.focus());
    },
    actionElement() {
      if (this.uploadInput)
        return this.uploadInput.actionElement();
    }
  },
  render() {
    const {
      navigationIndex: e,
      addButtonIndex: t,
      tabIndex: n,
      id: p,
      async: m,
      multiple: a,
      disabled: d,
      accept: f,
      ariaLabelledBy: h,
      ariaDescribedBy: I
    } = this.$props, l = N(this), i = a ? l.toLanguageString(u, c[u]) : l.toLanguageString(r, c[r]), b = k("k-upload-button", e === t ? "k-focus" : "");
    return o("div", {
      class: "k-upload-button-wrap"
    }, [o(j, {
      id: p,
      ref: y(this, "element"),
      role: "button",
      type: "button",
      disabled: d,
      ariaLabel: i,
      class: b,
      tabIndex: n,
      "aria-labelledby": h,
      "aria-describedby": I,
      onClick: this.onClick
    }, w(i) ? i : {
      default: () => [i]
    }), o(L, {
      id: this.uploadInputId,
      async: m,
      multiple: a,
      disabled: d,
      accept: f,
      onMousedown: this.onInputMouseDown,
      onAdd: this.onAdd,
      ref: (g) => {
        this.uploadInputRef = g;
      }
    }, null)]);
  }
});
export {
  $ as UploadAddButton
};