@indielayer/ui
Version:
Indielayer UI Components with Tailwind CSS build for Vue 3
71 lines (70 loc) • 2.55 kB
JavaScript
const a = {
classes: {
wrapper: ({ data: e }) => {
const t = ["inline-block relative cursor-pointer focus:outline-none group"];
return e.isInsideForm && !e.isInsideFormGroup && t.push("mb-5"), t;
},
circle: ({ props: e }) => {
const t = ["rounded-full flex justify-center items-center shrink-0 border outline-offset-2 outline-slate-300 dark:outline-slate-500 group-focus-visible:outline-1 group-focus-visible:outline"];
return e.size === "lg" ? t.push("h-5 w-5") : e.size === "xl" ? t.push("h-6 w-6") : t.push("h-4 w-4"), t;
},
circleIcon: ({ props: e, data: t }) => {
const s = [];
return t.selected || s.push("opacity-0"), e.size === "sm" || e.size === "xs" ? s.push("h-2") : e.size === "lg" ? s.push("h-2.5") : e.size === "xl" ? s.push("h-3") : s.push("h-2"), s;
},
label: ({ props: e, data: t }) => {
let s = "text-secondary-800 dark:text-secondary-200 pl-2";
return s += t.isInsideFormGroup ? " font-normal" : " font-medium", e.size === "xs" ? s += " text-xs" : e.size === "sm" ? s += " text-sm" : e.size === "lg" ? s += " text-lg" : e.size === "xl" && (s += " text-xl"), s;
},
content: ({ props: e }) => {
let t = "pl-2";
return e.size === "xs" ? t += " text-xs" : e.size === "sm" ? t += " text-sm" : e.size === "lg" ? t += " text-lg" : e.size === "xl" && (t += " text-xl"), t;
}
},
styles: ({ props: e, colors: t, css: s, data: n }) => {
const r = t.getPalette("gray"), l = t.getPalette(e.color), i = [];
return e.loading ? s.variables({
bg: "transparent",
border: "transparent",
dark: {
bg: "transparent",
border: "transparent"
}
}) : (e.disabled ? n.selected ? i.push(s.variables({
bg: "transparent",
border: r[200],
circle: r[200],
dark: {
bg: "transparent",
border: r[700],
circle: r[700]
}
})) : i.push(s.variables({
bg: r[200],
border: r[200],
dark: {
bg: r[700],
border: r[700]
}
})) : (n.selected ? i.push(s.variables({
bg: "transparent",
border: l[500],
circle: l[500],
dark: {
bg: "transparent",
border: l[500],
circle: l[500]
}
})) : i.push(s.variables({
bg: "#fff",
border: e.glow ? l[300] : r[300],
dark: {
bg: r[900],
border: e.glow ? l[300] : r[400]
}
})), e.glow && i.push(s.get("glow", t.getColorOpacity(l[500], 0.5)))), i);
}
}, o = a;
export {
o as default
};