npm - @primer/react-brand - Versions diffs - 0.68.0-rc.0963e67e → 0.68.0-rc.485a3446 - Mend

@primer/react-brand 0.68.0-rc.0963e67e → 0.68.0-rc.485a3446

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 (388) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SectionIntroStacked.d.ts","sourceRoot":"","sources":["../../src/SectionIntroStacked/SectionIntroStacked.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,iBAAiB,EAAiC,MAAM,OAAO,CAAA;AAG1F,OAAO,EAAO,SAAS,EAAC,MAAM,SAAS,CAAA;AACvC,OAAO,EAAU,YAAY,EAAoB,MAAM,YAAY,CAAA;AACnE,OAAO,EAAO,SAAS,EAAC,MAAM,SAAS,CAAA;AACvC,OAAO,EAAO,SAAS,EAAC,MAAM,SAAS,CAAA;~~AAKvC~~,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAEnD,eAAO,MAAM,2BAA2B,kCAAmC,CAAA;AAC3E,MAAM,MAAM,0BAA0B,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AAErF,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GACtE,SAAS,CAAC,WAAW,CAAC,GACtB,iBAAiB,GAAG;IAClB,OAAO,CAAC,EAAE,0BAA0B,CAAA;CACrC,CAAA;~~AAuCH~~,KAAK,+BAA+B,GAAG,SAAS,CAAC,kBAAkB,CAAC,GAAG,YAAY,CAAA;AA4CnF,KAAK,mCAAmC,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,SAAS,CAAC,GAC1E,SAAS,CAAC,oBAAoB,CAAC,GAAG;IAChC,EAAE,CAAC,EAAE,GAAG,CAAA;IACR,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAA;CAC9C,CAAA;AAkBH,KAAK,4BAA4B,GAAG,SAAS,GAAG,SAAS,CAAC,iBAAiB,CAAC,CAAA;AAqB5E,KAAK,6BAA6B,GAAG,SAAS,CAAC,gBAAgB,CAAC,CAAA;AAchE,KAAK,gCAAgC,GAAG,SAAS,CAAA;AAyCjD,KAAK,uCAAuC,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,CAAC,GACvF,SAAS,CAAC,oBAAoB,CAAC,GAAG;IAChC,EAAE,CAAC,EAAE,GAAG,CAAA;IACR,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAA;CAC9C,CAAA;AAmBH,MAAM,MAAM,4BAA4B,GAAG,SAAS,CAAC,aAAa,CAAC,CAAA;AAiDnE,eAAO,MAAM,mBAAmB;;;;uDA7H4B,iBAAiB,CAAC,6BAA6B,CAAC;6CA8E1D,iBAAiB,CAAC,4BAA4B,CAAC;+CAhEvC,gCAAgC;;;CAwHxF,CAAA"}
1	+ {"version":3,"file":"SectionIntroStacked.d.ts","sourceRoot":"","sources":["../../src/SectionIntroStacked/SectionIntroStacked.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,iBAAiB,EAAiC,MAAM,OAAO,CAAA;AAG1F,OAAO,EAAO,SAAS,EAAC,MAAM,SAAS,CAAA;AACvC,OAAO,EAAU,YAAY,EAAoB,MAAM,YAAY,CAAA;AACnE,OAAO,EAAO,SAAS,EAAC,MAAM,SAAS,CAAA;AACvC,OAAO,EAAO,SAAS,EAAC,MAAM,SAAS,CAAA;AAMvC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAEnD,eAAO,MAAM,2BAA2B,kCAAmC,CAAA;AAC3E,MAAM,MAAM,0BAA0B,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AAErF,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GACtE,SAAS,CAAC,WAAW,CAAC,GACtB,iBAAiB,GAAG;IAClB,OAAO,CAAC,EAAE,0BAA0B,CAAA;CACrC,CAAA;AAwCH,KAAK,+BAA+B,GAAG,SAAS,CAAC,kBAAkB,CAAC,GAAG,YAAY,CAAA;AA4CnF,KAAK,mCAAmC,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,SAAS,CAAC,GAC1E,SAAS,CAAC,oBAAoB,CAAC,GAAG;IAChC,EAAE,CAAC,EAAE,GAAG,CAAA;IACR,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAA;CAC9C,CAAA;AAkBH,KAAK,4BAA4B,GAAG,SAAS,GAAG,SAAS,CAAC,iBAAiB,CAAC,CAAA;AAqB5E,KAAK,6BAA6B,GAAG,SAAS,CAAC,gBAAgB,CAAC,CAAA;AAchE,KAAK,gCAAgC,GAAG,SAAS,CAAA;AAyCjD,KAAK,uCAAuC,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,CAAC,GACvF,SAAS,CAAC,oBAAoB,CAAC,GAAG;IAChC,EAAE,CAAC,EAAE,GAAG,CAAA;IACR,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAA;CAC9C,CAAA;AAmBH,MAAM,MAAM,4BAA4B,GAAG,SAAS,CAAC,aAAa,CAAC,CAAA;AAiDnE,eAAO,MAAM,mBAAmB;;;;uDA7H4B,iBAAiB,CAAC,6BAA6B,CAAC;6CA8E1D,iBAAiB,CAAC,4BAA4B,CAAC;+CAhEvC,gCAAgC;;;CAwHxF,CAAA"}

package/esm/SectionIntroStacked/SectionIntroStacked.js CHANGED Viewed

@@ -3,123 +3,124 @@ import { Grid as t } from "../Grid/Grid.js";
 import { useAnimation as n } from "../animation/useAnimation.js";
 import { Text as r } from "../Text/Text.js";
 import { Heading as i, defaultHeadingTag as a } from "../Heading/Heading.js";
-import { Link as o } from "../Link/Link.js";
-import { Icon as s } from "../Icon/Icon.js";
-import c from "./SectionIntroStacked.module.js";
-import l, { forwardRef as u, useCallback as d, useMemo as f } from "react";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import o from "../component-helpers/shared.module.js";
+import { Link as s } from "../Link/Link.js";
+import { Icon as c } from "../Icon/Icon.js";
+import l from "./SectionIntroStacked.module.js";
+import u, { forwardRef as d, useCallback as f, useMemo as p } from "react";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/SectionIntroStacked/SectionIntroStacked.tsx
-var h = ["default", "gridline"], g = u(({ animate: r, className: i, children: a, style: o, variant: s = "default", ...u }, d) => {
-	let { classes: f, styles: h } = n(r), g = l.Children.toArray(a), _ = g.filter((e) => l.isValidElement(e) && e.type === x), v = g.filter((e) => !_.includes(e));
-	return /* @__PURE__ */ p("header", {
-		ref: d,
-		className: e(c.SectionIntroStacked, s === "gridline" && c["SectionIntroStacked--variant-gridline"], f, i),
-		...u,
+var g = ["default", "gridline"], _ = d(({ animate: r, className: i, children: a, style: s, variant: c = "default", ...d }, f) => {
+	let { classes: p, styles: g } = n(r), _ = u.Children.toArray(a), v = _.filter((e) => u.isValidElement(e) && e.type === S), y = _.filter((e) => !v.includes(e));
+	return /* @__PURE__ */ m("header", {
+		ref: f,
+		className: e(l.SectionIntroStacked, c === "gridline" && l["SectionIntroStacked--variant-gridline"], c === "gridline" && o.gridline, p, i),
+		...d,
 		style: {
-			...h,
-			...o
+			...g,
+			...s
 		},
-		children: /* @__PURE__ */ m(t, {
+		children: /* @__PURE__ */ h(t, {
 			fullWidth: !0,
-			enableGutters: s !== "gridline",
-			children: [/* @__PURE__ */ p(t.Column, {
+			enableGutters: c !== "gridline",
+			children: [/* @__PURE__ */ m(t.Column, {
 				span: { large: 6 },
+				children: y
+			}), /* @__PURE__ */ m(t.Column, {
+				span: c === "gridline" ? { large: 6 } : { large: 5 },
+				start: c === "gridline" ? { large: 7 } : { large: 8 },
 				children: v
-			}), /* @__PURE__ */ p(t.Column, {
-				span: s === "gridline" ? { large: 6 } : { large: 5 },
-				start: s === "gridline" ? { large: 7 } : { large: 8 },
-				children: _
 			})]
 		})
 	});
-}), _ = "3", v = u(({ as: t = a, size: n = _, className: r, children: o, ...s }, u) => {
-	let m = f(() => l.Children.toArray(o), [o]), h = d(() => m.some((e) => l.isValidElement(e) && (e.type === "b" || e.type === "em")) ? "muted" : "default", [m]), g = m.length === 1 ? "default" : h();
-	return /* @__PURE__ */ p(i, {
-		ref: u,
-		className: e(c["SectionIntroStacked-heading"], g === "muted" && c["SectionIntroStacked-heading--muted"], r),
+}), v = "3", y = d(({ as: t = a, size: n = v, className: r, children: o, ...s }, c) => {
+	let d = p(() => u.Children.toArray(o), [o]), h = f(() => d.some((e) => u.isValidElement(e) && (e.type === "b" || e.type === "em")) ? "muted" : "default", [d]), g = d.length === 1 ? "default" : h();
+	return /* @__PURE__ */ m(i, {
+		ref: c,
+		className: e(l["SectionIntroStacked-heading"], g === "muted" && l["SectionIntroStacked-heading--muted"], r),
 		size: n,
 		as: t,
 		...s,
 		children: o
 	});
-}), y = u(({ className: t, children: n, ...i }, a) => /* @__PURE__ */ p(r, {
+}), b = d(({ className: t, children: n, ...i }, a) => /* @__PURE__ */ m(r, {
 	as: "p",
-	className: e(c["SectionIntroStacked-description"], t),
+	className: e(l["SectionIntroStacked-description"], t),
 	ref: a,
 	variant: "muted",
 	...i,
 	children: n
-})), b = u(({ className: t, children: n, variant: r = "accent", size: i = "medium", ...a }, s) => /* @__PURE__ */ p(o, {
-	ref: s,
-	className: e(c["SectionIntroStacked-link"], t),
+})), x = d(({ className: t, children: n, variant: r = "accent", size: i = "medium", ...a }, o) => /* @__PURE__ */ m(s, {
+	ref: o,
+	className: e(l["SectionIntroStacked-link"], t),
 	size: i,
 	variant: r,
 	...a,
 	children: n
-})), x = ({ animate: t, className: r, children: i, ...a }) => {
+})), S = ({ animate: t, className: r, children: i, ...a }) => {
 	let { classes: o, styles: s } = n(t);
-	return /* @__PURE__ */ p("ul", {
-		className: e(o, c["SectionIntroStacked-items"], r),
+	return /* @__PURE__ */ m("ul", {
+		className: e(o, l["SectionIntroStacked-items"], r),
 		style: { ...s },
 		...a,
 		children: i
 	});
-}, S = ({ className: t, color: n = "green", ...r }) => /* @__PURE__ */ p(s, {
-	className: e(c.SectionIntroStackedItem__icon, t),
+}, C = ({ className: t, color: n = "green", ...r }) => /* @__PURE__ */ m(c, {
+	className: e(l.SectionIntroStackedItem__icon, t),
 	hasBackground: !0,
 	size: "medium",
 	color: n,
 	...r
-}), C = u(({ as: t = "h3", size: n = "subhead-large", className: r, children: a, ...o }, s) => /* @__PURE__ */ p(i, {
+}), w = d(({ as: t = "h3", size: n = "subhead-large", className: r, children: a, ...o }, s) => /* @__PURE__ */ m(i, {
 	ref: s,
 	as: t,
 	size: n,
-	className: e(c.SectionIntroStackedItem__heading, r),
+	className: e(l.SectionIntroStackedItem__heading, r),
 	...o,
 	children: a
-})), w = u(({ className: t, children: n, ...i }, a) => /* @__PURE__ */ p(r, {
+})), T = d(({ className: t, children: n, ...i }, a) => /* @__PURE__ */ m(r, {
 	as: "p",
 	variant: "muted",
 	size: "200",
-	className: e(c.SectionIntroStackedItem__description, t),
+	className: e(l.SectionIntroStackedItem__description, t),
 	ref: a,
 	...i,
 	children: n
-})), T = Object.assign(g, {
-	Heading: v,
-	Description: y,
-	Link: b,
-	Items: x,
+})), E = Object.assign(_, {
+	Heading: y,
+	Description: b,
+	Link: x,
+	Items: S,
 	Item: ({ className: t, children: n, ...i }) => {
-		let a = e(c["SectionIntroStackedItem-item"], t), o = f(() => l.Children.toArray(n), [n]);
-		if (o.some((e) => l.isValidElement(e) && (e.type === S || e.type === C || e.type === w))) {
-			let t = o.find((e) => l.isValidElement(e) && e.type === S), n = o.filter((e) => !(l.isValidElement(e) && e.type === S));
-			return /* @__PURE__ */ m("li", {
-				className: e(a, !!t && c["SectionIntroStackedItem-item--with-icon"]),
+		let a = e(l["SectionIntroStackedItem-item"], t), o = p(() => u.Children.toArray(n), [n]);
+		if (o.some((e) => u.isValidElement(e) && (e.type === C || e.type === w || e.type === T))) {
+			let t = o.find((e) => u.isValidElement(e) && e.type === C), n = o.filter((e) => !(u.isValidElement(e) && e.type === C));
+			return /* @__PURE__ */ h("li", {
+				className: e(a, !!t && l["SectionIntroStackedItem-item--with-icon"]),
 				...i,
-				children: [t, /* @__PURE__ */ p("div", {
-					className: c.SectionIntroStackedItem__content,
+				children: [t, /* @__PURE__ */ m("div", {
+					className: l.SectionIntroStackedItem__content,
 					children: n
 				})]
 			});
 		}
-		let s = o.length === 1 ? "default" : o.some((e) => l.isValidElement(e) && (e.type === "b" || e.type === "em")) ? "muted" : "default";
-		return /* @__PURE__ */ p("li", {
+		let s = o.length === 1 ? "default" : o.some((e) => u.isValidElement(e) && (e.type === "b" || e.type === "em")) ? "muted" : "default";
+		return /* @__PURE__ */ m("li", {
 			className: a,
 			...i,
-			children: /* @__PURE__ */ p(r, {
+			children: /* @__PURE__ */ m(r, {
 				as: "span",
-				className: e(c["SectionIntroStackedItem__item-text"], s === "muted" && c["SectionIntroStackedItem__item-text--muted"]),
+				className: e(l["SectionIntroStackedItem__item-text"], s === "muted" && l["SectionIntroStackedItem__item-text--muted"]),
 				size: "350",
 				children: n
 			})
 		});
 	},
-	ItemIcon: S,
-	ItemHeading: C,
-	ItemDescription: w
+	ItemIcon: C,
+	ItemHeading: w,
+	ItemDescription: T
 });
 //#endregion
-export { T as SectionIntroStacked, h as SectionIntroStackedVariants };
+export { E as SectionIntroStacked, g as SectionIntroStackedVariants };
 //# sourceMappingURL=SectionIntroStacked.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SectionIntroStacked.js","names":[],"sources":["../../src/SectionIntroStacked/SectionIntroStacked.tsx"],"sourcesContent":["import React, {forwardRef, PropsWithChildren, useMemo, type Ref, useCallback} from 'react'\nimport {clsx} from 'clsx'\nimport {Grid} from '../Grid'\nimport {Link, LinkProps} from '../Link'\nimport {Heading, HeadingProps, defaultHeadingTag} from '../Heading'\nimport {Text, TextProps} from '../Text'\nimport {Icon, IconProps} from '../Icon'\nimport {useAnimation} from '../animation'\n\nimport styles from './SectionIntroStacked.module.css'\n\nimport type {BaseProps} from '../component-helpers'\n\nexport const SectionIntroStackedVariants = ['default', 'gridline'] as const\nexport type SectionIntroStackedVariant = (typeof SectionIntroStackedVariants)[number]\n\nexport type SectionIntroStackedProps = React.HTMLAttributes<HTMLElement> &\n BaseProps<HTMLElement> &\n PropsWithChildren & {\n variant?: SectionIntroStackedVariant\n }\n\nconst Root = forwardRef<HTMLElement, PropsWithChildren<SectionIntroStackedProps>>(\n ({animate, className, children, style, variant = 'default', ...props}, ref) => {\n const {classes: animationClasses, styles: animationInlineStyles} = useAnimation(animate)\n\n const childrenArray = React.Children.toArray(children)\n\n // extract Items and everything else into two separate arrays\n const items = childrenArray.filter(child => React.isValidElement(child) && child.type === ItemsBase)\n\n const otherChildren = childrenArray.filter(child => !items.includes(child))\n\n return (\n <header\n ref={ref}\n className={clsx(\n styles.SectionIntroStacked,\n variant === 'gridline' && styles['SectionIntroStacked--variant-gridline'],\n animationClasses,\n className,\n )}\n {...props}\n style={{...animationInlineStyles, ...style}}\n >\n <Grid fullWidth enableGutters={variant !== 'gridline'}>\n <Grid.Column span={{large: 6}}>{otherChildren}</Grid.Column>\n <Grid.Column\n span={variant === 'gridline' ? {large: 6} : {large: 5}}\n start={variant === 'gridline' ? {large: 7} : {large: 8}}\n >\n {items}\n </Grid.Column>\n </Grid>\n </header>\n )\n },\n)\n\ntype SectionIntroStackedHeadingProps = BaseProps<HTMLHeadingElement> & HeadingProps\n\nconst defaultHeadingSize = '3'\n\nconst _Heading = forwardRef(\n (\n {\n as = defaultHeadingTag,\n size = defaultHeadingSize,\n className,\n children,\n ...props\n }: PropsWithChildren<SectionIntroStackedHeadingProps>,\n ref: Ref<HTMLHeadingElement>,\n ) => {\n const childrenArray = useMemo(() => React.Children.toArray(children), [children])\n\n const getConditionalVariant = useCallback(() => {\n if (childrenArray.some(child => React.isValidElement(child) && (child.type === 'b' \|\| child.type === 'em'))) {\n return 'muted'\n }\n return 'default'\n }, [childrenArray])\n\n const defaultColor = childrenArray.length === 1 ? 'default' : getConditionalVariant()\n\n return (\n <Heading\n ref={ref}\n className={clsx(\n styles[`SectionIntroStacked-heading`],\n defaultColor === 'muted' && styles[`SectionIntroStacked-heading--muted`],\n className,\n )}\n size={size}\n as={as}\n {...props}\n >\n {children}\n </Heading>\n )\n },\n)\n\ntype SectionIntroStackedDescriptionProps = Omit<TextProps, 'as' \| 'variant'> &\n BaseProps<HTMLParagraphElement> & {\n as?: 'p'\n children: React.ReactNode \| React.ReactNode[]\n }\n\nconst _Description = forwardRef(\n ({className, children, ...props}: SectionIntroStackedDescriptionProps, ref: Ref<HTMLParagraphElement>) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles['SectionIntroStacked-description'], className)}\n ref={ref}\n variant=\"muted\"\n {...props}\n >\n {children}\n </Text>\n )\n },\n)\n\ntype SectionIntroStackedLinkProps = LinkProps & BaseProps<HTMLAnchorElement>\n\nconst _Link = forwardRef(\n (\n {className, children, variant = 'accent', size = 'medium', ...props}: SectionIntroStackedLinkProps,\n ref: Ref<HTMLAnchorElement>,\n ) => {\n return (\n <Link\n ref={ref}\n className={clsx(styles['SectionIntroStacked-link'], className)}\n size={size}\n variant={variant}\n {...props}\n >\n {children}\n </Link>\n )\n },\n)\n\ntype SectionIntroStackedItemsProps = BaseProps<HTMLUListElement>\n\nconst ItemsBase = ({animate, className, children, ...rest}: PropsWithChildren<SectionIntroStackedItemsProps>) => {\n const {classes: animationClasses, styles: animationInlineStyles} = useAnimation(animate)\n\n const timelineClassName = clsx(animationClasses, styles['SectionIntroStacked-items'], className)\n\n return (\n <ul className={timelineClassName} style={{...animationInlineStyles}} {...rest}>\n {children}\n </ul>\n )\n}\n\ntype SectionIntroStackedItemIconProps = IconProps\n\nconst ItemIcon = ({className, color = 'green', ...props}: SectionIntroStackedItemIconProps) => {\n return (\n <Icon\n className={clsx(styles['SectionIntroStackedItem__icon'], className)}\n hasBackground\n size=\"medium\"\n color={color}\n {...props}\n />\n )\n}\n\ntype SectionIntroStackedItemHeadingProps = HeadingProps\n\nconst ItemHeading = forwardRef(\n (\n {\n as = 'h3',\n size = 'subhead-large',\n className,\n children,\n ...props\n }: PropsWithChildren<SectionIntroStackedItemHeadingProps>,\n ref: Ref<HTMLHeadingElement>,\n ) => {\n return (\n <Heading\n ref={ref}\n as={as}\n size={size}\n className={clsx(styles['SectionIntroStackedItem__heading'], className)}\n {...props}\n >\n {children}\n </Heading>\n )\n },\n)\n\ntype SectionIntroStackedItemDescriptionProps = Omit<TextProps, 'as' \| 'variant' \| 'size'> &\n BaseProps<HTMLParagraphElement> & {\n as?: 'p'\n children: React.ReactNode \| React.ReactNode[]\n }\n\nconst ItemDescription = forwardRef(\n ({className, children, ...props}: SectionIntroStackedItemDescriptionProps, ref: Ref<HTMLParagraphElement>) => {\n return (\n <Text\n as=\"p\"\n variant=\"muted\"\n size=\"200\"\n className={clsx(styles['SectionIntroStackedItem__description'], className)}\n ref={ref}\n {...props}\n >\n {children}\n </Text>\n )\n },\n)\n\nexport type SectionIntroStackedItemProps = BaseProps<HTMLLIElement>\n\nconst ItemBase = ({className, children, ...rest}: PropsWithChildren<SectionIntroStackedItemProps>) => {\n const itemClassName = clsx(styles['SectionIntroStackedItem-item'], className)\n const childrenArray = useMemo(() => React.Children.toArray(children), [children])\n\n const hasSubComponents = childrenArray.some(\n child =>\n React.isValidElement(child) &&\n (child.type === ItemIcon \|\| child.type === ItemHeading \|\| child.type === ItemDescription),\n )\n\n if (hasSubComponents) {\n const iconChild = childrenArray.find(child => React.isValidElement(child) && child.type === ItemIcon)\n\n const contentChildren = childrenArray.filter(child => !(React.isValidElement(child) && child.type === ItemIcon))\n\n return (\n <li className={clsx(itemClassName, !!iconChild && styles['SectionIntroStackedItem-item--with-icon'])} {...rest}>\n {iconChild}\n <div className={styles['SectionIntroStackedItem__content']}>{contentChildren}</div>\n </li>\n )\n }\n\n const getConditionalVariant = () => {\n if (childrenArray.some(child => React.isValidElement(child) && (child.type === 'b' \|\| child.type === 'em'))) {\n return 'muted'\n }\n return 'default'\n }\n\n const defaultColor = childrenArray.length === 1 ? 'default' : getConditionalVariant()\n return (\n <li className={itemClassName} {...rest}>\n <Text\n as=\"span\"\n className={clsx(\n styles['SectionIntroStackedItem__item-text'],\n defaultColor === 'muted' && styles[`SectionIntroStackedItem__item-text--muted`],\n )}\n size=\"350\"\n >\n {children}\n </Text>\n </li>\n )\n}\n\nexport const SectionIntroStacked = Object.assign(Root, {\n Heading: _Heading,\n Description: _Description,\n Link: _Link,\n Items: ItemsBase,\n Item: ItemBase,\n ItemIcon,\n ItemHeading,\n ItemDescription,\n})\n"],"mappings":"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"}
1	+ {"version":3,"file":"SectionIntroStacked.js","names":[],"sources":["../../src/SectionIntroStacked/SectionIntroStacked.tsx"],"sourcesContent":["import React, {forwardRef, PropsWithChildren, useMemo, type Ref, useCallback} from 'react'\nimport {clsx} from 'clsx'\nimport {Grid} from '../Grid'\nimport {Link, LinkProps} from '../Link'\nimport {Heading, HeadingProps, defaultHeadingTag} from '../Heading'\nimport {Text, TextProps} from '../Text'\nimport {Icon, IconProps} from '../Icon'\nimport {useAnimation} from '../animation'\n\nimport styles from './SectionIntroStacked.module.css'\nimport gridlineStyles from '../component-helpers/shared.module.css'\n\nimport type {BaseProps} from '../component-helpers'\n\nexport const SectionIntroStackedVariants = ['default', 'gridline'] as const\nexport type SectionIntroStackedVariant = (typeof SectionIntroStackedVariants)[number]\n\nexport type SectionIntroStackedProps = React.HTMLAttributes<HTMLElement> &\n BaseProps<HTMLElement> &\n PropsWithChildren & {\n variant?: SectionIntroStackedVariant\n }\n\nconst Root = forwardRef<HTMLElement, PropsWithChildren<SectionIntroStackedProps>>(\n ({animate, className, children, style, variant = 'default', ...props}, ref) => {\n const {classes: animationClasses, styles: animationInlineStyles} = useAnimation(animate)\n\n const childrenArray = React.Children.toArray(children)\n\n // extract Items and everything else into two separate arrays\n const items = childrenArray.filter(child => React.isValidElement(child) && child.type === ItemsBase)\n\n const otherChildren = childrenArray.filter(child => !items.includes(child))\n\n return (\n <header\n ref={ref}\n className={clsx(\n styles.SectionIntroStacked,\n variant === 'gridline' && styles['SectionIntroStacked--variant-gridline'],\n variant === 'gridline' && gridlineStyles.gridline,\n animationClasses,\n className,\n )}\n {...props}\n style={{...animationInlineStyles, ...style}}\n >\n <Grid fullWidth enableGutters={variant !== 'gridline'}>\n <Grid.Column span={{large: 6}}>{otherChildren}</Grid.Column>\n <Grid.Column\n span={variant === 'gridline' ? {large: 6} : {large: 5}}\n start={variant === 'gridline' ? {large: 7} : {large: 8}}\n >\n {items}\n </Grid.Column>\n </Grid>\n </header>\n )\n },\n)\n\ntype SectionIntroStackedHeadingProps = BaseProps<HTMLHeadingElement> & HeadingProps\n\nconst defaultHeadingSize = '3'\n\nconst _Heading = forwardRef(\n (\n {\n as = defaultHeadingTag,\n size = defaultHeadingSize,\n className,\n children,\n ...props\n }: PropsWithChildren<SectionIntroStackedHeadingProps>,\n ref: Ref<HTMLHeadingElement>,\n ) => {\n const childrenArray = useMemo(() => React.Children.toArray(children), [children])\n\n const getConditionalVariant = useCallback(() => {\n if (childrenArray.some(child => React.isValidElement(child) && (child.type === 'b' \|\| child.type === 'em'))) {\n return 'muted'\n }\n return 'default'\n }, [childrenArray])\n\n const defaultColor = childrenArray.length === 1 ? 'default' : getConditionalVariant()\n\n return (\n <Heading\n ref={ref}\n className={clsx(\n styles[`SectionIntroStacked-heading`],\n defaultColor === 'muted' && styles[`SectionIntroStacked-heading--muted`],\n className,\n )}\n size={size}\n as={as}\n {...props}\n >\n {children}\n </Heading>\n )\n },\n)\n\ntype SectionIntroStackedDescriptionProps = Omit<TextProps, 'as' \| 'variant'> &\n BaseProps<HTMLParagraphElement> & {\n as?: 'p'\n children: React.ReactNode \| React.ReactNode[]\n }\n\nconst _Description = forwardRef(\n ({className, children, ...props}: SectionIntroStackedDescriptionProps, ref: Ref<HTMLParagraphElement>) => {\n return (\n <Text\n as=\"p\"\n className={clsx(styles['SectionIntroStacked-description'], className)}\n ref={ref}\n variant=\"muted\"\n {...props}\n >\n {children}\n </Text>\n )\n },\n)\n\ntype SectionIntroStackedLinkProps = LinkProps & BaseProps<HTMLAnchorElement>\n\nconst _Link = forwardRef(\n (\n {className, children, variant = 'accent', size = 'medium', ...props}: SectionIntroStackedLinkProps,\n ref: Ref<HTMLAnchorElement>,\n ) => {\n return (\n <Link\n ref={ref}\n className={clsx(styles['SectionIntroStacked-link'], className)}\n size={size}\n variant={variant}\n {...props}\n >\n {children}\n </Link>\n )\n },\n)\n\ntype SectionIntroStackedItemsProps = BaseProps<HTMLUListElement>\n\nconst ItemsBase = ({animate, className, children, ...rest}: PropsWithChildren<SectionIntroStackedItemsProps>) => {\n const {classes: animationClasses, styles: animationInlineStyles} = useAnimation(animate)\n\n const timelineClassName = clsx(animationClasses, styles['SectionIntroStacked-items'], className)\n\n return (\n <ul className={timelineClassName} style={{...animationInlineStyles}} {...rest}>\n {children}\n </ul>\n )\n}\n\ntype SectionIntroStackedItemIconProps = IconProps\n\nconst ItemIcon = ({className, color = 'green', ...props}: SectionIntroStackedItemIconProps) => {\n return (\n <Icon\n className={clsx(styles['SectionIntroStackedItem__icon'], className)}\n hasBackground\n size=\"medium\"\n color={color}\n {...props}\n />\n )\n}\n\ntype SectionIntroStackedItemHeadingProps = HeadingProps\n\nconst ItemHeading = forwardRef(\n (\n {\n as = 'h3',\n size = 'subhead-large',\n className,\n children,\n ...props\n }: PropsWithChildren<SectionIntroStackedItemHeadingProps>,\n ref: Ref<HTMLHeadingElement>,\n ) => {\n return (\n <Heading\n ref={ref}\n as={as}\n size={size}\n className={clsx(styles['SectionIntroStackedItem__heading'], className)}\n {...props}\n >\n {children}\n </Heading>\n )\n },\n)\n\ntype SectionIntroStackedItemDescriptionProps = Omit<TextProps, 'as' \| 'variant' \| 'size'> &\n BaseProps<HTMLParagraphElement> & {\n as?: 'p'\n children: React.ReactNode \| React.ReactNode[]\n }\n\nconst ItemDescription = forwardRef(\n ({className, children, ...props}: SectionIntroStackedItemDescriptionProps, ref: Ref<HTMLParagraphElement>) => {\n return (\n <Text\n as=\"p\"\n variant=\"muted\"\n size=\"200\"\n className={clsx(styles['SectionIntroStackedItem__description'], className)}\n ref={ref}\n {...props}\n >\n {children}\n </Text>\n )\n },\n)\n\nexport type SectionIntroStackedItemProps = BaseProps<HTMLLIElement>\n\nconst ItemBase = ({className, children, ...rest}: PropsWithChildren<SectionIntroStackedItemProps>) => {\n const itemClassName = clsx(styles['SectionIntroStackedItem-item'], className)\n const childrenArray = useMemo(() => React.Children.toArray(children), [children])\n\n const hasSubComponents = childrenArray.some(\n child =>\n React.isValidElement(child) &&\n (child.type === ItemIcon \|\| child.type === ItemHeading \|\| child.type === ItemDescription),\n )\n\n if (hasSubComponents) {\n const iconChild = childrenArray.find(child => React.isValidElement(child) && child.type === ItemIcon)\n\n const contentChildren = childrenArray.filter(child => !(React.isValidElement(child) && child.type === ItemIcon))\n\n return (\n <li className={clsx(itemClassName, !!iconChild && styles['SectionIntroStackedItem-item--with-icon'])} {...rest}>\n {iconChild}\n <div className={styles['SectionIntroStackedItem__content']}>{contentChildren}</div>\n </li>\n )\n }\n\n const getConditionalVariant = () => {\n if (childrenArray.some(child => React.isValidElement(child) && (child.type === 'b' \|\| child.type === 'em'))) {\n return 'muted'\n }\n return 'default'\n }\n\n const defaultColor = childrenArray.length === 1 ? 'default' : getConditionalVariant()\n return (\n <li className={itemClassName} {...rest}>\n <Text\n as=\"span\"\n className={clsx(\n styles['SectionIntroStackedItem__item-text'],\n defaultColor === 'muted' && styles[`SectionIntroStackedItem__item-text--muted`],\n )}\n size=\"350\"\n >\n {children}\n </Text>\n </li>\n )\n}\n\nexport const SectionIntroStacked = Object.assign(Root, {\n Heading: _Heading,\n Description: _Description,\n Link: _Link,\n Items: ItemsBase,\n Item: ItemBase,\n ItemIcon,\n ItemHeading,\n ItemDescription,\n})\n"],"mappings":"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"}

package/esm/SectionIntroStacked/SectionIntroStacked.module-Cr7kUqTH.css ADDED Viewed

@@ -0,0 +1 @@

+ .Primer_Brand__SectionIntroStacked-module__SectionIntroStacked___UM_8Y{--brand-Grid-spacing-row:var(--base-size-48)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi{padding-inline:var(--base-size-24);padding-block:var(--base-size-32);--SectionIntroStacked-item-divider-overflow-start:var(--base-size-24);--SectionIntroStacked-item-divider-overflow-end:var(--base-size-24);position:relative}@media screen and (width>=63.25rem){.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi{padding-inline:var(--base-size-64);padding-block:var(--base-size-64);--SectionIntroStacked-item-divider-overflow-start:0px;--SectionIntroStacked-item-divider-overflow-end:calc(var(--brand-Grid-spacing-margin) + var(--base-size-64));padding-inline:var(--base-size-64);padding-block:var(--base-size-64)}}@media screen and (width>=80rem){.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi{border-inline:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-heading--muted___MNSqH,.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem__item-text--muted___PAxL5{color:var(--brand-color-text-muted)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-heading--muted___MNSqH em,.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-heading--muted___MNSqH b,.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem__item-text___sVBGJ em,.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem__item-text___sVBGJ b{color:var(--brand-color-text-default);font-style:normal;font-weight:var(--base-text-weight-normal)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--full-width___wxr_6 .Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-heading___zOCel{max-width:none}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-description____vGqZ{max-width:50ch;margin-block-start:var(--base-size-16)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-link___Vna3J{margin-block-start:var(--base-size-16)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-items___rRGdi{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}@media screen and (width<=63.25rem){.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-heading___zOCel{font-size:var(--brand-text-size-600)}}@media screen and (width>=63.25rem){.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-items___rRGdi{top:var(--base-size-2);position:relative}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi .Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-items___rRGdi{border-inline-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);margin-block:calc(-1 * var(--base-size-64));padding-block:0;position:static;top:auto}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi .Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws{padding-inline-start:var(--base-size-32);padding-inline-end:var(--base-size-32)}}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi .Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws{border-block-end:none;position:relative}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi .Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws:first-child{padding-block-start:var(--base-size-40)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi .Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws:last-child{padding-block-end:var(--base-size-40)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi .Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws:not(:last-child):after{content:"";bottom:0;left:calc(-1 * var(--SectionIntroStacked-item-divider-overflow-start));right:calc(-1 * var(--SectionIntroStacked-item-divider-overflow-end));border-bottom:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);position:absolute}.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws{padding-block:var(--base-size-40);border-block-end:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws:last-child{border-block-end:none;padding-block-end:0}.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item___hzIws:first-child{padding-block-start:0}.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item--with-icon___XYMFo{align-items:flex-start;gap:var(--base-size-24);flex-direction:row;display:flex}@media screen and (width>=63.25rem){.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem-item--with-icon___XYMFo{gap:var(--base-size-48)}}.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem__content___kUlfY{gap:var(--base-size-8);flex-direction:column;flex:1;min-width:0;display:flex}.Primer_Brand__SectionIntroStacked-module__SectionIntroStackedItem__icon___PkmCx{border-radius:var(--brand-borderRadius-medium);flex-shrink:0}

package/esm/SectionIntroStacked/SectionIntroStacked.module.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import './SectionIntroStacked.module-DvJXKMKX.css';var e = {
+import './SectionIntroStacked.module-Cr7kUqTH.css';var e = {
 	SectionIntroStacked: "Primer_Brand__SectionIntroStacked-module__SectionIntroStacked___UM_8Y",
 	"SectionIntroStacked--variant-gridline": "Primer_Brand__SectionIntroStacked-module__SectionIntroStacked--variant-gridline___TUqhi",
 	"SectionIntroStacked-heading--muted": "Primer_Brand__SectionIntroStacked-module__SectionIntroStacked-heading--muted___MNSqH",

package/esm/SectionIntroStacked/SectionIntroStacked.module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SectionIntroStacked.module.js","names":[],"sources":["../../src/SectionIntroStacked/SectionIntroStacked.module.css"],"sourcesContent":[".SectionIntroStacked {\n --brand-Grid-spacing-row: var(--base-size-48);\n}\n\n.SectionIntroStacked--variant-gridline {\n position: relative;\n padding-inline: var(--base-size-24);\n padding-block: var(--base-size-32);\n\n --SectionIntroStacked-item-divider-overflow-start: var(--base-size-24);\n --SectionIntroStacked-item-divider-overflow-end: var(--base-size-24);\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStacked--variant-gridline {\n padding-inline: var(--base-size-64);\n padding-block: var(--base-size-64);\n /* At large viewports, left overflow is 0 (vertical divider bounds the start) /\n --SectionIntroStacked-item-divider-overflow-start: 0px;\n --SectionIntroStacked-item-divider-overflow-end: var(--base-size-64);\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStacked--variant-gridline {\n padding-inline: var(--base-size-64);\n padding-block: var(--base-size-64);\n --SectionIntroStacked-item-divider-overflow-start: 0px;\n --SectionIntroStacked-item-divider-overflow-end: calc(var(--brand-Grid-spacing-margin) + var(--base-size-64));\n }\n}\n\n.SectionIntroStacked--variant-gridline::before,\n.SectionIntroStacked--variant-gridline::after {\n content: '';\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n width: 100vw;\n height: 0;\n border-top: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n z-index: 1;\n}\n\n.SectionIntroStacked--variant-gridline::before {\n top: 0;\n}\n\n.SectionIntroStacked--variant-gridline::after {\n bottom: 0;\n}\n\n@media screen and (min-width: 80rem) {\n .SectionIntroStacked--variant-gridline {\n border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n}\n\n.SectionIntroStacked-heading--muted,\n.SectionIntroStackedItem__item-text--muted {\n color: var(--brand-color-text-muted);\n}\n\n.SectionIntroStacked-heading--muted em,\n.SectionIntroStacked-heading--muted b,\n.SectionIntroStackedItem__item-text em,\n.SectionIntroStackedItem__item-text b {\n color: var(--brand-color-text-default);\n font-style: normal;\n font-weight: var(--base-text-weight-normal);\n}\n\n.SectionIntroStacked--full-width .SectionIntroStacked-heading {\n max-width: none;\n}\n\n.SectionIntroStacked-description {\n margin-block-start: var(--base-size-16);\n max-width: 50ch;\n}\n\n.SectionIntroStacked-link {\n margin-block-start: var(--base-size-16);\n}\n\n.SectionIntroStacked-items {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n}\n\n@media screen and (max-width: 63.25rem) {\n .SectionIntroStacked-heading {\n font-size: var(--brand-text-size-600);\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStacked-items {\n position: relative;\n top: var(--base-size-2);\n }\n\n .SectionIntroStacked--variant-gridline .SectionIntroStacked-items {\n border-inline-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n margin-block: calc(-1 var(--base-size-64));\n padding-block: 0;\n position: static;\n top: auto;\n }\n\n .SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item {\n /* Inset item content from the vertical gridline /\n padding-inline-start: var(--base-size-32);\n padding-inline-end: var(--base-size-32);\n }\n}\n\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item {\n border-block-end: none;\n position: relative;\n}\n\n/ Restore equal padding on first/last items in gridline variant /\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item:first-child {\n padding-block-start: var(--base-size-40);\n}\n\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item:last-child {\n padding-block-end: var(--base-size-40);\n}\n\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item:not(:last-child)::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: calc(-1 var(--SectionIntroStacked-item-divider-overflow-start));\n right: calc(-1 * var(--SectionIntroStacked-item-divider-overflow-end));\n border-bottom: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.SectionIntroStackedItem-item {\n padding-block: var(--base-size-40);\n border-block-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.SectionIntroStackedItem-item:last-child {\n border-block-end: none;\n padding-block-end: 0;\n}\n\n.SectionIntroStackedItem-item:first-child {\n padding-block-start: 0;\n}\n\n.SectionIntroStackedItem-item--with-icon {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n gap: var(--base-size-24);\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStackedItem-item--with-icon {\n gap: var(--base-size-48);\n }\n}\n\n.SectionIntroStackedItem__content {\n display: flex;\n flex-direction: column;\n gap: var(--base-size-8);\n flex: 1;\n min-width: 0;\n}\n\n.SectionIntroStackedItem__icon {\n flex-shrink: 0;\n border-radius: var(--brand-borderRadius-medium);\n}\n"],"mappings":""}
1	+ {"version":3,"file":"SectionIntroStacked.module.js","names":[],"sources":["../../src/SectionIntroStacked/SectionIntroStacked.module.css"],"sourcesContent":[".SectionIntroStacked {\n --brand-Grid-spacing-row: var(--base-size-48);\n}\n\n.SectionIntroStacked--variant-gridline {\n position: relative;\n padding-inline: var(--base-size-24);\n padding-block: var(--base-size-32);\n\n --SectionIntroStacked-item-divider-overflow-start: var(--base-size-24);\n --SectionIntroStacked-item-divider-overflow-end: var(--base-size-24);\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStacked--variant-gridline {\n padding-inline: var(--base-size-64);\n padding-block: var(--base-size-64);\n /* At large viewports, left overflow is 0 (vertical divider bounds the start) /\n --SectionIntroStacked-item-divider-overflow-start: 0px;\n --SectionIntroStacked-item-divider-overflow-end: var(--base-size-64);\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStacked--variant-gridline {\n padding-inline: var(--base-size-64);\n padding-block: var(--base-size-64);\n --SectionIntroStacked-item-divider-overflow-start: 0px;\n --SectionIntroStacked-item-divider-overflow-end: calc(var(--brand-Grid-spacing-margin) + var(--base-size-64));\n }\n}\n\n@media screen and (min-width: 80rem) {\n .SectionIntroStacked--variant-gridline {\n border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n}\n\n.SectionIntroStacked-heading--muted,\n.SectionIntroStackedItem__item-text--muted {\n color: var(--brand-color-text-muted);\n}\n\n.SectionIntroStacked-heading--muted em,\n.SectionIntroStacked-heading--muted b,\n.SectionIntroStackedItem__item-text em,\n.SectionIntroStackedItem__item-text b {\n color: var(--brand-color-text-default);\n font-style: normal;\n font-weight: var(--base-text-weight-normal);\n}\n\n.SectionIntroStacked--full-width .SectionIntroStacked-heading {\n max-width: none;\n}\n\n.SectionIntroStacked-description {\n margin-block-start: var(--base-size-16);\n max-width: 50ch;\n}\n\n.SectionIntroStacked-link {\n margin-block-start: var(--base-size-16);\n}\n\n.SectionIntroStacked-items {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n}\n\n@media screen and (max-width: 63.25rem) {\n .SectionIntroStacked-heading {\n font-size: var(--brand-text-size-600);\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStacked-items {\n position: relative;\n top: var(--base-size-2);\n }\n\n .SectionIntroStacked--variant-gridline .SectionIntroStacked-items {\n border-inline-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n margin-block: calc(-1 var(--base-size-64));\n padding-block: 0;\n position: static;\n top: auto;\n }\n\n .SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item {\n /* Inset item content from the vertical gridline /\n padding-inline-start: var(--base-size-32);\n padding-inline-end: var(--base-size-32);\n }\n}\n\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item {\n border-block-end: none;\n position: relative;\n}\n\n/ Restore equal padding on first/last items in gridline variant /\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item:first-child {\n padding-block-start: var(--base-size-40);\n}\n\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item:last-child {\n padding-block-end: var(--base-size-40);\n}\n\n.SectionIntroStacked--variant-gridline .SectionIntroStackedItem-item:not(:last-child)::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: calc(-1 var(--SectionIntroStacked-item-divider-overflow-start));\n right: calc(-1 * var(--SectionIntroStacked-item-divider-overflow-end));\n border-bottom: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.SectionIntroStackedItem-item {\n padding-block: var(--base-size-40);\n border-block-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.SectionIntroStackedItem-item:last-child {\n border-block-end: none;\n padding-block-end: 0;\n}\n\n.SectionIntroStackedItem-item:first-child {\n padding-block-start: 0;\n}\n\n.SectionIntroStackedItem-item--with-icon {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n gap: var(--base-size-24);\n}\n\n@media screen and (min-width: 63.25rem) {\n .SectionIntroStackedItem-item--with-icon {\n gap: var(--base-size-48);\n }\n}\n\n.SectionIntroStackedItem__content {\n display: flex;\n flex-direction: column;\n gap: var(--base-size-8);\n flex: 1;\n min-width: 0;\n}\n\n.SectionIntroStackedItem__icon {\n flex-shrink: 0;\n border-radius: var(--brand-borderRadius-medium);\n}\n"],"mappings":""}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Tiles.d.ts","sourceRoot":"","sources":["../../src/Tiles/Tiles.tsx"],"names":[],"mappings":"AACA,OAAO,KAAgF,MAAM,OAAO,CAAA;AAEpG,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;~~AAGnD~~,sBAAsB;AACtB,OAAO,yGAAyG,CAAA;AAehH,KAAK,YAAY,GAAG,SAAS,GAAG,WAAW,CAAA;AAE3C,KAAK,WAAW,GAAG,SAAS,GAAG,SAAS,CAAA;AAIxC,MAAM,MAAM,UAAU,GAAG;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,GAAG,SAAS,CAAC,cAAc,CAAC,GAC3B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;~~AAoCtC~~,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,GAAG,SAAS,CAAC,aAAa,CAAC,GAC1B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAoCH;;;GAGG;AACH,eAAO,MAAM,KAAK;;;;;;;CAGhB,CAAA"}
1	+ {"version":3,"file":"Tiles.d.ts","sourceRoot":"","sources":["../../src/Tiles/Tiles.tsx"],"names":[],"mappings":"AACA,OAAO,KAAgF,MAAM,OAAO,CAAA;AAEpG,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,sBAAsB;AACtB,OAAO,yGAAyG,CAAA;AAehH,KAAK,YAAY,GAAG,SAAS,GAAG,WAAW,CAAA;AAE3C,KAAK,WAAW,GAAG,SAAS,GAAG,SAAS,CAAA;AAIxC,MAAM,MAAM,UAAU,GAAG;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,GAAG,SAAS,CAAC,cAAc,CAAC,GAC3B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAqCtC,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,GAAG,SAAS,CAAC,aAAa,CAAC,GAC1B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAoCH;;;GAGG;AACH,eAAO,MAAM,KAAK;;;;;;;CAGhB,CAAA"}

package/esm/Tiles/Tiles.js CHANGED Viewed

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Tiles.js","names":[],"sources":["../../src/Tiles/Tiles.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {createContext, forwardRef, type PropsWithChildren, type Ref, useContext} from 'react'\nimport {ArrowUpRightIcon} from '@primer/octicons-react'\nimport type {BaseProps} from '../component-helpers'\nimport {Text} from '../Text'\n\n/** * Design Tokens /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes.css'\n\n/* * Main Stylesheet (as a CSS Module) /\nimport styles from './Tiles.module.css'\n\nconst testIds = {\n root: 'Tiles',\n get grid() {\n return `${this.root}-grid`\n },\n get item() {\n return `${this.root}-item`\n },\n}\n\ntype TilesVariant = 'default' \| 'gridlines'\n\ntype TilesLayout = 'default' \| 'compact'\n\nconst TilesContext = createContext<TilesLayout>('default')\n\nexport type TilesProps = {\n /\n The visual variant of the Tiles component.\n /\n variant?: TilesVariant\n /\n The layout density of the Tiles grid.\n /\n layout?: TilesLayout\n /\n Test id for the root Tiles element.\n /\n 'data-testid'?: string\n} & BaseProps<HTMLDivElement> &\n React.HTMLAttributes<HTMLDivElement>\n\nconst TilesRoot = forwardRef(\n (\n {\n variant = 'default',\n layout = 'default',\n children,\n className,\n 'data-testid': testId,\n ...rest\n }: PropsWithChildren<TilesProps>,\n ref: Ref<HTMLDivElement>,\n ) => {\n return (\n <TilesContext.Provider value={layout}>\n <div\n ref={ref}\n className={clsx(\n styles.Tiles,\n styles[`Tiles--variant-${variant}`],\n styles[`Tiles--layout-${layout}`],\n className,\n )}\n data-testid={testId \|\| testIds.root}\n {...rest}\n >\n <ul className={styles['Tiles-grid']} data-testid={testIds.grid}>\n {children}\n </ul>\n </div>\n </TilesContext.Provider>\n )\n },\n)\n\nexport type TilesItemProps = {\n /\n The accessible name for the tile item.\n /\n name: string\n /\n Optional URL to link the tile to.\n /\n href?: string\n /\n Test id for the tile item element.\n /\n 'data-testid'?: string\n} & BaseProps<HTMLLIElement> &\n Omit<React.HTMLAttributes<HTMLLIElement>, 'children'> & {\n children: React.ReactNode\n }\n\nconst _Item = forwardRef(\n ({name, href, children, className, 'data-testid': testId, ...rest}: TilesItemProps, ref: Ref<HTMLLIElement>) => {\n const layout = useContext(TilesContext)\n const hasLink = Boolean(href)\n const isLabelHidden = layout === 'compact' && !hasLink\n\n const content = (\n <span className={styles['Tiles-item-content']}>\n <span className={styles['Tiles-item-media']} aria-hidden=\"true\">\n {children}\n </span>\n <span className={clsx(styles['Tiles-item-label'], isLabelHidden && 'visually-hidden')}>\n <Text as=\"span\" size=\"100\" className={styles['Tiles-item-name']}>\n {name}\n </Text>\n {hasLink && <ArrowUpRightIcon size={16} className={styles['Tiles-item-icon']} aria-hidden=\"true\" />}\n </span>\n </span>\n )\n\n return (\n <li ref={ref} className={clsx(styles['Tiles-item'], className)} data-testid={testId \|\| testIds.item} {...rest}>\n {hasLink ? (\n <a href={href} className={styles['Tiles-item-link']}>\n {content}\n </a>\n ) : (\n content\n )}\n </li>\n )\n },\n)\n\n/\n Use Tiles to display a grid of logos or icons with optional links.\n * @see https://primer.style/brand/components/Tiles\n */\nexport const Tiles = Object.assign(TilesRoot, {\n Item: _Item,\n testIds,\n})\n"],"mappings":"~~;;;;;;;;AAYA~~,IAAM,IAAU;CACd,MAAM;CACN,IAAI,OAAO;AACT,SAAO,GAAG,KAAK,KAAK;;CAEtB,IAAI,OAAO;AACT,SAAO,GAAG,KAAK,KAAK;;CAEvB,EAMK,IAAe,EAA2B,UAAU,EAkBpD,IAAY,GAEd,EACE,aAAU,WACV,YAAS,WACT,aACA,cACA,eAAe,GACf,GAAG,KAEL,MAGE,kBAAC,EAAa,UAAd;CAAuB,OAAO;WAC5B,kBAAC,OAAD;EACO;EACL,WAAW,EACT,EAAO,OACP,EAAO,kBAAkB,MACzB,EAAO,iBAAiB,MACxB,EACD;EACD,eAAa,KAAU,EAAQ;EAC/B,GAAI;YAEJ,kBAAC,MAAD;GAAI,WAAW,EAAO;GAAe,eAAa,EAAQ;GACvD;GACE,CAAA;EACD,CAAA;CACgB,CAAA,CAG7B,EAoBK,IAAQ,GACX,EAAC,SAAM,SAAM,aAAU,cAAW,eAAe,GAAQ,GAAG,KAAuB,MAA4B;CAC9G,IAAM,IAAS,EAAW,EAAa,EACjC,IAAU,EAAQ,GAClB,IAAgB,MAAW,aAAa,CAAC,GAEzC,IACJ,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACE,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAqB,eAAY;GACtD;GACI,CAAA,EACP,kBAAC,QAAD;GAAM,WAAW,EAAK,EAAO,qBAAqB,KAAiB,kBAAkB;aAArF,CACE,kBAAC,GAAD;IAAM,IAAG;IAAO,MAAK;IAAM,WAAW,EAAO;cAC1C;IACI,CAAA,EACN,KAAW,kBAAC,GAAD;IAAkB,MAAM;IAAI,WAAW,EAAO;IAAoB,eAAY;IAAS,CAAA,CAC9F;KACF;;AAGT,QACE,kBAAC,MAAD;EAAS;EAAK,WAAW,EAAK,EAAO,eAAe,EAAU;EAAE,eAAa,KAAU,EAAQ;EAAM,GAAI;YACtG,IACC,kBAAC,KAAD;GAAS;GAAM,WAAW,EAAO;aAC9B;GACC,CAAA,GAEJ;EAEC,CAAA;EAGV,EAMY,IAAQ,OAAO,OAAO,GAAW;CAC5C,MAAM;CACN;CACD,CAAC"}
1	+ {"version":3,"file":"Tiles.js","names":[],"sources":["../../src/Tiles/Tiles.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {createContext, forwardRef, type PropsWithChildren, type Ref, useContext} from 'react'\nimport {ArrowUpRightIcon} from '@primer/octicons-react'\nimport type {BaseProps} from '../component-helpers'\nimport gridlineStyles from '../component-helpers/shared.module.css'\nimport {Text} from '../Text'\n\n/** * Design Tokens /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes.css'\n\n/* * Main Stylesheet (as a CSS Module) /\nimport styles from './Tiles.module.css'\n\nconst testIds = {\n root: 'Tiles',\n get grid() {\n return `${this.root}-grid`\n },\n get item() {\n return `${this.root}-item`\n },\n}\n\ntype TilesVariant = 'default' \| 'gridlines'\n\ntype TilesLayout = 'default' \| 'compact'\n\nconst TilesContext = createContext<TilesLayout>('default')\n\nexport type TilesProps = {\n /\n The visual variant of the Tiles component.\n /\n variant?: TilesVariant\n /\n The layout density of the Tiles grid.\n /\n layout?: TilesLayout\n /\n Test id for the root Tiles element.\n /\n 'data-testid'?: string\n} & BaseProps<HTMLDivElement> &\n React.HTMLAttributes<HTMLDivElement>\n\nconst TilesRoot = forwardRef(\n (\n {\n variant = 'default',\n layout = 'default',\n children,\n className,\n 'data-testid': testId,\n ...rest\n }: PropsWithChildren<TilesProps>,\n ref: Ref<HTMLDivElement>,\n ) => {\n return (\n <TilesContext.Provider value={layout}>\n <div\n ref={ref}\n className={clsx(\n styles.Tiles,\n styles[`Tiles--variant-${variant}`],\n styles[`Tiles--layout-${layout}`],\n variant === 'gridlines' && gridlineStyles.gridline,\n className,\n )}\n data-testid={testId \|\| testIds.root}\n {...rest}\n >\n <ul className={styles['Tiles-grid']} data-testid={testIds.grid}>\n {children}\n </ul>\n </div>\n </TilesContext.Provider>\n )\n },\n)\n\nexport type TilesItemProps = {\n /\n The accessible name for the tile item.\n /\n name: string\n /\n Optional URL to link the tile to.\n /\n href?: string\n /\n Test id for the tile item element.\n /\n 'data-testid'?: string\n} & BaseProps<HTMLLIElement> &\n Omit<React.HTMLAttributes<HTMLLIElement>, 'children'> & {\n children: React.ReactNode\n }\n\nconst _Item = forwardRef(\n ({name, href, children, className, 'data-testid': testId, ...rest}: TilesItemProps, ref: Ref<HTMLLIElement>) => {\n const layout = useContext(TilesContext)\n const hasLink = Boolean(href)\n const isLabelHidden = layout === 'compact' && !hasLink\n\n const content = (\n <span className={styles['Tiles-item-content']}>\n <span className={styles['Tiles-item-media']} aria-hidden=\"true\">\n {children}\n </span>\n <span className={clsx(styles['Tiles-item-label'], isLabelHidden && 'visually-hidden')}>\n <Text as=\"span\" size=\"100\" className={styles['Tiles-item-name']}>\n {name}\n </Text>\n {hasLink && <ArrowUpRightIcon size={16} className={styles['Tiles-item-icon']} aria-hidden=\"true\" />}\n </span>\n </span>\n )\n\n return (\n <li ref={ref} className={clsx(styles['Tiles-item'], className)} data-testid={testId \|\| testIds.item} {...rest}>\n {hasLink ? (\n <a href={href} className={styles['Tiles-item-link']}>\n {content}\n </a>\n ) : (\n content\n )}\n </li>\n )\n },\n)\n\n/\n Use Tiles to display a grid of logos or icons with optional links.\n * @see https://primer.style/brand/components/Tiles\n */\nexport const Tiles = Object.assign(TilesRoot, {\n Item: _Item,\n testIds,\n})\n"],"mappings":";;;;;;;;;AAaA,IAAM,IAAU;CACd,MAAM;CACN,IAAI,OAAO;AACT,SAAO,GAAG,KAAK,KAAK;;CAEtB,IAAI,OAAO;AACT,SAAO,GAAG,KAAK,KAAK;;CAEvB,EAMK,IAAe,EAA2B,UAAU,EAkBpD,IAAY,GAEd,EACE,aAAU,WACV,YAAS,WACT,aACA,cACA,eAAe,GACf,GAAG,KAEL,MAGE,kBAAC,EAAa,UAAd;CAAuB,OAAO;WAC5B,kBAAC,OAAD;EACO;EACL,WAAW,EACT,EAAO,OACP,EAAO,kBAAkB,MACzB,EAAO,iBAAiB,MACxB,MAAY,eAAe,EAAe,UAC1C,EACD;EACD,eAAa,KAAU,EAAQ;EAC/B,GAAI;YAEJ,kBAAC,MAAD;GAAI,WAAW,EAAO;GAAe,eAAa,EAAQ;GACvD;GACE,CAAA;EACD,CAAA;CACgB,CAAA,CAG7B,EAoBK,IAAQ,GACX,EAAC,SAAM,SAAM,aAAU,cAAW,eAAe,GAAQ,GAAG,KAAuB,MAA4B;CAC9G,IAAM,IAAS,EAAW,EAAa,EACjC,IAAU,EAAQ,GAClB,IAAgB,MAAW,aAAa,CAAC,GAEzC,IACJ,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACE,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAqB,eAAY;GACtD;GACI,CAAA,EACP,kBAAC,QAAD;GAAM,WAAW,EAAK,EAAO,qBAAqB,KAAiB,kBAAkB;aAArF,CACE,kBAAC,GAAD;IAAM,IAAG;IAAO,MAAK;IAAM,WAAW,EAAO;cAC1C;IACI,CAAA,EACN,KAAW,kBAAC,GAAD;IAAkB,MAAM;IAAI,WAAW,EAAO;IAAoB,eAAY;IAAS,CAAA,CAC9F;KACF;;AAGT,QACE,kBAAC,MAAD;EAAS;EAAK,WAAW,EAAK,EAAO,eAAe,EAAU;EAAE,eAAa,KAAU,EAAQ;EAAM,GAAI;YACtG,IACC,kBAAC,KAAD;GAAS;GAAM,WAAW,EAAO;aAC9B;GACC,CAAA,GAEJ;EAEC,CAAA;EAGV,EAMY,IAAQ,OAAO,OAAO,GAAW;CAC5C,MAAM;CACN;CACD,CAAC"}

package/esm/Tiles/Tiles.module-DVK0nMCy.css ADDED Viewed

@@ -0,0 +1 @@

+ .Primer_Brand__Tiles-module__Tiles___RhWBm{width:100%;color:var(--brand-color-text-default)}.Primer_Brand__Tiles-module__Tiles-grid___lAoQw{--tiles-columns:2;flex-wrap:wrap;justify-content:center;margin:0;padding:0;list-style:none;display:flex}@media screen and (width>=48rem){.Primer_Brand__Tiles-module__Tiles--layout-default___szHFY .Primer_Brand__Tiles-module__Tiles-grid___lAoQw{--tiles-columns:4}}@media screen and (width>=63.25rem){.Primer_Brand__Tiles-module__Tiles--layout-default___szHFY .Primer_Brand__Tiles-module__Tiles-grid___lAoQw{--tiles-columns:6}}@media screen and (width>=48rem){.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-grid___lAoQw{--tiles-columns:4}}@media screen and (width>=63.25rem){.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-grid___lAoQw{--tiles-columns:8}}.Primer_Brand__Tiles-module__Tiles--variant-gridlines___6CsMP .Primer_Brand__Tiles-module__Tiles-grid___lAoQw{padding-right:var(--brand-borderWidth-thin);padding-bottom:var(--brand-borderWidth-thin);position:relative}.Primer_Brand__Tiles-module__Tiles--variant-gridlines___6CsMP .Primer_Brand__Tiles-module__Tiles-grid___lAoQw:before,.Primer_Brand__Tiles-module__Tiles--variant-gridlines___6CsMP .Primer_Brand__Tiles-module__Tiles-grid___lAoQw:after{content:"";border-left:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);z-index:1;pointer-events:none;width:0;position:absolute;top:0;bottom:0}.Primer_Brand__Tiles-module__Tiles--variant-gridlines___6CsMP .Primer_Brand__Tiles-module__Tiles-grid___lAoQw:before{left:0}.Primer_Brand__Tiles-module__Tiles--variant-gridlines___6CsMP .Primer_Brand__Tiles-module__Tiles-grid___lAoQw:after{right:0}.Primer_Brand__Tiles-module__Tiles-item___YlnUj{--tiles-inset-shadow:inset 0 0 0 transparent;width:calc(100% / var(--tiles-columns));box-sizing:border-box;background-color:var(--brand-tiles-bgColor-rest);border-top:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);border-left:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);box-shadow:var(--brand-borderWidth-thin) 0 0 0 var(--brand-color-border-muted), 0 var(--brand-borderWidth-thin) 0 0 var(--brand-color-border-muted), inset 0 0 0 transparent;box-shadow:var(--brand-borderWidth-thin) 0 0 0 var(--brand-color-border-muted), 0 var(--brand-borderWidth-thin) 0 0 var(--brand-color-border-muted), var(--tiles-inset-shadow);transition:background-color var(--brand-animation-duration-faster) var(--brand-animation-easing-default), box-shadow var(--brand-animation-duration-faster) var(--brand-animation-easing-default);flex-direction:column;display:flex;position:relative}:is(.Primer_Brand__Tiles-module__Tiles-item___YlnUj:has(.Primer_Brand__Tiles-module__Tiles-item-link___NcK69):hover,.Primer_Brand__Tiles-module__Tiles-item___YlnUj:has(.Primer_Brand__Tiles-module__Tiles-item-link___NcK69):focus-within){--tiles-inset-shadow:inset 0 var(--base-size-2) 0 var(--brand-tiles-highlightColor);background-color:var(--brand-tiles-bgColor-hover)}.Primer_Brand__Tiles-module__Tiles-item-link___NcK69{width:100%;color:inherit;flex:1;-webkit-text-decoration:none;text-decoration:none;display:flex}.Primer_Brand__Tiles-module__Tiles-item-link___NcK69:focus-visible{outline:var(--base-size-4) solid var(--brand-color-focus);outline-offset:calc(-1 * var(--base-size-4));border-radius:var(--brand-borderRadius-small)}.Primer_Brand__Tiles-module__Tiles-item-content___YIq8M{aspect-ratio:1;justify-content:center;align-items:center;width:100%;display:flex;position:relative}.Primer_Brand__Tiles-module__Tiles-item-media___QH9l2{justify-content:center;align-items:center;display:flex}.Primer_Brand__Tiles-module__Tiles-item-media___QH9l2 svg,.Primer_Brand__Tiles-module__Tiles-item-media___QH9l2 img{width:auto;height:var(--base-size-40);max-width:100%}.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-media___QH9l2 svg,.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-media___QH9l2 img{height:var(--base-size-32)}.Primer_Brand__Tiles-module__Tiles-item-label___L9BIA{justify-content:space-between;align-items:center;gap:var(--base-size-4);padding:var(--base-size-12) var(--base-size-16);display:flex;position:absolute;bottom:0;left:0;right:0}.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-media___QH9l2{transition:transform var(--brand-animation-duration-fast) var(--brand-animation-easing-default)}.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-link___NcK69:hover .Primer_Brand__Tiles-module__Tiles-item-media___QH9l2,.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-link___NcK69:focus-visible .Primer_Brand__Tiles-module__Tiles-item-media___QH9l2{transform:translateY(calc(-1 * var(--base-size-4)))}.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-label___L9BIA{opacity:0;transform:translateY(var(--base-size-4));transition:opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-default), transform var(--brand-animation-duration-fast) var(--brand-animation-easing-default);pointer-events:none}.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-link___NcK69:hover .Primer_Brand__Tiles-module__Tiles-item-label___L9BIA,.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-link___NcK69:focus-visible .Primer_Brand__Tiles-module__Tiles-item-label___L9BIA{opacity:1;transform:translateY(0)}.Primer_Brand__Tiles-module__Tiles-item-name___47ZMU{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.Primer_Brand__Tiles-module__Tiles-item-icon___2Hu6M{color:var(--brand-color-text-default);flex-shrink:0}@media (prefers-reduced-motion:reduce){.Primer_Brand__Tiles-module__Tiles-item___YlnUj,.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-media___QH9l2,.Primer_Brand__Tiles-module__Tiles--layout-compact___HBisD .Primer_Brand__Tiles-module__Tiles-item-label___L9BIA{transition:none}}

package/esm/Tiles/Tiles.module.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import './Tiles.module-D7UJKhKM.css';var e = {
+import './Tiles.module-DVK0nMCy.css';var e = {
 	Tiles: "Primer_Brand__Tiles-module__Tiles___RhWBm",
 	"Tiles-grid": "Primer_Brand__Tiles-module__Tiles-grid___lAoQw",
 	"Tiles--layout-default": "Primer_Brand__Tiles-module__Tiles--layout-default___szHFY",

package/esm/Tiles/Tiles.module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tiles.module.js","names":[],"sources":["../../src/Tiles/Tiles.module.css"],"sourcesContent":[".Tiles {\n width: 100%;\n color: var(--brand-color-text-default);\n}\n\n.Tiles-grid {\n --tiles-columns: 2;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n@media screen and (min-width: 48rem) {\n .Tiles--layout-default .Tiles-grid {\n --tiles-columns: 4;\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .Tiles--layout-default .Tiles-grid {\n --tiles-columns: 6;\n }\n}\n\n@media screen and (min-width: 48rem) {\n .Tiles--layout-compact .Tiles-grid {\n --tiles-columns: 4;\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .Tiles--layout-compact .Tiles-grid {\n --tiles-columns: 8;\n }\n}\n\n.Tiles--variant-gridlines ~~{\n position: relative;\n}\n\n~~.Tiles~~--variant~~-gridlines::before,\n.Tiles--variant-gridlines::after {\n content: '';\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n width: 100vw;\n height: 0;\n border-top: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.Tiles--variant-gridlines::before {\n top: 0;\n}\n\n.Tiles--variant-gridlines::after {\n bottom: 0;\n}\n\n.Tiles--variant-gridlines .Tiles-grid {\n position: relative;\n padding-right: var(--brand-borderWidth-thin);\n padding-bottom: var(--brand-borderWidth-thin);\n}\n\n.Tiles--variant-gridlines .Tiles-grid::before,\n.Tiles--variant-gridlines .Tiles-grid::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n width: 0;\n border-left: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n z-index: 1;\n pointer-events: none;\n}\n\n.Tiles--variant-gridlines .Tiles-grid::before {\n left: 0;\n}\n\n.Tiles--variant-gridlines .Tiles-grid::after {\n right: 0;\n}\n\n.Tiles-item {\n --tiles-inset-shadow: inset 0 0 0 transparent;\n position: relative;\n display: flex;\n flex-direction: column;\n width: calc(100% / var(--tiles-columns));\n box-sizing: border-box;\n background-color: var(--brand-tiles-bgColor-rest);\n border-top: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n border-left: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n box-shadow: var(--brand-borderWidth-thin) 0 0 0 var(--brand-color-border-muted),\n 0 var(--brand-borderWidth-thin) 0 0 var(--brand-color-border-muted), var(--tiles-inset-shadow);\n transition: background-color var(--brand-animation-duration-faster) var(--brand-animation-easing-default),\n box-shadow var(--brand-animation-duration-faster) var(--brand-animation-easing-default);\n}\n\n.Tiles-item:has(.Tiles-item-link):hover,\n.Tiles-item:has(.Tiles-item-link):focus-within {\n --tiles-inset-shadow: inset 0 var(--base-size-2) 0 var(--brand-tiles-highlightColor);\n background-color: var(--brand-tiles-bgColor-hover);\n}\n\n.Tiles-item-link {\n display: flex;\n width: 100%;\n flex: 1;\n text-decoration: none;\n color: inherit;\n}\n\n.Tiles-item-link:focus-visible {\n outline: var(--base-size-4) solid var(--brand-color-focus);\n outline-offset: calc(-1 * var(--base-size-4));\n border-radius: var(--brand-borderRadius-small);\n}\n\n.Tiles-item-content {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n aspect-ratio: 1;\n}\n\n.Tiles-item-media {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.Tiles-item-media svg,\n.Tiles-item-media img {\n width: auto;\n height: var(--base-size-40);\n max-width: 100%;\n}\n\n.Tiles--layout-compact .Tiles-item-media svg,\n.Tiles--layout-compact .Tiles-item-media img {\n height: var(--base-size-32);\n}\n\n.Tiles-item-label {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--base-size-4);\n padding: var(--base-size-12) var(--base-size-16);\n}\n\n.Tiles--layout-compact .Tiles-item-media {\n transition: transform var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n}\n\n.Tiles--layout-compact .Tiles-item-link:hover .Tiles-item-media,\n.Tiles--layout-compact .Tiles-item-link:focus-visible .Tiles-item-media {\n transform: translateY(calc(-1 * var(--base-size-4)));\n}\n\n.Tiles--layout-compact .Tiles-item-label {\n opacity: 0;\n transform: translateY(var(--base-size-4));\n transition: opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-default),\n transform var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n pointer-events: none;\n}\n\n.Tiles--layout-compact .Tiles-item-link:hover .Tiles-item-label,\n.Tiles--layout-compact .Tiles-item-link:focus-visible .Tiles-item-label {\n opacity: 1;\n transform: translateY(0);\n}\n\n.Tiles-item-name {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n}\n\n.Tiles-item-icon {\n flex-shrink: 0;\n color: var(--brand-color-text-default);\n}\n\n@media (prefers-reduced-motion: reduce) {\n .Tiles-item {\n transition: none;\n }\n\n .Tiles--layout-compact .Tiles-item-media {\n transition: none;\n }\n\n .Tiles--layout-compact .Tiles-item-label {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Tiles.module.js","names":[],"sources":["../../src/Tiles/Tiles.module.css"],"sourcesContent":[".Tiles {\n width: 100%;\n color: var(--brand-color-text-default);\n}\n\n.Tiles-grid {\n --tiles-columns: 2;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n@media screen and (min-width: 48rem) {\n .Tiles--layout-default .Tiles-grid {\n --tiles-columns: 4;\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .Tiles--layout-default .Tiles-grid {\n --tiles-columns: 6;\n }\n}\n\n@media screen and (min-width: 48rem) {\n .Tiles--layout-compact .Tiles-grid {\n --tiles-columns: 4;\n }\n}\n\n@media screen and (min-width: 63.25rem) {\n .Tiles--layout-compact .Tiles-grid {\n --tiles-columns: 8;\n }\n}\n\n.Tiles--variant-gridlines .Tiles-grid {\n position: relative;\n padding-right: var(--brand-borderWidth-thin);\n padding-bottom: var(--brand-borderWidth-thin);\n}\n\n.Tiles--variant-gridlines .Tiles-grid::before,\n.Tiles--variant-gridlines .Tiles-grid::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n width: 0;\n border-left: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n z-index: 1;\n pointer-events: none;\n}\n\n.Tiles--variant-gridlines .Tiles-grid::before {\n left: 0;\n}\n\n.Tiles--variant-gridlines .Tiles-grid::after {\n right: 0;\n}\n\n.Tiles-item {\n --tiles-inset-shadow: inset 0 0 0 transparent;\n position: relative;\n display: flex;\n flex-direction: column;\n width: calc(100% / var(--tiles-columns));\n box-sizing: border-box;\n background-color: var(--brand-tiles-bgColor-rest);\n border-top: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n border-left: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n box-shadow: var(--brand-borderWidth-thin) 0 0 0 var(--brand-color-border-muted),\n 0 var(--brand-borderWidth-thin) 0 0 var(--brand-color-border-muted), var(--tiles-inset-shadow);\n transition: background-color var(--brand-animation-duration-faster) var(--brand-animation-easing-default),\n box-shadow var(--brand-animation-duration-faster) var(--brand-animation-easing-default);\n}\n\n.Tiles-item:has(.Tiles-item-link):hover,\n.Tiles-item:has(.Tiles-item-link):focus-within {\n --tiles-inset-shadow: inset 0 var(--base-size-2) 0 var(--brand-tiles-highlightColor);\n background-color: var(--brand-tiles-bgColor-hover);\n}\n\n.Tiles-item-link {\n display: flex;\n width: 100%;\n flex: 1;\n text-decoration: none;\n color: inherit;\n}\n\n.Tiles-item-link:focus-visible {\n outline: var(--base-size-4) solid var(--brand-color-focus);\n outline-offset: calc(-1 * var(--base-size-4));\n border-radius: var(--brand-borderRadius-small);\n}\n\n.Tiles-item-content {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n aspect-ratio: 1;\n}\n\n.Tiles-item-media {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.Tiles-item-media svg,\n.Tiles-item-media img {\n width: auto;\n height: var(--base-size-40);\n max-width: 100%;\n}\n\n.Tiles--layout-compact .Tiles-item-media svg,\n.Tiles--layout-compact .Tiles-item-media img {\n height: var(--base-size-32);\n}\n\n.Tiles-item-label {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--base-size-4);\n padding: var(--base-size-12) var(--base-size-16);\n}\n\n.Tiles--layout-compact .Tiles-item-media {\n transition: transform var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n}\n\n.Tiles--layout-compact .Tiles-item-link:hover .Tiles-item-media,\n.Tiles--layout-compact .Tiles-item-link:focus-visible .Tiles-item-media {\n transform: translateY(calc(-1 * var(--base-size-4)));\n}\n\n.Tiles--layout-compact .Tiles-item-label {\n opacity: 0;\n transform: translateY(var(--base-size-4));\n transition: opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-default),\n transform var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n pointer-events: none;\n}\n\n.Tiles--layout-compact .Tiles-item-link:hover .Tiles-item-label,\n.Tiles--layout-compact .Tiles-item-link:focus-visible .Tiles-item-label {\n opacity: 1;\n transform: translateY(0);\n}\n\n.Tiles-item-name {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n}\n\n.Tiles-item-icon {\n flex-shrink: 0;\n color: var(--brand-color-text-default);\n}\n\n@media (prefers-reduced-motion: reduce) {\n .Tiles-item {\n transition: none;\n }\n\n .Tiles--layout-compact .Tiles-item-media {\n transition: none;\n }\n\n .Tiles--layout-compact .Tiles-item-label {\n transition: none;\n }\n}\n"],"mappings":""}

package/esm/component-helpers/shared.module-CrdMh7Vf.css ADDED Viewed

@@ -0,0 +1 @@

+ .Primer_Brand__shared-module__gridline___FDR_5{position:relative}.Primer_Brand__shared-module__gridline___FDR_5:before,.Primer_Brand__shared-module__gridline___FDR_5:after{content:"";border-top:var(--brand-borderWidth-thin) solid;-o-border-image:linear-gradient(var(--brand-color-border-muted), var(--brand-color-border-muted)) 1;border-image:linear-gradient(var(--brand-color-border-muted), var(--brand-color-border-muted)) 1;z-index:1;pointer-events:none;border-image-outset:0 100vw;height:0;position:absolute;left:0;right:0}.Primer_Brand__shared-module__gridline___FDR_5:before{top:0}.Primer_Brand__shared-module__gridline___FDR_5:after{bottom:0}

package/esm/component-helpers/shared.module.js ADDED Viewed

@@ -0,0 +1,5 @@
+import './shared.module-CrdMh7Vf.css';var e = { gridline: "Primer_Brand__shared-module__gridline___FDR_5" };
+//#endregion
+export { e as default };
+//# sourceMappingURL=shared.module.js.map

package/esm/component-helpers/shared.module.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"shared.module.js","names":[],"sources":["../../src/component-helpers/shared.module.css"],"sourcesContent":["/*\n * .gridline: horizontal gridlines that span the visible viewport, breaking\n * out of constrained-width parents. Uses border-image-outset to extend the\n * line visually without affecting layout or causing scrollbar overflow.\n */\n\n.gridline {\n position: relative;\n}\n\n.gridline::before,\n.gridline::after {\n content: '';\n position: absolute;\n left: 0;\n right: 0;\n height: 0;\n border-top: var(--brand-borderWidth-thin) solid;\n border-image: linear-gradient(var(--brand-color-border-muted), var(--brand-color-border-muted)) 1;\n border-image-outset: 0 100vw;\n z-index: 1;\n pointer-events: none;\n}\n\n.gridline::before {\n top: 0;\n}\n\n.gridline::after {\n bottom: 0;\n}\n"],"mappings":""}

package/esm/river/River/River.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"River.d.ts","sourceRoot":"","sources":["../../../src/river/River/River.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,iBAAiB,EAAoB,MAAM,OAAO,CAAA;AAE7E,OAAO,EAAU,KAAK,YAAY,EAAC,MAAM,eAAe,CAAA;AACxD,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,YAAY,CAAA;AAC/C,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,YAAY,CAAA;AAI/C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,yBAAyB,CAAA;AAEtD;;GAEG;AACH,OAAO,4FAA4F,CAAA;AACnG,OAAO,6FAA6F,CAAA;~~AAKpG~~,eAAO,MAAM,aAAa,kCAAmC,CAAA;AAC7D,eAAO,MAAM,YAAY,EAAG,UAAmB,CAAA;AAC/C,eAAO,MAAM,QAAQ,EAAG,UAAmB,CAAA;AAC3C,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAA;AAEzD,eAAO,MAAM,uBAAuB,kCAAmC,CAAA;AACvE,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,uBAAuB,CAAC,CAAC,MAAM,CAAC,CAAA;AAExE,MAAM,MAAM,UAAU,GAAG;IACvB;;;;;OAKG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,GAAG,iBAAiB,CAAC,EAAE,CAAA;IACpE;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;IAClC;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB,GAAG,SAAS,CAAC,WAAW,CAAC,GACxB,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAEnC,eAAO,MAAM,0BAA0B,UAAU,CAAA;AACjD,eAAO,MAAM,iBAAiB,UAAU,CAAA;AACxC,eAAO,MAAM,mBAAmB,EAAE,YAAwB,CAAA;~~AA2D1D~~,MAAM,MAAM,iBAAiB,GAAG,SAAS,CAAC,cAAc,CAAC,GAAG;IAC1D;;OAEG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAC3C;;OAEG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAClC;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAC1C;;;;;OAKG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,YAAY,GAAG,SAAS,GAAG,SAAS,CAAC,EAAE,CAAA;CACrG,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAExC,eAAO,MAAM,YAAY,uGA8FxB,CAAA;AAED,eAAO,MAAM,2BAA2B,gCAAiC,CAAA;AACzE,MAAM,MAAM,0BAA0B,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AAErF,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC,cAAc,CAAC,GACtD,KAAK,CAAC,kBAAkB,CAAC,cAAc,CAAC,GACxC,iBAAiB,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,oBAAoB,CAAC,EAAE,0BAA0B,CAAA;CAClD,CAAC,CAAA;AAEJ,eAAO,MAAM,MAAM,+HA8BlB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,KAAK;;;CAAuD,CAAA"}
1	+ {"version":3,"file":"River.d.ts","sourceRoot":"","sources":["../../../src/river/River/River.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,iBAAiB,EAAoB,MAAM,OAAO,CAAA;AAE7E,OAAO,EAAU,KAAK,YAAY,EAAC,MAAM,eAAe,CAAA;AACxD,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,YAAY,CAAA;AAC/C,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,YAAY,CAAA;AAI/C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,yBAAyB,CAAA;AAEtD;;GAEG;AACH,OAAO,4FAA4F,CAAA;AACnG,OAAO,6FAA6F,CAAA;AAMpG,eAAO,MAAM,aAAa,kCAAmC,CAAA;AAC7D,eAAO,MAAM,YAAY,EAAG,UAAmB,CAAA;AAC/C,eAAO,MAAM,QAAQ,EAAG,UAAmB,CAAA;AAC3C,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAA;AAEzD,eAAO,MAAM,uBAAuB,kCAAmC,CAAA;AACvE,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,uBAAuB,CAAC,CAAC,MAAM,CAAC,CAAA;AAExE,MAAM,MAAM,UAAU,GAAG;IACvB;;;;;OAKG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,GAAG,iBAAiB,CAAC,EAAE,CAAA;IACpE;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;IAClC;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB,GAAG,SAAS,CAAC,WAAW,CAAC,GACxB,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAEnC,eAAO,MAAM,0BAA0B,UAAU,CAAA;AACjD,eAAO,MAAM,iBAAiB,UAAU,CAAA;AACxC,eAAO,MAAM,mBAAmB,EAAE,YAAwB,CAAA;AA4D1D,MAAM,MAAM,iBAAiB,GAAG,SAAS,CAAC,cAAc,CAAC,GAAG;IAC1D;;OAEG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAC3C;;OAEG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAClC;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAC1C;;;;;OAKG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,YAAY,GAAG,SAAS,GAAG,SAAS,CAAC,EAAE,CAAA;CACrG,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAExC,eAAO,MAAM,YAAY,uGA8FxB,CAAA;AAED,eAAO,MAAM,2BAA2B,gCAAiC,CAAA;AACzE,MAAM,MAAM,0BAA0B,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AAErF,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC,cAAc,CAAC,GACtD,KAAK,CAAC,kBAAkB,CAAC,cAAc,CAAC,GACxC,iBAAiB,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,oBAAoB,CAAC,EAAE,0BAA0B,CAAA;CAClD,CAAC,CAAA;AAEJ,eAAO,MAAM,MAAM,+HA8BlB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,KAAK;;;CAAuD,CAAA"}