@progress/kendo-vue-buttons/FloatingActionButton/FloatingActionButtonItem.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 m, createVNode as i, h as r, ref as u } from "vue";
import { getTabIndex as h, setRef as p, Icon as f, getTemplate as b, classNames as g, getRef as k } from "@progress/kendo-vue-common";
const I = /* @__PURE__ */ m({
  name: "KendoVueFloatingActionButtonItem",
  props: {
    id: String,
    disabled: Boolean,
    focused: Boolean,
    index: Number,
    icon: String,
    item: [String, Function, Object],
    dataItem: Object,
    text: String,
    tabIndex: Number,
    customProp: [String, Function, Object],
    class: String
  },
  emits: {
    click: null,
    down: null
  },
  mounted() {
    this.element = k(this, "element");
  },
  computed: {
    itemClassNames() {
      return g("k-fab-item", {
        "k-focus": this.focused,
        "k-disabled": this.disabled
      });
    }
  },
  methods: {
    handleClick(e) {
      this.$props.index !== void 0 && !this.$props.disabled && this.$emit("click", e, this.$props.index);
    },
    focusElement() {
      this.$el && this.$el.focus();
    },
    onMouseDown(e) {
      this.$emit("down", e);
    }
  },
  setup() {
    return {
      elementRef: u(null)
    };
  },
  render() {
    const {
      disabled: e,
      id: l,
      tabIndex: a,
      dataItem: d
    } = this.$props, {
      text: t,
      icon: n,
      svgIcon: s
    } = d;
    let o;
    const c = i("li", {
      ref: p(this, "element"),
      id: l,
      class: this.itemClassNames,
      role: "menuitem",
      tabindex: h(a, e),
      "aria-disabled": e,
      "aria-label": `${t || ""} floatingactionbutton item`,
      onClick: this.handleClick,
      onMousedown: this.onMouseDown,
      onPointerdown: this.onMouseDown
    }, [t && i("span", {
      class: "k-fab-item-text"
    }, [t]), (s || n) && i(f, {
      name: n,
      icon: s,
      class: "k-fab-item-icon"
    }, null)]);
    return o = b.call(this, {
      h: r,
      template: this.$props.item,
      defaultRendering: c,
      additionalProps: this.$props,
      additionalListeners: {
        click: this.handleClick
      }
    }), o;
  }
});
export {
  I as FloatingActionButtonItem
};