@aplus-frontend/ui
Version:
51 lines (50 loc) • 1.83 kB
JavaScript
import { defineComponent as S, computed as n, createElementBlock as $, openBlock as b, normalizeClass as i, normalizeStyle as w, createElementVNode as B, toDisplayString as _ } from "vue";
import "../../config-provider/index.mjs";
import z from "./style/index.mjs";
import { useNamespace as I } from "../../config-provider/hooks/use-namespace.mjs";
const v = ["title"], A = /* @__PURE__ */ S({
name: "ApTag",
__name: "ap-tag",
props: {
type: { default: "purely" },
text: {},
color: { default: "#34B77C" },
size: { default: "middle" },
disabled: { type: Boolean, default: !1 },
fixedWidth: { type: Boolean, default: !1 }
},
setup(o) {
const e = o, { b: a, bm: r } = I("tag"), l = z("tag");
function s(t, p) {
t.length === 4 && (t = `#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`);
const m = parseInt(t.slice(1, 3), 16), f = parseInt(t.slice(3, 5), 16), g = parseInt(t.slice(5, 7), 16), y = Math.round(p * 255).toString(16).padStart(2, "0");
return `#${m.toString(16).padStart(2, "0")}${f.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${y}`;
}
const c = n(() => ({
"--tag-main-color": e.color,
"--tag-main-color-opacity": s(e.color, 0.06),
"--tag-main-color-background": s(e.color, 0.15)
})), d = n(() => [
a(),
a("wrapper"),
a(`wrapper-${e.type}`),
r("wrapper", e.size),
l.value
].filter(Boolean)), u = n(() => {
const t = [a("inner-wrapper"), r("inner-wrapper", e.size)];
return e.disabled && t.push(r("inner-wrapper", "disabled")), t;
});
return (t, p) => (b(), $("span", {
style: w(c.value),
title: t.text,
class: i(d.value)
}, [
B("span", {
class: i(u.value)
}, _(t.text), 3)
], 14, v));
}
});
export {
A as default
};