@base-framework/ui
Version:
This is a UI package that adds components and atoms that use Tailwind CSS and a theme based on Shadcn.
63 lines (62 loc) • 1.84 kB
JavaScript
import { I as m, Button as r } from "@base-framework/atoms";
import { Atom as s } from "@base-framework/base";
import { Icons as u } from "./icons.es.js";
const w = {
xs: "w-4 h-4",
sm: "w-6 h-6",
md: "w-8 h-8",
lg: "w-10 h-10",
xl: "w-12 h-12",
"2xl": "w-14 h-14",
"3xl": "w-16 h-16"
}, l = s((n, t) => {
var c;
const a = w[n.size || "sm"];
return m({
...n,
class: `stroke-current icon-size ${a} ${n.class || ""}`,
html: (c = t[0]) == null ? void 0 : c.textContent
});
}), i = (n) => s((t, a) => r({
...n,
...t,
class: `bttn ${n.class} ${t.class || ""}`
}, a)), h = s(
(n, t) => r({
...n,
class: n.class
}, [
n.icon && n.position !== "right" ? l({ size: "sm", class: n.animation ?? null }, n.icon) : null,
...t || [],
n.icon && n.position === "right" ? l({ size: "sm", class: n.animation ?? null }, n.icon) : null
])
), o = (n) => s((t, a) => h({
...n,
...t,
class: `bttn ${n.class} ${t.class || ""}`
}, a)), g = (n) => () => {
if (n.allowHistory === !0 && globalThis.history.length > 2) {
globalThis.history.back();
return;
}
n.backUrl && app.navigate(n.backUrl);
}, k = (n) => s((t, a) => (t.icon = t.icon || u.arrows.left, t.click = t.click || g(t), h({
...n,
...t
}, a))), e = {
primary: i({ class: "primary" }),
secondary: i({ class: "secondary" }),
destructive: i({ class: "destructive" }),
warning: i({ class: "warning" }),
outline: i({ class: "outline" }),
ghost: i({ class: "ghost" }),
link: i({ class: "link" }),
icon: o({ class: "icon" }),
withIcon: o({ class: "with-icon" }),
back: k({ class: "with-icon back-button" })
}, b = s((n, t) => (e[n.variant] || e.primary)(n, t)), $ = s((n, t) => b({ ...n, variant: "withIcon", icon: u.loading, animation: "animate-spin" }, t));
export {
b as B,
l as I,
$ as L
};