@primer/react-brand
Version:
Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.
72 lines (71 loc) • 2.15 kB
JavaScript
import e from "../node_modules/clsx/dist/clsx.js";
import { Text as t } from "../Text/Text.js";
import { LinkExternalIcon as n } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
import { ExpandableArrow as r } from "../ExpandableArrow/ExpandableArrow.js";
import i from "./Link.module.js";
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/link/colors-with-modes-Dh1w7a05.css';/* empty css */
import a, { useCallback as o } from "react";
import { jsx as s, jsxs as c } from "react/jsx-runtime";
//#region src/Link/Link.tsx
var l = ["default", "accent"], u = [
"small",
"medium",
"large"
], d = [
"start",
"end",
"none"
], f = {
small: "100",
medium: "200",
large: "300"
}, p = {
small: 16,
medium: 16,
large: 20
};
function m({ size: l = "medium", variant: u = "default", className: d, children: m, isExternal: h, onMouseEnter: g, onMouseLeave: _, onFocus: v, onBlur: y, arrowDirection: b = "end", ...x }) {
let [S, C] = a.useState(!1), [w, T] = a.useState(!1), E = o((e) => {
C(!S), g?.(e);
}, [g, S]), D = o((e) => {
C(!S), _?.(e);
}, [_, S]), O = o((e) => {
T(!w), v?.(e);
}, [v, w]), k = o((e) => {
T(!w), y?.(e);
}, [y, w]);
return /* @__PURE__ */ c("a", {
className: e(i.Link, i[`Link--${l}`], i[`Link--${u}`], h ? i["Link--is-external"] : i[`Link--arrow-${b}`], d),
onMouseEnter: E,
onMouseLeave: D,
onFocus: O,
onBlur: k,
...x,
children: [
b === "start" && !h && /* @__PURE__ */ s(r, {
className: i["Link-arrow"],
expanded: S || w,
reverse: !0,
hidden: !0
}),
/* @__PURE__ */ s(t, {
as: "span",
size: f[l],
className: e(i["Link--label"]),
children: m
}),
b === "end" && !h && /* @__PURE__ */ s(r, {
className: i["Link-arrow"],
expanded: S || w,
hidden: !0
}),
h && /* @__PURE__ */ s(n, {
size: p[l],
"aria-label": "External link"
})
]
});
}
//#endregion
export { m as Link, d as LinkArrowDirections, u as LinkSizes, l as LinkVariants };
//# sourceMappingURL=Link.js.map