@opensig/opendesign/lib/button/OButton.vue.js

"use strict";
const vue = require("vue");
const global = require("../_utils/global.js");
const icons = require("../_utils/icons.js");
const styleClass = require("../_utils/style-class.js");
const types = require("./types.js");
const htmlTag = require("../_components/html-tag.js");
const vueUtils = require("../_utils/vue-utils.js");
const is = require("../_utils/is.js");
const _hoisted_1 = {
  key: 1,
  class: "o-btn-suffix"
};
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "OButton",
  props: types.buttonProps,
  emits: ["click"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const tag = vue.computed(() => props.href ? "a" : props.tag);
    const round = styleClass.getRoundClass(props, "btn");
    const slots = vue.useSlots();
    const isOnlyIcon = vue.computed(() => vueUtils.isEmptySlot(slots.default) && (props.icon || slots.icon));
    const variant = vue.computed(() => {
      if (is.isUndefined(props.variant) && isOnlyIcon.value) {
        return "text";
      }
      return props.variant || "outline";
    });
    const onClick = (e) => {
      if (props.disabled || props.loading) {
        e.preventDefault();
        return;
      }
      emit("click", e);
    };
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(vue.unref(htmlTag), {
        tag: tag.value,
        href: props.href,
        type: tag.value === "button" ? "button" : "",
        class: vue.normalizeClass(["o-btn", [
          `o-btn-${props.color}`,
          `o-btn-${props.size || vue.unref(global.defaultSize)}`,
          `o-btn-${variant.value}`,
          vue.unref(round).class.value,
          {
            "o-btn-icon-only": isOnlyIcon.value,
            "o-btn-disabled": props.disabled
          }
        ]]),
        style: vue.normalizeStyle(vue.unref(round).style.value),
        onClick
      }, {
        default: vue.withCtx(() => [
          props.icon || slots.icon || props.loading ? (vue.openBlock(), vue.createElementBlock(
            "span",
            {
              key: 0,
              class: vue.normalizeClass(["o-btn-prefix", { loading: props.loading }])
            },
            [
              props.loading ? (vue.openBlock(), vue.createBlock(vue.unref(icons.IconLoading), {
                key: 0,
                class: "o-rotating"
              })) : vue.renderSlot(_ctx.$slots, "icon", { key: 1 }, () => [
                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(props.icon)))
              ])
            ],
            2
            /* CLASS */
          )) : vue.createCommentVNode("v-if", true),
          vue.renderSlot(_ctx.$slots, "default"),
          slots.suffix ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1, [
            vue.renderSlot(_ctx.$slots, "suffix")
          ])) : vue.createCommentVNode("v-if", true)
        ]),
        _: 3
        /* FORWARDED */
      }, 8, ["tag", "href", "type", "class", "style"]);
    };
  }
});
module.exports = _sfc_main;