@payfit/unity-components
Version:
101 lines (100 loc) • 2.82 kB
JavaScript
import { Icon as e } from "../icon/Icon.js";
import { Spinner as t } from "../spinner/Spinner.js";
import { isExternalUrl as n } from "../link/utils.js";
import { linkButtonFilled as r, linkButtonGhost as i, linkButtonOutlined as a } from "./LinkButton.variants.js";
import { forwardRef as o, useMemo as s } from "react";
import { useUnityTheme as c, uyMerge as l } from "@payfit/unity-themes";
import { jsx as u, jsxs as d } from "react/jsx-runtime";
import { Link as f } from "react-aria-components/Link";
//#region src/components/link-button/RawLinkButton.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 = o(({ variant: t, href: o, children: m, color: h = "primary", size: g = "default", isDisabled: _ = !1, isLoading: v = !1, prefixIcon: y, suffixIcon: b, truncateLabelLength: x, isExternal: S, ...C }, w) => {
let T = S ?? n(o), { theme: E } = c(), D = s(() => {
let e = {
size: g,
isDisabled: _,
isLoading: v
}, n;
switch (t) {
case "primary":
n = r({
...e,
color: h
});
break;
case "secondary":
if (E === "rebrand") {
let t = h === "inverted" ? "inverted.low" : "neutral";
n = r({
...e,
color: t
});
} else n = a({
...e,
color: h
});
break;
case "ghost":
n = i({
...e,
color: h
});
break;
case "outlined":
n = a({
...e,
color: h
});
break;
}
return l(n, "uy:no-underline", _ || v ? `${t === "primary" || t === "secondary" && E === "rebrand" ? "uy:data-[disabled]:bg-surface-neutral-disabled" : "uy:data-[disabled]:bg-transparent"} uy:data-[disabled]:text-content-neutral-disabled uy:data-[disabled]:cursor-not-allowed` : "", v ? "uy:data-[disabled]:cursor-progress" : "");
}, [
t,
h,
g,
_,
v,
E
]), O = { ...v && { "data-loading": v } };
return /* @__PURE__ */ u(f, {
"data-dd-privacy": "allow",
...C,
href: o,
ref: w,
isDisabled: _ || v,
className: D,
target: T ? "_blank" : C.target,
rel: T && !C.rel ? "noopener noreferrer" : C.rel,
...O,
children: /* @__PURE__ */ d("span", {
className: "uy:inline-flex uy:gap-50 uy:items-center",
children: [
p(v, y),
x && x > 0 ? /* @__PURE__ */ u("span", {
style: { "--uy-button-label-truncation-length": `${x}ch` },
className: "uy:truncate uy:min-w-0 uy:w-(--uy-button-label-truncation-length)",
children: m
}) : m,
b && /* @__PURE__ */ u(e, {
src: b,
size: 20,
color: "inherit",
role: "presentation",
"data-unity-icon": "suffix"
})
]
})
});
});
m.displayName = "RawLinkButton";
//#endregion
export { m as RawLinkButton };