UNPKG

@payfit/unity-components

Version:

101 lines (100 loc) 2.83 kB
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/Button.variants.js"; import { isExternalUrl as a } from "../link/utils.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 ?? a(o), { theme: E } = c(), D = s(() => { let e = { size: g, isDisabled: _, isLoading: v }, a; switch (t) { case "primary": a = l(n({ ...e, color: h })); break; case "secondary": if (E === "rebrand") { let t = h === "inverted" ? "inverted.low" : "neutral"; a = l(n({ ...e, color: t })); } else a = l(i({ ...e, color: h })); break; case "ghost": a = l(r({ ...e, color: h })); break; case "outlined": a = l(i({ ...e, color: h })); break; } return l(a, "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 };