@primer/react-brand/esm/Tiles/Tiles.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 { Text as t } from "../Text/Text.js";
import { ArrowUpRightIcon as n } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
import r from "../component-helpers/shared.module.js";
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes-DTTqGOfy.css';/* empty css                                                                                                   */
import i from "./Tiles.module.js";
import { createContext as a, forwardRef as o, useContext as s } from "react";
import { jsx as c, jsxs as l } from "react/jsx-runtime";
//#region src/Tiles/Tiles.tsx
var u = {
	root: "Tiles",
	get grid() {
		return `${this.root}-grid`;
	},
	get item() {
		return `${this.root}-item`;
	}
}, d = a("default"), f = o(({ variant: t = "default", layout: n = "default", children: a, className: o, "data-testid": s, ...l }, f) => /* @__PURE__ */ c(d.Provider, {
	value: n,
	children: /* @__PURE__ */ c("div", {
		ref: f,
		className: e(i.Tiles, i[`Tiles--variant-${t}`], i[`Tiles--layout-${n}`], t === "gridlines" && r.gridline, o),
		"data-testid": s || u.root,
		...l,
		children: /* @__PURE__ */ c("ul", {
			className: i["Tiles-grid"],
			"data-testid": u.grid,
			children: a
		})
	})
})), p = o(({ name: r, href: a, children: o, className: f, "data-testid": p, ...m }, h) => {
	let g = s(d), _ = !!a, v = g === "compact" && !_, y = /* @__PURE__ */ l("span", {
		className: i["Tiles-item-content"],
		children: [/* @__PURE__ */ c("span", {
			className: i["Tiles-item-media"],
			"aria-hidden": "true",
			children: o
		}), /* @__PURE__ */ l("span", {
			className: e(i["Tiles-item-label"], v && "visually-hidden"),
			children: [/* @__PURE__ */ c(t, {
				as: "span",
				size: "100",
				className: i["Tiles-item-name"],
				children: r
			}), _ && /* @__PURE__ */ c(n, {
				size: 16,
				className: i["Tiles-item-icon"],
				"aria-hidden": "true"
			})]
		})]
	});
	return /* @__PURE__ */ c("li", {
		ref: h,
		className: e(i["Tiles-item"], f),
		"data-testid": p || u.item,
		...m,
		children: _ ? /* @__PURE__ */ c("a", {
			href: a,
			className: i["Tiles-item-link"],
			children: y
		}) : y
	});
}), m = Object.assign(f, {
	Item: p,
	testIds: u
});
//#endregion
export { m as Tiles };

//# sourceMappingURL=Tiles.js.map