UNPKG

@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
import { I as m, Button as r } from "@base-framework/atoms"; import { Atom as c } from "@base-framework/base"; import { Icons as h } from "./icons.es.js"; const g = { 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 = c((n, t) => { var s; const a = g[n.size || "sm"]; return m({ ...n, class: `stroke-current icon-size ${a} ${n.class || ""}`, html: (s = t[0]) == null ? void 0 : s.textContent }); }), i = (n) => c((t, a) => r({ ...n, ...t, class: `bttn ${n.class} ${t.class || ""}` }, a)), u = c( (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) => c((t, a) => u({ ...n, ...t, class: `bttn ${n.class} ${t.class || ""}` }, a)), w = (n) => () => { if (n.allowHistory === !0 && globalThis.history.length > 2) { globalThis.history.back(); return; } n.backUrl && app.navigate(n.backUrl); }, k = (n) => c((t, a) => (t.icon = t.icon || h.chevron.single.left, t.click = t.click || w(t), u({ ...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 = c((n, t) => (e[n.variant] || e.primary)(n, t)), $ = c((n, t) => b({ ...n, variant: "withIcon", icon: h.loading, animation: "animate-spin" }, t)); export { b as B, l as I, $ as L };