@primer/react-brand 0.72.0-rc.f8b72452 → 0.72.0

package/esm/Testimonial/Testimonial.js

@@ -87,7 +87,7 @@ function S({ children: t, ...n }, r) {
 		children: c.Children.map(t, (t) => {
 			if (c.isValidElement(t) && t.type === "img") {
 				let n = t, i = {
-					className: e(s["Testimonial-logo-image"]),
+					className: e(s["Testimonial-logo-image"], n.props.className),
 					ref: r
 				};
 				return c.cloneElement(n, i);

package/esm/Testimonial/Testimonial.js.map

@@ -1 +1 @@
-{"version":3,"file":"Testimonial.js","names":[],"sources":["../../src/Testimonial/Testimonial.tsx"],"sourcesContent":["import React, {\n  HTMLAttributes,\n  PropsWithChildren,\n  forwardRef,\n  SVGProps,\n  CSSProperties,\n  ComponentPropsWithRef,\n} from 'react'\nimport {clsx} from 'clsx'\nimport {BaseProps} from '../component-helpers'\nimport {Text, Avatar as BaseAvatar, useAnimation} from '../'\nimport type {AvatarProps} from '../'\nimport {Link, type LinkProps} from '../Link'\n\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/testimonial/base.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/testimonial/colors-with-modes.css'\n\nimport styles from './Testimonial.module.css'\nimport {Colors, BiColorGradients} from '../constants'\n\ntype TestimonialSize = 'small' | 'large'\n\nexport const TestimonialQuoteMarkColors = [...Colors, ...BiColorGradients] as const\nexport const defaultQuoteMarkColor = TestimonialQuoteMarkColors[0]\n\nexport const TestimonialVariants = ['subtle', 'default', 'minimal', 'expressive'] as const\ntype TestimonialVariant = (typeof TestimonialVariants)[number]\nexport const defaultTestimonialVariant: TestimonialVariant = 'minimal'\n\nexport type TestimonialProps = {\n  /**\n   * Sets alternative appearance for the testimonial\n   */\n  variant?: TestimonialVariant\n  /**\n   * Applies an optional border where a variant supports it\n   */\n  hasBorder?: boolean\n  /**\n   * Valid children include Testimonial.Name, Testimonial.Avatar, and Testimonial.Name\n   */\n  children:\n    | React.ReactNode\n    | React.ReactElement<QuoteProps>\n    | React.ReactElement<NameProps>\n    | React.ReactElement<AvatarProps>\n    | React.ReactElement<LogoProps>[]\n  /**\n   * Sets the testimonial text size\n   */\n  size?: TestimonialSize\n  /** Sets the color of the quote mark */\n  quoteMarkColor?: (typeof TestimonialQuoteMarkColors)[number]\n} & BaseProps<HTMLElement> &\n  React.HTMLAttributes<HTMLElement>\n\n/**\n * Testimonial parent element\n * <Testimonial>\n */\nfunction TestimonialBase(\n  {\n    quoteMarkColor,\n    animate,\n    className,\n    children,\n    variant = 'minimal',\n    hasBorder = true,\n    size,\n    style,\n    ...rest\n  }: PropsWithChildren<TestimonialProps>,\n  ref,\n) {\n  const {classes: animationClasses, styles: animationInlineStyles} = useAnimation(animate)\n\n  const resolvedQuoteMarkColor = quoteMarkColor ?? (variant === 'expressive' ? 'green' : 'default')\n\n  const quoteMark = (\n    <div\n      aria-hidden=\"true\"\n      className={clsx(\n        styles['Testimonial__quoteMark'],\n        styles[`Testimonial__quoteMark--${resolvedQuoteMarkColor}`],\n        variant === 'expressive' && styles['Testimonial__quoteMark--hasBackground'],\n      )}\n    >\n      <span className={styles['Testimonial__quoteMarkGlyph']}>&ldquo;</span>\n    </div>\n  )\n\n  const childrenArray = React.Children.toArray(children)\n  const findChild = (type: React.ElementType) =>\n    childrenArray.find(child => React.isValidElement(child) && child.type === type)\n\n  const quoteChild = findChild(Quote)\n  const actionChild = findChild(_Link)\n  const avatarChild = findChild(Avatar)\n  const logoChild = findChild(Logo)\n  const nameChild = findChild(Name)\n\n  return (\n    <figure\n      ref={ref}\n      className={clsx(\n        animationClasses,\n        styles['Testimonial'],\n        styles[`Testimonial--variant-${variant}`],\n        size && styles[`Testimonial--size-${size}`],\n        hasBorder && styles['Testimonial--border'],\n        className,\n      )}\n      style={{\n        ...animationInlineStyles,\n        ...style,\n        ['--testimonial-accent-color' as keyof CSSProperties]: resolvedQuoteMarkColor,\n      }}\n      {...rest}\n    >\n      <div className={styles['Testimonial__quoteWrapper']}>\n        {quoteMark}\n        {quoteChild}\n        {actionChild}\n      </div>\n      <div className={styles['Testimonial__media']}>\n        {avatarChild}\n        {logoChild}\n        {nameChild}\n      </div>\n    </figure>\n  )\n}\n\nconst Root = forwardRef(TestimonialBase)\n\n/**\n * Testimonial quote child element\n * <Testimonial.Quote>\n */\ntype QuoteProps = React.HTMLAttributes<HTMLElement> & BaseProps<HTMLElement>\n\nfunction QuoteBase({children, className}: QuoteProps, ref) {\n  return (\n    <blockquote ref={ref}>\n      <Text className={clsx(styles['Testimonial-quote'], className)}>{children}</Text>\n    </blockquote>\n  )\n}\n\nconst Quote = forwardRef(QuoteBase)\n\n/**\n * Testimonial name child element\n * <Testimonial.Name>\n */\ntype NameProps = {\n  position?: string\n} & React.HTMLAttributes<HTMLElement> &\n  BaseProps<HTMLElement>\n\nfunction _Name({children, className, position}: NameProps, ref) {\n  return (\n    <figcaption ref={ref} className={clsx(styles['Testimonial-caption'], className)}>\n      <Text size=\"200\" className={clsx(styles['Testimonial-from'])} font=\"monospace\">\n        {children}\n      </Text>\n      {position && (\n        <Text size=\"200\" className={clsx(styles['Testimonial-position'])} variant=\"muted\">\n          {position}\n        </Text>\n      )}\n    </figcaption>\n  )\n}\n\nconst Name = forwardRef(_Name)\n\n/**\n * Testimonial logo child element\n * <Testimonial.Logo>\n */\ntype LogoProps = {\n  children: React.ReactElement<SVGProps<SVGSVGElement>> | React.ReactElement<HTMLAttributes<HTMLImageElement>>\n} & React.HTMLAttributes<HTMLImageElement> &\n  BaseProps<HTMLImageElement>\n\nfunction _Logo({children, ...rest}: LogoProps, ref) {\n  return (\n    <div className={styles['Testimonial-logo']} {...rest}>\n      {React.Children.map(children, child => {\n        if (React.isValidElement(child)) {\n          if (child.type === 'img') {\n            const imageChild = child as React.ReactElement<ComponentPropsWithRef<'img'>>\n            const imageProps: ComponentPropsWithRef<'img'> = {\n              className: clsx(styles['Testimonial-logo-image']),\n              ref: ref as ComponentPropsWithRef<'img'>['ref'],\n            }\n\n            return React.cloneElement(imageChild, imageProps)\n          }\n        }\n      })}\n    </div>\n  )\n}\n\nconst Logo = forwardRef(_Logo)\n\n/**\n * Testimonial avatar child element\n * <Testimonial.Avatar>\n */\n\nfunction _Avatar({size, ...rest}: AvatarProps) {\n  return <BaseAvatar className={clsx(styles['Testimonial-avatar'])} size={48} {...rest} />\n}\n\nconst Avatar = _Avatar\n\n/**\n * Testimonial link child element\n * <Testimonial.Link>\n */\nfunction _LinkBase({className, ...rest}: LinkProps, _ref) {\n  return <Link className={clsx(styles['Testimonial-link'], className)} {...rest} size=\"medium\" variant=\"accent\" />\n}\n\nconst _Link = forwardRef(_LinkBase)\n\n/**\n * Use Testimonial to display a quote from a customer or user.\n * @see https://primer.style/brand/components/Testimonial\n */\nexport const Testimonial = Object.assign(Root, {\n  Quote,\n  Name,\n  Avatar,\n  Logo,\n  Link: _Link,\n})\n"],"mappings":"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"}
+{"version":3,"file":"Testimonial.js","names":[],"sources":["../../src/Testimonial/Testimonial.tsx"],"sourcesContent":["import React, {\n  HTMLAttributes,\n  PropsWithChildren,\n  forwardRef,\n  SVGProps,\n  CSSProperties,\n  ComponentPropsWithRef,\n} from 'react'\nimport {clsx} from 'clsx'\nimport {BaseProps} from '../component-helpers'\nimport {Text, Avatar as BaseAvatar, useAnimation} from '../'\nimport type {AvatarProps} from '../'\nimport {Link, type LinkProps} from '../Link'\n\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/testimonial/base.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/testimonial/colors-with-modes.css'\n\nimport styles from './Testimonial.module.css'\nimport {Colors, BiColorGradients} from '../constants'\n\ntype TestimonialSize = 'small' | 'large'\n\nexport const TestimonialQuoteMarkColors = [...Colors, ...BiColorGradients] as const\nexport const defaultQuoteMarkColor = TestimonialQuoteMarkColors[0]\n\nexport const TestimonialVariants = ['subtle', 'default', 'minimal', 'expressive'] as const\ntype TestimonialVariant = (typeof TestimonialVariants)[number]\nexport const defaultTestimonialVariant: TestimonialVariant = 'minimal'\n\nexport type TestimonialProps = {\n  /**\n   * Sets alternative appearance for the testimonial\n   */\n  variant?: TestimonialVariant\n  /**\n   * Applies an optional border where a variant supports it\n   */\n  hasBorder?: boolean\n  /**\n   * Valid children include Testimonial.Name, Testimonial.Avatar, and Testimonial.Name\n   */\n  children:\n    | React.ReactNode\n    | React.ReactElement<QuoteProps>\n    | React.ReactElement<NameProps>\n    | React.ReactElement<AvatarProps>\n    | React.ReactElement<LogoProps>[]\n  /**\n   * Sets the testimonial text size\n   */\n  size?: TestimonialSize\n  /** Sets the color of the quote mark */\n  quoteMarkColor?: (typeof TestimonialQuoteMarkColors)[number]\n} & BaseProps<HTMLElement> &\n  React.HTMLAttributes<HTMLElement>\n\n/**\n * Testimonial parent element\n * <Testimonial>\n */\nfunction TestimonialBase(\n  {\n    quoteMarkColor,\n    animate,\n    className,\n    children,\n    variant = 'minimal',\n    hasBorder = true,\n    size,\n    style,\n    ...rest\n  }: PropsWithChildren<TestimonialProps>,\n  ref,\n) {\n  const {classes: animationClasses, styles: animationInlineStyles} = useAnimation(animate)\n\n  const resolvedQuoteMarkColor = quoteMarkColor ?? (variant === 'expressive' ? 'green' : 'default')\n\n  const quoteMark = (\n    <div\n      aria-hidden=\"true\"\n      className={clsx(\n        styles['Testimonial__quoteMark'],\n        styles[`Testimonial__quoteMark--${resolvedQuoteMarkColor}`],\n        variant === 'expressive' && styles['Testimonial__quoteMark--hasBackground'],\n      )}\n    >\n      <span className={styles['Testimonial__quoteMarkGlyph']}>&ldquo;</span>\n    </div>\n  )\n\n  const childrenArray = React.Children.toArray(children)\n  const findChild = (type: React.ElementType) =>\n    childrenArray.find(child => React.isValidElement(child) && child.type === type)\n\n  const quoteChild = findChild(Quote)\n  const actionChild = findChild(_Link)\n  const avatarChild = findChild(Avatar)\n  const logoChild = findChild(Logo)\n  const nameChild = findChild(Name)\n\n  return (\n    <figure\n      ref={ref}\n      className={clsx(\n        animationClasses,\n        styles['Testimonial'],\n        styles[`Testimonial--variant-${variant}`],\n        size && styles[`Testimonial--size-${size}`],\n        hasBorder && styles['Testimonial--border'],\n        className,\n      )}\n      style={{\n        ...animationInlineStyles,\n        ...style,\n        ['--testimonial-accent-color' as keyof CSSProperties]: resolvedQuoteMarkColor,\n      }}\n      {...rest}\n    >\n      <div className={styles['Testimonial__quoteWrapper']}>\n        {quoteMark}\n        {quoteChild}\n        {actionChild}\n      </div>\n      <div className={styles['Testimonial__media']}>\n        {avatarChild}\n        {logoChild}\n        {nameChild}\n      </div>\n    </figure>\n  )\n}\n\nconst Root = forwardRef(TestimonialBase)\n\n/**\n * Testimonial quote child element\n * <Testimonial.Quote>\n */\ntype QuoteProps = React.HTMLAttributes<HTMLElement> & BaseProps<HTMLElement>\n\nfunction QuoteBase({children, className}: QuoteProps, ref) {\n  return (\n    <blockquote ref={ref}>\n      <Text className={clsx(styles['Testimonial-quote'], className)}>{children}</Text>\n    </blockquote>\n  )\n}\n\nconst Quote = forwardRef(QuoteBase)\n\n/**\n * Testimonial name child element\n * <Testimonial.Name>\n */\ntype NameProps = {\n  position?: string\n} & React.HTMLAttributes<HTMLElement> &\n  BaseProps<HTMLElement>\n\nfunction _Name({children, className, position}: NameProps, ref) {\n  return (\n    <figcaption ref={ref} className={clsx(styles['Testimonial-caption'], className)}>\n      <Text size=\"200\" className={clsx(styles['Testimonial-from'])} font=\"monospace\">\n        {children}\n      </Text>\n      {position && (\n        <Text size=\"200\" className={clsx(styles['Testimonial-position'])} variant=\"muted\">\n          {position}\n        </Text>\n      )}\n    </figcaption>\n  )\n}\n\nconst Name = forwardRef(_Name)\n\n/**\n * Testimonial logo child element\n * <Testimonial.Logo>\n */\ntype LogoProps = {\n  children: React.ReactElement<SVGProps<SVGSVGElement>> | React.ReactElement<HTMLAttributes<HTMLImageElement>>\n} & React.HTMLAttributes<HTMLImageElement> &\n  BaseProps<HTMLImageElement>\n\nfunction _Logo({children, ...rest}: LogoProps, ref) {\n  return (\n    <div className={styles['Testimonial-logo']} {...rest}>\n      {React.Children.map(children, child => {\n        if (React.isValidElement(child)) {\n          if (child.type === 'img') {\n            const imageChild = child as React.ReactElement<ComponentPropsWithRef<'img'>>\n            const imageProps: ComponentPropsWithRef<'img'> = {\n              className: clsx(styles['Testimonial-logo-image'], imageChild.props.className),\n              ref: ref as ComponentPropsWithRef<'img'>['ref'],\n            }\n\n            return React.cloneElement(imageChild, imageProps)\n          }\n        }\n      })}\n    </div>\n  )\n}\n\nconst Logo = forwardRef(_Logo)\n\n/**\n * Testimonial avatar child element\n * <Testimonial.Avatar>\n */\n\nfunction _Avatar({size, ...rest}: AvatarProps) {\n  return <BaseAvatar className={clsx(styles['Testimonial-avatar'])} size={48} {...rest} />\n}\n\nconst Avatar = _Avatar\n\n/**\n * Testimonial link child element\n * <Testimonial.Link>\n */\nfunction _LinkBase({className, ...rest}: LinkProps, _ref) {\n  return <Link className={clsx(styles['Testimonial-link'], className)} {...rest} size=\"medium\" variant=\"accent\" />\n}\n\nconst _Link = forwardRef(_LinkBase)\n\n/**\n * Use Testimonial to display a quote from a customer or user.\n * @see https://primer.style/brand/components/Testimonial\n */\nexport const Testimonial = Object.assign(Root, {\n  Quote,\n  Name,\n  Avatar,\n  Logo,\n  Link: _Link,\n})\n"],"mappings":"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"}

package/esm/Testimonial/Testimonial.module-BEBpUSD7.css

@@ -0,0 +1 @@
+.Primer_Brand__Testimonial-module__Testimonial___kxB6R{color:var(--brand-color-text-default);font-family:var(--brand-fontStack-sansSerif)}.Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe,.Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S{border-radius:var(--brand-borderRadius-xlarge);padding:var(--base-size-48) var(--base-size-32);position:relative}@media screen and (width>=48rem){.Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe,.Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S{padding:var(--base-size-48)}}@media screen and (width>=63.25rem){.Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe.Primer_Brand__Testimonial-module__Testimonial--size-large___NH7Vg,.Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S.Primer_Brand__Testimonial-module__Testimonial--size-large___NH7Vg{padding:var(--base-size-96) var(--base-size-128)}}.Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe{background-color:var(--brand-color-canvas-subtle)}.Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S{background-color:var(--brand-color-canvas-default)}.Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe:before,.Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S:before{pointer-events:none;content:"";border-radius:inherit;position:absolute;inset:0}.Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe.Primer_Brand__Testimonial-module__Testimonial--border___pbUPS:before{-webkit-mask-image:var(--brand-Testimonial-borderMask-subtle);-webkit-mask-image:var(--brand-Testimonial-borderMask-subtle);mask-image:var(--brand-Testimonial-borderMask-subtle);border:var(--brand-borderWidth-thin) solid var(--brand-color-border-default)}.Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S.Primer_Brand__Testimonial-module__Testimonial--border___pbUPS:before{-webkit-mask-image:var(--brand-Testimonial-borderMask-default);-webkit-mask-image:var(--brand-Testimonial-borderMask-default);mask-image:var(--brand-Testimonial-borderMask-default);border:var(--brand-borderWidth-thin) solid var(--brand-color-border-default)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark___sC3I2{--brand-Testimonial-quoteMarkColor-gradient:radial-gradient(circle at top left, var(--brand-Testimonial-quoteMarkColor-start), var(--brand-Testimonial-quoteMarkColor-end));--brand-Testimonial-quoteMarkColor-background:var(--brand-Testimonial-quoteMarkColor-gradient,var(--brand-Testimonial-quoteMarkColor,currentColor));color:var(--brand-Testimonial-quoteMarkColor-start,var(--brand-Testimonial-quoteMarkColor,currentColor));font-size:var(--base-size-48);line-height:var(--base-size-48);font-weight:var(--base-text-weight-extrabold);position:relative}.Primer_Brand__Testimonial-module__Testimonial__quoteMark___sC3I2:before{content:"";background:var(--brand-Testimonial-quoteMarkColor-background);-webkit-mask:linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box, linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));-webkit-mask:linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box, linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));mask:linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box, linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));-webkit-mask-composite:xor;position:absolute;inset:0;-webkit-mask-composite:xor;mask-composite:exclude}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--hasBackground___AUVX2{width:calc(var(--base-size-48) + var(--base-size-8));height:calc(var(--base-size-48) + var(--base-size-8));border-radius:var(--base-size-12);background-color:var(--brand-Testimonial-quoteMarkBackground,var(--base-color-scale-gray-0));font-size:var(--base-size-64);justify-content:center;align-items:center;line-height:1;display:inline-flex}.Primer_Brand__Testimonial-module__Testimonial--size-large___NH7Vg .Primer_Brand__Testimonial-module__Testimonial__quoteMark___sC3I2:not(.Primer_Brand__Testimonial-module__Testimonial__quoteMark--hasBackground___AUVX2){font-size:7.5rem;line-height:1}.Primer_Brand__Testimonial-module__Testimonial__quoteMarkGlyph___1eZ5L{display:block}.Primer_Brand__Testimonial-module__Testimonial-quote___xbxri{font-family:var(--brand-fontStack-sansSerif);font-size:var(--brand-Testimonial-quote-fontSize-default);font-weight:var(--brand-Testimonial-quote-fontWeight-default);letter-spacing:var(--brand-Testimonial-quote-letterSpacing-default);line-height:1.2;display:block}.Primer_Brand__Testimonial-module__Testimonial--size-large___NH7Vg .Primer_Brand__Testimonial-module__Testimonial-quote___xbxri{font-size:var(--brand-Testimonial-quote-fontSize-large);font-weight:var(--brand-Testimonial-quote-fontWeight-large);letter-spacing:var(--brand-Testimonial-quote-letterSpacing-large)}.Primer_Brand__Testimonial-module__Testimonial-quote___xbxri em,.Primer_Brand__Testimonial-module__Testimonial-quote___xbxri b{color:var(--brand-Testimonial-quote-color-emphasis);font-style:normal;font-weight:inherit}.Primer_Brand__Testimonial-module__Testimonial__media___rvn7k{gap:var(--base-size-16);margin-top:var(--base-size-24);align-items:center;display:flex}.Primer_Brand__Testimonial-module__Testimonial-logo-image___rpGVd{display:block}.Primer_Brand__Testimonial-module__Testimonial--size-large___NH7Vg .Primer_Brand__Testimonial-module__Testimonial__media___rvn7k{margin-top:var(--base-size-64)}.Primer_Brand__Testimonial-module__Testimonial-caption___8c_KF{flex-direction:column;display:flex}.Primer_Brand__Testimonial-module__Testimonial-avatar___kWqMQ{flex:none}.Primer_Brand__Testimonial-module__Testimonial-from___XLpqj{font-weight:var(--base-text-weight-normal);text-transform:uppercase}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY{gap:var(--base-size-48);flex-direction:column;display:flex}@media screen and (width>=48rem){.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY{align-items:flex-end;gap:var(--base-size-96);flex-direction:row}}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial__quoteWrapper___vcgUf{align-items:flex-start;gap:var(--base-size-24);flex-direction:column;flex:1 1 0;min-width:0;display:flex}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial__media___rvn7k{align-items:flex-start;gap:var(--base-size-24);flex-direction:column;flex:none;margin-block-start:0}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial-caption___8c_KF{border-block-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-default);gap:var(--base-size-8);width:100%;padding-block-start:var(--base-size-24)}@media screen and (width>=48rem){.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial__media___rvn7k{min-width:240px;max-width:320px}}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial-from___XLpqj{align-items:center;gap:var(--base-size-8);font-family:var(--brand-fontStack-monospace);font-weight:var(--base-text-weight-medium);text-transform:uppercase;letter-spacing:.01em;display:flex}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial-from___XLpqj:before{content:"";background-color:var(--testimonial-accent-color,var(--brand-Testimonial-quoteMarkColor-default));flex-shrink:0;width:9px;height:14px;display:inline-block}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial__quoteMark___sC3I2{font-family:var(--brand-fontStack-monospace);font-weight:var(--brand-fontWeight-300)}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial__quoteMarkGlyph___1eZ5L{transform:translateY(var(--base-size-12))}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial__quoteMark___sC3I2:not(.Primer_Brand__Testimonial-module__Testimonial__quoteMark--hasBackground___AUVX2){margin-left:-.18em}.Primer_Brand__Testimonial-module__Testimonial--variant-expressive___J1PIY .Primer_Brand__Testimonial-module__Testimonial-quote___xbxri{font-family:var(--brand-fontStack-monospace);line-height:var(--brand-text-lineHeight-400);font-weight:var(--base-text-weight-normal)}.Primer_Brand__Testimonial-module__Testimonial-link___kK8cZ{margin-top:var(--base-size-8)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--default___wRFiA{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-default);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-default)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--blue___65lEG{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-blue);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-blue)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--blue-purple___HZ6wp{--brand-Testimonial-quoteMarkColor-start:var(--brand-Testimonial-quoteMarkColor-blue-purple-start);--brand-Testimonial-quoteMarkColor-end:var(--brand-Testimonial-quoteMarkColor-blue-purple-end);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-blue-purple)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--coral___zCLpT{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-coral);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-coral)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--green___zmlvZ{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-green);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-green)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--green-blue___Q0gxM{--brand-Testimonial-quoteMarkColor-start:var(--brand-Testimonial-quoteMarkColor-green-blue-start);--brand-Testimonial-quoteMarkColor-end:var(--brand-Testimonial-quoteMarkColor-green-blue-end);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-green-blue)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--gray___18cS4{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-gray);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-gray)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--indigo___GDdwu{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-indigo);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-indigo)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--lemon___SbBQ4{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-lemon);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-lemon)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--lime___jzEWj{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-lime);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-lime)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--orange___Mk2Ix{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-orange);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-orange)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--pink____Y7MC{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-pink);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-pink)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--pink-blue___VQftN{--brand-Testimonial-quoteMarkColor-start:var(--brand-Testimonial-quoteMarkColor-pink-blue-start);--brand-Testimonial-quoteMarkColor-end:var(--brand-Testimonial-quoteMarkColor-pink-blue-end);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-pink-blue)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--purple___TMw0P{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-purple);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-purple)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--purple-red___f1bgK{--brand-Testimonial-quoteMarkColor-start:var(--brand-Testimonial-quoteMarkColor-purple-red-start);--brand-Testimonial-quoteMarkColor-end:var(--brand-Testimonial-quoteMarkColor-purple-red-end);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-purple-red)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--red___rbO_z{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-red);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-red)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--red-orange___pm_dh{--brand-Testimonial-quoteMarkColor-start:var(--brand-Testimonial-quoteMarkColor-red-orange-start);--brand-Testimonial-quoteMarkColor-end:var(--brand-Testimonial-quoteMarkColor-red-orange-end);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-red-orange)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--teal___S_1eT{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-teal);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-teal)}.Primer_Brand__Testimonial-module__Testimonial__quoteMark--yellow___W8v__{--brand-Testimonial-quoteMarkColor:var(--brand-Testimonial-quoteMarkColor-yellow);--brand-Testimonial-quoteMarkBackground:var(--brand-Testimonial-quoteMarkBackground-yellow)}

package/esm/Testimonial/Testimonial.module.js

@@ -1,4 +1,4 @@
-import './Testimonial.module-DRCosU_J.css';var e = {
+import './Testimonial.module-BEBpUSD7.css';var e = {
 	Testimonial: "Primer_Brand__Testimonial-module__Testimonial___kxB6R",
 	"Testimonial--variant-subtle": "Primer_Brand__Testimonial-module__Testimonial--variant-subtle___rmjBe",
 	"Testimonial--variant-default": "Primer_Brand__Testimonial-module__Testimonial--variant-default___uNm5S",
@@ -9,6 +9,7 @@ import './Testimonial.module-DRCosU_J.css';var e = {
 	Testimonial__quoteMarkGlyph: "Primer_Brand__Testimonial-module__Testimonial__quoteMarkGlyph___1eZ5L",
 	"Testimonial-quote": "Primer_Brand__Testimonial-module__Testimonial-quote___xbxri",
 	Testimonial__media: "Primer_Brand__Testimonial-module__Testimonial__media___rvn7k",
+	"Testimonial-logo-image": "Primer_Brand__Testimonial-module__Testimonial-logo-image___rpGVd",
 	"Testimonial-caption": "Primer_Brand__Testimonial-module__Testimonial-caption___8c_KF",
 	"Testimonial-avatar": "Primer_Brand__Testimonial-module__Testimonial-avatar___kWqMQ",
 	"Testimonial-from": "Primer_Brand__Testimonial-module__Testimonial-from___XLpqj",

package/esm/Testimonial/Testimonial.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Testimonial.module.js","names":[],"sources":["../../src/Testimonial/Testimonial.module.css"],"sourcesContent":[".Testimonial {\n  color: var(--brand-color-text-default);\n  font-family: var(--brand-fontStack-sansSerif);\n}\n\n.Testimonial--variant-subtle,\n.Testimonial--variant-default {\n  position: relative;\n  border-radius: var(--brand-borderRadius-xlarge);\n  padding: var(--base-size-48) var(--base-size-32);\n}\n\n@media screen and (min-width: 48rem) {\n  .Testimonial--variant-subtle,\n  .Testimonial--variant-default {\n    padding: var(--base-size-48);\n  }\n}\n\n@media screen and (min-width: 63.25rem) {\n  .Testimonial--variant-subtle.Testimonial--size-large,\n  .Testimonial--variant-default.Testimonial--size-large {\n    padding: var(--base-size-96) var(--base-size-128);\n  }\n}\n\n.Testimonial--variant-subtle {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.Testimonial--variant-default {\n  background-color: var(--brand-color-canvas-default);\n}\n\n.Testimonial--variant-subtle::before,\n.Testimonial--variant-default::before {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  pointer-events: none;\n  content: '';\n  border-radius: inherit;\n}\n\n.Testimonial--variant-subtle.Testimonial--border::before {\n  mask-image: var(--brand-Testimonial-borderMask-subtle);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);\n}\n\n.Testimonial--variant-default.Testimonial--border::before {\n  mask-image: var(--brand-Testimonial-borderMask-default);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);\n}\n\n.Testimonial__quoteMark {\n  --brand-Testimonial-quoteMarkColor-gradient: radial-gradient(\n    circle at top left,\n    var(--brand-Testimonial-quoteMarkColor-start),\n    var(--brand-Testimonial-quoteMarkColor-end)\n  );\n  --brand-Testimonial-quoteMarkColor-background: var(\n    --brand-Testimonial-quoteMarkColor-gradient,\n    var(--brand-Testimonial-quoteMarkColor, currentColor)\n  );\n  color: var(--brand-Testimonial-quoteMarkColor-start, var(--brand-Testimonial-quoteMarkColor, currentColor));\n  font-size: var(--base-size-48);\n  line-height: var(--base-size-48);\n  font-weight: var(--base-text-weight-extrabold);\n  position: relative;\n}\n\n.Testimonial__quoteMark::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background: var(--brand-Testimonial-quoteMarkColor-background);\n  -webkit-mask: linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box,\n    linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));\n  mask: linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box,\n    linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));\n  -webkit-mask-composite: xor;\n  mask-composite: exclude;\n}\n\n.Testimonial__quoteMark--hasBackground {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: calc(var(--base-size-48) + var(--base-size-8));\n  height: calc(var(--base-size-48) + var(--base-size-8));\n  border-radius: var(--base-size-12);\n  background-color: var(--brand-Testimonial-quoteMarkBackground, var(--base-color-scale-gray-0));\n  font-size: var(--base-size-64);\n  line-height: 1;\n}\n\n.Testimonial--size-large .Testimonial__quoteMark:not(.Testimonial__quoteMark--hasBackground) {\n  font-size: 7.5rem; /* 120px */\n  line-height: 1;\n}\n\n.Testimonial__quoteMarkGlyph {\n  display: block;\n}\n\n.Testimonial-quote {\n  font-family: var(--brand-fontStack-sansSerif);\n  font-size: var(--brand-Testimonial-quote-fontSize-default);\n  font-weight: var(--brand-Testimonial-quote-fontWeight-default);\n  letter-spacing: var(--brand-Testimonial-quote-letterSpacing-default);\n  line-height: 1.2; /* requires custom line-height */\n  display: block;\n}\n\n.Testimonial--size-large .Testimonial-quote {\n  font-size: var(--brand-Testimonial-quote-fontSize-large);\n  font-weight: var(--brand-Testimonial-quote-fontWeight-large);\n  letter-spacing: var(--brand-Testimonial-quote-letterSpacing-large);\n}\n\n.Testimonial-quote em,\n.Testimonial-quote b {\n  color: var(--brand-Testimonial-quote-color-emphasis);\n  font-style: normal;\n  font-weight: inherit;\n}\n\n.Testimonial__media {\n  display: flex;\n  gap: var(--base-size-16);\n  align-items: center;\n  margin-top: var(--base-size-24);\n}\n\n.Testimonial--size-large .Testimonial__media {\n  margin-top: var(--base-size-64);\n}\n\n.Testimonial-caption {\n  display: flex;\n  flex-direction: column;\n}\n\n.Testimonial-avatar {\n  flex: none;\n}\n\n.Testimonial-from {\n  font-weight: var(--base-text-weight-normal);\n  text-transform: uppercase;\n}\n\n/* Expressive variant */\n.Testimonial--variant-expressive {\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-size-48);\n}\n\n@media screen and (min-width: 48rem) {\n  .Testimonial--variant-expressive {\n    flex-direction: row;\n    align-items: flex-end;\n    gap: var(--base-size-96);\n  }\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteWrapper {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--base-size-24);\n  flex: 1 1 0;\n  min-width: 0;\n}\n\n.Testimonial--variant-expressive .Testimonial__media {\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--base-size-24);\n  margin-block-start: 0;\n  flex: 0 0 auto;\n}\n\n.Testimonial--variant-expressive .Testimonial-caption {\n  border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);\n  padding-block-start: var(--base-size-24);\n  width: 100%;\n  gap: var(--base-size-8);\n}\n\n@media screen and (min-width: 48rem) {\n  .Testimonial--variant-expressive .Testimonial__media {\n    min-width: 240px;\n    max-width: 320px;\n  }\n}\n\n.Testimonial--variant-expressive .Testimonial-from {\n  display: flex;\n  align-items: center;\n  gap: var(--base-size-8);\n  font-family: var(--brand-fontStack-monospace);\n  font-weight: var(--base-text-weight-medium);\n  text-transform: uppercase;\n  letter-spacing: 0.01em;\n}\n\n.Testimonial--variant-expressive .Testimonial-from::before {\n  content: '';\n  display: inline-block;\n  width: 9px;\n  height: 14px;\n  background-color: var(--testimonial-accent-color, var(--brand-Testimonial-quoteMarkColor-default));\n  flex-shrink: 0;\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteMark {\n  font-family: var(--brand-fontStack-monospace);\n  font-weight: var(--brand-fontWeight-300);\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteMarkGlyph {\n  transform: translateY(var(--base-size-12));\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteMark:not(.Testimonial__quoteMark--hasBackground) {\n  margin-left: -0.18em;\n}\n\n.Testimonial--variant-expressive .Testimonial-quote {\n  font-family: var(--brand-fontStack-monospace);\n  line-height: var(--brand-text-lineHeight-400);\n  font-weight: var(--base-text-weight-normal);\n}\n\n.Testimonial-link {\n  margin-top: var(--base-size-8);\n}\n\n.Testimonial__quoteMark--default {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-default);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-default);\n}\n\n.Testimonial__quoteMark--blue {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-blue);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-blue);\n}\n\n.Testimonial__quoteMark--blue-purple {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-blue-purple-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-blue-purple-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-blue-purple);\n}\n\n.Testimonial__quoteMark--coral {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-coral);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-coral);\n}\n\n.Testimonial__quoteMark--green {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-green);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-green);\n}\n\n.Testimonial__quoteMark--green-blue {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-green-blue-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-green-blue-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-green-blue);\n}\n\n.Testimonial__quoteMark--gray {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-gray);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-gray);\n}\n\n.Testimonial__quoteMark--indigo {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-indigo);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-indigo);\n}\n\n.Testimonial__quoteMark--lemon {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-lemon);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-lemon);\n}\n\n.Testimonial__quoteMark--lime {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-lime);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-lime);\n}\n\n.Testimonial__quoteMark--orange {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-orange);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-orange);\n}\n\n.Testimonial__quoteMark--pink {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-pink);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-pink);\n}\n\n.Testimonial__quoteMark--pink-blue {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-pink-blue-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-pink-blue-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-pink-blue);\n}\n\n.Testimonial__quoteMark--purple {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-purple);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-purple);\n}\n\n.Testimonial__quoteMark--purple-red {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-purple-red-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-purple-red-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-purple-red);\n}\n\n.Testimonial__quoteMark--red {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-red);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-red);\n}\n\n.Testimonial__quoteMark--red-orange {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-red-orange-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-red-orange-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-red-orange);\n}\n\n.Testimonial__quoteMark--teal {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-teal);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-teal);\n}\n\n.Testimonial__quoteMark--yellow {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-yellow);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-yellow);\n}\n"],"mappings":""}
+{"version":3,"file":"Testimonial.module.js","names":[],"sources":["../../src/Testimonial/Testimonial.module.css"],"sourcesContent":[".Testimonial {\n  color: var(--brand-color-text-default);\n  font-family: var(--brand-fontStack-sansSerif);\n}\n\n.Testimonial--variant-subtle,\n.Testimonial--variant-default {\n  position: relative;\n  border-radius: var(--brand-borderRadius-xlarge);\n  padding: var(--base-size-48) var(--base-size-32);\n}\n\n@media screen and (min-width: 48rem) {\n  .Testimonial--variant-subtle,\n  .Testimonial--variant-default {\n    padding: var(--base-size-48);\n  }\n}\n\n@media screen and (min-width: 63.25rem) {\n  .Testimonial--variant-subtle.Testimonial--size-large,\n  .Testimonial--variant-default.Testimonial--size-large {\n    padding: var(--base-size-96) var(--base-size-128);\n  }\n}\n\n.Testimonial--variant-subtle {\n  background-color: var(--brand-color-canvas-subtle);\n}\n\n.Testimonial--variant-default {\n  background-color: var(--brand-color-canvas-default);\n}\n\n.Testimonial--variant-subtle::before,\n.Testimonial--variant-default::before {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  pointer-events: none;\n  content: '';\n  border-radius: inherit;\n}\n\n.Testimonial--variant-subtle.Testimonial--border::before {\n  mask-image: var(--brand-Testimonial-borderMask-subtle);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);\n}\n\n.Testimonial--variant-default.Testimonial--border::before {\n  mask-image: var(--brand-Testimonial-borderMask-default);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);\n}\n\n.Testimonial__quoteMark {\n  --brand-Testimonial-quoteMarkColor-gradient: radial-gradient(\n    circle at top left,\n    var(--brand-Testimonial-quoteMarkColor-start),\n    var(--brand-Testimonial-quoteMarkColor-end)\n  );\n  --brand-Testimonial-quoteMarkColor-background: var(\n    --brand-Testimonial-quoteMarkColor-gradient,\n    var(--brand-Testimonial-quoteMarkColor, currentColor)\n  );\n  color: var(--brand-Testimonial-quoteMarkColor-start, var(--brand-Testimonial-quoteMarkColor, currentColor));\n  font-size: var(--base-size-48);\n  line-height: var(--base-size-48);\n  font-weight: var(--base-text-weight-extrabold);\n  position: relative;\n}\n\n.Testimonial__quoteMark::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background: var(--brand-Testimonial-quoteMarkColor-background);\n  -webkit-mask: linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box,\n    linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));\n  mask: linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) content-box,\n    linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default));\n  -webkit-mask-composite: xor;\n  mask-composite: exclude;\n}\n\n.Testimonial__quoteMark--hasBackground {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: calc(var(--base-size-48) + var(--base-size-8));\n  height: calc(var(--base-size-48) + var(--base-size-8));\n  border-radius: var(--base-size-12);\n  background-color: var(--brand-Testimonial-quoteMarkBackground, var(--base-color-scale-gray-0));\n  font-size: var(--base-size-64);\n  line-height: 1;\n}\n\n.Testimonial--size-large .Testimonial__quoteMark:not(.Testimonial__quoteMark--hasBackground) {\n  font-size: 7.5rem; /* 120px */\n  line-height: 1;\n}\n\n.Testimonial__quoteMarkGlyph {\n  display: block;\n}\n\n.Testimonial-quote {\n  font-family: var(--brand-fontStack-sansSerif);\n  font-size: var(--brand-Testimonial-quote-fontSize-default);\n  font-weight: var(--brand-Testimonial-quote-fontWeight-default);\n  letter-spacing: var(--brand-Testimonial-quote-letterSpacing-default);\n  line-height: 1.2; /* requires custom line-height */\n  display: block;\n}\n\n.Testimonial--size-large .Testimonial-quote {\n  font-size: var(--brand-Testimonial-quote-fontSize-large);\n  font-weight: var(--brand-Testimonial-quote-fontWeight-large);\n  letter-spacing: var(--brand-Testimonial-quote-letterSpacing-large);\n}\n\n.Testimonial-quote em,\n.Testimonial-quote b {\n  color: var(--brand-Testimonial-quote-color-emphasis);\n  font-style: normal;\n  font-weight: inherit;\n}\n\n.Testimonial__media {\n  display: flex;\n  gap: var(--base-size-16);\n  align-items: center;\n  margin-top: var(--base-size-24);\n}\n\n.Testimonial-logo-image {\n  display: block;\n}\n\n.Testimonial--size-large .Testimonial__media {\n  margin-top: var(--base-size-64);\n}\n\n.Testimonial-caption {\n  display: flex;\n  flex-direction: column;\n}\n\n.Testimonial-avatar {\n  flex: none;\n}\n\n.Testimonial-from {\n  font-weight: var(--base-text-weight-normal);\n  text-transform: uppercase;\n}\n\n/* Expressive variant */\n.Testimonial--variant-expressive {\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-size-48);\n}\n\n@media screen and (min-width: 48rem) {\n  .Testimonial--variant-expressive {\n    flex-direction: row;\n    align-items: flex-end;\n    gap: var(--base-size-96);\n  }\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteWrapper {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--base-size-24);\n  flex: 1 1 0;\n  min-width: 0;\n}\n\n.Testimonial--variant-expressive .Testimonial__media {\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--base-size-24);\n  margin-block-start: 0;\n  flex: 0 0 auto;\n}\n\n.Testimonial--variant-expressive .Testimonial-caption {\n  border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);\n  padding-block-start: var(--base-size-24);\n  width: 100%;\n  gap: var(--base-size-8);\n}\n\n@media screen and (min-width: 48rem) {\n  .Testimonial--variant-expressive .Testimonial__media {\n    min-width: 240px;\n    max-width: 320px;\n  }\n}\n\n.Testimonial--variant-expressive .Testimonial-from {\n  display: flex;\n  align-items: center;\n  gap: var(--base-size-8);\n  font-family: var(--brand-fontStack-monospace);\n  font-weight: var(--base-text-weight-medium);\n  text-transform: uppercase;\n  letter-spacing: 0.01em;\n}\n\n.Testimonial--variant-expressive .Testimonial-from::before {\n  content: '';\n  display: inline-block;\n  width: 9px;\n  height: 14px;\n  background-color: var(--testimonial-accent-color, var(--brand-Testimonial-quoteMarkColor-default));\n  flex-shrink: 0;\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteMark {\n  font-family: var(--brand-fontStack-monospace);\n  font-weight: var(--brand-fontWeight-300);\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteMarkGlyph {\n  transform: translateY(var(--base-size-12));\n}\n\n.Testimonial--variant-expressive .Testimonial__quoteMark:not(.Testimonial__quoteMark--hasBackground) {\n  margin-left: -0.18em;\n}\n\n.Testimonial--variant-expressive .Testimonial-quote {\n  font-family: var(--brand-fontStack-monospace);\n  line-height: var(--brand-text-lineHeight-400);\n  font-weight: var(--base-text-weight-normal);\n}\n\n.Testimonial-link {\n  margin-top: var(--base-size-8);\n}\n\n.Testimonial__quoteMark--default {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-default);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-default);\n}\n\n.Testimonial__quoteMark--blue {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-blue);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-blue);\n}\n\n.Testimonial__quoteMark--blue-purple {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-blue-purple-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-blue-purple-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-blue-purple);\n}\n\n.Testimonial__quoteMark--coral {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-coral);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-coral);\n}\n\n.Testimonial__quoteMark--green {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-green);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-green);\n}\n\n.Testimonial__quoteMark--green-blue {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-green-blue-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-green-blue-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-green-blue);\n}\n\n.Testimonial__quoteMark--gray {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-gray);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-gray);\n}\n\n.Testimonial__quoteMark--indigo {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-indigo);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-indigo);\n}\n\n.Testimonial__quoteMark--lemon {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-lemon);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-lemon);\n}\n\n.Testimonial__quoteMark--lime {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-lime);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-lime);\n}\n\n.Testimonial__quoteMark--orange {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-orange);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-orange);\n}\n\n.Testimonial__quoteMark--pink {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-pink);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-pink);\n}\n\n.Testimonial__quoteMark--pink-blue {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-pink-blue-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-pink-blue-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-pink-blue);\n}\n\n.Testimonial__quoteMark--purple {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-purple);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-purple);\n}\n\n.Testimonial__quoteMark--purple-red {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-purple-red-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-purple-red-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-purple-red);\n}\n\n.Testimonial__quoteMark--red {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-red);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-red);\n}\n\n.Testimonial__quoteMark--red-orange {\n  --brand-Testimonial-quoteMarkColor-start: var(--brand-Testimonial-quoteMarkColor-red-orange-start);\n  --brand-Testimonial-quoteMarkColor-end: var(--brand-Testimonial-quoteMarkColor-red-orange-end);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-red-orange);\n}\n\n.Testimonial__quoteMark--teal {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-teal);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-teal);\n}\n\n.Testimonial__quoteMark--yellow {\n  --brand-Testimonial-quoteMarkColor: var(--brand-Testimonial-quoteMarkColor-yellow);\n  --brand-Testimonial-quoteMarkBackground: var(--brand-Testimonial-quoteMarkBackground-yellow);\n}\n"],"mappings":""}

package/esm/VideoPlayer/VideoPlayer.js

@@ -1,8 +1,8 @@
 import e from "../node_modules/clsx/dist/clsx.js";
 import { useProvidedRefOrCreate as t } from "../hooks/useRef.js";
 import { Text as n } from "../Text/Text.js";
-import { PlayIcon as r } from "./components/PlayIcon/PlayIcon.js";
-import { MarkGithubIcon as i } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
+import { MarkGithubIcon as r } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
+import { PlayIcon as i } from "./components/PlayIcon/PlayIcon.js";
 import a from "./VideoPlayer.module.js";
 import { VideoContext as o, VideoProvider as s, useVideo as c } from "./hooks/useVideo.js";
 import { Captions as l } from "./components/Captions/Captions.js";
@@ -19,7 +19,7 @@ import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/compon
 import { forwardRef as v, useCallback as y, useContext as b } from "react";
 import { jsx as x, jsxs as S } from "react/jsx-runtime";
 //#region src/VideoPlayer/VideoPlayer.tsx
-var C = v(({ title: o, visuallyHiddenTitle: s, showBranding: v = !0, children: b, className: C, showPlayPauseButton: T = !0, showSeekControl: E = !0, showCCButton: D = !0, showMuteButton: O = !0, showVolumeControl: k = !0, showFullScreenButton: A = !0, playIcon: j = () => /* @__PURE__ */ x(r, { className: a.VideoPlayer__playButton }), ...M }, N) => {
+var C = v(({ title: o, visuallyHiddenTitle: s, showBranding: v = !0, children: b, className: C, showPlayPauseButton: T = !0, showSeekControl: E = !0, showCCButton: D = !0, showMuteButton: O = !0, showVolumeControl: k = !0, showFullScreenButton: A = !0, playIcon: j = () => /* @__PURE__ */ x(i, { className: a.VideoPlayer__playButton }), ...M }, N) => {
 	let { ccEnabled: P, fullscreenRef: F, isPlaying: I, ref: L, togglePlaying: R } = c(), z = t(y((e) => {
 		w(N, e);
 	}, [N])), B = y((e) => {
@@ -46,7 +46,7 @@ var C = v(({ title: o, visuallyHiddenTitle: s, showBranding: v = !0, children: b
 					}),
 					v || !s ? /* @__PURE__ */ S("div", {
 						className: e(a.VideoPlayer__title, I && a["VideoPlayer__title--hidden"]),
-						children: [v && /* @__PURE__ */ x(i, {
+						children: [v && /* @__PURE__ */ x(r, {
 							size: 40,
 							"aria-label": "GitHub logo"
 						}), !s && /* @__PURE__ */ x(n, {

package/esm/css/reset-CSgu34_f.css

@@ -0,0 +1 @@
+*,:before,:after{box-sizing:border-box}body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}html,html:focus-within{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html,html:focus-within{scroll-behavior:auto}}body{min-height:100vh;line-height:1.5}a:not([class]){-webkit-text-decoration-skip:ink;-webkit-text-decoration-skip-ink:auto;text-decoration-skip-ink:auto}img,picture{max-width:100%}input,button,textarea,select{font:inherit}

package/esm/css/stylesheets.js

@@ -1,4 +1,4 @@
-import './utilities-BivJncWo.css';import './reset-PKNIUbst.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/typography/typography-responsive-D6GwCHec.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/breakpoints-DV9ZFHGu.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/border-B0NqqX5b.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-tpdcmiok.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/typography/typography-CAC6sGQ3.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/size/size-6EfgMG7y.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes-BVk7bh0Y.css';/* empty css      */
+import './utilities-BivJncWo.css';import './reset-CSgu34_f.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/typography/typography-responsive-D6GwCHec.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/breakpoints-DV9ZFHGu.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/size/border-B0NqqX5b.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-Bdet_nBw.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/typography/typography-CAC6sGQ3.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/size/size-6EfgMG7y.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes-BVk7bh0Y.css';/* empty css      */
 /* empty css                                                                                         */
 /* empty css                                                                    */
 /* empty css                                                                                */

package/esm/index.esm.js

@@ -10,71 +10,71 @@ import { Text as S, TextFontVariants as C, TextSizes as w, TextTags as T, TextVa
 import { EyebrowText as M, EyebrowTextVariants as N } from "./EyebrowText/EyebrowText.js";
 import { TextCursorAnimation as P, testIds as F } from "./TextCursorAnimation/TextCursorAnimation.js";
 import { Heading as I, HeadingFontVariants as L, HeadingLetterSpacing as R, HeadingSizes as z, HeadingStretch as B, HeadingTags as V, HeadingWeights as H, classMap as U, defaultHeadingFont as W, defaultHeadingTag as G } from "./Heading/Heading.js";
-import { Image as K, ImageBorderRadiusOptions as q } from "./Image/Image.js";
-import { Button as J, ButtonSizes as Y, ButtonVariants as X, _Button as Z, defaultButtonSize as Q, defaultButtonVariant as $ } from "./Button/Button.js";
-import { Hero as ee } from "./Hero/Hero.js";
-import { ColorModesEnum as te, ThemeContext as ne, ThemeProvider as re } from "./ThemeProvider/ThemeProvider.js";
-import { useTheme as ie } from "./ThemeProvider/useTheme.js";
-import { ButtonGroup as ae } from "./ButtonGroup/ButtonGroup.js";
-import { RiverAccordion as oe, RiverAccordionVariants as se } from "./river/RiverAccordion/RiverAccordion.js";
-import { Link as ce, LinkArrowDirections as le, LinkSizes as ue, LinkVariants as de } from "./Link/Link.js";
-import { Label as fe, LabelColors as pe, LabelSizes as me, defaultLabelColor as he, defaultLabelSize as ge } from "./Label/Label.js";
-import { River as _e, defaultRiverAlign as ve, defaultRiverImageTextRatio as ye, defaultRiverVariant as be } from "./river/River/River.js";
-import { RiverBreakout as xe, RiverBreakoutVariants as Se } from "./river/RiverBreakout/RiverBreakout.js";
-import { Icon as Ce, defaultIconColor as we, defaultIconSize as Te, iconColors as Ee, iconSizeMap as De, iconSizes as Oe, namedIconSizes as ke, numericIconSizes as Ae } from "./Icon/Icon.js";
-import { BreakpointSize as je, useWindowSize as Me } from "./hooks/useWindowSize.js";
-import { RiverBreakoutTabs as Ne } from "./river/RiverBreakoutTabs/RiverBreakoutTabs.js";
-import { RiverStoryScroll as Pe } from "./river/RiverStoryScroll/RiverStoryScroll.js";
-import { Pagination as Fe } from "./Pagination/Pagination.js";
-import { MediaPlaylist as Ie } from "./MediaPlaylist/MediaPlaylist.js";
-import { useFocusTrap as Le } from "./hooks/useFocusTrap.js";
-import { SubdomainNavBar as Re } from "./SubdomainNavBar/SubdomainNavBar.js";
-import { InlineLink as ze } from "./InlineLink/InlineLink.js";
-import { Token as Be, TokenVariants as Ve, defaultTokenVariant as He } from "./Token/Token.js";
-import { Accordion as Ue, AccordionContent as We, AccordionHeading as Ge, AccordionRoot as Ke, AccordionToggleColors as qe } from "./Accordion/Accordion.js";
-import { FAQ as Je } from "./FAQ/FAQ.js";
-import { FAQGroup as Ye } from "./FAQ/FAQGroup.js";
-import { Checkbox as Xe } from "./forms/Checkbox/Checkbox.js";
-import { DEFAULT_TEXTAREA_COLS as Ze, DEFAULT_TEXTAREA_RESIZE as Qe, DEFAULT_TEXTAREA_ROWS as $e, Textarea as et } from "./forms/Textarea/Textarea.js";
-import { TextInput as tt } from "./forms/TextInput/TextInput.js";
-import { Select as nt } from "./forms/Select/Select.js";
-import { Radio as rt } from "./forms/Radio/Radio.js";
-import { FormControl as it } from "./forms/FormControl/FormControl.js";
-import { CheckboxGroup as at } from "./forms/CheckboxGroup/CheckboxGroup.js";
-import { RadioGroup as ot } from "./forms/RadioGroup/RadioGroup.js";
-import { Avatar as st, AvatarShapes as ct, AvatarSizes as lt } from "./Avatar/Avatar.js";
-import { Testimonial as ut, TestimonialQuoteMarkColors as dt, TestimonialVariants as ft, defaultQuoteMarkColor as pt, defaultTestimonialVariant as mt } from "./Testimonial/Testimonial.js";
-import { ComparisonTable as ht, _ComparisonTable as gt } from "./ComparisonTable/ComparisonTable.js";
-import { AnchorNav as _t } from "./AnchorNav/AnchorNav.js";
-import { CTABanner as vt, CTABannerBackgroundColors as yt } from "./CTABanner/CTABanner.js";
-import { UnorderedList as bt } from "./list/UnorderedList/UnorderedList.js";
-import { OrderedList as xt } from "./list/OrderedList/OrderedList.js";
-import { CTAForm as St } from "./CTAForm/CTAForm.js";
-import { MinimalFooter as Ct } from "./MinimalFooter/MinimalFooter.js";
-import { Pillar as wt, defaultPillarIconColor as Tt, defaultPillarIconSize as Et } from "./Pillar/Pillar.js";
-import { Card as Dt, CardBackgroundColors as Ot, CardCTAVariants as kt, CardIconColors as At, CardLabelVariants as jt, CardTokenPositions as Mt, CardVariants as Nt, defaultCardCTAVariant as Pt, defaultCardIconColor as Ft, defaultCardLabelVariant as It } from "./Card/Card.js";
-import { CardSkewEffect as Lt } from "./Card/CardSkewEffect.js";
-import { SectionIntro as Rt } from "./SectionIntro/SectionIntro.js";
-import { ActionMenu as zt, ActionMenuButtonModes as Bt, ActionMenuProvider as Vt, ActionMenuSizes as Ht, actionMenuOverlaySides as Ut, useActionMenuContext as Wt } from "./ActionMenu/ActionMenu.js";
-import { Prose as Gt } from "./Prose/Prose.js";
-import { useVideo as Kt } from "./VideoPlayer/hooks/useVideo.js";
-import { VideoPlayer as qt } from "./VideoPlayer/VideoPlayer.js";
-import { LogoSuite as Jt } from "./LogoSuite/LogoSuite.js";
-import { Timeline as Yt } from "./Timeline/Timeline.js";
-import { Bento as Xt } from "./Bento/Bento.js";
-import { EyebrowBanner as Zt, EyebrowBannerIconColors as Qt, EyebrowBannerLabelColors as $t, defaultEyebrowBannerIconColor as en } from "./EyebrowBanner/EyebrowBanner.js";
-import { Tooltip as tn, TooltipContext as nn } from "./Tooltip/Tooltip.js";
-import { PricingOptions as rn } from "./PricingOptions/PricingOptions.js";
-import { SubNav as an, SubNavSubMenuVariants as on, useSubNavContext as sn } from "./SubNav/SubNav.js";
-import { NavList as cn } from "./NavList/NavList.js";
-import { IDE as ln, IDEDefaultIconMap as un, IDEFileExtensions as dn } from "./IDE/IDE.js";
-import { BreadcrumbVariants as fn, Breadcrumbs as pn } from "./Breadcrumbs/Breadcrumbs.js";
-import { Section as mn, SectionBackgroundColors as hn, SectionPaddingVariants as gn } from "./Section/Section.js";
-import { Statistic as _n, StatisticSizes as vn, StatisticSpacingValues as yn } from "./Statistic/Statistic.js";
-import { BreakoutBanner as bn, BreakoutBannerBackgroundColors as xn } from "./BreakoutBanner/BreakoutBanner.js";
-import { Footnotes as Sn, FootnotesItemTags as Cn, FootnotesTags as wn } from "./Footnotes/Footnotes.js";
-import { FrostedGlassVFX as Tn, FrostedGlassVFXIntensity as En, defaultFrostedGlassVFXIntensity as Dn } from "./FrostedGlassVFX/FrostedGlassVFX.js";
-import { SectionIntroStacked as On, SectionIntroStackedVariants as kn } from "./SectionIntroStacked/SectionIntroStacked.js";
-import { Tabs as An } from "./Tabs/Tabs.js";
-import { Tiles as jn } from "./Tiles/Tiles.js";
-export { Ue as Accordion, We as AccordionContent, Ge as AccordionHeading, Ke as AccordionRoot, qe as AccordionToggleColors, zt as ActionMenu, Bt as ActionMenuButtonModes, Vt as ActionMenuProvider, Ht as ActionMenuSizes, _t as AnchorNav, a as Animate, n as AnimationContext, r as AnimationProvider, i as AnimationVariants, st as Avatar, ct as AvatarShapes, lt as AvatarSizes, Xt as Bento, g as Box, _ as BoxBackgroundColors, v as BoxBorderColorOptions, y as BoxBorderRadiusOptions, b as BoxBorderWidthOptions, x as BoxSpacingValues, fn as BreadcrumbVariants, pn as Breadcrumbs, bn as BreakoutBanner, xn as BreakoutBannerBackgroundColors, je as BreakpointSize, J as Button, ae as ButtonGroup, Y as ButtonSizes, X as ButtonVariants, vt as CTABanner, yt as CTABannerBackgroundColors, St as CTAForm, Dt as Card, Ot as CardBackgroundColors, kt as CardCTAVariants, At as CardIconColors, jt as CardLabelVariants, Lt as CardSkewEffect, Mt as CardTokenPositions, Nt as CardVariants, Xe as Checkbox, at as CheckboxGroup, te as ColorModesEnum, ht as ComparisonTable, Ze as DEFAULT_TEXTAREA_COLS, Qe as DEFAULT_TEXTAREA_RESIZE, $e as DEFAULT_TEXTAREA_ROWS, Zt as EyebrowBanner, Qt as EyebrowBannerIconColors, $t as EyebrowBannerLabelColors, M as EyebrowText, N as EyebrowTextVariants, Je as FAQ, Ye as FAQGroup, Sn as Footnotes, Cn as FootnotesItemTags, wn as FootnotesTags, it as FormControl, Tn as FrostedGlassVFX, En as FrostedGlassVFXIntensity, t as Grid, I as Heading, L as HeadingFontVariants, R as HeadingLetterSpacing, z as HeadingSizes, B as HeadingStretch, V as HeadingTags, H as HeadingWeights, ee as Hero, ln as IDE, un as IDEDefaultIconMap, dn as IDEFileExtensions, Ce as Icon, K as Image, q as ImageBorderRadiusOptions, ze as InlineLink, fe as Label, pe as LabelColors, me as LabelSizes, ce as Link, le as LinkArrowDirections, ue as LinkSizes, de as LinkVariants, Jt as LogoSuite, Ie as MediaPlaylist, Ct as MinimalFooter, cn as NavList, xt as OrderedList, Fe as Pagination, wt as Pillar, rn as PricingOptions, Gt as Prose, rt as Radio, ot as RadioGroup, _e as River, oe as RiverAccordion, se as RiverAccordionVariants, xe as RiverBreakout, Ne as RiverBreakoutTabs, Se as RiverBreakoutVariants, Pe as RiverStoryScroll, mn as Section, hn as SectionBackgroundColors, Rt as SectionIntro, On as SectionIntroStacked, kn as SectionIntroStackedVariants, gn as SectionPaddingVariants, nt as Select, c as Stack, l as StackAlignItemVariants, u as StackDirectionVariants, d as StackFlexWrapVariants, f as StackJustifyContentVariants, p as StackSpacingVariants, _n as Statistic, vn as StatisticSizes, yn as StatisticSpacingValues, an as SubNav, on as SubNavSubMenuVariants, Re as SubdomainNavBar, An as Tabs, ut as Testimonial, dt as TestimonialQuoteMarkColors, ft as TestimonialVariants, S as Text, P as TextCursorAnimation, C as TextFontVariants, tt as TextInput, s as TextRevealAnimation, w as TextSizes, T as TextTags, E as TextVariants, D as TextWeights, et as Textarea, ne as ThemeContext, re as ThemeProvider, jn as Tiles, Yt as Timeline, Be as Token, Ve as TokenVariants, tn as Tooltip, nn as TooltipContext, bt as UnorderedList, qt as VideoPlayer, Z as _Button, gt as _ComparisonTable, e as _GLOBAL_STYLES, Ut as actionMenuOverlaySides, U as classMap, Q as defaultButtonSize, $ as defaultButtonVariant, Pt as defaultCardCTAVariant, Ft as defaultCardIconColor, It as defaultCardLabelVariant, en as defaultEyebrowBannerIconColor, O as defaultFontVariant, Dn as defaultFrostedGlassVFXIntensity, W as defaultHeadingFont, G as defaultHeadingTag, we as defaultIconColor, Te as defaultIconSize, he as defaultLabelColor, ge as defaultLabelSize, Tt as defaultPillarIconColor, Et as defaultPillarIconSize, pt as defaultQuoteMarkColor, ve as defaultRiverAlign, ye as defaultRiverImageTextRatio, be as defaultRiverVariant, m as defaultStackDirection, h as defaultStackSpacing, mt as defaultTestimonialVariant, k as defaultTextSize, A as defaultTextTag, j as defaultTextVariant, He as defaultTokenVariant, Ee as iconColors, De as iconSizeMap, Oe as iconSizes, ke as namedIconSizes, Ae as numericIconSizes, F as testIds, Wt as useActionMenuContext, o as useAnimation, Le as useFocusTrap, sn as useSubNavContext, ie as useTheme, Kt as useVideo, Me as useWindowSize };
+import { Button as K, ButtonSizes as q, ButtonVariants as J, _Button as Y, defaultButtonSize as X, defaultButtonVariant as Z } from "./Button/Button.js";
+import { ColorModesEnum as Q, ThemeContext as $, ThemeProvider as ee } from "./ThemeProvider/ThemeProvider.js";
+import { useTheme as te } from "./ThemeProvider/useTheme.js";
+import { ActionMenu as ne, ActionMenuButtonModes as re, ActionMenuProvider as ie, ActionMenuSizes as ae, actionMenuOverlaySides as oe, useActionMenuContext as se } from "./ActionMenu/ActionMenu.js";
+import { ButtonGroup as ce } from "./ButtonGroup/ButtonGroup.js";
+import { Image as le, ImageBorderRadiusOptions as ue } from "./Image/Image.js";
+import { Hero as de } from "./Hero/Hero.js";
+import { RiverAccordion as fe, RiverAccordionVariants as pe } from "./river/RiverAccordion/RiverAccordion.js";
+import { Link as me, LinkArrowDirections as he, LinkSizes as ge, LinkVariants as _e } from "./Link/Link.js";
+import { Label as ve, LabelColors as ye, LabelSizes as be, defaultLabelColor as xe, defaultLabelSize as Se } from "./Label/Label.js";
+import { River as Ce, RiverVisualPaddingOptions as we, RiverVisualPositionOptions as Te, defaultRiverAlign as Ee, defaultRiverImageTextRatio as De, defaultRiverVariant as Oe } from "./river/River/River.js";
+import { RiverBreakout as ke, RiverBreakoutVariants as Ae } from "./river/RiverBreakout/RiverBreakout.js";
+import { Icon as je, defaultIconColor as Me, defaultIconSize as Ne, iconColors as Pe, iconSizeMap as Fe, iconSizes as Ie, namedIconSizes as Le, numericIconSizes as Re } from "./Icon/Icon.js";
+import { BreakpointSize as ze, useWindowSize as Be } from "./hooks/useWindowSize.js";
+import { RiverBreakoutTabs as Ve } from "./river/RiverBreakoutTabs/RiverBreakoutTabs.js";
+import { RiverStoryScroll as He } from "./river/RiverStoryScroll/RiverStoryScroll.js";
+import { Pagination as Ue } from "./Pagination/Pagination.js";
+import { MediaPlaylist as We } from "./MediaPlaylist/MediaPlaylist.js";
+import { useFocusTrap as Ge } from "./hooks/useFocusTrap.js";
+import { SubdomainNavBar as Ke } from "./SubdomainNavBar/SubdomainNavBar.js";
+import { InlineLink as qe } from "./InlineLink/InlineLink.js";
+import { Token as Je, TokenVariants as Ye, defaultTokenVariant as Xe } from "./Token/Token.js";
+import { Accordion as Ze, AccordionContent as Qe, AccordionHeading as $e, AccordionRoot as et, AccordionToggleColors as tt } from "./Accordion/Accordion.js";
+import { FAQ as nt } from "./FAQ/FAQ.js";
+import { FAQGroup as rt } from "./FAQ/FAQGroup.js";
+import { Checkbox as it } from "./forms/Checkbox/Checkbox.js";
+import { DEFAULT_TEXTAREA_COLS as at, DEFAULT_TEXTAREA_RESIZE as ot, DEFAULT_TEXTAREA_ROWS as st, Textarea as ct } from "./forms/Textarea/Textarea.js";
+import { TextInput as lt } from "./forms/TextInput/TextInput.js";
+import { Select as ut } from "./forms/Select/Select.js";
+import { Radio as dt } from "./forms/Radio/Radio.js";
+import { FormControl as ft } from "./forms/FormControl/FormControl.js";
+import { CheckboxGroup as pt } from "./forms/CheckboxGroup/CheckboxGroup.js";
+import { RadioGroup as mt } from "./forms/RadioGroup/RadioGroup.js";
+import { Avatar as ht, AvatarShapes as gt, AvatarSizes as _t } from "./Avatar/Avatar.js";
+import { Testimonial as vt, TestimonialQuoteMarkColors as yt, TestimonialVariants as bt, defaultQuoteMarkColor as xt, defaultTestimonialVariant as St } from "./Testimonial/Testimonial.js";
+import { ComparisonTable as Ct, _ComparisonTable as wt } from "./ComparisonTable/ComparisonTable.js";
+import { AnchorNav as Tt } from "./AnchorNav/AnchorNav.js";
+import { CTABanner as Et, CTABannerBackgroundColors as Dt } from "./CTABanner/CTABanner.js";
+import { UnorderedList as Ot } from "./list/UnorderedList/UnorderedList.js";
+import { OrderedList as kt } from "./list/OrderedList/OrderedList.js";
+import { CTAForm as At } from "./CTAForm/CTAForm.js";
+import { MinimalFooter as jt } from "./MinimalFooter/MinimalFooter.js";
+import { Pillar as Mt, defaultPillarIconColor as Nt, defaultPillarIconSize as Pt } from "./Pillar/Pillar.js";
+import { Card as Ft, CardBackgroundColors as It, CardCTAVariants as Lt, CardIconColors as Rt, CardLabelVariants as zt, CardTokenPositions as Bt, CardVariants as Vt, defaultCardCTAVariant as Ht, defaultCardIconColor as Ut, defaultCardLabelVariant as Wt } from "./Card/Card.js";
+import { CardSkewEffect as Gt } from "./Card/CardSkewEffect.js";
+import { SectionIntro as Kt } from "./SectionIntro/SectionIntro.js";
+import { Prose as qt } from "./Prose/Prose.js";
+import { useVideo as Jt } from "./VideoPlayer/hooks/useVideo.js";
+import { VideoPlayer as Yt } from "./VideoPlayer/VideoPlayer.js";
+import { LogoSuite as Xt } from "./LogoSuite/LogoSuite.js";
+import { Timeline as Zt } from "./Timeline/Timeline.js";
+import { Bento as Qt } from "./Bento/Bento.js";
+import { EyebrowBanner as $t, EyebrowBannerIconColors as en, EyebrowBannerLabelColors as tn, defaultEyebrowBannerIconColor as nn } from "./EyebrowBanner/EyebrowBanner.js";
+import { Tooltip as rn, TooltipContext as an } from "./Tooltip/Tooltip.js";
+import { PricingOptions as on } from "./PricingOptions/PricingOptions.js";
+import { SubNav as sn, SubNavSubMenuVariants as cn, useSubNavContext as ln } from "./SubNav/SubNav.js";
+import { NavList as un } from "./NavList/NavList.js";
+import { IDE as dn, IDEDefaultIconMap as fn, IDEFileExtensions as pn } from "./IDE/IDE.js";
+import { BreadcrumbVariants as mn, Breadcrumbs as hn } from "./Breadcrumbs/Breadcrumbs.js";
+import { Section as gn, SectionBackgroundColors as _n, SectionPaddingVariants as vn } from "./Section/Section.js";
+import { Statistic as yn, StatisticSizes as bn, StatisticSpacingValues as xn } from "./Statistic/Statistic.js";
+import { BreakoutBanner as Sn, BreakoutBannerBackgroundColors as Cn } from "./BreakoutBanner/BreakoutBanner.js";
+import { Footnotes as wn, FootnotesItemTags as Tn, FootnotesTags as En } from "./Footnotes/Footnotes.js";
+import { FrostedGlassVFX as Dn, FrostedGlassVFXIntensity as On, defaultFrostedGlassVFXIntensity as kn } from "./FrostedGlassVFX/FrostedGlassVFX.js";
+import { SectionIntroStacked as An, SectionIntroStackedVariants as jn } from "./SectionIntroStacked/SectionIntroStacked.js";
+import { Tabs as Mn } from "./Tabs/Tabs.js";
+import { Tiles as Nn } from "./Tiles/Tiles.js";
+export { Ze as Accordion, Qe as AccordionContent, $e as AccordionHeading, et as AccordionRoot, tt as AccordionToggleColors, ne as ActionMenu, re as ActionMenuButtonModes, ie as ActionMenuProvider, ae as ActionMenuSizes, Tt as AnchorNav, a as Animate, n as AnimationContext, r as AnimationProvider, i as AnimationVariants, ht as Avatar, gt as AvatarShapes, _t as AvatarSizes, Qt as Bento, g as Box, _ as BoxBackgroundColors, v as BoxBorderColorOptions, y as BoxBorderRadiusOptions, b as BoxBorderWidthOptions, x as BoxSpacingValues, mn as BreadcrumbVariants, hn as Breadcrumbs, Sn as BreakoutBanner, Cn as BreakoutBannerBackgroundColors, ze as BreakpointSize, K as Button, ce as ButtonGroup, q as ButtonSizes, J as ButtonVariants, Et as CTABanner, Dt as CTABannerBackgroundColors, At as CTAForm, Ft as Card, It as CardBackgroundColors, Lt as CardCTAVariants, Rt as CardIconColors, zt as CardLabelVariants, Gt as CardSkewEffect, Bt as CardTokenPositions, Vt as CardVariants, it as Checkbox, pt as CheckboxGroup, Q as ColorModesEnum, Ct as ComparisonTable, at as DEFAULT_TEXTAREA_COLS, ot as DEFAULT_TEXTAREA_RESIZE, st as DEFAULT_TEXTAREA_ROWS, $t as EyebrowBanner, en as EyebrowBannerIconColors, tn as EyebrowBannerLabelColors, M as EyebrowText, N as EyebrowTextVariants, nt as FAQ, rt as FAQGroup, wn as Footnotes, Tn as FootnotesItemTags, En as FootnotesTags, ft as FormControl, Dn as FrostedGlassVFX, On as FrostedGlassVFXIntensity, t as Grid, I as Heading, L as HeadingFontVariants, R as HeadingLetterSpacing, z as HeadingSizes, B as HeadingStretch, V as HeadingTags, H as HeadingWeights, de as Hero, dn as IDE, fn as IDEDefaultIconMap, pn as IDEFileExtensions, je as Icon, le as Image, ue as ImageBorderRadiusOptions, qe as InlineLink, ve as Label, ye as LabelColors, be as LabelSizes, me as Link, he as LinkArrowDirections, ge as LinkSizes, _e as LinkVariants, Xt as LogoSuite, We as MediaPlaylist, jt as MinimalFooter, un as NavList, kt as OrderedList, Ue as Pagination, Mt as Pillar, on as PricingOptions, qt as Prose, dt as Radio, mt as RadioGroup, Ce as River, fe as RiverAccordion, pe as RiverAccordionVariants, ke as RiverBreakout, Ve as RiverBreakoutTabs, Ae as RiverBreakoutVariants, He as RiverStoryScroll, we as RiverVisualPaddingOptions, Te as RiverVisualPositionOptions, gn as Section, _n as SectionBackgroundColors, Kt as SectionIntro, An as SectionIntroStacked, jn as SectionIntroStackedVariants, vn as SectionPaddingVariants, ut as Select, c as Stack, l as StackAlignItemVariants, u as StackDirectionVariants, d as StackFlexWrapVariants, f as StackJustifyContentVariants, p as StackSpacingVariants, yn as Statistic, bn as StatisticSizes, xn as StatisticSpacingValues, sn as SubNav, cn as SubNavSubMenuVariants, Ke as SubdomainNavBar, Mn as Tabs, vt as Testimonial, yt as TestimonialQuoteMarkColors, bt as TestimonialVariants, S as Text, P as TextCursorAnimation, C as TextFontVariants, lt as TextInput, s as TextRevealAnimation, w as TextSizes, T as TextTags, E as TextVariants, D as TextWeights, ct as Textarea, $ as ThemeContext, ee as ThemeProvider, Nn as Tiles, Zt as Timeline, Je as Token, Ye as TokenVariants, rn as Tooltip, an as TooltipContext, Ot as UnorderedList, Yt as VideoPlayer, Y as _Button, wt as _ComparisonTable, e as _GLOBAL_STYLES, oe as actionMenuOverlaySides, U as classMap, X as defaultButtonSize, Z as defaultButtonVariant, Ht as defaultCardCTAVariant, Ut as defaultCardIconColor, Wt as defaultCardLabelVariant, nn as defaultEyebrowBannerIconColor, O as defaultFontVariant, kn as defaultFrostedGlassVFXIntensity, W as defaultHeadingFont, G as defaultHeadingTag, Me as defaultIconColor, Ne as defaultIconSize, xe as defaultLabelColor, Se as defaultLabelSize, Nt as defaultPillarIconColor, Pt as defaultPillarIconSize, xt as defaultQuoteMarkColor, Ee as defaultRiverAlign, De as defaultRiverImageTextRatio, Oe as defaultRiverVariant, m as defaultStackDirection, h as defaultStackSpacing, St as defaultTestimonialVariant, k as defaultTextSize, A as defaultTextTag, j as defaultTextVariant, Xe as defaultTokenVariant, Pe as iconColors, Fe as iconSizeMap, Ie as iconSizes, Le as namedIconSizes, Re as numericIconSizes, F as testIds, se as useActionMenuContext, o as useAnimation, Ge as useFocusTrap, ln as useSubNavContext, te as useTheme, Jt as useVideo, Be as useWindowSize };

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-Bdet_nBw.css

@@ -0,0 +1 @@
+:root,[data-color-mode=light]{--brand-color-success-fg:var(--base-color-scale-green-6);--brand-color-success-emphasis:var(--base-color-scale-green-5);--brand-color-success-muted:#8cf2a699;--brand-color-success-subtle:var(--base-color-scale-green-1);--brand-color-danger-fg:var(--base-color-scale-red-5);--brand-color-danger-emphasis:var(--base-color-scale-red-5);--brand-color-danger-muted:#ffaba899;--brand-color-danger-subtle:var(--base-color-scale-red-0);--brand-color-error-fg:var(--brand-color-danger-fg);--brand-color-error-emphasis:var(--brand-color-danger-emphasis);--brand-color-error-muted:var(--brand-color-danger-muted);--brand-color-error-subtle:var(--brand-color-danger-subtle);--brand-color-accent-primary:var(--base-color-scale-green-7);--brand-color-accent-secondary:var(--base-color-scale-yellow-5);--brand-color-text-default:var(--base-color-scale-black-0);--brand-color-text-muted:var(--base-color-scale-gray-7);--brand-color-text-subtle:var(--brand-color-text-muted);--brand-color-text-onEmphasis:var(--base-color-scale-white-0);--brand-color-text-emphasized:var(--base-color-scale-green-6);--brand-color-text-link-rest:var(--base-color-scale-blue-6);--brand-color-text-link-pressed:var(--base-color-scale-blue-8);--brand-color-text-danger:#cf222e;--brand-color-text-error:var(--brand-color-text-danger);--brand-color-neutral-emphasisPlus:var(--base-color-scale-gray-8);--brand-color-neutral-emphasis:var(--base-color-scale-gray-6);--brand-color-neutral-muted:#c4ccc6fe;--brand-color-neutral-subtle:#e4ebe6fe;--brand-color-canvas-default:var(--base-color-scale-white-0);--brand-color-canvas-invert:var(--base-color-scale-black-0);--brand-color-canvas-overlay:var(--base-color-scale-white-0);--brand-color-canvas-inset:var(--base-color-scale-gray-0);--brand-color-canvas-subtle:var(--base-color-scale-gray-0);--brand-color-canvas-muted:#f9fbf9;--brand-color-border-default:var(--base-color-scale-gray-4);--brand-color-border-muted:var(--base-color-scale-gray-1);--brand-color-border-subtle:var(--base-color-scale-gray-2);--brand-color-focus:var(--base-color-scale-blue-5)}[data-color-mode=dark]{--brand-color-success-fg:var(--base-color-scale-green-3);--brand-color-success-emphasis:var(--base-color-scale-green-6);--brand-color-success-muted:#0d302499;--brand-color-success-subtle:#0e422cd9;--brand-color-danger-fg:var(--base-color-scale-red-4);--brand-color-danger-emphasis:var(--base-color-scale-red-5);--brand-color-danger-muted:#5e021799;--brand-color-danger-subtle:#fa383dd9;--brand-color-error-fg:var(--brand-color-danger-fg);--brand-color-error-emphasis:var(--brand-color-danger-emphasis);--brand-color-error-muted:var(--brand-color-danger-muted);--brand-color-error-subtle:var(--brand-color-danger-subtle);--brand-color-accent-primary:var(--base-color-scale-green-2);--brand-color-accent-secondary:var(--base-color-scale-yellow-3);--brand-color-text-default:var(--base-color-scale-white-0);--brand-color-text-muted:var(--base-color-scale-gray-2);--brand-color-text-subtle:var(--brand-color-text-muted);--brand-color-text-onEmphasis:var(--base-color-scale-black-0);--brand-color-text-emphasized:var(--base-color-scale-green-3);--brand-color-text-link-rest:var(--base-color-scale-blue-1);--brand-color-text-link-pressed:var(--base-color-scale-blue-1);--brand-color-text-danger:#ff8182;--brand-color-text-error:var(--brand-color-text-danger);--brand-color-neutral-emphasisPlus:var(--base-color-scale-gray-3);--brand-color-neutral-emphasis:var(--base-color-scale-gray-3);--brand-color-neutral-muted:#7c8980fe;--brand-color-neutral-subtle:#7c8980;--brand-color-canvas-default:var(--base-color-scale-black-0);--brand-color-canvas-invert:var(--base-color-scale-white-0);--brand-color-canvas-overlay:var(--base-color-scale-gray-6);--brand-color-canvas-inset:var(--base-color-scale-black-0);--brand-color-canvas-subtle:var(--base-color-scale-gray-8);--brand-color-canvas-muted:#090d0a;--brand-color-border-default:var(--base-color-scale-gray-5);--brand-color-border-muted:var(--base-color-scale-gray-7);--brand-color-border-subtle:var(--base-color-scale-gray-6);--brand-color-focus:var(--base-color-scale-blue-3)}

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/river-DHn1_SEa.css

@@ -0,0 +1 @@
+:root{--brand-RiverBreakout-variant-gridline-spacing-contentGap:var(--base-size-16);--brand-RiverBreakout-variant-gridline-spacing-outerInline:var(--base-size-20);--brand-RiverBreakout-variant-gridline-spacing-outerBlockEnd:var(--base-size-40);--brand-RiverBreakout-variant-gridline-spacing-outerBlock:var(--base-size-36);--brand-RiverBreakout-spacing-inner:var(--base-size-40);--brand-RiverAccordion-variant-gridline-spacing-contentGap:var(--base-size-32);--brand-RiverAccordion-variant-gridline-spacing-outerInline:var(--base-size-20);--brand-RiverAccordion-variant-gridline-spacing-outerBlock:var(--base-size-40);--brand-River-variant-gridline-spacing-outerInline:var(--base-size-20);--brand-River-variant-gridline-spacing-outerBlock:var(--base-size-40);--brand-River-variant-gridline-visual-padding:var(--base-size-32);--brand-River-spacing-outerBlock:var(--base-size-36);--brand-River-spacing-innerY:var(--base-size-24);--brand-River-spacing-inner:var(--base-size-40)}@media (width>=768px){:root{--brand-RiverBreakout-variant-gridline-spacing-contentGap:var(--base-size-20);--brand-RiverBreakout-variant-gridline-spacing-outerInline:var(--base-size-36);--brand-RiverBreakout-variant-gridline-spacing-outerBlockEnd:var(--base-size-48);--brand-RiverBreakout-variant-gridline-spacing-outerBlock:var(--base-size-40);--brand-RiverBreakout-spacing-inner:var(--base-size-48);--brand-RiverAccordion-variant-gridline-spacing-outerInline:var(--base-size-36);--brand-RiverAccordion-variant-gridline-spacing-outerBlock:var(--base-size-36);--brand-River-spacing-innerY:var(--base-size-24)}}@media (width>=1012px){:root{--brand-River-variant-gridline-visual-padding:var(--base-size-64)}}@media (width>=1280px){:root{--brand-RiverBreakout-variant-gridline-spacing-contentGap:var(--base-size-24);--brand-RiverBreakout-variant-gridline-spacing-outerInline:var(--base-size-64);--brand-RiverBreakout-variant-gridline-spacing-outerBlockEnd:var(--base-size-80);--brand-RiverBreakout-variant-gridline-spacing-outerBlock:var(--base-size-64);--brand-RiverBreakout-spacing-inner:var(--base-size-64);--brand-RiverAccordion-variant-gridline-spacing-contentGap:var(--base-size-64);--brand-RiverAccordion-variant-gridline-spacing-outerInline:var(--base-size-64);--brand-RiverAccordion-variant-gridline-spacing-outerBlock:var(--base-size-64);--brand-River-variant-gridline-spacing-outerInline:var(--base-size-64);--brand-River-variant-gridline-spacing-outerBlock:var(--base-size-64);--brand-River-spacing-outerBlock:var(--base-size-48);--brand-River-spacing-innerY:var(--base-size-32);--brand-River-spacing-inner:var(--base-size-24)}}

package/esm/river/River/River.d.ts

@@ -71,7 +71,11 @@ export type RiverContentProps = BaseProps<HTMLDivElement> & {
     children: React.ReactElement<TextProps> | React.ReactElement<HeadingProps | TextProps | LinkProps>[];
 } & React.HTMLAttributes<HTMLDivElement>;
 export declare const RiverContent: React.ForwardRefExoticComponent<Omit<RiverContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export type RiverVisualProps = BaseProps<HTMLDivElement> & React.HtmlHTMLAttributes<HTMLDivElement> & PropsWithChildren<{
+export declare const RiverVisualPositionOptions: readonly ["default", "center", "block-end", "block-end-inline-start", "block-end-inline-end"];
+export type RiverVisualPosition = (typeof RiverVisualPositionOptions)[number];
+export declare const RiverVisualPaddingOptions: readonly ["default", "none", "all"];
+export type RiverVisualPadding = (typeof RiverVisualPaddingOptions)[number];
+export type RiverVisualBaseProps = BaseProps<HTMLDivElement> & React.HtmlHTMLAttributes<HTMLDivElement> & PropsWithChildren<{
     /**
      * Applies automatic size constraints to child images and video.
      * This can be disabled by setting this prop to `false`.
@@ -88,12 +92,22 @@ export type RiverVisualProps = BaseProps<HTMLDivElement> & React.HtmlHTMLAttribu
      */
     rounded?: boolean;
 }>;
-export declare const Visual: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<RiverVisualProps>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type RiverVisualProps = RiverVisualBaseProps & {
+    /**
+     * Positions media within the visual region in the gridline variant.
+     */
+    position?: RiverVisualPosition;
+    /**
+     * Controls media padding within the visual region in the gridline variant.
+     */
+    padding?: RiverVisualPadding;
+};
+export declare const RiverVisualBase: React.ForwardRefExoticComponent<Omit<RiverVisualBaseProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 /**
  * Alternating text and image pairs.
  */
 export declare const River: React.ForwardRefExoticComponent<Omit<RiverProps, "ref"> & React.RefAttributes<HTMLElement>> & {
-    Visual: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<RiverVisualProps>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Visual: React.ForwardRefExoticComponent<Omit<RiverVisualProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
     Content: React.ForwardRefExoticComponent<Omit<RiverContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 };
 //# sourceMappingURL=River.d.ts.map

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

@@ -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;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;AAqE1D,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,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;CAClB,CAAC,CAAA;AAEJ,eAAO,MAAM,MAAM,+HA4BlB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,KAAK;;;CAAuD,CAAA"}
+{"version":3,"file":"River.d.ts","sourceRoot":"","sources":["../../../src/river/River/River.tsx"],"names":[],"mappings":"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"}

package/esm/river/River/River.js

@@ -3,7 +3,7 @@ import { useAnimation as t } from "../../animation/useAnimation.js";
 import { Text as n } from "../../Text/Text.js";
 import { EyebrowText as r } from "../../EyebrowText/EyebrowText.js";
 import { Heading as i } from "../../Heading/Heading.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/river-QteO10lt.css';import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/base-Ue-p74RC.css';/* empty css                                                                                          */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/river-DHn1_SEa.css';import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/base-Ue-p74RC.css';/* empty css                                                                                          */
 import a from "../../component-helpers/shared.module.js";
 import { Link as o } from "../../Link/Link.js";
 import { Label as s } from "../../Label/Label.js";
@@ -13,19 +13,21 @@ import l, { forwardRef as u, useMemo as d } from "react";
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/river/River/River.tsx
 var m = "50:50", h = "start", g = "default", _ = u(({ animate: n, imageTextRatio: r = m, align: i = h, variant: o = g, className: s, children: u, style: d, ...f }, _) => {
-	let { classes: b, styles: x } = t(n), { Visual: S, Content: C } = l.Children.toArray(u).reduce((e, t) => (l.isValidElement(t) && typeof t.type != "string" && (t.type === y && (e.Visual = t), t.type === v && (e.Content = t)), e), {
+	let { classes: y, styles: b } = t(n), { Visual: x, Content: C } = l.Children.toArray(u).reduce((e, t) => (l.isValidElement(t) && typeof t.type != "string" && (t.type === S && (e.Visual = t), t.type === v && (e.Content = t)), e), {
 		Visual: null,
 		Content: null
-	}), w = S ? l.cloneElement(S, { className: e(S.props.className, o === "gridline" && c["River__visual--has-background"]) }) : null;
+	}), w = x?.props.position ?? "default", T = x?.props.padding ?? "default";
+	(w !== "default" || T !== "default") && o !== "gridline" && (process.env.NODE_ENV === "development" || process.env.NODE_ENV === "test") && console.warn(`River: River.Visual position and padding are only supported when River uses variant="gridline"; ignoring position="${w}" and padding="${T}".`);
+	let E = x ? l.cloneElement(x, { className: e(x.props.className, o === "gridline" && c["River__visual--has-background"]) }) : null;
 	return /* @__PURE__ */ p("section", {
 		ref: _,
-		className: e(c.River, c[`River--${r.replace(":", "-")}`], c[`River--align-${i}`], c[`River--variant-${o}`], o === "gridline" && a.gridline, b, s),
+		className: e(c.River, c[`River--${r.replace(":", "-")}`], c[`River--align-${i}`], c[`River--variant-${o}`], o === "gridline" && a.gridline, y, s),
 		style: {
-			...x,
+			...b,
 			...d
 		},
 		...f,
-		children: [C, w]
+		children: [C, E]
 	});
 }), v = u(({ align: a = "center", animate: u, children: m, className: h, leadingComponent: g, trailingComponent: _, trailingComponentDivider: v = !1, style: y, ...b }, x) => {
 	let { classes: S, styles: C } = t(u), w = d(() => l.Children.toArray(m), [m]), T = w.find((e) => l.isValidElement(e) && e.type === i), E = w.find((e) => l.isValidElement(e) && e.type === n), D = w.find((e) => l.isValidElement(e) && e.type === o), O = w.find((e) => l.isValidElement(e) && e.type === s), k = w.find((e) => l.isValidElement(e) && e.type === r);
@@ -46,7 +48,10 @@ var m = "50:50", h = "start", g = "default", _ = u(({ animate: n, imageTextRatio
 				className: c.River__label,
 				children: k
 			}),
-			!O && !k && g && /* @__PURE__ */ f("div", { children: /* @__PURE__ */ f(g, {}) }),
+			!O && !k && g && /* @__PURE__ */ f("div", {
+				className: c.River__leadingComponent,
+				children: /* @__PURE__ */ f(g, {})
+			}),
 			l.isValidElement(T) && /* @__PURE__ */ f("div", {
 				className: c.River__heading,
 				children: l.cloneElement(T, {
@@ -77,16 +82,30 @@ var m = "50:50", h = "start", g = "default", _ = u(({ animate: n, imageTextRatio
 			})
 		]
 	});
-}), y = u(({ fillMedia: t = !0, children: n, className: r, hasShadow: i = !1, rounded: a = !0, ...o }, s) => /* @__PURE__ */ f("div", {
+}), y = [
+	"default",
+	"center",
+	"block-end",
+	"block-end-inline-start",
+	"block-end-inline-end"
+], b = [
+	"default",
+	"none",
+	"all"
+], x = u(({ fillMedia: t = !0, children: n, className: r, hasShadow: i = !1, rounded: a = !0, ...o }, s) => /* @__PURE__ */ f("div", {
 	ref: s,
 	className: e(c.River__visual, i && c["River__visual--has-shadow"], t && c["River__visual--fill-media"], a && c["River__visual--rounded"], r),
 	...o,
 	children: n
-})), b = Object.assign(_, {
-	Visual: y,
+})), S = u(({ className: t, position: n = "default", padding: r = "default", ...i }, a) => /* @__PURE__ */ f(x, {
+	ref: a,
+	className: e(n !== "default" && c[`River__visual--position-${n}`], r !== "default" && c[`River__visual--padding-${r}`], t),
+	...i
+})), C = Object.assign(_, {
+	Visual: S,
 	Content: v
 });
 //#endregion
-export { b as River, v as RiverContent, y as Visual, h as defaultRiverAlign, m as defaultRiverImageTextRatio, g as defaultRiverVariant };
+export { C as River, v as RiverContent, x as RiverVisualBase, b as RiverVisualPaddingOptions, y as RiverVisualPositionOptions, h as defaultRiverAlign, m as defaultRiverImageTextRatio, g as defaultRiverVariant };
 
 //# sourceMappingURL=River.js.map