@primer/react-brand/esm/Token/Token.js

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

import e from "../node_modules/clsx/dist/clsx.js";
import { useAnimation as t } from "../animation/useAnimation.js";
import { Text as n } from "../Text/Text.js";
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes-5VT1x9eF.css';/* empty css                                                                                                   */
import r from "./Token.module.js";
import i, { forwardRef as a } from "react";
import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
//#region src/Token/Token.tsx
var l = [
	"default",
	"accent",
	"outline",
	"invisible"
], u = l[0], d = {
	root: "Token",
	get leadingVisual() {
		return `${this.root}-leading-visual`;
	}
}, f = a(({ animate: a, variant: l = u, as: f = "span", children: p, className: m, "data-testid": h, leadingVisual: g, style: _, ...v }, y) => {
	let { classes: b, styles: x } = t(a), S = e(b, r.Token, g && r["Token--hasLeadingVisual"], f === "a" && r["Token--interactive"], r[`Token--variant-${l}`], m), C = /* @__PURE__ */ c(o, { children: [g && /* @__PURE__ */ s("span", {
		className: r["Token__leading-visual"],
		"data-testid": d.leadingVisual,
		"aria-hidden": "true",
		children: typeof g == "function" ? /* @__PURE__ */ s(g, { className: r.Token__visual }) : i.isValidElement(g) && i.cloneElement(g, { className: e(r.Token__visual, g.props.className) })
	}), /* @__PURE__ */ s(n, {
		as: "span",
		size: "100",
		className: r.Token__label,
		children: p
	})] });
	return s(f === "a" ? "a" : "span", {
		ref: y,
		className: S,
		"data-testid": h || d.root,
		style: {
			...x,
			..._
		},
		...v,
		children: C
	});
}), p = Object.assign(f, { testIds: d });
//#endregion
export { p as Token, l as TokenVariants, u as defaultTokenVariant };

//# sourceMappingURL=Token.js.map