@opensig/opendesign/es/button/OButton.vue.mjs

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

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