npm - @primer/react-brand - Versions diffs - 0.68.0-rc.b6d410ef → 0.68.1-rc.a7b95aa2 - Mend

@primer/react-brand 0.68.0-rc.b6d410ef → 0.68.1-rc.a7b95aa2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (486) hide show

package/esm/PricingOptions/PricingOptions.js CHANGED Viewed

@@ -6,10 +6,10 @@ import { Button as o } from "../Button/Button.js";
 import { useWindowSize as s } from "../hooks/useWindowSize.js";
 import { Accordion as c } from "../Accordion/Accordion.js";
 import { UnorderedList as l } from "../list/UnorderedList/UnorderedList.js";
+import { Tooltip as u } from "../Tooltip/Tooltip.js";
 import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/pricing-options/pricing-options-B9TarQsR.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes-DBi2l0Re.css';/* empty css                                                                                                           */
 /* empty css                                                                                                             */
-import u from "./PricingOptions.module.js";
-import { Tooltip as d } from "../Tooltip/Tooltip.js";
+import d from "./PricingOptions.module.js";
 import f, { forwardRef as p, useMemo as m } from "react";
 import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
 //#region src/PricingOptions/PricingOptions.tsx
@@ -54,25 +54,25 @@ var v = {
 	let c = m(() => f.Children.toArray(n).filter((e) => f.isValidElement(e) && typeof e.type != "string" && e.type === T), [n]).slice(0, 4), l = m(() => c.map((e) => {
 		let t = f.Children.toArray(e.props.children).find((e) => f.isValidElement(e) && typeof e.type != "string" && e.type === C);
 		return f.isValidElement(t) ? t : null;
-	}), [c]), d = l.some((e) => e !== null);
+	}), [c]), u = l.some((e) => e !== null);
 	return /* @__PURE__ */ g(b, {
 		align: t,
 		children: /* @__PURE__ */ _("div", {
-			className: e(u.PricingOptions, u[`PricingOptions--layout-${a.includes("default") ? "default" : "cards"}`], u[`PricingOptions--items${c.length}`], u[`PricingOptions--appearance-${a.includes("gradient") ? "gradient" : "solid"}`], r),
+			className: e(d.PricingOptions, d[`PricingOptions--layout-${a.includes("default") ? "default" : "cards"}`], d[`PricingOptions--items${c.length}`], d[`PricingOptions--appearance-${a.includes("gradient") ? "gradient" : "solid"}`], r),
 			"data-testid": i || v.root,
 			ref: s,
 			...o,
-			children: [c, d && /* @__PURE__ */ g("div", {
-				className: u.PricingOptions__labels,
+			children: [c, u && /* @__PURE__ */ g("div", {
+				className: d.PricingOptions__labels,
 				"data-testid": v.labelRow,
 				style: { "--brand-pricing-options-column-count": c.length },
 				children: l.map((t, n) => {
 					let r = !!t?.props.children;
 					return /* @__PURE__ */ g("div", {
-						className: e(u["PricingOptions__label-cell"], r ? u["PricingOptions__label-cell--has-label"] : u["PricingOptions__label-cell--empty"]),
+						className: e(d["PricingOptions__label-cell"], r ? d["PricingOptions__label-cell--has-label"] : d["PricingOptions__label-cell--empty"]),
 						"data-testid": t?.props["data-testid"] || v.label,
 						children: t?.props.children ? /* @__PURE__ */ g("span", {
-							className: u.PricingOptions__label,
+							className: d.PricingOptions__label,
 							children: t.props.children
 						}) : null
 					}, n);
@@ -81,7 +81,7 @@ var v = {
 		})
 	});
 }), T = p(({ "data-testid": t, children: n, className: r, leadingComponent: i, ...a }, o) => {
-	let { align: s } = x(), { Heading: c, Description: l, Price: d, FeatureList: p, Actions: h, ActionsMessage: y, Footnote: b } = m(() => f.Children.toArray(n), [n]).reduce((e, t) => (f.isValidElement(t) && typeof t.type != "string" && (t.type === k && (e.FeatureList = t), (t.type === P || t.type === F || t.type === I) && e.Actions.push(t), t.type === N && (e.ActionsMessage = t), t.type === L && (e.Footnote = t), t.type === D && (e.Heading = t), t.type === E && (e.Description = t), t.type === O && (e.Price = t)), e), {
+	let { align: s } = x(), { Heading: c, Description: l, Price: u, FeatureList: p, Actions: h, ActionsMessage: y, Footnote: b } = m(() => f.Children.toArray(n), [n]).reduce((e, t) => (f.isValidElement(t) && typeof t.type != "string" && (t.type === k && (e.FeatureList = t), (t.type === P || t.type === F || t.type === I) && e.Actions.push(t), t.type === N && (e.ActionsMessage = t), t.type === L && (e.Footnote = t), t.type === D && (e.Heading = t), t.type === E && (e.Description = t), t.type === O && (e.Price = t)), e), {
 		FeatureList: null,
 		Actions: [],
 		ActionsMessage: null,
@@ -91,23 +91,23 @@ var v = {
 		Price: null
 	});
 	return /* @__PURE__ */ _("div", {
-		className: e(u.PricingOptions__item, i && u["PricingOptions__item--has-leading-component"], u[`PricingOptions__item--align-${s}`], r),
+		className: e(d.PricingOptions__item, i && d["PricingOptions__item--has-leading-component"], d[`PricingOptions__item--align-${s}`], r),
 		"data-testid": t || v.item,
 		ref: o,
 		...a,
 		children: [
 			/* @__PURE__ */ g("div", {
-				className: u.PricingOptions__header,
+				className: d.PricingOptions__header,
 				children: c
 			}),
 			l,
-			d,
+			u,
 			i && /* @__PURE__ */ g("div", {
-				className: u["PricingOptions__leading-component"],
+				className: d["PricingOptions__leading-component"],
 				children: i
 			}),
 			(h.length > 0 || y) && /* @__PURE__ */ _("div", {
-				className: u.PricingOptions__actions,
+				className: d.PricingOptions__actions,
 				children: [h, y]
 			}),
 			p,
@@ -116,7 +116,7 @@ var v = {
 	});
 }), E = p(({ children: n, className: r, "data-testid": i, ...a }, o) => /* @__PURE__ */ g(t, {
 	as: "p",
-	className: e(u.PricingOptions__description, r),
+	className: e(d.PricingOptions__description, r),
 	"data-testid": i || v.description,
 	ref: o,
 	size: "200",
@@ -125,40 +125,40 @@ var v = {
 	children: n
 })), D = p(({ as: t = "h3", children: r, "data-testid": i, size: a = "5", className: o, ...s }, c) => /* @__PURE__ */ g(n, {
 	as: t,
-	className: e(u.PricingOptions__heading, u[`PricingOptions__heading--size-${a}`], o),
+	className: e(d.PricingOptions__heading, d[`PricingOptions__heading--size-${a}`], o),
 	"data-testid": i || v.heading,
 	ref: c,
 	size: a,
 	...s,
 	children: r
-})), O = p(({ children: n, className: r, currencyCode: i = "USD", currencySymbol: a = "$", "data-testid": o, originalPrice: s, trailingText: c, ...l }, d) => /* @__PURE__ */ _(t, {
+})), O = p(({ children: n, className: r, currencyCode: i = "USD", currencySymbol: a = "$", "data-testid": o, originalPrice: s, trailingText: c, ...l }, u) => /* @__PURE__ */ _(t, {
 	as: "p",
-	className: e(u.PricingOptions__price, r),
+	className: e(d.PricingOptions__price, r),
 	"data-testid": o || v.price,
-	ref: d,
+	ref: u,
 	weight: "normal",
 	...l,
 	children: [
 		/* @__PURE__ */ _("span", {
-			className: u["PricingOptions__price-amount"],
+			className: d["PricingOptions__price-amount"],
 			children: [
 				/* @__PURE__ */ g(t, {
 					as: "span",
-					className: u["PricingOptions__price-currency-symbol"],
+					className: d["PricingOptions__price-currency-symbol"],
 					size: "500",
 					weight: "normal",
 					children: a
 				}),
 				/* @__PURE__ */ g(t, {
 					as: "span",
-					className: u["PricingOptions__price-value"],
+					className: d["PricingOptions__price-value"],
 					size: "500",
 					weight: "normal",
 					children: n
 				}),
 				/* @__PURE__ */ g(t, {
 					as: "span",
-					className: u["PricingOptions__price-currency-code"],
+					className: d["PricingOptions__price-currency-code"],
 					size: "100",
 					weight: "normal",
 					children: i
@@ -166,14 +166,14 @@ var v = {
 			]
 		}),
 		s && /* @__PURE__ */ _("del", {
-			className: u["PricingOptions__price-original-price"],
+			className: d["PricingOptions__price-original-price"],
 			children: [/* @__PURE__ */ g(t, {
 				size: "400",
 				variant: "muted",
 				weight: "normal",
 				children: a
 			}), /* @__PURE__ */ g(t, {
-				className: u["PricingOptions__price-original-price-value"],
+				className: d["PricingOptions__price-original-price-value"],
 				size: "300",
 				variant: "muted",
 				weight: "normal",
@@ -182,13 +182,13 @@ var v = {
 		}),
 		c && /* @__PURE__ */ g(t, {
 			as: "span",
-			className: u["PricingOptions__price-trailing-text"],
+			className: d["PricingOptions__price-trailing-text"],
 			size: "200",
 			variant: "muted",
 			children: c
 		})
 	]
-})), k = p(({ children: t, className: n, "data-testid": r, hasDivider: a = !0, expanded: o, accordionAs: d = "h4", ...p }, m) => {
+})), k = p(({ children: t, className: n, "data-testid": r, hasDivider: a = !0, expanded: o, accordionAs: u = "h4", ...p }, m) => {
 	let { allFeatureListsExpanded: h, updateFeatureListExpanded: y, featureListUserInteracted: b, setFeatureListUserInteracted: C } = x(), { isMedium: w, isXLarge: T, isSmall: E } = s();
 	f.useEffect(() => {
 		(o === void 0 || typeof o == "object") && C(!1);
@@ -218,7 +218,7 @@ var v = {
 		Heading: t,
 		Items: []
 	}), e), []).map(({ Heading: e, Items: t }, n) => /* @__PURE__ */ _("div", {
-		className: u["PricingOptions__feature-list-set"],
+		className: d["PricingOptions__feature-list-set"],
 		children: [e, /* @__PURE__ */ g(l, {
 			variant: "checked",
 			...p,
@@ -227,20 +227,21 @@ var v = {
 	}, n));
 	return /* @__PURE__ */ g("div", {
 		ref: m,
-		className: e(u["PricingOptions__feature-list"], a && u["PricingOptions__feature-list--has-divider"], n),
+		className: e(d["PricingOptions__feature-list"], a && d["PricingOptions__feature-list--has-divider"], n),
 		"data-testid": r || v.featureList,
 		children: /* @__PURE__ */ _(c, {
-			className: u["PricingOptions__feature-list-accordion"],
+			className: d["PricingOptions__feature-list-accordion"],
+			disableAnimation: !0,
 			open: D,
 			onToggle: (e) => {
 				C(!0), y(e.currentTarget.open);
 			},
 			children: [/* @__PURE__ */ _(c.Heading, {
-				as: d,
-				className: u["PricingOptions__feature-list-accordion-heading"],
-				children: [O, /* @__PURE__ */ g(i, { className: u["PricingOptions__feature-list-accordion-chevron"] })]
+				as: u,
+				className: d["PricingOptions__feature-list-accordion-heading"],
+				children: [O, /* @__PURE__ */ g(i, { className: d["PricingOptions__feature-list-accordion-chevron"] })]
 			}), /* @__PURE__ */ g(c.Content, {
-				className: u["PricingOptions__feature-list-accordion-content"],
+				className: d["PricingOptions__feature-list-accordion-content"],
 				children: k
 			})]
 		})
@@ -253,7 +254,7 @@ var v = {
 	children: e
 })), j = p(({ children: t, className: r, "data-testid": i, ...a }, o) => /* @__PURE__ */ g(n, {
 	as: "h4",
-	className: e(u["PricingOptions__feature-list-group-heading"], r),
+	className: e(d["PricingOptions__feature-list-group-heading"], r),
 	"data-testid": i || v.featureListGroupHeading,
 	ref: o,
 	size: "subhead-medium",
@@ -262,19 +263,19 @@ var v = {
 })), M = p(({ children: t, className: n, infoTooltip: i, leadingVisual: o, leadingVisualFill: s, variant: c = "included", "data-testid": f, ...p }, m) => {
 	let h = o ?? (c === "included" ? r : a), y = c === "included" ? "Includes" : "Does not include", b = s ?? (c === "included" ? "var(--brand-color-accent-primary)" : "var(--brand-color-text-muted)");
 	return /* @__PURE__ */ _(l.Item, {
-		className: e(u["PricingOptions__feature-list-item"], { [u["PricingOptions__feature-list-item--excluded"]]: c === "excluded" }, i && u["PricingOptions__feature-list-item--has-info"], n),
+		className: e(d["PricingOptions__feature-list-item"], { [d["PricingOptions__feature-list-item--excluded"]]: c === "excluded" }, i && d["PricingOptions__feature-list-item--has-info"], n),
 		"data-testid": f || v.featureListItem,
 		leadingVisual: h,
 		leadingVisualAriaLabel: y,
 		leadingVisualFill: b,
 		ref: m,
 		...p,
-		children: [t, i && /* @__PURE__ */ g(d, {
+		children: [t, i && /* @__PURE__ */ g(u, {
 			text: i,
 			direction: "n",
 			children: /* @__PURE__ */ g("button", {
 				type: "button",
-				className: u["PricingOptions__feature-list-item-info"],
+				className: d["PricingOptions__feature-list-item-info"],
 				"aria-label": `More information about ${typeof t == "string" ? t : "this feature"}`,
 				children: /* @__PURE__ */ _("svg", {
 					viewBox: "0 0 4 8",
@@ -294,21 +295,21 @@ var v = {
 	});
 }), N = p(({ children: t, className: n, "data-testid": r, leadingComponent: i, ...a }, o) => /* @__PURE__ */ _("div", {
 	ref: o,
-	className: e(u["PricingOptions__actions-message"], n),
+	className: e(d["PricingOptions__actions-message"], n),
 	"data-testid": r || v.actionsMessage,
 	...a,
 	children: [i && /* @__PURE__ */ g("span", {
-		className: u["PricingOptions__actions-message-leading-component"],
+		className: d["PricingOptions__actions-message-leading-component"],
 		children: i
 	}), /* @__PURE__ */ g("div", {
-		className: u["PricingOptions__actions-message-content"],
+		className: d["PricingOptions__actions-message-content"],
 		children: t
 	})]
 })), P = p(({ as: t, children: n, className: r, "data-testid": i, ...a }, s) => /* @__PURE__ */ g(o, {
 	ref: s,
 	as: t,
 	"data-testid": i || v.primaryAction,
-	className: e(u["PricingOptions__primary-action"], r),
+	className: e(d["PricingOptions__primary-action"], r),
 	size: "medium",
 	variant: "primary",
 	block: !0,
@@ -317,7 +318,7 @@ var v = {
 })), F = p(({ as: t, children: n, className: r, "data-testid": i, ...a }, s) => /* @__PURE__ */ g(o, {
 	ref: s,
 	as: t,
-	className: e(u["PricingOptions__primary-action"], r),
+	className: e(d["PricingOptions__primary-action"], r),
 	"data-testid": i || v.secondaryAction,
 	variant: "secondary",
 	block: !0,
@@ -325,13 +326,13 @@ var v = {
 	children: n
 })), I = p(({ children: t, className: n, "data-testid": r, ...i }, a) => /* @__PURE__ */ g("div", {
 	ref: a,
-	className: e(u["PricingOptions__menu-action"], n),
+	className: e(d["PricingOptions__menu-action"], n),
 	"data-testid": r || v.menuAction,
 	...i,
 	children: t
 })), L = p(({ children: n, className: r, "data-testid": i, ...a }, o) => /* @__PURE__ */ g(t, {
 	as: "p",
-	className: e(u.PricingOptions__footnote, r),
+	className: e(d.PricingOptions__footnote, r),
 	"data-testid": i || v.footnote,
 	ref: o,
 	size: "100",

package/esm/PricingOptions/PricingOptions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PricingOptions.js","names":[],"sources":["../../src/PricingOptions/PricingOptions.tsx"],"sourcesContent":["import React, {forwardRef, HTMLAttributes, PropsWithChildren, useMemo, Ref, Dispatch} from 'react'\nimport {CheckIcon, TriangleDownIcon, XIcon} from '@primer/octicons-react'\nimport {clsx} from 'clsx'\nimport type {ListItemProps} from '../list/ListItem/ListItem'\nimport type {BaseProps} from '../component-helpers'\n\nimport {\n Accordion,\n Button,\n ButtonBaseProps,\n Heading as HeadingComponent,\n HeadingProps,\n Text,\n Tooltip,\n UnorderedList,\n UnorderedListProps,\n useWindowSize,\n} from '..'\n\n/*\n Design tokens\n /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pricing-options/pricing-options.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes.css'\n\n/\n Main stylesheet (as a CSS Module)\n /\nimport styles from './PricingOptions.module.css'\n\ntype AlignOptions = 'start' \| 'center'\n\nexport type PricingOptionsProps = {\n align?: AlignOptions\n variant?: 'default' \| 'default-gradient' \| 'cards' \| 'cards-gradient'\n ['data-testid']?: string\n} & PropsWithChildren<BaseProps<HTMLDivElement>> &\n HTMLAttributes<HTMLDivElement>\n\nconst testIds = {\n root: 'PricingOptions',\n item: 'PricingOptions__item',\n labelRow: 'PricingOptions__labels',\n heading: 'PricingOptions__heading',\n label: 'PricingOptions__label',\n description: 'PricingOptions__description',\n price: 'PricingOptions__price',\n actionsMessage: 'PricingOptions__actionsMessage',\n primaryAction: 'PricingOptions__primaryAction',\n secondaryAction: 'PricingOptions__secondaryAction',\n menuAction: 'PricingOptions__menuAction',\n featureList: 'PricingOptions__featureList',\n featureListHeading: 'PricingOptions__featureListHeading',\n featureListItem: 'PricingOptions__featureListItem',\n featureListGroupHeading: 'PricingOptions__featureListGroupHeading',\n footnote: 'PricingOptions__footnote',\n}\n\ntype PricingOptionsContextValue = {\n align: AlignOptions\n allFeatureListsExpanded: boolean\n updateFeatureListExpanded: Dispatch<boolean>\n featureListUserInteracted: boolean\n setFeatureListUserInteracted: Dispatch<boolean>\n}\n\nconst PricingOptionsContext = React.createContext<PricingOptionsContextValue>({\n align: 'start',\n allFeatureListsExpanded: false,\n featureListUserInteracted: false,\n updateFeatureListExpanded: () => {},\n setFeatureListUserInteracted: () => {},\n})\n\nconst PricingOptionsProvider = ({children, align = 'start'}: PropsWithChildren<{align: AlignOptions}>) => {\n const [allFeatureListsExpanded, setAllFeatureListsExpanded] = React.useState(false)\n const [featureListUserInteracted, setFeatureListUserInteracted] = React.useState(false)\n\n const updateFeatureListExpanded = (newValue: boolean) => {\n setAllFeatureListsExpanded(() => newValue)\n }\n\n return (\n <PricingOptionsContext.Provider\n value={{\n allFeatureListsExpanded,\n updateFeatureListExpanded,\n align,\n featureListUserInteracted,\n setFeatureListUserInteracted,\n }}\n >\n {children}\n </PricingOptionsContext.Provider>\n )\n}\n\nconst usePricingOptions = (): PricingOptionsContextValue => {\n return React.useContext(PricingOptionsContext)\n}\n\nconst pricingOptionsDefaultFeatureListHeading = \"What's included\"\n\ntype PricingOptionsLabelProps = PropsWithChildren<{\n 'data-testid'?: string\n}>\n\nconst PricingOptionsLabel = ({children}: PricingOptionsLabelProps) => {\n return <>{children}</>\n}\n\nconst PricingOptionsRoot = forwardRef(\n (\n {\n align = 'start',\n children,\n className,\n 'data-testid': testId,\n variant = 'default',\n ...rest\n }: PropsWithChildren<PricingOptionsProps>,\n ref: Ref<HTMLDivElement>,\n ) => {\n const filteredChildren = useMemo(\n () =>\n React.Children.toArray(children).filter(\n child => React.isValidElement(child) && typeof child.type !== 'string' && child.type === PricingOptionsItem,\n ) as React.ReactElement<PropsWithChildren<PricingOptionsItem>>[],\n [children],\n ).slice(0, 4)\n\n const headerLabels = useMemo(\n () =>\n filteredChildren.map(item => {\n const labelChild = React.Children.toArray(item.props.children).find(\n child =>\n React.isValidElement(child) && typeof child.type !== 'string' && child.type === PricingOptionsLabel,\n )\n\n return (\n React.isValidElement(labelChild) ? labelChild : null\n ) as React.ReactElement<PricingOptionsLabelProps> \| null\n }),\n [filteredChildren],\n )\n\n const hasHeaderLabels = headerLabels.some(label => label !== null)\n\n return (\n <PricingOptionsProvider align={align}>\n <div\n className={clsx(\n styles.PricingOptions,\n styles[`PricingOptions--layout-${variant.includes('default') ? 'default' : 'cards'}`],\n styles[`PricingOptions--items${filteredChildren.length}`],\n styles[`PricingOptions--appearance-${variant.includes('gradient') ? 'gradient' : 'solid'}`],\n className,\n )}\n data-testid={testId \|\| testIds.root}\n ref={ref}\n {...(rest as HTMLAttributes<HTMLElement>)}\n >\n {filteredChildren}\n\n {hasHeaderLabels && (\n <div\n className={styles['PricingOptions__labels']}\n data-testid={testIds.labelRow}\n style={\n {\n '--brand-pricing-options-column-count': filteredChildren.length,\n } as React.CSSProperties\n }\n >\n {headerLabels.map((headerLabel, index) => {\n const hasLabelContent = Boolean(headerLabel?.props.children)\n\n return (\n <div\n className={clsx(\n styles['PricingOptions__label-cell'],\n hasLabelContent\n ? styles['PricingOptions__label-cell--has-label']\n : styles['PricingOptions__label-cell--empty'],\n )}\n data-testid={headerLabel?.props['data-testid'] \|\| testIds.label}\n key={index}\n >\n {headerLabel?.props.children ? (\n <span className={styles.PricingOptions__label}>{headerLabel.props.children}</span>\n ) : null}\n </div>\n )\n })}\n </div>\n )}\n </div>\n </PricingOptionsProvider>\n )\n },\n)\n\nexport type PricingOptionsItem = {\n ['data-testid']?: string\n /\n Escape-hatch for inserting custom React components.\n * Warning:\n * This prop isn't advertised in our docs but remains part of the public API for edge-cases.\n * Need to use this prop? Please check in with #primer-brand first to confirm correct usage.\n /\n leadingComponent?: React.ReactElement\n} & PropsWithChildren<BaseProps<HTMLDivElement>>\n\ntype FilteredChildren = {\n FeatureList: React.ReactElement<PricingOptionsFeatureListProps> \| null\n Actions: React.ReactElement<PricingOptionsActionsProps>[]\n ActionsMessage: React.ReactElement<PricingOptionsActionsMessageProps> \| null\n Footnote: React.ReactElement<PricingOptionsFootnoteProps> \| null\n Heading: React.ReactElement<PricingOptionsHeadingProps> \| null\n Description: React.ReactElement<PricingOptionsDescriptionProps> \| null\n Price: React.ReactElement<PricingOptionsPriceProps> \| null\n}\n\nconst PricingOptionsItem = forwardRef(\n (\n {'data-testid': testId, children, className, leadingComponent, ...rest}: PropsWithChildren<PricingOptionsItem>,\n ref: Ref<HTMLDivElement>,\n ) => {\n const {align} = usePricingOptions()\n\n const memoizedChildren = useMemo(() => React.Children.toArray(children), [children])\n\n const filteredChildren = memoizedChildren.reduce<FilteredChildren>(\n (acc, child) => {\n if (React.isValidElement(child) && typeof child.type !== 'string') {\n if (child.type === PricingOptionsFeatureList) {\n acc.FeatureList = child as React.ReactElement<PricingOptionsFeatureListProps> \| null\n }\n\n if (\n child.type === PricingOptionsPrimaryAction \|\|\n child.type === PricingOptionsSecondaryAction \|\|\n child.type === PricingOptionsMenuAction\n ) {\n acc.Actions.push(child as React.ReactElement<PricingOptionsActionsProps>)\n }\n\n if (child.type === PricingOptionsActionsMessage) {\n acc.ActionsMessage = child as React.ReactElement<PricingOptionsActionsMessageProps>\n }\n\n if (child.type === PricingOptionsFootnote) {\n acc.Footnote = child as React.ReactElement<PricingOptionsFootnoteProps>\n }\n\n if (child.type === PricingOptionsHeading) {\n acc.Heading = child as React.ReactElement<PricingOptionsHeadingProps>\n }\n\n if (child.type === PricingOptionsDescription) {\n acc.Description = child as React.ReactElement<PricingOptionsDescriptionProps>\n }\n\n if (child.type === PricingOptionsPrice) {\n acc.Price = child as React.ReactElement<PricingOptionsPriceProps>\n }\n }\n\n return acc\n },\n {\n FeatureList: null,\n Actions: [],\n ActionsMessage: null,\n Footnote: null,\n Heading: null,\n Description: null,\n Price: null,\n },\n )\n\n const {Heading, Description, Price, FeatureList, Actions, ActionsMessage, Footnote} = filteredChildren\n\n return (\n <div\n className={clsx(\n styles.PricingOptions__item,\n leadingComponent && styles['PricingOptions__item--has-leading-component'],\n styles[`PricingOptions__item--align-${align}`],\n className,\n )}\n data-testid={testId \|\| testIds.item}\n ref={ref}\n {...(rest as HTMLAttributes<HTMLElement>)}\n >\n <div className={styles['PricingOptions__header']}>{Heading}</div>\n {Description}\n {Price}\n {leadingComponent && <div className={styles['PricingOptions__leading-component']}>{leadingComponent}</div>}\n {(Actions.length > 0 \|\| ActionsMessage) && (\n <div className={styles.PricingOptions__actions}>\n {Actions}\n {ActionsMessage}\n </div>\n )}\n {FeatureList}\n {Footnote}\n </div>\n )\n },\n)\n\ntype PricingOptionsDescriptionProps = PropsWithChildren<BaseProps<HTMLParagraphElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsDescription = forwardRef<HTMLParagraphElement, PricingOptionsDescriptionProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles.PricingOptions__description, className)}\n data-testid={testId \|\| testIds.description}\n ref={ref}\n size=\"200\"\n variant=\"muted\"\n {...rest}\n >\n {children}\n </Text>\n )\n },\n)\n\ntype PricingOptionsHeadingProps = PropsWithChildren<BaseProps<HTMLHeadingElement>> & {\n 'data-testid'?: string\n} & HeadingProps\n\nconst PricingOptionsHeading = forwardRef<HTMLHeadingElement, PricingOptionsHeadingProps>(\n ({as = 'h3', children, 'data-testid': testId, size = '5', className, ...rest}, ref) => {\n return (\n <HeadingComponent\n as={as}\n className={clsx(styles.PricingOptions__heading, styles[`PricingOptions__heading--size-${size}`], className)}\n data-testid={testId \|\| testIds.heading}\n ref={ref}\n size={size}\n {...rest}\n >\n {children}\n </HeadingComponent>\n )\n },\n)\n\ntype PricingOptionsPriceProps = PropsWithChildren<BaseProps<HTMLParagraphElement>> & {\n currencyCode?: string\n currencySymbol?: string\n 'data-testid'?: string\n originalPrice?: string\n trailingText?: string\n}\n\nconst PricingOptionsPrice = forwardRef<HTMLParagraphElement, PricingOptionsPriceProps>(\n (\n {\n children,\n className,\n currencyCode = 'USD',\n currencySymbol = '$',\n 'data-testid': testId,\n originalPrice,\n trailingText,\n ...rest\n },\n ref,\n ) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles.PricingOptions__price, className)}\n data-testid={testId \|\| testIds.price}\n ref={ref}\n weight=\"normal\"\n {...rest}\n >\n <span className={styles['PricingOptions__price-amount']}>\n <Text as=\"span\" className={styles['PricingOptions__price-currency-symbol']} size=\"500\" weight=\"normal\">\n {currencySymbol}\n </Text>\n\n <Text as=\"span\" className={styles['PricingOptions__price-value']} size=\"500\" weight=\"normal\">\n {children}\n </Text>\n\n <Text as=\"span\" className={styles['PricingOptions__price-currency-code']} size=\"100\" weight=\"normal\">\n {currencyCode}\n </Text>\n </span>\n\n {originalPrice && (\n <del className={styles['PricingOptions__price-original-price']}>\n <Text size=\"400\" variant=\"muted\" weight=\"normal\">\n {currencySymbol}\n </Text>\n <Text\n className={styles['PricingOptions__price-original-price-value']}\n size=\"300\"\n variant=\"muted\"\n weight=\"normal\"\n >\n {originalPrice}\n </Text>\n </del>\n )}\n\n {trailingText && (\n <Text as=\"span\" className={styles['PricingOptions__price-trailing-text']} size=\"200\" variant=\"muted\">\n {trailingText}\n </Text>\n )}\n </Text>\n )\n },\n)\n\ntype PricingOptionsFeatureListProps = BaseProps<HTMLUListElement> & {\n accordionAs?: HeadingProps['as']\n expanded?: ExpandedProp\n hasDivider?: boolean\n children: React.ReactElement<PricingOptionsFeatureListGroupHeadingProps \| PricingOptionsFeatureListItemProps>[]\n 'data-testid'?: string\n}\n\ntype ExpandedProp = boolean \| ResponsiveExpandableProps\n\ntype ResponsiveExpandableProps = {\n narrow: boolean\n regular: boolean\n wide: boolean\n}\n\ntype ValidFeatureListChildren = {\n Heading: React.ReactElement<PricingOptionsFeatureListGroupHeadingProps> \| null\n Items: React.ReactElement<PricingOptionsFeatureListItemProps>[]\n}[]\n\nconst PricingOptionsFeatureList = forwardRef<HTMLDivElement, PricingOptionsFeatureListProps>(\n ({children, className, 'data-testid': testId, hasDivider = true, expanded, accordionAs = 'h4', ...rest}, ref) => {\n const {\n allFeatureListsExpanded,\n updateFeatureListExpanded,\n featureListUserInteracted,\n setFeatureListUserInteracted,\n } = usePricingOptions()\n const {isMedium: isRegular, isXLarge: isWide, isSmall: isNarrow} = useWindowSize()\n\n React.useEffect(() => {\n if (expanded === undefined \|\| typeof expanded === 'object') {\n setFeatureListUserInteracted(false)\n }\n }, [isRegular, isWide, isNarrow, setFeatureListUserInteracted, expanded])\n\n const shouldBeOpen = React.useMemo(() => {\n if (featureListUserInteracted) {\n return allFeatureListsExpanded\n }\n\n // Important: Fixes layout shift by ensuring that explicit values are preserved.\n if (typeof expanded === 'boolean') {\n return expanded\n }\n // If undefined, should follow some default responsive logic\n if (expanded === undefined) {\n if (isWide) return true\n if (isRegular) return true\n return false\n }\n\n // finally handle responsive objects, and go from largest to smallest viewports\n const {narrow, regular, wide} = expanded\n if (isWide) return wide\n if (isRegular) return regular\n return narrow\n }, [expanded, allFeatureListsExpanded, isRegular, isWide, featureListUserInteracted])\n\n let FeatureListHeading = (\n <PricingOptions.FeatureListHeading>{pricingOptionsDefaultFeatureListHeading}</PricingOptions.FeatureListHeading>\n )\n\n const FilteredChildrenSet = React.Children.toArray(children).reduce<ValidFeatureListChildren>((acc, child) => {\n if (React.isValidElement(child) && child.type === PricingOptionsFeatureListHeading) {\n FeatureListHeading = child\n } else if (React.isValidElement(child) && child.type === PricingOptionsFeatureListItem) {\n if (acc.length === 0) {\n acc.push({Heading: null, Items: []})\n }\n acc[acc.length - 1].Items.push(child as React.ReactElement<PricingOptionsFeatureListItemProps>)\n } else if (React.isValidElement(child) && child.type === PricingOptionsFeatureListGroupHeading) {\n acc.push({\n Heading: child as React.ReactElement<PricingOptionsFeatureListGroupHeadingProps>,\n Items: [],\n })\n }\n\n return acc\n }, [])\n\n const FeatureListItems = FilteredChildrenSet.map(({Heading: HeadingChild, Items}, index) => (\n <div className={styles['PricingOptions__feature-list-set']} key={index}>\n {HeadingChild}\n\n <UnorderedList variant=\"checked\" {...(rest as UnorderedListProps)}>\n {Items}\n </UnorderedList>\n </div>\n ))\n\n return (\n <div\n ref={ref}\n className={clsx(\n styles['PricingOptions__feature-list'],\n hasDivider && styles['PricingOptions__feature-list--has-divider'],\n className,\n )}\n data-testid={testId \|\| testIds.featureList}\n >\n <Accordion\n className={styles['PricingOptions__feature-list-accordion']}\n open={shouldBeOpen}\n onToggle={event => {\n setFeatureListUserInteracted(true)\n updateFeatureListExpanded(event.currentTarget.open)\n }}\n >\n <Accordion.Heading as={accordionAs} className={styles['PricingOptions__feature-list-accordion-heading']}>\n {FeatureListHeading}\n\n <TriangleDownIcon className={styles['PricingOptions__feature-list-accordion-chevron']} />\n </Accordion.Heading>\n <Accordion.Content className={styles['PricingOptions__feature-list-accordion-content']}>\n {FeatureListItems}\n </Accordion.Content>\n </Accordion>\n </div>\n )\n },\n)\n\ntype PricingOptionsFeatureListHeadingProps = PropsWithChildren<BaseProps<HTMLDivElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsFeatureListHeading = forwardRef<HTMLDivElement, PricingOptionsFeatureListHeadingProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <div className={className} data-testid={testId \|\| testIds.featureListHeading} ref={ref} {...rest}>\n {children}\n </div>\n )\n },\n)\n\ntype PricingOptionsFeatureListGroupHeadingProps = PropsWithChildren<BaseProps<HTMLHeadingElement>> & {\n as?: Exclude<HeadingProps['as'], 'h1' \| 'h2'>\n 'data-testid'?: string\n}\n\nconst PricingOptionsFeatureListGroupHeading = forwardRef<\n HTMLHeadingElement,\n PricingOptionsFeatureListGroupHeadingProps\n>(({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <HeadingComponent\n as=\"h4\"\n className={clsx(styles['PricingOptions__feature-list-group-heading'], className)}\n data-testid={testId \|\| testIds.featureListGroupHeading}\n ref={ref}\n size=\"subhead-medium\"\n {...rest}\n >\n {children}\n </HeadingComponent>\n )\n})\n\ntype PricingOptionsFeatureListItemProps = PropsWithChildren<BaseProps<HTMLLIElement>> & {\n 'data-testid'?: string\n infoTooltip?: string\n variant?: 'included' \| 'excluded'\n} & Omit<ListItemProps, 'variant'>\n\nconst PricingOptionsFeatureListItem = forwardRef<HTMLLIElement, PricingOptionsFeatureListItemProps>(\n (\n {\n children,\n className,\n infoTooltip,\n leadingVisual,\n leadingVisualFill,\n variant = 'included',\n 'data-testid': testId,\n ...rest\n },\n ref,\n ) => {\n const itemLeadingVisual = leadingVisual ?? (variant === 'included' ? CheckIcon : XIcon)\n const itemLeadingVisualAriaLabel = variant === 'included' ? 'Includes' : 'Does not include'\n\n const itemLeadingVisualFill =\n leadingVisualFill ??\n (variant === 'included' ? 'var(--brand-color-accent-primary)' : 'var(--brand-color-text-muted)')\n\n return (\n <UnorderedList.Item\n className={clsx(\n styles['PricingOptions__feature-list-item'],\n {[styles['PricingOptions__feature-list-item--excluded']]: variant === 'excluded'},\n infoTooltip && styles['PricingOptions__feature-list-item--has-info'],\n className,\n )}\n data-testid={testId \|\| testIds.featureListItem}\n leadingVisual={itemLeadingVisual}\n leadingVisualAriaLabel={itemLeadingVisualAriaLabel}\n leadingVisualFill={itemLeadingVisualFill}\n ref={ref}\n {...rest}\n >\n {children}\n {infoTooltip && (\n <Tooltip text={infoTooltip} direction=\"n\">\n <button\n type=\"button\"\n className={styles['PricingOptions__feature-list-item-info']}\n aria-label={`More information about ${typeof children === 'string' ? children : 'this feature'}`}\n >\n <svg viewBox=\"0 0 4 8\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n <path\n d=\"M0.75 3C0.33579 3 0 3.33579 0 3.75C0 4.16421 0.33579 4.5 0.75 4.5H1V6.5H0.75C0.33579 6.5 0 6.8358 0 7.25C0 7.6642 0.33579 8 0.75 8H2.75C3.16421 8 3.5 7.6642 3.5 7.25C3.5 6.8358 3.16421 6.5 2.75 6.5H2.5V3.75C2.5 3.33579 2.16421 3 1.75 3H0.75Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M2.5 1C2.5 1.55228 2.05229 2 1.5 2C0.94772 2 0.5 1.55228 0.5 1C0.5 0.44772 0.94772 0 1.5 0C2.05229 0 2.5 0.44772 2.5 1Z\"\n fill=\"currentColor\"\n />\n </svg>\n </button>\n </Tooltip>\n )}\n </UnorderedList.Item>\n )\n },\n)\n\ntype AsA = {as: 'a'; href: string; 'data-testid'?: string} & React.AnchorHTMLAttributes<BaseProps<HTMLAnchorElement>> &\n ButtonBaseProps\n\ntype AsButton = {as: 'button'; 'data-testid'?: string} & React.ButtonHTMLAttributes<BaseProps<HTMLButtonElement>> &\n ButtonBaseProps\n\ntype PricingOptionsActionsProps = AsA \| AsButton\n\ntype PricingOptionsActionsMessageProps = PropsWithChildren<BaseProps<HTMLDivElement>> & {\n 'data-testid'?: string\n leadingComponent?: React.ReactElement\n}\n\nconst PricingOptionsActionsMessage = forwardRef<HTMLDivElement, PricingOptionsActionsMessageProps>(\n ({children, className, 'data-testid': testId, leadingComponent, ...rest}, ref) => {\n return (\n <div\n ref={ref}\n className={clsx(styles['PricingOptions__actions-message'], className)}\n data-testid={testId \|\| testIds.actionsMessage}\n {...rest}\n >\n {leadingComponent && (\n <span className={styles['PricingOptions__actions-message-leading-component']}>{leadingComponent}</span>\n )}\n <div className={styles['PricingOptions__actions-message-content']}>{children}</div>\n </div>\n )\n },\n)\n\nconst PricingOptionsPrimaryAction = forwardRef<\n HTMLAnchorElement \| HTMLButtonElement,\n PropsWithChildren<PricingOptionsActionsProps>\n>(({as, children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Button\n ref={ref as React.Ref<HTMLButtonElement>}\n as={as}\n data-testid={testId \|\| testIds.primaryAction}\n className={clsx(styles['PricingOptions__primary-action'], className)}\n size=\"medium\"\n variant=\"primary\"\n block\n {...rest}\n >\n {children}\n </Button>\n )\n})\n\nconst PricingOptionsSecondaryAction = forwardRef<\n HTMLAnchorElement \| HTMLButtonElement,\n PropsWithChildren<PricingOptionsActionsProps>\n>(({as, children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Button\n ref={ref as React.Ref<HTMLButtonElement>}\n as={as}\n className={clsx(styles['PricingOptions__primary-action'], className)}\n data-testid={testId \|\| testIds.secondaryAction}\n variant=\"secondary\"\n block\n {...rest}\n >\n {children}\n </Button>\n )\n})\n\ntype PricingOptionsMenuActionProps = PropsWithChildren<BaseProps<HTMLDivElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsMenuAction = forwardRef<HTMLDivElement, PricingOptionsMenuActionProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <div\n ref={ref}\n className={clsx(styles['PricingOptions__menu-action'], className)}\n data-testid={testId \|\| testIds.menuAction}\n {...rest}\n >\n {children}\n </div>\n )\n },\n)\n\ntype PricingOptionsFootnoteProps = PropsWithChildren<BaseProps<HTMLParagraphElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsFootnote = forwardRef<HTMLParagraphElement, PricingOptionsFootnoteProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles.PricingOptions__footnote, className)}\n data-testid={testId \|\| testIds.footnote}\n ref={ref}\n size=\"100\"\n variant=\"muted\"\n weight=\"light\"\n {...rest}\n >\n {children}\n </Text>\n )\n },\n)\n\n/\n Pricing options component:\n * {@link https://primer.style/brand/components/PricingOptions/ See usage examples}.\n */\nexport const PricingOptions = Object.assign(PricingOptionsRoot, {\n ActionsMessage: PricingOptionsActionsMessage,\n Description: PricingOptionsDescription,\n FeatureList: PricingOptionsFeatureList,\n FeatureListHeading: PricingOptionsFeatureListHeading,\n FeatureListGroupHeading: PricingOptionsFeatureListGroupHeading,\n FeatureListItem: PricingOptionsFeatureListItem,\n Footnote: PricingOptionsFootnote,\n Label: PricingOptionsLabel,\n Heading: PricingOptionsHeading,\n Item: PricingOptionsItem,\n MenuAction: PricingOptionsMenuAction,\n Price: PricingOptionsPrice,\n PrimaryAction: PricingOptionsPrimaryAction,\n SecondaryAction: PricingOptionsSecondaryAction,\n testIds,\n})\n"],"mappings":"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"}
1	+ {"version":3,"file":"PricingOptions.js","names":[],"sources":["../../src/PricingOptions/PricingOptions.tsx"],"sourcesContent":["import React, {forwardRef, HTMLAttributes, PropsWithChildren, useMemo, Ref, Dispatch} from 'react'\nimport {CheckIcon, TriangleDownIcon, XIcon} from '@primer/octicons-react'\nimport {clsx} from 'clsx'\nimport type {ListItemProps} from '../list/ListItem/ListItem'\nimport type {BaseProps} from '../component-helpers'\nimport {Accordion} from '../Accordion/Accordion'\nimport {Button, type ButtonBaseProps} from '../Button'\nimport {Heading as HeadingComponent, type HeadingProps} from '../Heading'\nimport {Text} from '../Text'\nimport {Tooltip} from '../Tooltip'\nimport {useWindowSize} from '../hooks/useWindowSize'\nimport {UnorderedList, type UnorderedListProps} from '../list'\n\n/*\n Design tokens\n /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pricing-options/pricing-options.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes.css'\n\n/\n Main stylesheet (as a CSS Module)\n /\nimport styles from './PricingOptions.module.css'\n\ntype AlignOptions = 'start' \| 'center'\n\nexport type PricingOptionsProps = {\n align?: AlignOptions\n variant?: 'default' \| 'default-gradient' \| 'cards' \| 'cards-gradient'\n ['data-testid']?: string\n} & PropsWithChildren<BaseProps<HTMLDivElement>> &\n HTMLAttributes<HTMLDivElement>\n\nconst testIds = {\n root: 'PricingOptions',\n item: 'PricingOptions__item',\n labelRow: 'PricingOptions__labels',\n heading: 'PricingOptions__heading',\n label: 'PricingOptions__label',\n description: 'PricingOptions__description',\n price: 'PricingOptions__price',\n actionsMessage: 'PricingOptions__actionsMessage',\n primaryAction: 'PricingOptions__primaryAction',\n secondaryAction: 'PricingOptions__secondaryAction',\n menuAction: 'PricingOptions__menuAction',\n featureList: 'PricingOptions__featureList',\n featureListHeading: 'PricingOptions__featureListHeading',\n featureListItem: 'PricingOptions__featureListItem',\n featureListGroupHeading: 'PricingOptions__featureListGroupHeading',\n footnote: 'PricingOptions__footnote',\n}\n\ntype PricingOptionsContextValue = {\n align: AlignOptions\n allFeatureListsExpanded: boolean\n updateFeatureListExpanded: Dispatch<boolean>\n featureListUserInteracted: boolean\n setFeatureListUserInteracted: Dispatch<boolean>\n}\n\nconst PricingOptionsContext = React.createContext<PricingOptionsContextValue>({\n align: 'start',\n allFeatureListsExpanded: false,\n featureListUserInteracted: false,\n updateFeatureListExpanded: () => {},\n setFeatureListUserInteracted: () => {},\n})\n\nconst PricingOptionsProvider = ({children, align = 'start'}: PropsWithChildren<{align: AlignOptions}>) => {\n const [allFeatureListsExpanded, setAllFeatureListsExpanded] = React.useState(false)\n const [featureListUserInteracted, setFeatureListUserInteracted] = React.useState(false)\n\n const updateFeatureListExpanded = (newValue: boolean) => {\n setAllFeatureListsExpanded(() => newValue)\n }\n\n return (\n <PricingOptionsContext.Provider\n value={{\n allFeatureListsExpanded,\n updateFeatureListExpanded,\n align,\n featureListUserInteracted,\n setFeatureListUserInteracted,\n }}\n >\n {children}\n </PricingOptionsContext.Provider>\n )\n}\n\nconst usePricingOptions = (): PricingOptionsContextValue => {\n return React.useContext(PricingOptionsContext)\n}\n\nconst pricingOptionsDefaultFeatureListHeading = \"What's included\"\n\ntype PricingOptionsLabelProps = PropsWithChildren<{\n 'data-testid'?: string\n}>\n\nconst PricingOptionsLabel = ({children}: PricingOptionsLabelProps) => {\n return <>{children}</>\n}\n\nconst PricingOptionsRoot = forwardRef(\n (\n {\n align = 'start',\n children,\n className,\n 'data-testid': testId,\n variant = 'default',\n ...rest\n }: PropsWithChildren<PricingOptionsProps>,\n ref: Ref<HTMLDivElement>,\n ) => {\n const filteredChildren = useMemo(\n () =>\n React.Children.toArray(children).filter(\n child => React.isValidElement(child) && typeof child.type !== 'string' && child.type === PricingOptionsItem,\n ) as React.ReactElement<PropsWithChildren<PricingOptionsItem>>[],\n [children],\n ).slice(0, 4)\n\n const headerLabels = useMemo(\n () =>\n filteredChildren.map(item => {\n const labelChild = React.Children.toArray(item.props.children).find(\n child =>\n React.isValidElement(child) && typeof child.type !== 'string' && child.type === PricingOptionsLabel,\n )\n\n return (\n React.isValidElement(labelChild) ? labelChild : null\n ) as React.ReactElement<PricingOptionsLabelProps> \| null\n }),\n [filteredChildren],\n )\n\n const hasHeaderLabels = headerLabels.some(label => label !== null)\n\n return (\n <PricingOptionsProvider align={align}>\n <div\n className={clsx(\n styles.PricingOptions,\n styles[`PricingOptions--layout-${variant.includes('default') ? 'default' : 'cards'}`],\n styles[`PricingOptions--items${filteredChildren.length}`],\n styles[`PricingOptions--appearance-${variant.includes('gradient') ? 'gradient' : 'solid'}`],\n className,\n )}\n data-testid={testId \|\| testIds.root}\n ref={ref}\n {...(rest as HTMLAttributes<HTMLElement>)}\n >\n {filteredChildren}\n\n {hasHeaderLabels && (\n <div\n className={styles['PricingOptions__labels']}\n data-testid={testIds.labelRow}\n style={\n {\n '--brand-pricing-options-column-count': filteredChildren.length,\n } as React.CSSProperties\n }\n >\n {headerLabels.map((headerLabel, index) => {\n const hasLabelContent = Boolean(headerLabel?.props.children)\n\n return (\n <div\n className={clsx(\n styles['PricingOptions__label-cell'],\n hasLabelContent\n ? styles['PricingOptions__label-cell--has-label']\n : styles['PricingOptions__label-cell--empty'],\n )}\n data-testid={headerLabel?.props['data-testid'] \|\| testIds.label}\n key={index}\n >\n {headerLabel?.props.children ? (\n <span className={styles.PricingOptions__label}>{headerLabel.props.children}</span>\n ) : null}\n </div>\n )\n })}\n </div>\n )}\n </div>\n </PricingOptionsProvider>\n )\n },\n)\n\nexport type PricingOptionsItem = {\n ['data-testid']?: string\n /\n Escape-hatch for inserting custom React components.\n * Warning:\n * This prop isn't advertised in our docs but remains part of the public API for edge-cases.\n * Need to use this prop? Please check in with #primer-brand first to confirm correct usage.\n /\n leadingComponent?: React.ReactElement\n} & PropsWithChildren<BaseProps<HTMLDivElement>>\n\ntype FilteredChildren = {\n FeatureList: React.ReactElement<PricingOptionsFeatureListProps> \| null\n Actions: React.ReactElement<PricingOptionsActionsProps>[]\n ActionsMessage: React.ReactElement<PricingOptionsActionsMessageProps> \| null\n Footnote: React.ReactElement<PricingOptionsFootnoteProps> \| null\n Heading: React.ReactElement<PricingOptionsHeadingProps> \| null\n Description: React.ReactElement<PricingOptionsDescriptionProps> \| null\n Price: React.ReactElement<PricingOptionsPriceProps> \| null\n}\n\nconst PricingOptionsItem = forwardRef(\n (\n {'data-testid': testId, children, className, leadingComponent, ...rest}: PropsWithChildren<PricingOptionsItem>,\n ref: Ref<HTMLDivElement>,\n ) => {\n const {align} = usePricingOptions()\n\n const memoizedChildren = useMemo(() => React.Children.toArray(children), [children])\n\n const filteredChildren = memoizedChildren.reduce<FilteredChildren>(\n (acc, child) => {\n if (React.isValidElement(child) && typeof child.type !== 'string') {\n if (child.type === PricingOptionsFeatureList) {\n acc.FeatureList = child as React.ReactElement<PricingOptionsFeatureListProps> \| null\n }\n\n if (\n child.type === PricingOptionsPrimaryAction \|\|\n child.type === PricingOptionsSecondaryAction \|\|\n child.type === PricingOptionsMenuAction\n ) {\n acc.Actions.push(child as React.ReactElement<PricingOptionsActionsProps>)\n }\n\n if (child.type === PricingOptionsActionsMessage) {\n acc.ActionsMessage = child as React.ReactElement<PricingOptionsActionsMessageProps>\n }\n\n if (child.type === PricingOptionsFootnote) {\n acc.Footnote = child as React.ReactElement<PricingOptionsFootnoteProps>\n }\n\n if (child.type === PricingOptionsHeading) {\n acc.Heading = child as React.ReactElement<PricingOptionsHeadingProps>\n }\n\n if (child.type === PricingOptionsDescription) {\n acc.Description = child as React.ReactElement<PricingOptionsDescriptionProps>\n }\n\n if (child.type === PricingOptionsPrice) {\n acc.Price = child as React.ReactElement<PricingOptionsPriceProps>\n }\n }\n\n return acc\n },\n {\n FeatureList: null,\n Actions: [],\n ActionsMessage: null,\n Footnote: null,\n Heading: null,\n Description: null,\n Price: null,\n },\n )\n\n const {Heading, Description, Price, FeatureList, Actions, ActionsMessage, Footnote} = filteredChildren\n\n return (\n <div\n className={clsx(\n styles.PricingOptions__item,\n leadingComponent && styles['PricingOptions__item--has-leading-component'],\n styles[`PricingOptions__item--align-${align}`],\n className,\n )}\n data-testid={testId \|\| testIds.item}\n ref={ref}\n {...(rest as HTMLAttributes<HTMLElement>)}\n >\n <div className={styles['PricingOptions__header']}>{Heading}</div>\n {Description}\n {Price}\n {leadingComponent && <div className={styles['PricingOptions__leading-component']}>{leadingComponent}</div>}\n {(Actions.length > 0 \|\| ActionsMessage) && (\n <div className={styles.PricingOptions__actions}>\n {Actions}\n {ActionsMessage}\n </div>\n )}\n {FeatureList}\n {Footnote}\n </div>\n )\n },\n)\n\ntype PricingOptionsDescriptionProps = PropsWithChildren<BaseProps<HTMLParagraphElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsDescription = forwardRef<HTMLParagraphElement, PricingOptionsDescriptionProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles.PricingOptions__description, className)}\n data-testid={testId \|\| testIds.description}\n ref={ref}\n size=\"200\"\n variant=\"muted\"\n {...rest}\n >\n {children}\n </Text>\n )\n },\n)\n\ntype PricingOptionsHeadingProps = PropsWithChildren<BaseProps<HTMLHeadingElement>> & {\n 'data-testid'?: string\n} & HeadingProps\n\nconst PricingOptionsHeading = forwardRef<HTMLHeadingElement, PricingOptionsHeadingProps>(\n ({as = 'h3', children, 'data-testid': testId, size = '5', className, ...rest}, ref) => {\n return (\n <HeadingComponent\n as={as}\n className={clsx(styles.PricingOptions__heading, styles[`PricingOptions__heading--size-${size}`], className)}\n data-testid={testId \|\| testIds.heading}\n ref={ref}\n size={size}\n {...rest}\n >\n {children}\n </HeadingComponent>\n )\n },\n)\n\ntype PricingOptionsPriceProps = PropsWithChildren<BaseProps<HTMLParagraphElement>> & {\n currencyCode?: string\n currencySymbol?: string\n 'data-testid'?: string\n originalPrice?: string\n trailingText?: string\n}\n\nconst PricingOptionsPrice = forwardRef<HTMLParagraphElement, PricingOptionsPriceProps>(\n (\n {\n children,\n className,\n currencyCode = 'USD',\n currencySymbol = '$',\n 'data-testid': testId,\n originalPrice,\n trailingText,\n ...rest\n },\n ref,\n ) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles.PricingOptions__price, className)}\n data-testid={testId \|\| testIds.price}\n ref={ref}\n weight=\"normal\"\n {...rest}\n >\n <span className={styles['PricingOptions__price-amount']}>\n <Text as=\"span\" className={styles['PricingOptions__price-currency-symbol']} size=\"500\" weight=\"normal\">\n {currencySymbol}\n </Text>\n\n <Text as=\"span\" className={styles['PricingOptions__price-value']} size=\"500\" weight=\"normal\">\n {children}\n </Text>\n\n <Text as=\"span\" className={styles['PricingOptions__price-currency-code']} size=\"100\" weight=\"normal\">\n {currencyCode}\n </Text>\n </span>\n\n {originalPrice && (\n <del className={styles['PricingOptions__price-original-price']}>\n <Text size=\"400\" variant=\"muted\" weight=\"normal\">\n {currencySymbol}\n </Text>\n <Text\n className={styles['PricingOptions__price-original-price-value']}\n size=\"300\"\n variant=\"muted\"\n weight=\"normal\"\n >\n {originalPrice}\n </Text>\n </del>\n )}\n\n {trailingText && (\n <Text as=\"span\" className={styles['PricingOptions__price-trailing-text']} size=\"200\" variant=\"muted\">\n {trailingText}\n </Text>\n )}\n </Text>\n )\n },\n)\n\ntype PricingOptionsFeatureListProps = BaseProps<HTMLUListElement> & {\n accordionAs?: HeadingProps['as']\n expanded?: ExpandedProp\n hasDivider?: boolean\n children: React.ReactElement<PricingOptionsFeatureListGroupHeadingProps \| PricingOptionsFeatureListItemProps>[]\n 'data-testid'?: string\n}\n\ntype ExpandedProp = boolean \| ResponsiveExpandableProps\n\ntype ResponsiveExpandableProps = {\n narrow: boolean\n regular: boolean\n wide: boolean\n}\n\ntype ValidFeatureListChildren = {\n Heading: React.ReactElement<PricingOptionsFeatureListGroupHeadingProps> \| null\n Items: React.ReactElement<PricingOptionsFeatureListItemProps>[]\n}[]\n\nconst PricingOptionsFeatureList = forwardRef<HTMLDivElement, PricingOptionsFeatureListProps>(\n ({children, className, 'data-testid': testId, hasDivider = true, expanded, accordionAs = 'h4', ...rest}, ref) => {\n const {\n allFeatureListsExpanded,\n updateFeatureListExpanded,\n featureListUserInteracted,\n setFeatureListUserInteracted,\n } = usePricingOptions()\n const {isMedium: isRegular, isXLarge: isWide, isSmall: isNarrow} = useWindowSize()\n\n React.useEffect(() => {\n if (expanded === undefined \|\| typeof expanded === 'object') {\n setFeatureListUserInteracted(false)\n }\n }, [isRegular, isWide, isNarrow, setFeatureListUserInteracted, expanded])\n\n const shouldBeOpen = React.useMemo(() => {\n if (featureListUserInteracted) {\n return allFeatureListsExpanded\n }\n\n // Important: Fixes layout shift by ensuring that explicit values are preserved.\n if (typeof expanded === 'boolean') {\n return expanded\n }\n // If undefined, should follow some default responsive logic\n if (expanded === undefined) {\n if (isWide) return true\n if (isRegular) return true\n return false\n }\n\n // finally handle responsive objects, and go from largest to smallest viewports\n const {narrow, regular, wide} = expanded\n if (isWide) return wide\n if (isRegular) return regular\n return narrow\n }, [expanded, allFeatureListsExpanded, isRegular, isWide, featureListUserInteracted])\n\n let FeatureListHeading = (\n <PricingOptions.FeatureListHeading>{pricingOptionsDefaultFeatureListHeading}</PricingOptions.FeatureListHeading>\n )\n\n const FilteredChildrenSet = React.Children.toArray(children).reduce<ValidFeatureListChildren>((acc, child) => {\n if (React.isValidElement(child) && child.type === PricingOptionsFeatureListHeading) {\n FeatureListHeading = child\n } else if (React.isValidElement(child) && child.type === PricingOptionsFeatureListItem) {\n if (acc.length === 0) {\n acc.push({Heading: null, Items: []})\n }\n acc[acc.length - 1].Items.push(child as React.ReactElement<PricingOptionsFeatureListItemProps>)\n } else if (React.isValidElement(child) && child.type === PricingOptionsFeatureListGroupHeading) {\n acc.push({\n Heading: child as React.ReactElement<PricingOptionsFeatureListGroupHeadingProps>,\n Items: [],\n })\n }\n\n return acc\n }, [])\n\n const FeatureListItems = FilteredChildrenSet.map(({Heading: HeadingChild, Items}, index) => (\n <div className={styles['PricingOptions__feature-list-set']} key={index}>\n {HeadingChild}\n\n <UnorderedList variant=\"checked\" {...(rest as UnorderedListProps)}>\n {Items}\n </UnorderedList>\n </div>\n ))\n\n return (\n <div\n ref={ref}\n className={clsx(\n styles['PricingOptions__feature-list'],\n hasDivider && styles['PricingOptions__feature-list--has-divider'],\n className,\n )}\n data-testid={testId \|\| testIds.featureList}\n >\n <Accordion\n className={styles['PricingOptions__feature-list-accordion']}\n disableAnimation\n open={shouldBeOpen}\n onToggle={event => {\n setFeatureListUserInteracted(true)\n updateFeatureListExpanded(event.currentTarget.open)\n }}\n >\n <Accordion.Heading as={accordionAs} className={styles['PricingOptions__feature-list-accordion-heading']}>\n {FeatureListHeading}\n\n <TriangleDownIcon className={styles['PricingOptions__feature-list-accordion-chevron']} />\n </Accordion.Heading>\n <Accordion.Content className={styles['PricingOptions__feature-list-accordion-content']}>\n {FeatureListItems}\n </Accordion.Content>\n </Accordion>\n </div>\n )\n },\n)\n\ntype PricingOptionsFeatureListHeadingProps = PropsWithChildren<BaseProps<HTMLDivElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsFeatureListHeading = forwardRef<HTMLDivElement, PricingOptionsFeatureListHeadingProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <div className={className} data-testid={testId \|\| testIds.featureListHeading} ref={ref} {...rest}>\n {children}\n </div>\n )\n },\n)\n\ntype PricingOptionsFeatureListGroupHeadingProps = PropsWithChildren<BaseProps<HTMLHeadingElement>> & {\n as?: Exclude<HeadingProps['as'], 'h1' \| 'h2'>\n 'data-testid'?: string\n}\n\nconst PricingOptionsFeatureListGroupHeading = forwardRef<\n HTMLHeadingElement,\n PricingOptionsFeatureListGroupHeadingProps\n>(({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <HeadingComponent\n as=\"h4\"\n className={clsx(styles['PricingOptions__feature-list-group-heading'], className)}\n data-testid={testId \|\| testIds.featureListGroupHeading}\n ref={ref}\n size=\"subhead-medium\"\n {...rest}\n >\n {children}\n </HeadingComponent>\n )\n})\n\ntype PricingOptionsFeatureListItemProps = PropsWithChildren<BaseProps<HTMLLIElement>> & {\n 'data-testid'?: string\n infoTooltip?: string\n variant?: 'included' \| 'excluded'\n} & Omit<ListItemProps, 'variant'>\n\nconst PricingOptionsFeatureListItem = forwardRef<HTMLLIElement, PricingOptionsFeatureListItemProps>(\n (\n {\n children,\n className,\n infoTooltip,\n leadingVisual,\n leadingVisualFill,\n variant = 'included',\n 'data-testid': testId,\n ...rest\n },\n ref,\n ) => {\n const itemLeadingVisual = leadingVisual ?? (variant === 'included' ? CheckIcon : XIcon)\n const itemLeadingVisualAriaLabel = variant === 'included' ? 'Includes' : 'Does not include'\n\n const itemLeadingVisualFill =\n leadingVisualFill ??\n (variant === 'included' ? 'var(--brand-color-accent-primary)' : 'var(--brand-color-text-muted)')\n\n return (\n <UnorderedList.Item\n className={clsx(\n styles['PricingOptions__feature-list-item'],\n {[styles['PricingOptions__feature-list-item--excluded']]: variant === 'excluded'},\n infoTooltip && styles['PricingOptions__feature-list-item--has-info'],\n className,\n )}\n data-testid={testId \|\| testIds.featureListItem}\n leadingVisual={itemLeadingVisual}\n leadingVisualAriaLabel={itemLeadingVisualAriaLabel}\n leadingVisualFill={itemLeadingVisualFill}\n ref={ref}\n {...rest}\n >\n {children}\n {infoTooltip && (\n <Tooltip text={infoTooltip} direction=\"n\">\n <button\n type=\"button\"\n className={styles['PricingOptions__feature-list-item-info']}\n aria-label={`More information about ${typeof children === 'string' ? children : 'this feature'}`}\n >\n <svg viewBox=\"0 0 4 8\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n <path\n d=\"M0.75 3C0.33579 3 0 3.33579 0 3.75C0 4.16421 0.33579 4.5 0.75 4.5H1V6.5H0.75C0.33579 6.5 0 6.8358 0 7.25C0 7.6642 0.33579 8 0.75 8H2.75C3.16421 8 3.5 7.6642 3.5 7.25C3.5 6.8358 3.16421 6.5 2.75 6.5H2.5V3.75C2.5 3.33579 2.16421 3 1.75 3H0.75Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M2.5 1C2.5 1.55228 2.05229 2 1.5 2C0.94772 2 0.5 1.55228 0.5 1C0.5 0.44772 0.94772 0 1.5 0C2.05229 0 2.5 0.44772 2.5 1Z\"\n fill=\"currentColor\"\n />\n </svg>\n </button>\n </Tooltip>\n )}\n </UnorderedList.Item>\n )\n },\n)\n\ntype AsA = {as: 'a'; href: string; 'data-testid'?: string} & React.AnchorHTMLAttributes<BaseProps<HTMLAnchorElement>> &\n ButtonBaseProps\n\ntype AsButton = {as: 'button'; 'data-testid'?: string} & React.ButtonHTMLAttributes<BaseProps<HTMLButtonElement>> &\n ButtonBaseProps\n\ntype PricingOptionsActionsProps = AsA \| AsButton\n\ntype PricingOptionsActionsMessageProps = PropsWithChildren<BaseProps<HTMLDivElement>> & {\n 'data-testid'?: string\n leadingComponent?: React.ReactElement\n}\n\nconst PricingOptionsActionsMessage = forwardRef<HTMLDivElement, PricingOptionsActionsMessageProps>(\n ({children, className, 'data-testid': testId, leadingComponent, ...rest}, ref) => {\n return (\n <div\n ref={ref}\n className={clsx(styles['PricingOptions__actions-message'], className)}\n data-testid={testId \|\| testIds.actionsMessage}\n {...rest}\n >\n {leadingComponent && (\n <span className={styles['PricingOptions__actions-message-leading-component']}>{leadingComponent}</span>\n )}\n <div className={styles['PricingOptions__actions-message-content']}>{children}</div>\n </div>\n )\n },\n)\n\nconst PricingOptionsPrimaryAction = forwardRef<\n HTMLAnchorElement \| HTMLButtonElement,\n PropsWithChildren<PricingOptionsActionsProps>\n>(({as, children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Button\n ref={ref as React.Ref<HTMLButtonElement>}\n as={as}\n data-testid={testId \|\| testIds.primaryAction}\n className={clsx(styles['PricingOptions__primary-action'], className)}\n size=\"medium\"\n variant=\"primary\"\n block\n {...rest}\n >\n {children}\n </Button>\n )\n})\n\nconst PricingOptionsSecondaryAction = forwardRef<\n HTMLAnchorElement \| HTMLButtonElement,\n PropsWithChildren<PricingOptionsActionsProps>\n>(({as, children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Button\n ref={ref as React.Ref<HTMLButtonElement>}\n as={as}\n className={clsx(styles['PricingOptions__primary-action'], className)}\n data-testid={testId \|\| testIds.secondaryAction}\n variant=\"secondary\"\n block\n {...rest}\n >\n {children}\n </Button>\n )\n})\n\ntype PricingOptionsMenuActionProps = PropsWithChildren<BaseProps<HTMLDivElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsMenuAction = forwardRef<HTMLDivElement, PricingOptionsMenuActionProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <div\n ref={ref}\n className={clsx(styles['PricingOptions__menu-action'], className)}\n data-testid={testId \|\| testIds.menuAction}\n {...rest}\n >\n {children}\n </div>\n )\n },\n)\n\ntype PricingOptionsFootnoteProps = PropsWithChildren<BaseProps<HTMLParagraphElement>> & {\n 'data-testid'?: string\n}\n\nconst PricingOptionsFootnote = forwardRef<HTMLParagraphElement, PricingOptionsFootnoteProps>(\n ({children, className, 'data-testid': testId, ...rest}, ref) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles.PricingOptions__footnote, className)}\n data-testid={testId \|\| testIds.footnote}\n ref={ref}\n size=\"100\"\n variant=\"muted\"\n weight=\"light\"\n {...rest}\n >\n {children}\n </Text>\n )\n },\n)\n\n/\n Pricing options component:\n * {@link https://primer.style/brand/components/PricingOptions/ See usage examples}.\n */\nexport const PricingOptions = Object.assign(PricingOptionsRoot, {\n ActionsMessage: PricingOptionsActionsMessage,\n Description: PricingOptionsDescription,\n FeatureList: PricingOptionsFeatureList,\n FeatureListHeading: PricingOptionsFeatureListHeading,\n FeatureListGroupHeading: PricingOptionsFeatureListGroupHeading,\n FeatureListItem: PricingOptionsFeatureListItem,\n Footnote: PricingOptionsFootnote,\n Label: PricingOptionsLabel,\n Heading: PricingOptionsHeading,\n Item: PricingOptionsItem,\n MenuAction: PricingOptionsMenuAction,\n Price: PricingOptionsPrice,\n PrimaryAction: PricingOptionsPrimaryAction,\n SecondaryAction: PricingOptionsSecondaryAction,\n testIds,\n})\n"],"mappings":"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"}

package/esm/Stack/Stack.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/size/si
 export declare const StackDirectionVariants: readonly ["horizontal", "vertical"];
 type StackDirectionVariants = (typeof StackDirectionVariants)[number];
 export declare const defaultStackDirection: "vertical";
-export declare const StackSpacingVariants: readonly ["none", "condensed", "normal", "spacious", 4, 8, 12, 16, 20, 24, 28, 32, 36, 40, 44, 48, 64, 80, 96, 112, 128];
+export declare const StackSpacingVariants: readonly ["none", "condensed", "normal", "spacious", 4, 8, 12, 16, 20, 24, 28, 32, 36, 40, 44, 48, 60, 64, 80, 88, 96, 112, 128];
 type StackSpacingVariants = (typeof StackSpacingVariants)[number];
 export declare const defaultStackSpacing: "condensed";
 export declare const StackAlignItemVariants: readonly ["center", "flex-start", "flex-end"];

package/esm/Stack/Stack.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Stack.d.ts","sourceRoot":"","sources":["../../src/Stack/Stack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAGhD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,OAAO,gFAAgF,CAAA;AAGvF,eAAO,MAAM,sBAAsB,qCAAsC,CAAA;AACzE,KAAK,sBAAsB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AACrE,eAAO,MAAM,qBAAqB,YAA4B,CAAA;AAE9D,eAAO,MAAM,oBAAoB,~~0HAAyE~~,CAAA;AAC1G,KAAK,oBAAoB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAA;AACjE,eAAO,MAAM,mBAAmB,aAA0B,CAAA;AAE1D,eAAO,MAAM,sBAAsB,+CAAgD,CAAA;AACnF,KAAK,sBAAsB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AAErE,eAAO,MAAM,qBAAqB,6BAA8B,CAAA;AAChE,KAAK,qBAAqB,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAA;AAEnE,eAAO,MAAM,2BAA2B,gGAK9B,CAAA;AACV,KAAK,sBAAsB,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1E,KAAK,2BAA2B,GAAG;IACjC,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,IAAI,CAAC,EAAE,sBAAsB,CAAA;CAC9B,CAAA;AAED,KAAK,uBAAuB,GAAG;IAC7B,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,IAAI,CAAC,EAAE,sBAAsB,CAAA;CAC9B,CAAA;AAED,KAAK,sBAAsB,GAAG;IAC5B,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,IAAI,CAAC,EAAE,sBAAsB,CAAA;CAC9B,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAC7B,OAAO,CAAC,EAAE,oBAAoB,CAAA;IAC9B,IAAI,CAAC,EAAE,oBAAoB,CAAA;CAC5B,CAAA;AAED,KAAK,qBAAqB,GAAG;IAC3B,MAAM,CAAC,EAAE,qBAAqB,CAAA;IAC9B,OAAO,CAAC,EAAE,qBAAqB,CAAA;IAC/B,IAAI,CAAC,EAAE,qBAAqB,CAAA;CAC7B,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,SAAS,CAAC,WAAW,CAAC,GAAG;IAChD,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAE,GAAG,KAAK,CAAC,SAAS,CAAA;IAC7C;;;;OAIG;IACH,SAAS,CAAC,EAAE,sBAAsB,GAAG,sBAAsB,CAAA;IAC3D;;;;OAIG;IACH,GAAG,CAAC,EAAE,oBAAoB,GAAG,oBAAoB,CAAA;IACjD;;;;OAIG;IACH,UAAU,CAAC,EAAE,sBAAsB,GAAG,uBAAuB,CAAA;IAC7D;;;;OAIG;IACH,OAAO,CAAC,EAAE,oBAAoB,GAAG,oBAAoB,CAAA;IACrD;;;;OAIG;IACH,cAAc,CAAC,EAAE,sBAAsB,GAAG,2BAA2B,CAAA;IACrE;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B;;OAEG;IACH,QAAQ,CAAC,EAAE,qBAAqB,GAAG,qBAAqB,CAAA;CACzD,GAAG,SAAS,CAAC,cAAc,CAAC,GAC3B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AA4GtC;;;GAGG;AACH,eAAO,MAAM,KAAK,yFAAwB,CAAA"}
1	+ {"version":3,"file":"Stack.d.ts","sourceRoot":"","sources":["../../src/Stack/Stack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAGhD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,OAAO,gFAAgF,CAAA;AAGvF,eAAO,MAAM,sBAAsB,qCAAsC,CAAA;AACzE,KAAK,sBAAsB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AACrE,eAAO,MAAM,qBAAqB,YAA4B,CAAA;AAE9D,eAAO,MAAM,oBAAoB,kIAAyE,CAAA;AAC1G,KAAK,oBAAoB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAA;AACjE,eAAO,MAAM,mBAAmB,aAA0B,CAAA;AAE1D,eAAO,MAAM,sBAAsB,+CAAgD,CAAA;AACnF,KAAK,sBAAsB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AAErE,eAAO,MAAM,qBAAqB,6BAA8B,CAAA;AAChE,KAAK,qBAAqB,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAA;AAEnE,eAAO,MAAM,2BAA2B,gGAK9B,CAAA;AACV,KAAK,sBAAsB,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1E,KAAK,2BAA2B,GAAG;IACjC,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,IAAI,CAAC,EAAE,sBAAsB,CAAA;CAC9B,CAAA;AAED,KAAK,uBAAuB,GAAG;IAC7B,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,IAAI,CAAC,EAAE,sBAAsB,CAAA;CAC9B,CAAA;AAED,KAAK,sBAAsB,GAAG;IAC5B,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,IAAI,CAAC,EAAE,sBAAsB,CAAA;CAC9B,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAC7B,OAAO,CAAC,EAAE,oBAAoB,CAAA;IAC9B,IAAI,CAAC,EAAE,oBAAoB,CAAA;CAC5B,CAAA;AAED,KAAK,qBAAqB,GAAG;IAC3B,MAAM,CAAC,EAAE,qBAAqB,CAAA;IAC9B,OAAO,CAAC,EAAE,qBAAqB,CAAA;IAC/B,IAAI,CAAC,EAAE,qBAAqB,CAAA;CAC7B,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,SAAS,CAAC,WAAW,CAAC,GAAG;IAChD,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAE,GAAG,KAAK,CAAC,SAAS,CAAA;IAC7C;;;;OAIG;IACH,SAAS,CAAC,EAAE,sBAAsB,GAAG,sBAAsB,CAAA;IAC3D;;;;OAIG;IACH,GAAG,CAAC,EAAE,oBAAoB,GAAG,oBAAoB,CAAA;IACjD;;;;OAIG;IACH,UAAU,CAAC,EAAE,sBAAsB,GAAG,uBAAuB,CAAA;IAC7D;;;;OAIG;IACH,OAAO,CAAC,EAAE,oBAAoB,GAAG,oBAAoB,CAAA;IACrD;;;;OAIG;IACH,cAAc,CAAC,EAAE,sBAAsB,GAAG,2BAA2B,CAAA;IACrE;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B;;OAEG;IACH,QAAQ,CAAC,EAAE,qBAAqB,GAAG,qBAAqB,CAAA;CACzD,GAAG,SAAS,CAAC,cAAc,CAAC,GAC3B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AA4GtC;;;GAGG;AACH,eAAO,MAAM,KAAK,yFAAwB,CAAA"}

package/esm/Stack/Stack.module-BlpDkOqI.css ADDED Viewed

@@ -0,0 +1 @@

+ .Primer_Brand__Stack-module__Stack___kkChc{display:flex}.Primer_Brand__Stack-module__Stack--vertical___bDZvE{flex-direction:column}.Primer_Brand__Stack-module__Stack--horizontal___SffMX{flex-direction:row}.Primer_Brand__Stack-module__Stack-narrow--vertical___IAUDe{flex-direction:column}.Primer_Brand__Stack-module__Stack-narrow--horizontal___2KaoW{flex-direction:row}@media screen and (width>=48rem){.Primer_Brand__Stack-module__Stack-regular--vertical___vd6L5{flex-direction:column}.Primer_Brand__Stack-module__Stack-regular--horizontal___s7IV3{flex-direction:row}}@media screen and (width>=80rem){.Primer_Brand__Stack-module__Stack-wide--vertical___pr0cr{flex-direction:column}.Primer_Brand__Stack-module__Stack-wide--horizontal___2sAhE{flex-direction:row}}.Primer_Brand__Stack-module__Stack--gap-none___M7oco{gap:0}.Primer_Brand__Stack-module__Stack--gap-condensed___wITpD{gap:var(--brand-stack-gap-condensed)}.Primer_Brand__Stack-module__Stack--gap-normal___3_XTQ{gap:var(--brand-stack-gap-normal)}.Primer_Brand__Stack-module__Stack--gap-spacious___YWDRs{gap:var(--brand-stack-gap-spacious)}.Primer_Brand__Stack-module__Stack--gap-4___DmtHd{gap:var(--base-size-4)}.Primer_Brand__Stack-module__Stack--gap-8___0tz6i{gap:var(--base-size-8)}.Primer_Brand__Stack-module__Stack--gap-12___hw3H6{gap:var(--base-size-12)}.Primer_Brand__Stack-module__Stack--gap-16___t6Ejn{gap:var(--base-size-16)}.Primer_Brand__Stack-module__Stack--gap-20___FbD_l{gap:var(--base-size-20)}.Primer_Brand__Stack-module__Stack--gap-24___aI3Ni{gap:var(--base-size-24)}.Primer_Brand__Stack-module__Stack--gap-28___kvqUN{gap:var(--base-size-28)}.Primer_Brand__Stack-module__Stack--gap-32___QcuiZ{gap:var(--base-size-32)}.Primer_Brand__Stack-module__Stack--gap-36___bzo72{gap:var(--base-size-36)}.Primer_Brand__Stack-module__Stack--gap-40____noq3{gap:var(--base-size-40)}.Primer_Brand__Stack-module__Stack--gap-44___E14a1{gap:var(--base-size-44)}.Primer_Brand__Stack-module__Stack--gap-48___4cXLL{gap:var(--base-size-48)}.Primer_Brand__Stack-module__Stack--gap-60___Og2VH{gap:var(--base-size-60)}.Primer_Brand__Stack-module__Stack--gap-64___Jc3_y{gap:var(--base-size-64)}.Primer_Brand__Stack-module__Stack--gap-80___L08Xx{gap:var(--base-size-80)}.Primer_Brand__Stack-module__Stack--gap-88___AyHSj{gap:var(--base-size-88)}.Primer_Brand__Stack-module__Stack--gap-96___akgBJ{gap:var(--base-size-96)}.Primer_Brand__Stack-module__Stack--gap-112___E8Grv{gap:var(--base-size-112)}.Primer_Brand__Stack-module__Stack--gap-128___SVUO1{gap:var(--base-size-128)}.Primer_Brand__Stack-module__Stack-narrow--gap-none___YrNLI{gap:0}.Primer_Brand__Stack-module__Stack-narrow--gap-condensed___1jfe1{gap:var(--brand-stack-gap-condensed)}.Primer_Brand__Stack-module__Stack-narrow--gap-normal___j5C5u{gap:var(--brand-stack-gap-normal)}.Primer_Brand__Stack-module__Stack-narrow--gap-spacious___7yaBE{gap:var(--brand-stack-gap-spacious)}.Primer_Brand__Stack-module__Stack--padding-none___YsKYp{padding:0}.Primer_Brand__Stack-module__Stack--padding-condensed___NyPEM{padding:var(--brand-stack-padding-condensed)}.Primer_Brand__Stack-module__Stack--padding-normal___Z7YWq{padding:var(--brand-stack-padding-normal)}.Primer_Brand__Stack-module__Stack--padding-spacious___HCbMd{padding:var(--brand-stack-padding-spacious)}.Primer_Brand__Stack-module__Stack--padding-4____FXLn{padding:var(--base-size-4)}.Primer_Brand__Stack-module__Stack--padding-8___mfgwT{padding:var(--base-size-8)}.Primer_Brand__Stack-module__Stack--padding-12___xAM4B{padding:var(--base-size-12)}.Primer_Brand__Stack-module__Stack--padding-16___XZRrW{padding:var(--base-size-16)}.Primer_Brand__Stack-module__Stack--padding-20___4KQLU{padding:var(--base-size-20)}.Primer_Brand__Stack-module__Stack--padding-24___xwvS5{padding:var(--base-size-24)}.Primer_Brand__Stack-module__Stack--padding-28___RzzNL{padding:var(--base-size-28)}.Primer_Brand__Stack-module__Stack--padding-32___wkcqe{padding:var(--base-size-32)}.Primer_Brand__Stack-module__Stack--padding-36___LSie5{padding:var(--base-size-36)}.Primer_Brand__Stack-module__Stack--padding-40___VqBeq{padding:var(--base-size-40)}.Primer_Brand__Stack-module__Stack--padding-44___mm4AF{padding:var(--base-size-44)}.Primer_Brand__Stack-module__Stack--padding-48___t1OLR{padding:var(--base-size-48)}.Primer_Brand__Stack-module__Stack--padding-60___0mxrO{padding:var(--base-size-60)}.Primer_Brand__Stack-module__Stack--padding-64___V2DFf{padding:var(--base-size-64)}.Primer_Brand__Stack-module__Stack--padding-80___hoHKh{padding:var(--base-size-80)}.Primer_Brand__Stack-module__Stack--padding-88___goVG4{padding:var(--base-size-88)}.Primer_Brand__Stack-module__Stack--padding-96___aJNAL{padding:var(--base-size-96)}.Primer_Brand__Stack-module__Stack--padding-112___4_E_r{padding:var(--base-size-112)}.Primer_Brand__Stack-module__Stack--padding-128___pxk0j{padding:var(--base-size-128)}.Primer_Brand__Stack-module__Stack-narrow--padding-none___XJ0bB{padding:0}.Primer_Brand__Stack-module__Stack-narrow--padding-condensed___ev3AN{padding:var(--brand-stack-padding-condensed)}.Primer_Brand__Stack-module__Stack-narrow--padding-normal___Nzmce{padding:var(--brand-stack-padding-normal)}.Primer_Brand__Stack-module__Stack-narrow--padding-spacious___mCH98{padding:var(--brand-stack-padding-spacious)}.Primer_Brand__Stack-module__Stack-narrow--padding-4___q19rQ{padding:var(--base-size-4)}.Primer_Brand__Stack-module__Stack-narrow--padding-8___kcIyl{padding:var(--base-size-8)}.Primer_Brand__Stack-module__Stack-narrow--padding-12___XMlJ1{padding:var(--base-size-12)}.Primer_Brand__Stack-module__Stack-narrow--padding-16___8SqCc{padding:var(--base-size-16)}.Primer_Brand__Stack-module__Stack-narrow--padding-20___UHjCb{padding:var(--base-size-20)}.Primer_Brand__Stack-module__Stack-narrow--padding-24____i12s{padding:var(--base-size-24)}.Primer_Brand__Stack-module__Stack-narrow--padding-28___u0yWu{padding:var(--base-size-28)}.Primer_Brand__Stack-module__Stack-narrow--padding-32___zqRGI{padding:var(--base-size-32)}.Primer_Brand__Stack-module__Stack-narrow--padding-36___lGKdp{padding:var(--base-size-36)}.Primer_Brand__Stack-module__Stack-narrow--padding-40___atyPw{padding:var(--base-size-40)}.Primer_Brand__Stack-module__Stack-narrow--padding-44___OVq8j{padding:var(--base-size-44)}.Primer_Brand__Stack-module__Stack-narrow--padding-48___nCssn{padding:var(--base-size-48)}.Primer_Brand__Stack-module__Stack-narrow--padding-60___TZzjf{padding:var(--base-size-60)}.Primer_Brand__Stack-module__Stack-narrow--padding-64___0f2_2{padding:var(--base-size-64)}.Primer_Brand__Stack-module__Stack-narrow--padding-80___5zWH_{padding:var(--base-size-80)}.Primer_Brand__Stack-module__Stack-narrow--padding-88___XetV9{padding:var(--base-size-88)}.Primer_Brand__Stack-module__Stack-narrow--padding-96___uTd_u{padding:var(--base-size-96)}.Primer_Brand__Stack-module__Stack-narrow--padding-112___pF7Tf{padding:var(--base-size-112)}.Primer_Brand__Stack-module__Stack-narrow--padding-128___5p0JU{padding:var(--base-size-128)}.Primer_Brand__Stack-module__Stack-narrow--gap-4___6moeR{gap:var(--base-size-4)}.Primer_Brand__Stack-module__Stack-narrow--gap-8___ZnKF3{gap:var(--base-size-8)}.Primer_Brand__Stack-module__Stack-narrow--gap-12___wppH_{gap:var(--base-size-12)}.Primer_Brand__Stack-module__Stack-narrow--gap-16___NtSXw{gap:var(--base-size-16)}.Primer_Brand__Stack-module__Stack-narrow--gap-20___pCp05{gap:var(--base-size-20)}.Primer_Brand__Stack-module__Stack-narrow--gap-24___d9_7X{gap:var(--base-size-24)}.Primer_Brand__Stack-module__Stack-narrow--gap-28___yydXA{gap:var(--base-size-28)}.Primer_Brand__Stack-module__Stack-narrow--gap-32___uIKIR{gap:var(--base-size-32)}.Primer_Brand__Stack-module__Stack-narrow--gap-36___j5Zvi{gap:var(--base-size-36)}.Primer_Brand__Stack-module__Stack-narrow--gap-40___XyNCt{gap:var(--base-size-40)}.Primer_Brand__Stack-module__Stack-narrow--gap-44___IooME{gap:var(--base-size-44)}.Primer_Brand__Stack-module__Stack-narrow--gap-48___9Ri5H{gap:var(--base-size-48)}.Primer_Brand__Stack-module__Stack-narrow--gap-60___FE3Wk{gap:var(--base-size-60)}.Primer_Brand__Stack-module__Stack-narrow--gap-64___f5a6m{gap:var(--base-size-64)}.Primer_Brand__Stack-module__Stack-narrow--gap-80___t8fnj{gap:var(--base-size-80)}.Primer_Brand__Stack-module__Stack-narrow--gap-88___7PC64{gap:var(--base-size-88)}.Primer_Brand__Stack-module__Stack-narrow--gap-96___kupcP{gap:var(--base-size-96)}.Primer_Brand__Stack-module__Stack-narrow--gap-112____ZzLO{gap:var(--base-size-112)}.Primer_Brand__Stack-module__Stack-narrow--gap-128___Zrn34{gap:var(--base-size-128)}@media screen and (width>=48rem){.Primer_Brand__Stack-module__Stack-regular--gap-none___84Qcx{gap:0}.Primer_Brand__Stack-module__Stack-regular--gap-condensed___nXEjo{gap:var(--brand-stack-gap-condensed)}.Primer_Brand__Stack-module__Stack-regular--gap-normal___4AJ0b{gap:var(--brand-stack-gap-normal)}.Primer_Brand__Stack-module__Stack-regular--gap-spacious___5ovu5{gap:var(--brand-stack-gap-spacious)}.Primer_Brand__Stack-module__Stack-regular--gap-4___8q5d5{gap:var(--base-size-4)}.Primer_Brand__Stack-module__Stack-regular--gap-8___ruGAD{gap:var(--base-size-8)}.Primer_Brand__Stack-module__Stack-regular--gap-12___pkc6_{gap:var(--base-size-12)}.Primer_Brand__Stack-module__Stack-regular--gap-16___Cyxjb{gap:var(--base-size-16)}.Primer_Brand__Stack-module__Stack-regular--gap-20___C8Szl{gap:var(--base-size-20)}.Primer_Brand__Stack-module__Stack-regular--gap-24___JTvNO{gap:var(--base-size-24)}.Primer_Brand__Stack-module__Stack-regular--gap-28___jwMPq{gap:var(--base-size-28)}.Primer_Brand__Stack-module__Stack-regular--gap-32___e6bgD{gap:var(--base-size-32)}.Primer_Brand__Stack-module__Stack-regular--gap-36___gC2Bo{gap:var(--base-size-36)}.Primer_Brand__Stack-module__Stack-regular--gap-40___NYqUy{gap:var(--base-size-40)}.Primer_Brand__Stack-module__Stack-regular--gap-44___b_NET{gap:var(--base-size-44)}.Primer_Brand__Stack-module__Stack-regular--gap-48___QaR_m{gap:var(--base-size-48)}.Primer_Brand__Stack-module__Stack-regular--gap-60___t9VTq{gap:var(--base-size-60)}.Primer_Brand__Stack-module__Stack-regular--gap-64___xCaJe{gap:var(--base-size-64)}.Primer_Brand__Stack-module__Stack-regular--gap-80___rhDhC{gap:var(--base-size-80)}.Primer_Brand__Stack-module__Stack-regular--gap-88___Yaka3{gap:var(--base-size-88)}.Primer_Brand__Stack-module__Stack-regular--gap-96___Ts_06{gap:var(--base-size-96)}.Primer_Brand__Stack-module__Stack-regular--gap-112___eHocK{gap:var(--base-size-112)}.Primer_Brand__Stack-module__Stack-regular--gap-128___uidMP{gap:var(--base-size-128)}.Primer_Brand__Stack-module__Stack-regular--padding-none___BcPTQ{padding:0}.Primer_Brand__Stack-module__Stack-regular--padding-condensed___Wd_3A{padding:var(--brand-stack-padding-condensed)}.Primer_Brand__Stack-module__Stack-regular--padding-normal___f3Joq{padding:var(--brand-stack-padding-normal)}.Primer_Brand__Stack-module__Stack-regular--padding-spacious___xzuU0{padding:var(--brand-stack-padding-spacious)}.Primer_Brand__Stack-module__Stack-regular--padding-4___pEH4Z{padding:var(--base-size-4)}.Primer_Brand__Stack-module__Stack-regular--padding-8___UbyXY{padding:var(--base-size-8)}.Primer_Brand__Stack-module__Stack-regular--padding-12___UQK__{padding:var(--base-size-12)}.Primer_Brand__Stack-module__Stack-regular--padding-16___Y62Pz{padding:var(--base-size-16)}.Primer_Brand__Stack-module__Stack-regular--padding-20___wLP_s{padding:var(--base-size-20)}.Primer_Brand__Stack-module__Stack-regular--padding-24___J5NFg{padding:var(--base-size-24)}.Primer_Brand__Stack-module__Stack-regular--padding-28___LaSVD{padding:var(--base-size-28)}.Primer_Brand__Stack-module__Stack-regular--padding-32___L0_VX{padding:var(--base-size-32)}.Primer_Brand__Stack-module__Stack-regular--padding-36___o5wDc{padding:var(--base-size-36)}.Primer_Brand__Stack-module__Stack-regular--padding-40___cb5NW{padding:var(--base-size-40)}.Primer_Brand__Stack-module__Stack-regular--padding-44___DEz_q{padding:var(--base-size-44)}.Primer_Brand__Stack-module__Stack-regular--padding-48___MqcFN{padding:var(--base-size-48)}.Primer_Brand__Stack-module__Stack-regular--padding-60___2sUmV{padding:var(--base-size-60)}.Primer_Brand__Stack-module__Stack-regular--padding-64___S3iI3{padding:var(--base-size-64)}.Primer_Brand__Stack-module__Stack-regular--padding-80___8eVDK{padding:var(--base-size-80)}.Primer_Brand__Stack-module__Stack-regular--padding-88___ok1gb{padding:var(--base-size-88)}.Primer_Brand__Stack-module__Stack-regular--padding-96___T3v7i{padding:var(--base-size-96)}.Primer_Brand__Stack-module__Stack-regular--padding-112___7YpRg{padding:var(--base-size-112)}.Primer_Brand__Stack-module__Stack-regular--padding-128___ibsTw{padding:var(--base-size-128)}}@media screen and (width>=80rem){.Primer_Brand__Stack-module__Stack-wide--gap-none___ajgTL{gap:0}.Primer_Brand__Stack-module__Stack-wide--gap-condensed___kzJ6N{gap:var(--brand-stack-gap-condensed)}.Primer_Brand__Stack-module__Stack-wide--gap-normal___2URL1{gap:var(--brand-stack-gap-normal)}.Primer_Brand__Stack-module__Stack-wide--gap-spacious___PE_on{gap:var(--brand-stack-gap-spacious)}.Primer_Brand__Stack-module__Stack-wide--gap-4___3nPEs{gap:var(--base-size-4)}.Primer_Brand__Stack-module__Stack-wide--gap-8___FHaOS{gap:var(--base-size-8)}.Primer_Brand__Stack-module__Stack-wide--gap-12___f5Wii{gap:var(--base-size-12)}.Primer_Brand__Stack-module__Stack-wide--gap-16___vdqL4{gap:var(--base-size-16)}.Primer_Brand__Stack-module__Stack-wide--gap-20___3YbbY{gap:var(--base-size-20)}.Primer_Brand__Stack-module__Stack-wide--gap-24___o2aeb{gap:var(--base-size-24)}.Primer_Brand__Stack-module__Stack-wide--gap-28___g5SFZ{gap:var(--base-size-28)}.Primer_Brand__Stack-module__Stack-wide--gap-32___7KZhL{gap:var(--base-size-32)}.Primer_Brand__Stack-module__Stack-wide--gap-36___mWJFS{gap:var(--base-size-36)}.Primer_Brand__Stack-module__Stack-wide--gap-40___wZvNo{gap:var(--base-size-40)}.Primer_Brand__Stack-module__Stack-wide--gap-44___oH_Yw{gap:var(--base-size-44)}.Primer_Brand__Stack-module__Stack-wide--gap-48___IbC9F{gap:var(--base-size-48)}.Primer_Brand__Stack-module__Stack-wide--gap-60___V1qHz{gap:var(--base-size-60)}.Primer_Brand__Stack-module__Stack-wide--gap-64___xC__G{gap:var(--base-size-64)}.Primer_Brand__Stack-module__Stack-wide--gap-80___1QMyu{gap:var(--base-size-80)}.Primer_Brand__Stack-module__Stack-wide--gap-88___d3g2C{gap:var(--base-size-88)}.Primer_Brand__Stack-module__Stack-wide--gap-96___wRoRW{gap:var(--base-size-96)}.Primer_Brand__Stack-module__Stack-wide--gap-112___MQg4d{gap:var(--base-size-112)}.Primer_Brand__Stack-module__Stack-wide--gap-128___YfFMR{gap:var(--base-size-128)}.Primer_Brand__Stack-module__Stack-wide--padding-none___hcJOP{padding:0}.Primer_Brand__Stack-module__Stack-wide--padding-condensed___N3J0E{padding:var(--brand-stack-padding-condensed)}.Primer_Brand__Stack-module__Stack-wide--padding-normal___pjnIB{padding:var(--brand-stack-padding-normal)}.Primer_Brand__Stack-module__Stack-wide--padding-spacious___cFQHO{padding:var(--brand-stack-padding-spacious)}.Primer_Brand__Stack-module__Stack-wide--padding-4___muYDs{padding:var(--base-size-4)}.Primer_Brand__Stack-module__Stack-wide--padding-8___6YlEO{padding:var(--base-size-8)}.Primer_Brand__Stack-module__Stack-wide--padding-12___7KdnN{padding:var(--base-size-12)}.Primer_Brand__Stack-module__Stack-wide--padding-16___M5zuV{padding:var(--base-size-16)}.Primer_Brand__Stack-module__Stack-wide--padding-20___I5zX2{padding:var(--base-size-20)}.Primer_Brand__Stack-module__Stack-wide--padding-24___GooBy{padding:var(--base-size-24)}.Primer_Brand__Stack-module__Stack-wide--padding-28___tZ7sr{padding:var(--base-size-28)}.Primer_Brand__Stack-module__Stack-wide--padding-32___4jLoz{padding:var(--base-size-32)}.Primer_Brand__Stack-module__Stack-wide--padding-36___aIhUT{padding:var(--base-size-36)}.Primer_Brand__Stack-module__Stack-wide--padding-40___4WmEN{padding:var(--base-size-40)}.Primer_Brand__Stack-module__Stack-wide--padding-44___LlwnC{padding:var(--base-size-44)}.Primer_Brand__Stack-module__Stack-wide--padding-48___JEKfb{padding:var(--base-size-48)}.Primer_Brand__Stack-module__Stack-wide--padding-60___zEzWC{padding:var(--base-size-60)}.Primer_Brand__Stack-module__Stack-wide--padding-64___ltiCt{padding:var(--base-size-64)}.Primer_Brand__Stack-module__Stack-wide--padding-80___uLiYs{padding:var(--base-size-80)}.Primer_Brand__Stack-module__Stack-wide--padding-88____swHh{padding:var(--base-size-88)}.Primer_Brand__Stack-module__Stack-wide--padding-96____jNjX{padding:var(--base-size-96)}.Primer_Brand__Stack-module__Stack-wide--padding-112___LSUS8{padding:var(--base-size-112)}.Primer_Brand__Stack-module__Stack-wide--padding-128___KHUZL{padding:var(--base-size-128)}}.Primer_Brand__Stack-module__Stack--align-items-flex-end___hbt2y{align-items:flex-end}.Primer_Brand__Stack-module__Stack--align-items-flex-start___toOez{align-items:flex-start}.Primer_Brand__Stack-module__Stack--align-items-center___mSuT6{align-items:center}.Primer_Brand__Stack-module__Stack-narrow--align-items-flex-end___Ge2P6{align-items:flex-end}.Primer_Brand__Stack-module__Stack-narrow--align-items-flex-start___hoXcB{align-items:flex-start}.Primer_Brand__Stack-module__Stack-narrow--align-items-center___lhASm{align-items:center}@media screen and (width>=48rem){.Primer_Brand__Stack-module__Stack-regular--align-items-flex-end___bvlKf{align-items:flex-end}.Primer_Brand__Stack-module__Stack-regular--align-items-flex-start___AfvRV{align-items:flex-start}.Primer_Brand__Stack-module__Stack-regular--align-items-center___otAWC{align-items:center}}@media screen and (width>=80rem){.Primer_Brand__Stack-module__Stack-wide--align-items-flex-end___ujXDY{align-items:flex-end}.Primer_Brand__Stack-module__Stack-wide--align-items-flex-start___cXAgb{align-items:flex-start}.Primer_Brand__Stack-module__Stack-wide--align-items-center___aZ__N{align-items:center}}.Primer_Brand__Stack-module__Stack--justify-content-flex-end___48DQ2{justify-content:flex-end}.Primer_Brand__Stack-module__Stack--justify-content-flex-start___RqQ_5{justify-content:flex-start}.Primer_Brand__Stack-module__Stack--justify-content-center___0h6jn{justify-content:center}.Primer_Brand__Stack-module__Stack--justify-content-space-between___ntQDP{justify-content:space-between}.Primer_Brand__Stack-module__Stack--justify-content-space-evenly___bIDDs{justify-content:space-evenly}.Primer_Brand__Stack-module__Stack--justify-content-space-around___yUAvd{justify-content:space-around}.Primer_Brand__Stack-module__Stack-narrow--justify-content-flex-end___Z57le{justify-content:flex-end}.Primer_Brand__Stack-module__Stack-narrow--justify-content-flex-start___fDidq{justify-content:flex-start}.Primer_Brand__Stack-module__Stack-narrow--justify-content-center___uHqFo{justify-content:center}.Primer_Brand__Stack-module__Stack-narrow--justify-content-space-between___g6N5s{justify-content:space-between}.Primer_Brand__Stack-module__Stack-narrow--justify-content-space-evenly___apJam{justify-content:space-evenly}.Primer_Brand__Stack-module__Stack-narrow--justify-content-space-around___hPKro{justify-content:space-around}@media screen and (width>=48rem){.Primer_Brand__Stack-module__Stack-regular--justify-content-flex-end___Frx0I{justify-content:flex-end}.Primer_Brand__Stack-module__Stack-regular--justify-content-flex-start___O6P7s{justify-content:flex-start}.Primer_Brand__Stack-module__Stack-regular--justify-content-center___h0_dy{justify-content:center}.Primer_Brand__Stack-module__Stack-regular--justify-content-space-between___zGjlD{justify-content:space-between}.Primer_Brand__Stack-module__Stack-regular--justify-content-space-evenly___Hkq1Z{justify-content:space-evenly}.Primer_Brand__Stack-module__Stack-regular--justify-content-space-around___aSXvQ{justify-content:space-around}}@media screen and (width>=80rem){.Primer_Brand__Stack-module__Stack-wide--justify-content-flex-end___SIG6M{justify-content:flex-end}.Primer_Brand__Stack-module__Stack-wide--justify-content-flex-start___HdgK5{justify-content:flex-start}.Primer_Brand__Stack-module__Stack-wide--justify-content-center___OD2Wf{justify-content:center}.Primer_Brand__Stack-module__Stack-wide--justify-content-space-between___DDCkb{justify-content:space-between}.Primer_Brand__Stack-module__Stack-wide--justify-content-space-evenly___PICqP{justify-content:space-evenly}.Primer_Brand__Stack-module__Stack-wide--justify-content-space-around___sIOQP{justify-content:space-around}}.Primer_Brand__Stack-module__Stack-flexWrap--wrap___uuc8B{flex-wrap:wrap}.Primer_Brand__Stack-module__Stack-flexWrap--no-wrap___kv7Fm{flex-wrap:nowrap}.Primer_Brand__Stack-module__Stack-narrow-flexWrap--wrap___SQOmL{flex-wrap:wrap}.Primer_Brand__Stack-module__Stack-narrow-flexWrap--no-wrap___aoyQB{flex-wrap:nowrap}@media screen and (width>=48rem){.Primer_Brand__Stack-module__Stack-regular-flexWrap--wrap___LTrer{flex-wrap:wrap}.Primer_Brand__Stack-module__Stack-regular-flexWrap--no-wrap___g3lo_{flex-wrap:nowrap}}@media screen and (width>=80rem){.Primer_Brand__Stack-module__Stack-wide-flexWrap--wrap___sBzMn{flex-wrap:wrap}.Primer_Brand__Stack-module__Stack-wide-flexWrap--no-wrap___7PGRZ{flex-wrap:nowrap}}