@payfit/unity-components
Version:
94 lines (93 loc) • 2.36 kB
JavaScript
import { Icon as e } from "../icon/Icon.js";
import { Spinner as t } from "../spinner/Spinner.js";
import { buttonFilled as n, buttonGhost as r, buttonOutlined as i } from "./Button.variants.js";
import { forwardRef as a, useMemo as o } from "react";
import { cn as s, useUnityTheme as c, uyMerge as l } from "@payfit/unity-themes";
import { jsx as u, jsxs as d } from "react/jsx-runtime";
import { Button as f } from "react-aria-components/Button";
//#region src/components/button/Button.tsx
var p = (n, r) => n ? /* @__PURE__ */ u(t, {
size: "small",
color: "inherit",
label: "Loading..."
}) : r ? /* @__PURE__ */ u(e, {
src: r,
size: 20,
color: "inherit",
role: "presentation",
"data-unity-icon": "prefix"
}) : null, m = a(({ variant: t, children: a, color: m = "primary", size: h = "default", isDisabled: g = !1, isLoading: _ = !1, prefixIcon: v, suffixIcon: y, truncateLabelLength: b, mode: x = "default", ...S }, C) => {
let { theme: w } = c(), T = o(() => {
let e = {
size: h,
isDisabled: g,
isLoading: _,
mode: x
};
switch (t) {
case "primary": return l(n({
...e,
color: m
}));
case "secondary":
if (w === "rebrand") {
let t = m === "inverted" ? "inverted.low" : "neutral";
return l(n({
...e,
color: t
}));
}
return l(i({
...e,
color: m
}));
case "ghost": return l(r({
...e,
color: m
}));
case "outlined": return l(i({
...e,
color: m
}));
}
}, [
t,
m,
h,
g,
_,
x,
w
]), E = { ..._ && { "data-loading": _ } }, D = g || _, O = _ || !!v || !!y;
return /* @__PURE__ */ u(f, {
"data-dd-privacy": "allow",
...S,
ref: C,
isDisabled: D,
"aria-disabled": D ? !0 : void 0,
isPending: _,
className: T,
...E,
children: /* @__PURE__ */ d("span", {
className: s("uy:inline-flex uy:items-center", O && "uy:gap-50"),
children: [
p(_, v),
b && b > 0 ? /* @__PURE__ */ u("span", {
style: { "--uy-button-label-truncation-length": `${b}ch` },
className: "uy:truncate uy:min-w-0 uy:w-(--uy-button-label-truncation-length)",
children: a
}) : a,
y && /* @__PURE__ */ u(e, {
src: y,
size: 20,
color: "inherit",
role: "presentation",
"data-unity-icon": "suffix"
})
]
})
});
});
m.displayName = "Button";
//#endregion
export { m as Button };