y-design-ssr/libs/button/index.mjs

SSR component library of YUI with Vue3

import { ref as N, reactive as k, defineComponent as _, createVNode as l, Fragment as S } from "vue";
const c = (t, e) => e ? typeof e == "string" ? ` ${t}--${e}` : Array.isArray(e) ? e.reduce((a, n) => a + c(t, n), "") : Object.keys(e).reduce(
  (a, n) => a + (e[n] ? c(t, n) : ""),
  ""
) : "", w = (t) => (e, a) => {
  let n = e, r = a;
  return n && typeof n != "string" && (r = n, n = ""), n = n ? `${t}__${n}` : t, `${n}${c(n, r)}`;
}, C = () => (t, e) => e ? `${c(`y-${t}`, e)}` : `y-${t}`, z = {
  "pull-refresh": {
    pulling: "下拉刷新...",
    loosing: "释放刷新...",
    loading: "数据加载中...",
    success: "数据已更新",
    failed: "数据跟新失败，请稍后再试"
  },
  "form-item": {
    validateMessage: "请输入正确内容"
  }
};
N("zh-CN");
k({
  "zh-CN": z
});
const T = (t) => {
  const e = `y-${t}`;
  return [e, w(e), C()];
}, I = (t) => isNaN(Number(t)) && typeof t == "string" ? t : `${t}px`, [M, u, q] = T("button"), A = /* @__PURE__ */ _({
  name: M,
  props: {
    // 标签
    tag: {
      type: String,
      default: "button"
    },
    // 文案
    text: {
      type: String,
      default: ""
    },
    // 类型
    type: {
      type: String,
      default: "primary"
    },
    // 尺寸
    size: {
      type: String,
      default: "middle"
    },
    // 不可以状态
    disabled: {
      type: Boolean,
      default: !1
    },
    // 阴影
    shadow: {
      type: String,
      default: ""
    },
    // 方形
    square: {
      type: Boolean,
      default: !1
    },
    // 半圆弧
    semicircle: {
      type: Boolean,
      default: !1
    },
    // 自定义圆角
    radius: {
      type: [Number, String],
      default: ""
    },
    // 补充文案，双行显示
    supplementText: {
      type: String,
      default: ""
    },
    // block 自动填满父布局
    block: {
      type: Boolean,
      default: !1
    },
    // 危险按钮状态
    danger: {
      type: Boolean,
      default: !1
    }
  },
  emits: ["click"],
  setup(t, {
    slots: e,
    emit: a
  }) {
    const n = (r) => {
      a("click", r);
    };
    return () => {
      let {
        tag: r
      } = t;
      const {
        radius: g,
        type: i,
        size: m,
        disabled: s,
        shadow: d,
        block: b,
        square: $,
        semicircle: x,
        danger: h,
        text: B,
        supplementText: f
      } = t, o = e.default ? e.default() : B;
      return r = i === "link" ? "a" : r, l(r, {
        class: [u([i, m, {
          block: b,
          square: $,
          semicircle: x,
          disabled: s && r === "a"
        }, (i === "primary" || i === "secondary") && d ? `shadow_${d}` : "", h ? `${i}_danger` : "", s ? `${i}_disabled` : ""]), q("el", "clickable")],
        style: {
          borderRadius: I(g)
        },
        disabled: s,
        onClick: n
      }, {
        default: () => {
          var p, y;
          return [l("div", {
            class: u("content")
          }, [((p = e.leftIcon) == null ? void 0 : p.call(e)) || null, o && l(S, null, [f ? l("div", {
            class: u("text")
          }, [l("p", null, [o]), l("p", {
            class: u("subtext")
          }, [f])]) : l("span", {
            class: u("text")
          }, [o])]), ((y = e.rightIcon) == null ? void 0 : y.call(e)) || null])];
        }
      });
    };
  }
});
function j(t) {
  const e = t;
  return e.install = (a) => {
    const { name: n } = t;
    n && a.component(n, t);
  }, e;
}
const E = j(A);
export {
  E as default
};