@primer/react-brand/esm/ComparisonTable/ComparisonTable.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 { Heading as r } from "../Heading/Heading.js";
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/comparison-table/comparison-table-L50b0Mii.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/comparison-table/colors-with-modes-D2oNfyDt.css';/* empty css                                                                                                              */
/* empty css                                                                                                             */
import i from "./ComparisonTable.module.js";
import a, { forwardRef as o, useMemo as s } from "react";
import { jsx as c, jsxs as l } from "react/jsx-runtime";
//#region src/ComparisonTable/ComparisonTable.tsx
var u = o(({ as: n, animate: o, children: u, className: m, heading: h, featuredColumn: g = 1, visuallyHiddenFeaturedLabel: _ = "featured", variant: v = "default", style: y, ...b }, x) => {
	let { classes: S, styles: C } = t(o), w = n || "section", T = s(() => a.Children.toArray(u).filter((e) => a.isValidElement(e) && typeof e.type != "string"), [u]), E = T.filter((e) => e.type === d), D = E.map((t, n) => n === 0 ? a.cloneElement(t, {
		className: e(i["ComparisonTable-row"], t.props.className),
		children: a.Children.map(t.props.children, (n, r) => {
			if (a.isValidElement(n) && n.type === f) {
				let o = r === g;
				return a.cloneElement(n, {
					as: n.props.children ? "th" : "td",
					className: e(i["ComparisonTable-cell"], i["ComparisonTable-cell-heading"], i[`ComparisonTable-cell-heading--${v}`], r === 0 && i["ComparisonTable-cell-heading--first"], o && i["ComparisonTable-cell-heading--featured"], t.props.className),
					children: /* @__PURE__ */ l("span", {
						className: e(r === g && i["ComparisonTable-cell-heading-label--featured"]),
						children: [n.props.children, o && /* @__PURE__ */ l("span", {
							className: "visually-hidden",
							children: [
								"(",
								_,
								")"
							]
						})]
					})
				});
			}
			return null;
		})
	}) : null).filter(Boolean), O = s(() => {
		let e = E.at(0);
		return e && a.Children.map(e.props.children, (e) => {
			if (a.isValidElement(e)) return e.props.children;
		}) || [];
	}, [E]), [, ...k] = E, A = k.map((t, n) => a.cloneElement(t, {
		className: e(i["ComparisonTable-row"], `ComparisonTable-row--${n}`, t.props.className),
		children: a.Children.map(t.props.children, (r, o) => a.isValidElement(r) && r.type === f ? /* @__PURE__ */ l(f, {
			...r.props,
			as: o === 0 ? "th" : "td",
			className: e(i["ComparisonTable-cell"], i[`ComparisonTable-cell--${v}`], o === 0 && i["ComparisonTable-cell-heading"], o === 0 && i[`ComparisonTable-cell-heading--${v}`], o === g && i["ComparisonTable-cell--featured"], k.length - 1 === n && i["ComparisonTable-cell--lastrow"], t.props.className),
			children: [o >= 1 && /* @__PURE__ */ c("span", {
				className: e(i["ComparisonTable-inline-cell-label"], i["ComparisonTable--hide-element-on-narrow"], o === g && i["ComparisonTable-cell-heading-label--featured"]),
				children: O[o]
			}), /* @__PURE__ */ c("span", {
				className: e(i["ComparisonTable-cell-container"], o === g && i["ComparisonTable-cell-container--featured"]),
				children: r.props.children
			})]
		}) : null)
	})), j = T.find((e) => e.type === p);
	return /* @__PURE__ */ l(w, {
		ref: x,
		className: e(S, m),
		style: {
			...C,
			...y
		},
		...b,
		children: [
			h && /* @__PURE__ */ c(r, {
				className: i["ComparisonTable--heading"],
				as: "h3",
				size: "4",
				children: h
			}),
			/* @__PURE__ */ l("table", {
				className: e(i.ComparisonTable, `ComparisonTable--${v}`),
				children: [D.length && /* @__PURE__ */ c("thead", { children: D }), A.length && /* @__PURE__ */ c("tbody", { children: A })]
			}),
			j && /* @__PURE__ */ c("footer", {
				className: i["ComparisonTable-footnote"],
				children: j
			})
		]
	});
}), d = ({ children: e, ...t }) => /* @__PURE__ */ c("tr", {
	...t,
	children: e
}), f = ({ as: e, children: t, ...n }) => /* @__PURE__ */ c(e || "td", {
	...n,
	children: t
}), p = ({ children: e, ...t }) => typeof e == "string" ? /* @__PURE__ */ c(n, {
	as: "p",
	size: "100",
	variant: "muted",
	children: e
}) : /* @__PURE__ */ c("div", {
	...t,
	children: e
}), m = Object.assign(u, {
	Row: d,
	Cell: f,
	Footnote: p
});
//#endregion
export { m as ComparisonTable, u as _ComparisonTable };

//# sourceMappingURL=ComparisonTable.js.map