@progress/kendo-vue-inputs/radiobutton/RadioButton.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 N, h as t, createVNode as h, ref as R } from "vue";
import { getDefaultSlots as k, templateRendering as y, getListeners as I, getTemplate as l, getTabIndex as C, setRef as x, kendoThemeMaps as j, getRef as O, guid as z, validatePackage as F } from "@progress/kendo-vue-common";
import { packageMetadata as L } from "../package-metadata.mjs";
const M = /* @__PURE__ */ N({
  name: "KendoRadioButton",
  props: {
    ariaDescribedBy: String,
    checked: Boolean,
    disabled: Boolean,
    className: String,
    content: [String, Number, Boolean, Object],
    dataItem: Object,
    id: String,
    label: String,
    labelRender: [String, Number, Boolean, Object],
    item: [String, Number, Boolean, Object],
    labelPlacement: String,
    name: String,
    index: Number,
    tag: {
      type: String,
      default: "div"
    },
    size: {
      type: String,
      default: "medium",
      validator: function(e) {
        return [null, "small", "medium", "large"].includes(e);
      }
    },
    tabIndex: Number,
    value: [String, Number, Object],
    valid: {
      type: Boolean,
      default: void 0
    },
    role: String
  },
  emits: {
    change: (e) => !0,
    focus: (e) => !0,
    blur: (e) => !0
  },
  created() {
    this.calculatedId = z(), F(L);
  },
  mounted() {
    this.input = O(this, "input");
  },
  computed: {
    inputClassName() {
      return {
        "k-radio": !0,
        [`k-radio-${j.sizeMap[this.$props.size]}`]: this.$props.size,
        "k-invalid": this.$props.valid === !1,
        [this.$props.className]: this.$props.className
      };
    }
  },
  methods: {
    focusElement() {
      this.input && this.input.focus();
    },
    handleChange(e) {
      this.$emit("change", {
        event: e,
        value: this.$props.value
      });
    },
    handleFocus(e) {
      this.$props.disabled || this.$emit("focus", {
        event: e,
        target: this
      });
    },
    handleBlur(e) {
      this.$props.disabled || this.$emit("blur", {
        event: e,
        target: this
      });
    }
  },
  setup() {
    return {
      inputRef: R(null)
    };
  },
  render() {
    const e = k(this), {
      ariaDescribedBy: p,
      checked: m,
      disabled: n,
      id: s,
      label: r,
      labelRender: a,
      labelPlacement: b,
      name: g,
      tabIndex: f,
      value: S,
      tag: d,
      role: $
    } = this.$props;
    let i = r;
    if (a) {
      const v = a ? y.call(this, a, I.call(this)) : null;
      i = l.call(this, {
        h: t,
        template: v
      });
    }
    const o = l.call(this, {
      h: t,
      template: this.$props.content
    }), u = i !== void 0 ? h("label", {
      class: "k-radio-label",
      for: s || this.calculatedId,
      style: {
        userSelect: "none"
      },
      "aria-label": r
    }, [i]) : null, c = h("input", {
      role: $,
      type: "radio",
      id: s || this.calculatedId,
      name: g,
      class: this.inputClassName,
      ref: x(this, "input"),
      disabled: n,
      tabindex: C(f, n),
      checked: m,
      style: this.$attrs.style,
      "aria-describedby": p,
      value: S,
      onChange: this.handleChange,
      onFocus: this.handleFocus,
      onBlur: this.handleBlur
    }, null), B = b === "before" ? t(d, [u, c, o, e]) : t(d, [c, u, o, e]);
    return l.call(this, {
      h: t,
      template: this.$props.item,
      defaultRendering: B,
      defaultSlots: e,
      additionalListeners: {
        change: this.handleChange,
        focus: this.handleFocus,
        blur: this.handleBlur
      },
      additionalProps: {
        dataItem: this.$props.dataItem
      }
    });
  }
});
export {
  M as RadioButton
};