@primer/react-brand 0.75.0-rc.c3abcc84 → 0.75.0

package/esm/Link/Link.module.js

@@ -1,5 +1,6 @@
-import './Link.module-CiGiy5gk.css';var e = {
-	Link: "Primer_Brand__Link-module__Link___lF11y",
+import './Link.module-CiGiy5gk.css';//#region src/Link/Link.module.css
+var e = "Primer_Brand__Link-module__Link___lF11y", t = {
+	Link: e,
 	"Link--arrow-start": "Primer_Brand__Link-module__Link--arrow-start___Cyw51",
 	"Link--arrow-end": "Primer_Brand__Link-module__Link--arrow-end___esdN8",
 	"Link--large": "Primer_Brand__Link-module__Link--large___mTWWi",
@@ -10,6 +11,6 @@ import './Link.module-CiGiy5gk.css';var e = {
 	"Link-arrow": "Primer_Brand__Link-module__Link-arrow___yd78i"
 };
 //#endregion
-export { e as default };
+export { e as Link, t as default };
 
 //# sourceMappingURL=Link.module.js.map

package/esm/LogoSuite/LogoSuite.d.ts

@@ -62,7 +62,7 @@ export type LogoSuiteLogoBarProps = BaseProps<HTMLDivElement> & {
  * Use LogoSuite to present a list of logos, such as sponsors or vendors.
  * @see https://primer.style/brand/components/LogoSuite
  */
-export declare const LogoSuite: (({ align, children, className, hasDivider, variant, "data-testid": testId, }: PropsWithChildren<LogoSuiteProps>) => import("react/jsx-runtime").JSX.Element) & {
+export declare const LogoSuite: (({ align, children, className, hasDivider, variant, "data-testid": testId, }: PropsWithChildren<LogoSuiteProps>) => React.JSX.Element) & {
     Heading: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<LogoSuiteHeadingProps>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
     Description: React.ForwardRefExoticComponent<(Omit<BaseProps<HTMLParagraphElement> & {
         font?: import("../Text").TextFontVariants;

package/esm/LogoSuite/LogoSuite.js

@@ -1,11 +1,12 @@
-import e from "../node_modules/clsx/dist/clsx.js";
+import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { Grid as t } from "../Grid/Grid.js";
 import { useReducedMotion as n } from "../hooks/useReducedMotion.js";
 import { Text as r } from "../Text/Text.js";
 import { Heading as i, defaultHeadingTag as a } from "../Heading/Heading.js";
 import { Button as o } from "../Button/Button.js";
-import { PauseIcon as s, PlayIcon as c } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes-B8ia26TA.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/logosuite/base-DTi5Rx4y.css';/* empty css                                                                                                       */
+import { PauseIcon as s } from "../node_modules/@primer/octicons-react/dist/icons/PauseIcon.js";
+import { PlayIcon as c } from "../node_modules/@primer/octicons-react/dist/icons/PlayIcon.js";
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/logosuite/base-DTi5Rx4y.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes-B8ia26TA.css';/* empty css                                                                                                       */
 /* empty css                                                                                          */
 import l from "./LogoSuite.module.js";
 import u, { forwardRef as d, useCallback as f, useEffect as p, useMemo as m, useState as h } from "react";

package/esm/LogoSuite/LogoSuite.js.map

@@ -1 +1 @@
-{"version":3,"file":"LogoSuite.js","names":[],"sources":["../../src/LogoSuite/LogoSuite.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {type PropsWithChildren, type Ref, forwardRef, useCallback, useEffect, useMemo, useState} from 'react'\nimport {useReducedMotion} from '../hooks/useReducedMotion'\nimport {PauseIcon, PlayIcon} from '@primer/octicons-react'\nimport type {BaseProps} from '../component-helpers'\nimport {Heading, HeadingProps, defaultHeadingTag, Text, TextProps, Grid, Button} from '../'\n\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/logosuite/base.css'\n\n/** * Main Stylesheet (as a CSS Module) */\nimport styles from './LogoSuite.module.css'\n\nconst testIds = {\n  root: 'LogoSuite',\n  get marqueeGroup() {\n    return `${this.root}-marqueeGroup`\n  },\n}\n\nexport type LogoSuiteProps = {\n  /**\n   * The horizontal alignment of the LogoSuite.\n   */\n  align?: 'start' | 'center' | 'justify'\n  /**\n   * Whether to render a divider immediately after the LogoSuite.\n   */\n  hasDivider?: boolean\n  /**\n   * Test id for the root LogoSuite element.\n   */\n  'data-testid'?: string\n  /**\n   * Alternative presentation\n   */\n  variant?: 'default' | 'gridline-expressive'\n} & BaseProps<HTMLDivElement> &\n  React.HTMLAttributes<HTMLDivElement>\n\nconst LogoSuiteBase = ({\n  align = 'center',\n  children,\n  className,\n  hasDivider = true,\n  variant = 'default',\n  'data-testid': testId,\n}: PropsWithChildren<LogoSuiteProps>) => {\n  const childrenArray = useMemo(() => React.Children.toArray(children), [children])\n\n  const HeadingChild = childrenArray.find(child => {\n    return React.isValidElement(child) && child.type === _Heading\n  })\n\n  const DescriptionChild = childrenArray.find(child => {\n    return React.isValidElement(child) && child.type === _Description\n  })\n\n  const LogobarChild = childrenArray.find(child => {\n    return React.isValidElement(child) && child.type === _LogoBar\n  })\n\n  if (!HeadingChild) {\n    if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {\n      // eslint-disable-next-line no-console\n      console.warn('LogoSuite: Heading child is required. You may use `visuallyHidden` to hide it from view.')\n    }\n  }\n\n  const isHeadingVisuallyHidden =\n    React.isValidElement<LogoSuiteHeadingProps>(HeadingChild) && HeadingChild.props.visuallyHidden\n  const isGridlineExpressive = variant === 'gridline-expressive'\n  const hasVisibleTextContent = isGridlineExpressive && ((HeadingChild && !isHeadingVisuallyHidden) || DescriptionChild)\n\n  return (\n    <div\n      className={clsx(\n        styles.LogoSuite,\n        styles[`LogoSuite--${align}`],\n        hasDivider && styles['LogoSuite--hasDivider'],\n        styles[`LogoSuite--${variant}`],\n        className,\n      )}\n      data-testid={testId}\n    >\n      {isGridlineExpressive ? (\n        <Grid className={styles['LogoSuite__content']}>\n          {hasVisibleTextContent && (\n            <Grid.Column span={{large: 3}} className={styles['LogoSuite__textContainer']}>\n              {HeadingChild}\n              {DescriptionChild}\n            </Grid.Column>\n          )}\n          <Grid.Column span={{large: hasVisibleTextContent ? 9 : 12}} className={styles['LogoSuite__logobarContainer']}>\n            {!hasVisibleTextContent && isHeadingVisuallyHidden && HeadingChild}\n            {LogobarChild}\n          </Grid.Column>\n        </Grid>\n      ) : (\n        <>\n          {HeadingChild}\n          {DescriptionChild}\n          {LogobarChild}\n        </>\n      )}\n    </div>\n  )\n}\n\nexport type LogoSuiteHeadingProps = BaseProps<HTMLHeadingElement> &\n  HeadingProps & {\n    /**\n     * Whether to visually hide the heading.\n     */\n    visuallyHidden?: boolean\n  }\n\nconst _Heading = forwardRef(\n  (\n    {\n      as = defaultHeadingTag,\n      size = 'subhead-large',\n      className,\n      children,\n      visuallyHidden,\n      ...props\n    }: PropsWithChildren<LogoSuiteHeadingProps>,\n    ref: Ref<HTMLHeadingElement>,\n  ) => {\n    return (\n      <Heading\n        ref={ref}\n        className={clsx(\n          styles['LogoSuite__heading'],\n          visuallyHidden && styles['LogoSuite__heading--visually-hidden'],\n          visuallyHidden && 'visually-hidden',\n          className,\n        )}\n        size={size}\n        as={as}\n        {...props}\n      >\n        {children}\n      </Heading>\n    )\n  },\n)\n\nexport type LogoSuiteDescriptionProps = BaseProps<HTMLParagraphElement> &\n  TextProps & {\n    children: React.ReactNode | React.ReactNode[]\n  }\n\nconst _Description = forwardRef(\n  (\n    {className, children, size = '200', variant = 'muted', ...props}: LogoSuiteDescriptionProps,\n    ref: Ref<HTMLParagraphElement>,\n  ) => {\n    return (\n      <Text\n        as=\"p\"\n        ref={ref}\n        size={size}\n        variant={variant}\n        className={clsx(styles['LogoSuite__description'], className)}\n        {...props}\n      >\n        {children}\n      </Text>\n    )\n  },\n)\n\ntype PlayPauseButtonProps = {\n  isPlaying?: boolean\n  onPlayPause?: (isPlaying: boolean) => void\n}\n\nconst PlayPauseButton = ({isPlaying = true, onPlayPause}: PlayPauseButtonProps) => {\n  const onClick = useCallback(() => {\n    onPlayPause?.(!isPlaying)\n  }, [onPlayPause, isPlaying])\n\n  /**\n   * aria-pressed is intentionally not used here to prevent potentially confusing screen reader announcements\n   * eg \"Play animation on\" or \"Pause animation off\"\n   */\n  return (\n    <button\n      className={styles['LogoSuite__logobar-playPauseButton']}\n      type=\"button\"\n      onClick={onClick}\n      aria-label={isPlaying ? 'Pause animation' : 'Play animation'}\n    >\n      {isPlaying ? <PauseIcon /> : <PlayIcon />}\n    </button>\n  )\n}\n\nexport type LogoSuiteLogoBarProps = BaseProps<HTMLDivElement> & {\n  children: React.ReactNode | React.ReactNode[]\n  /**\n   * The gap between logos\n   */\n  gap?: 'default' | 'condensed'\n  /**\n   * Enables an optional marquee effect\n   */\n  marquee?: boolean\n  /**\n   * The speed of the marquee effect\n   */\n  marqueeSpeed?: 'slow' | 'normal' | 'idle'\n  /**\n   * The stylistic variant of the LogoBar.\n   */\n  variant?: 'muted' | 'emphasis'\n  /**\n   * Displays an optional takeover button (as an anchor) on hover/focus.\n   */\n  takeoverButton?: {\n    label: string\n  } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> &\n    BaseProps<HTMLAnchorElement>\n}\n\nconst _LogoBar = forwardRef(\n  (\n    {\n      className,\n      children,\n      gap = 'default',\n      marquee = false,\n      marqueeSpeed = 'normal',\n      variant = 'muted',\n      takeoverButton,\n      ...props\n    }: LogoSuiteLogoBarProps,\n    ref: Ref<HTMLDivElement>,\n  ) => {\n    const prefersReducedMotion = useReducedMotion()\n    const [isPlaying, setIsPlaying] = useState(() => marquee && !prefersReducedMotion && marqueeSpeed !== 'idle')\n\n    useEffect(() => {\n      setIsPlaying(marquee && !prefersReducedMotion && marqueeSpeed !== 'idle')\n    }, [marquee, prefersReducedMotion, marqueeSpeed])\n\n    if (marquee && takeoverButton) {\n      if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {\n        // eslint-disable-next-line no-console\n        console.warn(\n          'LogoSuite.Logobar: `takeoverButton` cant be used with `marquee` prop due to accessibility risks. Set `marquee={false}` to use the takeover feature.',\n        )\n      }\n    }\n\n    const defaultProps = {\n      ref,\n      className: clsx(\n        styles['LogoSuite__logobar'],\n        styles[`LogoSuite__logobar--variant-${variant}`],\n        styles[`LogoSuite__logobar--gap-${gap}`],\n        className,\n      ),\n      ...props,\n    }\n\n    const [isFocusWithin, setIsFocusWithin] = useState(false)\n\n    const handleFocus = useCallback(() => {\n      setIsFocusWithin(true)\n    }, [])\n\n    const handleBlur = useCallback((event: React.FocusEvent) => {\n      if (!event.currentTarget.contains(event.relatedTarget as Node)) {\n        setIsFocusWithin(false)\n      }\n    }, [])\n\n    const renderTakeoverButton = () => {\n      if (!takeoverButton) return null\n      const {className: takeoverButtonClassName, label, ref: _ref, ...takeoverButtonProps} = takeoverButton\n      return (\n        <div className={styles['LogoSuite__logobar-takeoverButtonContainer']}>\n          <Button\n            as=\"a\"\n            variant=\"primary\"\n            className={clsx(styles['LogoSuite__logobar-takeoverButton'], takeoverButtonClassName)}\n            {...takeoverButtonProps}\n          >\n            {label}\n          </Button>\n        </div>\n      )\n    }\n\n    if (marquee) {\n      const {className: marqueeDefaultClassName, ...restProps} = defaultProps\n      const shouldPause = !isPlaying || prefersReducedMotion\n      return (\n        <div\n          {...restProps}\n          className={clsx(\n            styles['LogoSuite__logobar--has-marquee'],\n            marqueeDefaultClassName,\n            shouldPause && styles['LogoSuite__logobar--paused'],\n          )}\n        >\n          <div\n            className={clsx(\n              styles['LogoSuite__logobar-marquee'],\n              isFocusWithin && styles['LogoSuite__logobar-marquee--focused'],\n            )}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n          >\n            <div\n              className={clsx(\n                styles['LogoSuite__logobar-marqueeGroup'],\n                styles[`LogoSuite__logobar-marqueeGroup--speed-${marqueeSpeed}`],\n              )}\n              data-testid={testIds.marqueeGroup}\n            >\n              {children}\n            </div>\n            <div\n              inert\n              aria-hidden=\"true\"\n              className={clsx(\n                styles['LogoSuite__logobar-marqueeGroup'],\n                styles[`LogoSuite__logobar-marqueeGroup--speed-${marqueeSpeed}`],\n              )}\n            >\n              {children}\n            </div>\n          </div>\n          <PlayPauseButton onPlayPause={setIsPlaying} isPlaying={isPlaying} />\n        </div>\n      )\n    }\n\n    if (takeoverButton) {\n      const {className: defaultClassName, ...restProps} = defaultProps\n      return (\n        <div {...restProps} className={clsx(defaultClassName, styles['LogoSuite__logobar--has-takeover'])}>\n          {children}\n          {renderTakeoverButton()}\n        </div>\n      )\n    }\n\n    return <div {...defaultProps}>{children}</div>\n  },\n)\n\n/**\n * Use LogoSuite to present a list of logos, such as sponsors or vendors.\n * @see https://primer.style/brand/components/LogoSuite\n */\nexport const LogoSuite = Object.assign(LogoSuiteBase, {\n  Heading: _Heading,\n  Description: _Description,\n  Logobar: _LogoBar,\n  testIds,\n})\n"],"mappings":"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"}
+{"version":3,"file":"LogoSuite.js","names":[],"sources":["../../src/LogoSuite/LogoSuite.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {type PropsWithChildren, type Ref, forwardRef, useCallback, useEffect, useMemo, useState} from 'react'\nimport {useReducedMotion} from '../hooks/useReducedMotion'\nimport {PauseIcon, PlayIcon} from '@primer/octicons-react'\nimport type {BaseProps} from '../component-helpers'\nimport {Heading, HeadingProps, defaultHeadingTag, Text, TextProps, Grid, Button} from '../'\n\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/logosuite/base.css'\n\n/** * Main Stylesheet (as a CSS Module) */\nimport styles from './LogoSuite.module.css'\n\nconst testIds = {\n  root: 'LogoSuite',\n  get marqueeGroup() {\n    return `${this.root}-marqueeGroup`\n  },\n}\n\nexport type LogoSuiteProps = {\n  /**\n   * The horizontal alignment of the LogoSuite.\n   */\n  align?: 'start' | 'center' | 'justify'\n  /**\n   * Whether to render a divider immediately after the LogoSuite.\n   */\n  hasDivider?: boolean\n  /**\n   * Test id for the root LogoSuite element.\n   */\n  'data-testid'?: string\n  /**\n   * Alternative presentation\n   */\n  variant?: 'default' | 'gridline-expressive'\n} & BaseProps<HTMLDivElement> &\n  React.HTMLAttributes<HTMLDivElement>\n\nconst LogoSuiteBase = ({\n  align = 'center',\n  children,\n  className,\n  hasDivider = true,\n  variant = 'default',\n  'data-testid': testId,\n}: PropsWithChildren<LogoSuiteProps>) => {\n  const childrenArray = useMemo(() => React.Children.toArray(children), [children])\n\n  const HeadingChild = childrenArray.find(child => {\n    return React.isValidElement(child) && child.type === _Heading\n  })\n\n  const DescriptionChild = childrenArray.find(child => {\n    return React.isValidElement(child) && child.type === _Description\n  })\n\n  const LogobarChild = childrenArray.find(child => {\n    return React.isValidElement(child) && child.type === _LogoBar\n  })\n\n  if (!HeadingChild) {\n    if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {\n      // eslint-disable-next-line no-console\n      console.warn('LogoSuite: Heading child is required. You may use `visuallyHidden` to hide it from view.')\n    }\n  }\n\n  const isHeadingVisuallyHidden =\n    React.isValidElement<LogoSuiteHeadingProps>(HeadingChild) && HeadingChild.props.visuallyHidden\n  const isGridlineExpressive = variant === 'gridline-expressive'\n  const hasVisibleTextContent = isGridlineExpressive && ((HeadingChild && !isHeadingVisuallyHidden) || DescriptionChild)\n\n  return (\n    <div\n      className={clsx(\n        styles.LogoSuite,\n        styles[`LogoSuite--${align}`],\n        hasDivider && styles['LogoSuite--hasDivider'],\n        styles[`LogoSuite--${variant}`],\n        className,\n      )}\n      data-testid={testId}\n    >\n      {isGridlineExpressive ? (\n        <Grid className={styles['LogoSuite__content']}>\n          {hasVisibleTextContent && (\n            <Grid.Column span={{large: 3}} className={styles['LogoSuite__textContainer']}>\n              {HeadingChild}\n              {DescriptionChild}\n            </Grid.Column>\n          )}\n          <Grid.Column span={{large: hasVisibleTextContent ? 9 : 12}} className={styles['LogoSuite__logobarContainer']}>\n            {!hasVisibleTextContent && isHeadingVisuallyHidden && HeadingChild}\n            {LogobarChild}\n          </Grid.Column>\n        </Grid>\n      ) : (\n        <>\n          {HeadingChild}\n          {DescriptionChild}\n          {LogobarChild}\n        </>\n      )}\n    </div>\n  )\n}\n\nexport type LogoSuiteHeadingProps = BaseProps<HTMLHeadingElement> &\n  HeadingProps & {\n    /**\n     * Whether to visually hide the heading.\n     */\n    visuallyHidden?: boolean\n  }\n\nconst _Heading = forwardRef(\n  (\n    {\n      as = defaultHeadingTag,\n      size = 'subhead-large',\n      className,\n      children,\n      visuallyHidden,\n      ...props\n    }: PropsWithChildren<LogoSuiteHeadingProps>,\n    ref: Ref<HTMLHeadingElement>,\n  ) => {\n    return (\n      <Heading\n        ref={ref}\n        className={clsx(\n          styles['LogoSuite__heading'],\n          visuallyHidden && styles['LogoSuite__heading--visually-hidden'],\n          visuallyHidden && 'visually-hidden',\n          className,\n        )}\n        size={size}\n        as={as}\n        {...props}\n      >\n        {children}\n      </Heading>\n    )\n  },\n)\n\nexport type LogoSuiteDescriptionProps = BaseProps<HTMLParagraphElement> &\n  TextProps & {\n    children: React.ReactNode | React.ReactNode[]\n  }\n\nconst _Description = forwardRef(\n  (\n    {className, children, size = '200', variant = 'muted', ...props}: LogoSuiteDescriptionProps,\n    ref: Ref<HTMLParagraphElement>,\n  ) => {\n    return (\n      <Text\n        as=\"p\"\n        ref={ref}\n        size={size}\n        variant={variant}\n        className={clsx(styles['LogoSuite__description'], className)}\n        {...props}\n      >\n        {children}\n      </Text>\n    )\n  },\n)\n\ntype PlayPauseButtonProps = {\n  isPlaying?: boolean\n  onPlayPause?: (isPlaying: boolean) => void\n}\n\nconst PlayPauseButton = ({isPlaying = true, onPlayPause}: PlayPauseButtonProps) => {\n  const onClick = useCallback(() => {\n    onPlayPause?.(!isPlaying)\n  }, [onPlayPause, isPlaying])\n\n  /**\n   * aria-pressed is intentionally not used here to prevent potentially confusing screen reader announcements\n   * eg \"Play animation on\" or \"Pause animation off\"\n   */\n  return (\n    <button\n      className={styles['LogoSuite__logobar-playPauseButton']}\n      type=\"button\"\n      onClick={onClick}\n      aria-label={isPlaying ? 'Pause animation' : 'Play animation'}\n    >\n      {isPlaying ? <PauseIcon /> : <PlayIcon />}\n    </button>\n  )\n}\n\nexport type LogoSuiteLogoBarProps = BaseProps<HTMLDivElement> & {\n  children: React.ReactNode | React.ReactNode[]\n  /**\n   * The gap between logos\n   */\n  gap?: 'default' | 'condensed'\n  /**\n   * Enables an optional marquee effect\n   */\n  marquee?: boolean\n  /**\n   * The speed of the marquee effect\n   */\n  marqueeSpeed?: 'slow' | 'normal' | 'idle'\n  /**\n   * The stylistic variant of the LogoBar.\n   */\n  variant?: 'muted' | 'emphasis'\n  /**\n   * Displays an optional takeover button (as an anchor) on hover/focus.\n   */\n  takeoverButton?: {\n    label: string\n  } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> &\n    BaseProps<HTMLAnchorElement>\n}\n\nconst _LogoBar = forwardRef(\n  (\n    {\n      className,\n      children,\n      gap = 'default',\n      marquee = false,\n      marqueeSpeed = 'normal',\n      variant = 'muted',\n      takeoverButton,\n      ...props\n    }: LogoSuiteLogoBarProps,\n    ref: Ref<HTMLDivElement>,\n  ) => {\n    const prefersReducedMotion = useReducedMotion()\n    const [isPlaying, setIsPlaying] = useState(() => marquee && !prefersReducedMotion && marqueeSpeed !== 'idle')\n\n    useEffect(() => {\n      setIsPlaying(marquee && !prefersReducedMotion && marqueeSpeed !== 'idle')\n    }, [marquee, prefersReducedMotion, marqueeSpeed])\n\n    if (marquee && takeoverButton) {\n      if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {\n        // eslint-disable-next-line no-console\n        console.warn(\n          'LogoSuite.Logobar: `takeoverButton` cant be used with `marquee` prop due to accessibility risks. Set `marquee={false}` to use the takeover feature.',\n        )\n      }\n    }\n\n    const defaultProps = {\n      ref,\n      className: clsx(\n        styles['LogoSuite__logobar'],\n        styles[`LogoSuite__logobar--variant-${variant}`],\n        styles[`LogoSuite__logobar--gap-${gap}`],\n        className,\n      ),\n      ...props,\n    }\n\n    const [isFocusWithin, setIsFocusWithin] = useState(false)\n\n    const handleFocus = useCallback(() => {\n      setIsFocusWithin(true)\n    }, [])\n\n    const handleBlur = useCallback((event: React.FocusEvent) => {\n      if (!event.currentTarget.contains(event.relatedTarget as Node)) {\n        setIsFocusWithin(false)\n      }\n    }, [])\n\n    const renderTakeoverButton = () => {\n      if (!takeoverButton) return null\n      const {className: takeoverButtonClassName, label, ref: _ref, ...takeoverButtonProps} = takeoverButton\n      return (\n        <div className={styles['LogoSuite__logobar-takeoverButtonContainer']}>\n          <Button\n            as=\"a\"\n            variant=\"primary\"\n            className={clsx(styles['LogoSuite__logobar-takeoverButton'], takeoverButtonClassName)}\n            {...takeoverButtonProps}\n          >\n            {label}\n          </Button>\n        </div>\n      )\n    }\n\n    if (marquee) {\n      const {className: marqueeDefaultClassName, ...restProps} = defaultProps\n      const shouldPause = !isPlaying || prefersReducedMotion\n      return (\n        <div\n          {...restProps}\n          className={clsx(\n            styles['LogoSuite__logobar--has-marquee'],\n            marqueeDefaultClassName,\n            shouldPause && styles['LogoSuite__logobar--paused'],\n          )}\n        >\n          <div\n            className={clsx(\n              styles['LogoSuite__logobar-marquee'],\n              isFocusWithin && styles['LogoSuite__logobar-marquee--focused'],\n            )}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n          >\n            <div\n              className={clsx(\n                styles['LogoSuite__logobar-marqueeGroup'],\n                styles[`LogoSuite__logobar-marqueeGroup--speed-${marqueeSpeed}`],\n              )}\n              data-testid={testIds.marqueeGroup}\n            >\n              {children}\n            </div>\n            <div\n              inert\n              aria-hidden=\"true\"\n              className={clsx(\n                styles['LogoSuite__logobar-marqueeGroup'],\n                styles[`LogoSuite__logobar-marqueeGroup--speed-${marqueeSpeed}`],\n              )}\n            >\n              {children}\n            </div>\n          </div>\n          <PlayPauseButton onPlayPause={setIsPlaying} isPlaying={isPlaying} />\n        </div>\n      )\n    }\n\n    if (takeoverButton) {\n      const {className: defaultClassName, ...restProps} = defaultProps\n      return (\n        <div {...restProps} className={clsx(defaultClassName, styles['LogoSuite__logobar--has-takeover'])}>\n          {children}\n          {renderTakeoverButton()}\n        </div>\n      )\n    }\n\n    return <div {...defaultProps}>{children}</div>\n  },\n)\n\n/**\n * Use LogoSuite to present a list of logos, such as sponsors or vendors.\n * @see https://primer.style/brand/components/LogoSuite\n */\nexport const LogoSuite = Object.assign(LogoSuiteBase, {\n  Heading: _Heading,\n  Description: _Description,\n  Logobar: _LogoBar,\n  testIds,\n})\n"],"mappings":"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"}

package/esm/LogoSuite/LogoSuite.module.js

@@ -1,12 +1,13 @@
-import './LogoSuite.module-BCbX-lfy.css';var e = {
-	LogoSuite: "Primer_Brand__LogoSuite-module__LogoSuite___bHvbJ",
+import './LogoSuite.module-BCbX-lfy.css';//#region src/LogoSuite/LogoSuite.module.css
+var e = "Primer_Brand__LogoSuite-module__LogoSuite___bHvbJ", t = "Primer_Brand__LogoSuite-module__LogoSuite__description___J_Sms", n = "Primer_Brand__LogoSuite-module__LogoSuite__heading___PsSGL", r = "Primer_Brand__LogoSuite-module__LogoSuite__logobar___3IogC", i = "Primer_Brand__LogoSuite-module__LogobarScrollX___eGhi4", a = "Primer_Brand__LogoSuite-module__LogoSuite__content____8K_Y", o = "Primer_Brand__LogoSuite-module__LogoSuite__textContainer___OB63e", s = "Primer_Brand__LogoSuite-module__LogoSuite__logobarContainer___RcqbC", c = {
+	LogoSuite: e,
 	"LogoSuite--default": "Primer_Brand__LogoSuite-module__LogoSuite--default___mbLiN",
-	LogoSuite__description: "Primer_Brand__LogoSuite-module__LogoSuite__description___J_Sms",
-	LogoSuite__heading: "Primer_Brand__LogoSuite-module__LogoSuite__heading___PsSGL",
+	LogoSuite__description: t,
+	LogoSuite__heading: n,
 	"LogoSuite--start": "Primer_Brand__LogoSuite-module__LogoSuite--start___zqwlX",
 	"LogoSuite--center": "Primer_Brand__LogoSuite-module__LogoSuite--center___j119b",
 	"LogoSuite--justify": "Primer_Brand__LogoSuite-module__LogoSuite--justify___MTk0u",
-	LogoSuite__logobar: "Primer_Brand__LogoSuite-module__LogoSuite__logobar___3IogC",
+	LogoSuite__logobar: r,
 	"LogoSuite__logobar--gap-default": "Primer_Brand__LogoSuite-module__LogoSuite__logobar--gap-default___sGwUx",
 	"LogoSuite__logobar--gap-condensed": "Primer_Brand__LogoSuite-module__LogoSuite__logobar--gap-condensed___T86E8",
 	"LogoSuite__heading--visually-hidden": "Primer_Brand__LogoSuite-module__LogoSuite__heading--visually-hidden___oZzlO",
@@ -15,7 +16,7 @@ import './LogoSuite.module-BCbX-lfy.css';var e = {
 	"LogoSuite--hasDivider": "Primer_Brand__LogoSuite-module__LogoSuite--hasDivider___Wj8u_",
 	"LogoSuite__logobar--has-marquee": "Primer_Brand__LogoSuite-module__LogoSuite__logobar--has-marquee___tyW6K",
 	"LogoSuite__logobar-marqueeGroup": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-marqueeGroup___bUhyS",
-	LogobarScrollX: "Primer_Brand__LogoSuite-module__LogobarScrollX___eGhi4",
+	LogobarScrollX: i,
 	"LogoSuite__logobar-marqueeGroup--speed-default": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-marqueeGroup--speed-default___nsm9D",
 	"LogoSuite__logobar-marqueeGroup--speed-slow": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-marqueeGroup--speed-slow___NZHrb",
 	"LogoSuite__logobar-marquee": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-marquee____s6pK",
@@ -23,13 +24,13 @@ import './LogoSuite.module-BCbX-lfy.css';var e = {
 	"LogoSuite__logobar-marquee--focused": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-marquee--focused___zizoE",
 	"LogoSuite__logobar-playPauseButton": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-playPauseButton___KDfie",
 	"LogoSuite--gridline-expressive": "Primer_Brand__LogoSuite-module__LogoSuite--gridline-expressive___86D16",
-	LogoSuite__content: "Primer_Brand__LogoSuite-module__LogoSuite__content____8K_Y",
-	LogoSuite__textContainer: "Primer_Brand__LogoSuite-module__LogoSuite__textContainer___OB63e",
-	LogoSuite__logobarContainer: "Primer_Brand__LogoSuite-module__LogoSuite__logobarContainer___RcqbC",
+	LogoSuite__content: a,
+	LogoSuite__textContainer: o,
+	LogoSuite__logobarContainer: s,
 	"LogoSuite__logobar--has-takeover": "Primer_Brand__LogoSuite-module__LogoSuite__logobar--has-takeover___ZQbXf",
 	"LogoSuite__logobar-takeoverButtonContainer": "Primer_Brand__LogoSuite-module__LogoSuite__logobar-takeoverButtonContainer___ehoEd"
 };
 //#endregion
-export { e as default };
+export { e as LogoSuite, a as LogoSuite__content, t as LogoSuite__description, n as LogoSuite__heading, r as LogoSuite__logobar, s as LogoSuite__logobarContainer, o as LogoSuite__textContainer, i as LogobarScrollX, c as default };
 
 //# sourceMappingURL=LogoSuite.module.js.map

package/esm/MediaPlaylist/MediaPlaylist.d.ts

@@ -27,22 +27,22 @@ type MediaPlaylistHeadingInternalProps = {
     activeIndex?: number | null;
     itemCount?: number;
 };
-declare function MediaPlaylistHeading({ activeIndex, as, children, className, id, itemCount, ...props }: MediaPlaylistHeadingProps & MediaPlaylistHeadingInternalProps): import("react/jsx-runtime").JSX.Element;
+declare function MediaPlaylistHeading({ activeIndex, as, children, className, id, itemCount, ...props }: MediaPlaylistHeadingProps & MediaPlaylistHeadingInternalProps): React.JSX.Element;
 export type MediaPlaylistItemProps = React.PropsWithChildren<{
     /**
      * An optional thumbnail to be shown in the playlist for this item.
      */
     thumbnail?: React.ReactNode;
 } & BaseProps<HTMLDivElement>>;
-declare function MediaPlaylistItem({ children }: MediaPlaylistItemProps): import("react/jsx-runtime").JSX.Element;
+declare function MediaPlaylistItem({ children }: MediaPlaylistItemProps): React.JSX.Element;
 export type MediaPlaylistItemHeadingProps = Omit<TextProps, 'as' | 'children' | 'title'> & {
     children?: React.ReactNode;
     description?: React.ReactNode;
     title?: React.ReactNode;
 };
-declare function MediaPlaylistItemHeading({ children, className, description, font, size, title, variant, weight, ...props }: MediaPlaylistItemHeadingProps): import("react/jsx-runtime").JSX.Element;
+declare function MediaPlaylistItemHeading({ children, className, description, font, size, title, variant, weight, ...props }: MediaPlaylistItemHeadingProps): React.JSX.Element;
 export type MediaPlaylistItemContentProps = React.HTMLAttributes<HTMLDivElement>;
-declare function MediaPlaylistItemContent({ children, className, ...props }: MediaPlaylistItemContentProps): import("react/jsx-runtime").JSX.Element;
+declare function MediaPlaylistItemContent({ children, className, ...props }: MediaPlaylistItemContentProps): React.JSX.Element;
 export type MediaPlaylistItemMediaProps = React.HTMLAttributes<HTMLDivElement>;
 /**
  * Use MediaPlaylist to pair media playback with an itemized, thumbnail-backed playlist.

package/esm/MediaPlaylist/MediaPlaylist.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaPlaylist.d.ts","sourceRoot":"","sources":["../../src/MediaPlaylist/MediaPlaylist.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAGrD,OAAO,EAAgB,KAAK,YAAY,EAAE,KAAK,SAAS,EAAC,MAAM,IAAI,CAAA;AAKnE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AACnD;;GAEG;AACH,OAAO,kHAAkH,CAAA;AAOzH,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACvD;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAC,GACA,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAA;AA6HxD,MAAM,MAAM,yBAAyB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC9D,EAAE,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAA;CACvC,CAAC,GACA,SAAS,CAAC,cAAc,CAAC,CAAA;AAE3B,KAAK,iCAAiC,GAAG;IACvC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,iBAAS,oBAAoB,CAAC,EAC5B,WAAkB,EAClB,EAAS,EACT,QAAQ,EACR,SAAS,EACT,EAAE,EACF,SAAa,EACb,GAAG,KAAK,EACT,EAAE,yBAAyB,GAAG,iCAAiC,2CAa/D;AAED,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,iBAAiB,CAC1D;IACE;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC5B,GAAG,SAAS,CAAC,cAAc,CAAC,CAC9B,CAAA;AAED,iBAAS,iBAAiB,CAAC,EAAC,QAAQ,EAAC,EAAE,sBAAsB,2CAE5D;AAED,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,UAAU,GAAG,OAAO,CAAC,GAAG;IACzF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,CAAA;AAED,iBAAS,wBAAwB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,WAAW,EACX,IAAkB,EAClB,IAAY,EACZ,KAAK,EACL,OAAmB,EACnB,MAAiB,EACjB,GAAG,KAAK,EACT,EAAE,6BAA6B,2CA4B/B;AAED,MAAM,MAAM,6BAA6B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEhF,iBAAS,wBAAwB,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,6BAA6B,2CAM/F;AAED,MAAM,MAAM,2BAA2B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAyB9E;;GAEG;AACH,eAAO,MAAM,aAAa;IA7QxB;;OAEG;2BACoB,MAAM;IAC7B;;OAEG;oBACa,MAAM;IACtB;;OAEG;eACQ,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI;oBAC1B,MAAM;;;;;;;;;;;;CAwQtB,CAAA"}
+{"version":3,"file":"MediaPlaylist.d.ts","sourceRoot":"","sources":["../../src/MediaPlaylist/MediaPlaylist.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAGrD,OAAO,EAAgB,KAAK,YAAY,EAAE,KAAK,SAAS,EAAC,MAAM,IAAI,CAAA;AAKnE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AACnD;;GAEG;AACH,OAAO,kHAAkH,CAAA;AAOzH,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACvD;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAC,GACA,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAA;AA6HxD,MAAM,MAAM,yBAAyB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC9D,EAAE,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAA;CACvC,CAAC,GACA,SAAS,CAAC,cAAc,CAAC,CAAA;AAE3B,KAAK,iCAAiC,GAAG;IACvC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,iBAAS,oBAAoB,CAAC,EAC5B,WAAkB,EAClB,EAAS,EACT,QAAQ,EACR,SAAS,EACT,EAAE,EACF,SAAa,EACb,GAAG,KAAK,EACT,EAAE,yBAAyB,GAAG,iCAAiC,qBAa/D;AAED,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,iBAAiB,CAC1D;IACE;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC5B,GAAG,SAAS,CAAC,cAAc,CAAC,CAC9B,CAAA;AAED,iBAAS,iBAAiB,CAAC,EAAC,QAAQ,EAAC,EAAE,sBAAsB,qBAE5D;AAED,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,UAAU,GAAG,OAAO,CAAC,GAAG;IACzF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,CAAA;AAED,iBAAS,wBAAwB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,WAAW,EACX,IAAkB,EAClB,IAAY,EACZ,KAAK,EACL,OAAmB,EACnB,MAAiB,EACjB,GAAG,KAAK,EACT,EAAE,6BAA6B,qBA4B/B;AAED,MAAM,MAAM,6BAA6B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEhF,iBAAS,wBAAwB,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,6BAA6B,qBAM/F;AAED,MAAM,MAAM,2BAA2B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAwB9E;;GAEG;AACH,eAAO,MAAM,aAAa;IA5QxB;;OAEG;2BACoB,MAAM;IAC7B;;OAEG;oBACa,MAAM;IACtB;;OAEG;eACQ,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI;oBAC1B,MAAM;;;;;;;;;;;;CAuQtB,CAAA"}

package/esm/MediaPlaylist/MediaPlaylist.js

@@ -1,4 +1,4 @@
-import e from "../node_modules/clsx/dist/clsx.js";
+import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { useId as t } from "../hooks/useId.js";
 import { Text as n } from "../Text/Text.js";
 import { Heading as r } from "../Heading/Heading.js";

package/esm/MediaPlaylist/MediaPlaylist.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaPlaylist.js","names":[],"sources":["../../src/MediaPlaylist/MediaPlaylist.tsx"],"sourcesContent":["import React, {cloneElement, forwardRef} from 'react'\nimport {clsx} from 'clsx'\n\nimport {Heading, Text, type HeadingProps, type TextProps} from '..'\nimport {Pagination} from '../Pagination'\nimport {useId} from '../hooks/useId'\n\nimport {type MediaPlaylistComponentTypes, useMediaPlaylist} from './useMediaPlaylist'\nimport type {BaseProps} from '../component-helpers'\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/media-playlist/colors-with-modes.css'\n\n/** Main Stylesheet (as a CSS Module) */\n\nimport styles from './MediaPlaylist.module.css'\nimport gridlineStyles from '../component-helpers/shared.module.css'\n\nexport type MediaPlaylistProps = React.PropsWithChildren<{\n  /**\n   * The index of the item to be selected by default. This is ignored if `selectedIndex` is provided.\n   */\n  defaultSelectedIndex?: number\n  /**\n   * The index of the currently selected item. This makes the component controlled.\n   */\n  selectedIndex?: number\n  /**\n   * Callback fired when the selected index changes.\n   */\n  onChange?: (selectedIndex: number) => void\n  'data-testid'?: string\n}> &\n  Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>\n\nconst MediaPlaylistRoot = forwardRef<HTMLDivElement, MediaPlaylistProps>(\n  ({children, className, defaultSelectedIndex = 0, onChange, selectedIndex, 'data-testid': testId, ...props}, ref) => {\n    const uniqueId = useId()\n\n    const {\n      activeIndex,\n      currentItemPage,\n      getPaginationAttributes,\n      getTabListProps,\n      getTabPanelProps,\n      getTabProps,\n      handlePageChange,\n      hasOverflowItems,\n      headingChild,\n      isItemSelected,\n      items,\n      setItemRef,\n      tabListRef,\n    } = useMediaPlaylist({\n      children,\n      components: mediaPlaylistComponents,\n      defaultSelectedIndex,\n      onChange,\n      selectedIndex,\n    })\n\n    const headingId = headingChild?.props.id ?? `${uniqueId}-heading`\n\n    if (!headingChild && (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test')) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        'MediaPlaylist: Heading child is required. This element labels the playlist for assistive technologies.',\n      )\n    }\n\n    const tabListProps = headingChild\n      ? getTabListProps({labelledBy: headingId})\n      : getTabListProps({label: 'Media playlist'})\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          styles.MediaPlaylist,\n          gridlineStyles.gridline,\n          hasOverflowItems && styles['MediaPlaylist--overflowItems'],\n          className,\n        )}\n        data-testid={testId || testIds.root}\n        {...props}\n      >\n        <div className={styles.MediaPlaylist__layout}>\n          <div className={styles.MediaPlaylist__playlist}>\n            {headingChild &&\n              cloneElement(headingChild, {\n                activeIndex,\n                id: headingId,\n                itemCount: items.length,\n              })}\n            <div {...tabListProps} ref={tabListRef} className={styles.MediaPlaylist__tablist}>\n              {items.map((item, index) => {\n                const tabProps = getTabProps<HTMLButtonElement>(String(index))\n\n                return (\n                  <div\n                    key={index}\n                    ref={element => {\n                      setItemRef(index, element)\n                    }}\n                    className={clsx(\n                      styles.MediaPlaylist__item,\n                      isItemSelected(index) && styles['MediaPlaylist__item--selected'],\n                      item.className,\n                    )}\n                  >\n                    <button type=\"button\" {...tabProps} className={styles.MediaPlaylist__tab}>\n                      <span className={styles.MediaPlaylist__tabContent}>\n                        {item.thumbnail && <span className={styles.MediaPlaylist__thumbnail}>{item.thumbnail}</span>}\n                        <span className={styles.MediaPlaylist__itemHeadingContent}>{item.heading}</span>\n                      </span>\n                    </button>\n                  </div>\n                )\n              })}\n            </div>\n\n            {hasOverflowItems && (\n              <Pagination\n                className={styles.MediaPlaylist__pagination}\n                pageCount={items.length}\n                currentPage={currentItemPage}\n                onPageChange={handlePageChange}\n                hrefBuilder={() => '#'}\n                pageAttributesBuilder={getPaginationAttributes}\n                aria-label=\"Media playlist items\"\n                showPages={false}\n              />\n            )}\n          </div>\n\n          <div className={styles.MediaPlaylist__mediaPanels}>\n            {items.map((item, index) => {\n              const panelProps = getTabPanelProps(String(index))\n\n              return (\n                <div\n                  key={index}\n                  {...panelProps}\n                  tabIndex={-1}\n                  className={clsx(styles.MediaPlaylist__mediaPanel, styles.MediaPlaylist__panel)}\n                >\n                  {item.media}\n                  <div className={styles.MediaPlaylist__panelContent}>{item.content}</div>\n                </div>\n              )\n            })}\n          </div>\n        </div>\n      </div>\n    )\n  },\n)\n\nexport type MediaPlaylistHeadingProps = React.PropsWithChildren<{\n  as?: Exclude<HeadingProps['as'], 'h1'>\n}> &\n  BaseProps<HTMLDivElement>\n\ntype MediaPlaylistHeadingInternalProps = {\n  activeIndex?: number | null\n  itemCount?: number\n}\n\nfunction MediaPlaylistHeading({\n  activeIndex = null,\n  as = 'h3',\n  children,\n  className,\n  id,\n  itemCount = 0,\n  ...props\n}: MediaPlaylistHeadingProps & MediaPlaylistHeadingInternalProps) {\n  return (\n    <div className={clsx(styles.MediaPlaylist__heading, className)} {...props}>\n      <Heading as={as} id={id} className={styles.MediaPlaylist__headingLabel}>\n        {children}\n      </Heading>\n      {itemCount > 0 && activeIndex !== null && (\n        <span className={styles.MediaPlaylist__headingCounter} aria-live=\"polite\">\n          {activeIndex + 1}/{itemCount}\n        </span>\n      )}\n    </div>\n  )\n}\n\nexport type MediaPlaylistItemProps = React.PropsWithChildren<\n  {\n    /**\n     * An optional thumbnail to be shown in the playlist for this item.\n     */\n    thumbnail?: React.ReactNode\n  } & BaseProps<HTMLDivElement>\n>\n\nfunction MediaPlaylistItem({children}: MediaPlaylistItemProps) {\n  return <>{children}</>\n}\n\nexport type MediaPlaylistItemHeadingProps = Omit<TextProps, 'as' | 'children' | 'title'> & {\n  children?: React.ReactNode\n  description?: React.ReactNode\n  title?: React.ReactNode\n}\n\nfunction MediaPlaylistItemHeading({\n  children,\n  className,\n  description,\n  font = 'mona-sans',\n  size = '200',\n  title,\n  variant = 'default',\n  weight = 'medium',\n  ...props\n}: MediaPlaylistItemHeadingProps) {\n  const hasStructuredContent = title !== undefined || description !== undefined\n  const headingTitle = title ?? children\n\n  return (\n    <Text\n      {...props}\n      as=\"span\"\n      className={clsx(styles.MediaPlaylist__itemHeading, className)}\n      font={font}\n      size={size}\n      variant={variant}\n      weight={weight}\n    >\n      {hasStructuredContent ? (\n        <span className={styles.MediaPlaylist__itemHeadingDetails}>\n          {headingTitle && <span className={styles.MediaPlaylist__itemHeadingTitle}>{headingTitle}</span>}\n          {description && (\n            <Text as=\"span\" font=\"monospace\" size=\"100\" variant=\"muted\">\n              {description}\n            </Text>\n          )}\n        </span>\n      ) : (\n        children\n      )}\n    </Text>\n  )\n}\n\nexport type MediaPlaylistItemContentProps = React.HTMLAttributes<HTMLDivElement>\n\nfunction MediaPlaylistItemContent({children, className, ...props}: MediaPlaylistItemContentProps) {\n  return (\n    <div className={clsx(styles.MediaPlaylist__content, className)} {...props}>\n      {children}\n    </div>\n  )\n}\n\nexport type MediaPlaylistItemMediaProps = React.HTMLAttributes<HTMLDivElement>\n\nconst MediaPlaylistItemMedia = forwardRef<HTMLDivElement, MediaPlaylistItemMediaProps>(function MediaPlaylistItemMedia(\n  {children, className, ...props},\n  ref,\n) {\n  return (\n    <div ref={ref} className={clsx(styles.MediaPlaylist__media, className)} {...props}>\n      {children}\n    </div>\n  )\n})\n\nconst mediaPlaylistComponents = {\n  Heading: MediaPlaylistHeading,\n  Item: MediaPlaylistItem,\n  ItemHeading: MediaPlaylistItemHeading,\n  ItemContent: MediaPlaylistItemContent,\n  ItemMedia: MediaPlaylistItemMedia,\n} satisfies MediaPlaylistComponentTypes\n\nconst testIds = {\n  root: 'MediaPlaylist',\n}\n\n/**\n * Use MediaPlaylist to pair media playback with an itemized, thumbnail-backed playlist.\n */\nexport const MediaPlaylist = Object.assign(MediaPlaylistRoot, {\n  Heading: MediaPlaylistHeading,\n  Item: MediaPlaylistItem,\n  ItemHeading: MediaPlaylistItemHeading,\n  ItemContent: MediaPlaylistItemContent,\n  ItemMedia: MediaPlaylistItemMedia,\n  testIds,\n})\n"],"mappings":";;;;;;;;;;;;AAoCA,IAAM,IAAoB,GACvB,EAAC,aAAU,cAAW,0BAAuB,GAAG,aAAU,kBAAe,eAAe,GAAQ,GAAG,KAAQ,MAAQ;CAClH,IAAM,IAAW,GAAO,EAElB,EACJ,gBACA,oBACA,4BACA,oBACA,qBACA,gBACA,qBACA,qBACA,iBACA,mBACA,UACA,eACA,kBACE,EAAiB;EACnB;EACA,YAAY;EACZ;EACA;EACA;EACD,CAAC,EAEI,IAAY,GAAc,MAAM,MAAM,GAAG,EAAS;AAExD,CAAI,CAAC,MAAA,QAAA,IAAA,aAA0C,iBAAA,QAAA,IAAA,aAA0C,WAEvF,QAAQ,KACN,yGACD;CAGH,IAAM,IACF,EADiB,IACD,EAAC,YAAY,GAAU,GACvB,EAAC,OAAO,kBAAiB,CAAC;AAE9C,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,EAAO,eACP,EAAe,UACf,KAAoB,EAAO,iCAC3B,EACD;EACD,eAAa,KAAU,EAAQ;EAC/B,GAAI;YAEJ,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAvB,CACE,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAvB;KACG,KACC,EAAa,GAAc;MACzB;MACA,IAAI;MACJ,WAAW,EAAM;MAClB,CAAC;KACJ,kBAAC,OAAD;MAAK,GAAI;MAAc,KAAK;MAAY,WAAW,EAAO;gBACvD,EAAM,KAAK,GAAM,MAAU;OAC1B,IAAM,IAAW,EAA+B,OAAO,EAAM,CAAC;AAE9D,cACE,kBAAC,OAAD;QAEE,MAAK,MAAW;AACd,WAAW,GAAO,EAAQ;;QAE5B,WAAW,EACT,EAAO,qBACP,EAAe,EAAM,IAAI,EAAO,kCAChC,EAAK,UACN;kBAED,kBAAC,UAAD;SAAQ,MAAK;SAAS,GAAI;SAAU,WAAW,EAAO;mBACpD,kBAAC,QAAD;UAAM,WAAW,EAAO;oBAAxB,CACG,EAAK,aAAa,kBAAC,QAAD;WAAM,WAAW,EAAO;qBAA2B,EAAK;WAAiB,CAAA,EAC5F,kBAAC,QAAD;WAAM,WAAW,EAAO;qBAAoC,EAAK;WAAe,CAAA,CAC3E;;SACA,CAAA;QACL,EAhBC,EAgBD;QAER;MACE,CAAA;KAEL,KACC,kBAAC,GAAD;MACE,WAAW,EAAO;MAClB,WAAW,EAAM;MACjB,aAAa;MACb,cAAc;MACd,mBAAmB;MACnB,uBAAuB;MACvB,cAAW;MACX,WAAW;MACX,CAAA;KAEA;OAEN,kBAAC,OAAD;IAAK,WAAW,EAAO;cACpB,EAAM,KAAK,GAAM,MAId,kBAAC,OAAD;KAEE,GALe,EAAiB,OAAO,EAAM,CAKzC;KACJ,UAAU;KACV,WAAW,EAAK,EAAO,2BAA2B,EAAO,qBAAqB;eAJhF,CAMG,EAAK,OACN,kBAAC,OAAD;MAAK,WAAW,EAAO;gBAA8B,EAAK;MAAc,CAAA,CACpE;OAPC,EAOD,CAER;IACE,CAAA,CACF;;EACF,CAAA;EAGX;AAYD,SAAS,EAAqB,EAC5B,iBAAc,MACd,QAAK,MACL,aACA,cACA,OACA,eAAY,GACZ,GAAG,KAC6D;AAChE,QACE,kBAAC,OAAD;EAAK,WAAW,EAAK,EAAO,wBAAwB,EAAU;EAAE,GAAI;YAApE,CACE,kBAAC,GAAD;GAAa;GAAQ;GAAI,WAAW,EAAO;GACxC;GACO,CAAA,EACT,IAAY,KAAK,MAAgB,QAChC,kBAAC,QAAD;GAAM,WAAW,EAAO;GAA+B,aAAU;aAAjE;IACG,IAAc;IAAE;IAAE;IACd;KAEL;;;AAaV,SAAS,EAAkB,EAAC,eAAmC;AAC7D,QAAO,kBAAA,GAAA,EAAG,aAAY,CAAA;;AASxB,SAAS,EAAyB,EAChC,aACA,cACA,gBACA,UAAO,aACP,UAAO,OACP,UACA,aAAU,WACV,YAAS,UACT,GAAG,KAC6B;CAChC,IAAM,IAAuB,MAAU,KAAA,KAAa,MAAgB,KAAA,GAC9D,IAAe,KAAS;AAE9B,QACE,kBAAC,GAAD;EACE,GAAI;EACJ,IAAG;EACH,WAAW,EAAK,EAAO,4BAA4B,EAAU;EACvD;EACA;EACG;EACD;YAEP,IACC,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAxB,CACG,KAAgB,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAkC;IAAoB,CAAA,EAC9F,KACC,kBAAC,GAAD;IAAM,IAAG;IAAO,MAAK;IAAY,MAAK;IAAM,SAAQ;cACjD;IACI,CAAA,CAEJ;OAEP;EAEG,CAAA;;AAMX,SAAS,EAAyB,EAAC,aAAU,cAAW,GAAG,KAAuC;AAChG,QACE,kBAAC,OAAD;EAAK,WAAW,EAAK,EAAO,wBAAwB,EAAU;EAAE,GAAI;EACjE;EACG,CAAA;;AAMV,IAAM,IAAyB,EAAwD,SACrF,EAAC,aAAU,cAAW,GAAG,KACzB,GACA;AACA,QACE,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAK,EAAO,sBAAsB,EAAU;EAAE,GAAI;EACzE;EACG,CAAA;EAER,EAEI,IAA0B;CAC9B,SAAS;CACT,MAAM;CACN,aAAa;CACb,aAAa;CACb,WAAW;CACZ,EAEK,IAAU,EACd,MAAM,iBACP,EAKY,IAAgB,OAAO,OAAO,GAAmB;CAC5D,SAAS;CACT,MAAM;CACN,aAAa;CACb,aAAa;CACb,WAAW;CACX;CACD,CAAC"}
+{"version":3,"file":"MediaPlaylist.js","names":[],"sources":["../../src/MediaPlaylist/MediaPlaylist.tsx"],"sourcesContent":["import React, {cloneElement, forwardRef} from 'react'\nimport {clsx} from 'clsx'\n\nimport {Heading, Text, type HeadingProps, type TextProps} from '..'\nimport {Pagination} from '../Pagination'\nimport {useId} from '../hooks/useId'\n\nimport {type MediaPlaylistComponentTypes, useMediaPlaylist} from './useMediaPlaylist'\nimport type {BaseProps} from '../component-helpers'\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/media-playlist/colors-with-modes.css'\n\n/** Main Stylesheet (as a CSS Module) */\n\nimport styles from './MediaPlaylist.module.css'\nimport gridlineStyles from '../component-helpers/shared.module.css'\n\nexport type MediaPlaylistProps = React.PropsWithChildren<{\n  /**\n   * The index of the item to be selected by default. This is ignored if `selectedIndex` is provided.\n   */\n  defaultSelectedIndex?: number\n  /**\n   * The index of the currently selected item. This makes the component controlled.\n   */\n  selectedIndex?: number\n  /**\n   * Callback fired when the selected index changes.\n   */\n  onChange?: (selectedIndex: number) => void\n  'data-testid'?: string\n}> &\n  Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>\n\nconst MediaPlaylistRoot = forwardRef<HTMLDivElement, MediaPlaylistProps>(\n  ({children, className, defaultSelectedIndex = 0, onChange, selectedIndex, 'data-testid': testId, ...props}, ref) => {\n    const uniqueId = useId()\n\n    const {\n      activeIndex,\n      currentItemPage,\n      getPaginationAttributes,\n      getTabListProps,\n      getTabPanelProps,\n      getTabProps,\n      handlePageChange,\n      hasOverflowItems,\n      headingChild,\n      isItemSelected,\n      items,\n      setItemRef,\n      tabListRef,\n    } = useMediaPlaylist({\n      children,\n      components: mediaPlaylistComponents,\n      defaultSelectedIndex,\n      onChange,\n      selectedIndex,\n    })\n\n    const headingId = headingChild?.props.id ?? `${uniqueId}-heading`\n\n    if (!headingChild && (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test')) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        'MediaPlaylist: Heading child is required. This element labels the playlist for assistive technologies.',\n      )\n    }\n\n    const tabListProps = headingChild\n      ? getTabListProps({labelledBy: headingId})\n      : getTabListProps({label: 'Media playlist'})\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          styles.MediaPlaylist,\n          gridlineStyles.gridline,\n          hasOverflowItems && styles['MediaPlaylist--overflowItems'],\n          className,\n        )}\n        data-testid={testId || testIds.root}\n        {...props}\n      >\n        <div className={styles.MediaPlaylist__layout}>\n          <div className={styles.MediaPlaylist__playlist}>\n            {headingChild &&\n              cloneElement(headingChild, {\n                activeIndex,\n                id: headingId,\n                itemCount: items.length,\n              })}\n            <div {...tabListProps} ref={tabListRef} className={styles.MediaPlaylist__tablist}>\n              {items.map((item, index) => {\n                const tabProps = getTabProps<HTMLButtonElement>(String(index))\n\n                return (\n                  <div\n                    key={index}\n                    ref={element => {\n                      setItemRef(index, element)\n                    }}\n                    className={clsx(\n                      styles.MediaPlaylist__item,\n                      isItemSelected(index) && styles['MediaPlaylist__item--selected'],\n                      item.className,\n                    )}\n                  >\n                    <button type=\"button\" {...tabProps} className={styles.MediaPlaylist__tab}>\n                      <span className={styles.MediaPlaylist__tabContent}>\n                        {item.thumbnail && <span className={styles.MediaPlaylist__thumbnail}>{item.thumbnail}</span>}\n                        <span className={styles.MediaPlaylist__itemHeadingContent}>{item.heading}</span>\n                      </span>\n                    </button>\n                  </div>\n                )\n              })}\n            </div>\n\n            {hasOverflowItems && (\n              <Pagination\n                className={styles.MediaPlaylist__pagination}\n                pageCount={items.length}\n                currentPage={currentItemPage}\n                onPageChange={handlePageChange}\n                hrefBuilder={() => '#'}\n                pageAttributesBuilder={getPaginationAttributes}\n                aria-label=\"Media playlist items\"\n                showPages={false}\n              />\n            )}\n          </div>\n\n          <div className={styles.MediaPlaylist__mediaPanels}>\n            {items.map((item, index) => {\n              const panelProps = getTabPanelProps(String(index))\n\n              return (\n                <div\n                  key={index}\n                  {...panelProps}\n                  tabIndex={-1}\n                  className={clsx(styles.MediaPlaylist__mediaPanel, styles.MediaPlaylist__panel)}\n                >\n                  {item.media}\n                  <div className={styles.MediaPlaylist__panelContent}>{item.content}</div>\n                </div>\n              )\n            })}\n          </div>\n        </div>\n      </div>\n    )\n  },\n)\n\nexport type MediaPlaylistHeadingProps = React.PropsWithChildren<{\n  as?: Exclude<HeadingProps['as'], 'h1'>\n}> &\n  BaseProps<HTMLDivElement>\n\ntype MediaPlaylistHeadingInternalProps = {\n  activeIndex?: number | null\n  itemCount?: number\n}\n\nfunction MediaPlaylistHeading({\n  activeIndex = null,\n  as = 'h3',\n  children,\n  className,\n  id,\n  itemCount = 0,\n  ...props\n}: MediaPlaylistHeadingProps & MediaPlaylistHeadingInternalProps) {\n  return (\n    <div className={clsx(styles.MediaPlaylist__heading, className)} {...props}>\n      <Heading as={as} id={id} className={styles.MediaPlaylist__headingLabel}>\n        {children}\n      </Heading>\n      {itemCount > 0 && activeIndex !== null && (\n        <span className={styles.MediaPlaylist__headingCounter} aria-live=\"polite\">\n          {activeIndex + 1}/{itemCount}\n        </span>\n      )}\n    </div>\n  )\n}\n\nexport type MediaPlaylistItemProps = React.PropsWithChildren<\n  {\n    /**\n     * An optional thumbnail to be shown in the playlist for this item.\n     */\n    thumbnail?: React.ReactNode\n  } & BaseProps<HTMLDivElement>\n>\n\nfunction MediaPlaylistItem({children}: MediaPlaylistItemProps) {\n  return <>{children}</>\n}\n\nexport type MediaPlaylistItemHeadingProps = Omit<TextProps, 'as' | 'children' | 'title'> & {\n  children?: React.ReactNode\n  description?: React.ReactNode\n  title?: React.ReactNode\n}\n\nfunction MediaPlaylistItemHeading({\n  children,\n  className,\n  description,\n  font = 'mona-sans',\n  size = '200',\n  title,\n  variant = 'default',\n  weight = 'medium',\n  ...props\n}: MediaPlaylistItemHeadingProps) {\n  const hasStructuredContent = title !== undefined || description !== undefined\n  const headingTitle = title ?? children\n\n  return (\n    <Text\n      {...props}\n      as=\"span\"\n      className={clsx(styles.MediaPlaylist__itemHeading, className)}\n      font={font}\n      size={size}\n      variant={variant}\n      weight={weight}\n    >\n      {hasStructuredContent ? (\n        <span className={styles.MediaPlaylist__itemHeadingDetails}>\n          {headingTitle && <span className={styles.MediaPlaylist__itemHeadingTitle}>{headingTitle}</span>}\n          {description && (\n            <Text as=\"span\" font=\"monospace\" size=\"100\" variant=\"muted\">\n              {description}\n            </Text>\n          )}\n        </span>\n      ) : (\n        children\n      )}\n    </Text>\n  )\n}\n\nexport type MediaPlaylistItemContentProps = React.HTMLAttributes<HTMLDivElement>\n\nfunction MediaPlaylistItemContent({children, className, ...props}: MediaPlaylistItemContentProps) {\n  return (\n    <div className={clsx(styles.MediaPlaylist__content, className)} {...props}>\n      {children}\n    </div>\n  )\n}\n\nexport type MediaPlaylistItemMediaProps = React.HTMLAttributes<HTMLDivElement>\n\nconst MediaPlaylistItemMedia = forwardRef<HTMLDivElement, MediaPlaylistItemMediaProps>(\n  function MediaPlaylistItemMediaWithRef({children, className, ...props}, ref) {\n    return (\n      <div ref={ref} className={clsx(styles.MediaPlaylist__media, className)} {...props}>\n        {children}\n      </div>\n    )\n  },\n)\n\nconst mediaPlaylistComponents = {\n  Heading: MediaPlaylistHeading,\n  Item: MediaPlaylistItem,\n  ItemHeading: MediaPlaylistItemHeading,\n  ItemContent: MediaPlaylistItemContent,\n  ItemMedia: MediaPlaylistItemMedia,\n} satisfies MediaPlaylistComponentTypes\n\nconst testIds = {\n  root: 'MediaPlaylist',\n}\n\n/**\n * Use MediaPlaylist to pair media playback with an itemized, thumbnail-backed playlist.\n */\nexport const MediaPlaylist = Object.assign(MediaPlaylistRoot, {\n  Heading: MediaPlaylistHeading,\n  Item: MediaPlaylistItem,\n  ItemHeading: MediaPlaylistItemHeading,\n  ItemContent: MediaPlaylistItemContent,\n  ItemMedia: MediaPlaylistItemMedia,\n  testIds,\n})\n"],"mappings":";;;;;;;;;;;;AAoCA,IAAM,IAAoB,GACvB,EAAC,aAAU,cAAW,0BAAuB,GAAG,aAAU,kBAAe,eAAe,GAAQ,GAAG,KAAQ,MAAQ;CAClH,IAAM,IAAW,EAAM,GAEjB,EACJ,gBACA,oBACA,4BACA,oBACA,qBACA,gBACA,qBACA,qBACA,iBACA,mBACA,UACA,eACA,kBACE,EAAiB;EACnB;EACA,YAAY;EACZ;EACA;EACA;CACF,CAAC,GAEK,IAAY,GAAc,MAAM,MAAM,GAAG,EAAS;CAExD,AAAI,CAAC,MAAA,QAAA,IAAA,aAA0C,iBAAA,QAAA,IAAA,aAA0C,WAEvF,QAAQ,KACN,wGACF;CAGF,IAAM,IACF,EADiB,IACD,EAAC,YAAY,EAAS,IACtB,EAAC,OAAO,iBAAgB,CAAC;CAE7C,OACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,EAAO,eACP,EAAe,UACf,KAAoB,EAAO,iCAC3B,CACF;EACA,eAAa,KAAU,EAAQ;EAC/B,GAAI;YAEJ,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAvB,CACE,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAvB;KACG,KACC,EAAa,GAAc;MACzB;MACA,IAAI;MACJ,WAAW,EAAM;KACnB,CAAC;KACH,kBAAC,OAAD;MAAK,GAAI;MAAc,KAAK;MAAY,WAAW,EAAO;gBACvD,EAAM,KAAK,GAAM,MAAU;OAC1B,IAAM,IAAW,EAA+B,OAAO,CAAK,CAAC;OAE7D,OACE,kBAAC,OAAD;QAEE,MAAK,MAAW;SACd,EAAW,GAAO,CAAO;QAC3B;QACA,WAAW,EACT,EAAO,qBACP,EAAe,CAAK,KAAK,EAAO,kCAChC,EAAK,SACP;kBAEA,kBAAC,UAAD;SAAQ,MAAK;SAAS,GAAI;SAAU,WAAW,EAAO;mBACpD,kBAAC,QAAD;UAAM,WAAW,EAAO;oBAAxB,CACG,EAAK,aAAa,kBAAC,QAAD;WAAM,WAAW,EAAO;qBAA2B,EAAK;UAAgB,CAAA,GAC3F,kBAAC,QAAD;WAAM,WAAW,EAAO;qBAAoC,EAAK;UAAc,CAAA,CAC3E;;QACA,CAAA;OACL,GAhBE,CAgBF;MAET,CAAC;KACE,CAAA;KAEJ,KACC,kBAAC,GAAD;MACE,WAAW,EAAO;MAClB,WAAW,EAAM;MACjB,aAAa;MACb,cAAc;MACd,mBAAmB;MACnB,uBAAuB;MACvB,cAAW;MACX,WAAW;KACZ,CAAA;IAEA;OAEL,kBAAC,OAAD;IAAK,WAAW,EAAO;cACpB,EAAM,KAAK,GAAM,MAId,kBAAC,OAAD;KAEE,GALe,EAAiB,OAAO,CAAK,CAKxC;KACJ,UAAU;KACV,WAAW,EAAK,EAAO,2BAA2B,EAAO,oBAAoB;eAJ/E,CAMG,EAAK,OACN,kBAAC,OAAD;MAAK,WAAW,EAAO;gBAA8B,EAAK;KAAa,CAAA,CACpE;OAPE,CAOF,CAER;GACE,CAAA,CACF;;CACF,CAAA;AAET,CACF;AAYA,SAAS,EAAqB,EAC5B,iBAAc,MACd,QAAK,MACL,aACA,cACA,OACA,eAAY,GACZ,GAAG,KAC6D;CAChE,OACE,kBAAC,OAAD;EAAK,WAAW,EAAK,EAAO,wBAAwB,CAAS;EAAG,GAAI;YAApE,CACE,kBAAC,GAAD;GAAa;GAAQ;GAAI,WAAW,EAAO;GACxC;EACM,CAAA,GACR,IAAY,KAAK,MAAgB,QAChC,kBAAC,QAAD;GAAM,WAAW,EAAO;GAA+B,aAAU;aAAjE;IACG,IAAc;IAAE;IAAE;GACf;IAEL;;AAET;AAWA,SAAS,EAAkB,EAAC,eAAmC;CAC7D,OAAO,kBAAA,GAAA,EAAG,YAAW,CAAA;AACvB;AAQA,SAAS,EAAyB,EAChC,aACA,cACA,gBACA,UAAO,aACP,UAAO,OACP,UACA,aAAU,WACV,YAAS,UACT,GAAG,KAC6B;CAChC,IAAM,IAAuB,MAAU,KAAA,KAAa,MAAgB,KAAA,GAC9D,IAAe,KAAS;CAE9B,OACE,kBAAC,GAAD;EACE,GAAI;EACJ,IAAG;EACH,WAAW,EAAK,EAAO,4BAA4B,CAAS;EACtD;EACA;EACG;EACD;YAEP,IACC,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAxB,CACG,KAAgB,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAkC;GAAmB,CAAA,GAC7F,KACC,kBAAC,GAAD;IAAM,IAAG;IAAO,MAAK;IAAY,MAAK;IAAM,SAAQ;cACjD;GACG,CAAA,CAEJ;OAEN;CAEE,CAAA;AAEV;AAIA,SAAS,EAAyB,EAAC,aAAU,cAAW,GAAG,KAAuC;CAChG,OACE,kBAAC,OAAD;EAAK,WAAW,EAAK,EAAO,wBAAwB,CAAS;EAAG,GAAI;EACjE;CACE,CAAA;AAET;AAIA,IAAM,IAAyB,EAC7B,SAAuC,EAAC,aAAU,cAAW,GAAG,KAAQ,GAAK;CAC3E,OACE,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAK,EAAO,sBAAsB,CAAS;EAAG,GAAI;EACzE;CACE,CAAA;AAET,CACF,GAEM,IAA0B;CAC9B,SAAS;CACT,MAAM;CACN,aAAa;CACb,aAAa;CACb,WAAW;AACb,GAEM,IAAU,EACd,MAAM,gBACR,GAKa,IAAgB,OAAO,OAAO,GAAmB;CAC5D,SAAS;CACT,MAAM;CACN,aAAa;CACb,aAAa;CACb,WAAW;CACX;AACF,CAAC"}

package/esm/MediaPlaylist/MediaPlaylist.module.js

@@ -1,30 +1,31 @@
-import './MediaPlaylist.module-BddC0boN.css';var e = {
-	MediaPlaylist: "Primer_Brand__MediaPlaylist-module__MediaPlaylist___mqadg",
-	MediaPlaylist__panelContent: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__panelContent___nD2Xr",
-	MediaPlaylist__layout: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__layout___Jxb17",
-	MediaPlaylist__playlist: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__playlist___r232y",
-	MediaPlaylist__heading: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__heading___bvLnj",
-	MediaPlaylist__headingLabel: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__headingLabel___cOPfs",
-	MediaPlaylist__headingCounter: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__headingCounter___xJSQs",
-	MediaPlaylist__mediaPanels: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__mediaPanels___bgH_2",
-	MediaPlaylist__mediaPanel: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__mediaPanel___YI_I2",
-	MediaPlaylist__panel: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__panel___iC9Tx",
-	MediaPlaylist__media: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__media___HVCCb",
-	MediaPlaylist__tablist: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__tablist___EhGxB",
+import './MediaPlaylist.module-BddC0boN.css';//#region src/MediaPlaylist/MediaPlaylist.module.css
+var e = "Primer_Brand__MediaPlaylist-module__MediaPlaylist___mqadg", t = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__panelContent___nD2Xr", n = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__layout___Jxb17", r = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__playlist___r232y", i = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__heading___bvLnj", a = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__headingLabel___cOPfs", o = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__headingCounter___xJSQs", s = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__mediaPanels___bgH_2", c = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__mediaPanel___YI_I2", l = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__panel___iC9Tx", u = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__media___HVCCb", d = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__tablist___EhGxB", f = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__pagination___mct_v", p = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__item___KJx6C", m = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeading___j5Q2s", h = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeadingContent___pzVd0", g = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeadingDetails___wQCnu", _ = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeadingTitle___F1sIm", v = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__tab___LvxjX", y = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__tabContent___9cPbZ", b = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__thumbnail___PENaA", x = "Primer_Brand__MediaPlaylist-module__MediaPlaylist__content___m36IL", S = {
+	MediaPlaylist: e,
+	MediaPlaylist__panelContent: t,
+	MediaPlaylist__layout: n,
+	MediaPlaylist__playlist: r,
+	MediaPlaylist__heading: i,
+	MediaPlaylist__headingLabel: a,
+	MediaPlaylist__headingCounter: o,
+	MediaPlaylist__mediaPanels: s,
+	MediaPlaylist__mediaPanel: c,
+	MediaPlaylist__panel: l,
+	MediaPlaylist__media: u,
+	MediaPlaylist__tablist: d,
 	"MediaPlaylist--overflowItems": "Primer_Brand__MediaPlaylist-module__MediaPlaylist--overflowItems___QWHRc",
-	MediaPlaylist__pagination: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__pagination___mct_v",
-	MediaPlaylist__item: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__item___KJx6C",
+	MediaPlaylist__pagination: f,
+	MediaPlaylist__item: p,
 	"MediaPlaylist__item--selected": "Primer_Brand__MediaPlaylist-module__MediaPlaylist__item--selected___Ihn_G",
-	MediaPlaylist__itemHeading: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeading___j5Q2s",
-	MediaPlaylist__itemHeadingContent: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeadingContent___pzVd0",
-	MediaPlaylist__itemHeadingDetails: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeadingDetails___wQCnu",
-	MediaPlaylist__itemHeadingTitle: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__itemHeadingTitle___F1sIm",
-	MediaPlaylist__tab: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__tab___LvxjX",
-	MediaPlaylist__tabContent: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__tabContent___9cPbZ",
-	MediaPlaylist__thumbnail: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__thumbnail___PENaA",
-	MediaPlaylist__content: "Primer_Brand__MediaPlaylist-module__MediaPlaylist__content___m36IL"
+	MediaPlaylist__itemHeading: m,
+	MediaPlaylist__itemHeadingContent: h,
+	MediaPlaylist__itemHeadingDetails: g,
+	MediaPlaylist__itemHeadingTitle: _,
+	MediaPlaylist__tab: v,
+	MediaPlaylist__tabContent: y,
+	MediaPlaylist__thumbnail: b,
+	MediaPlaylist__content: x
 };
 //#endregion
-export { e as default };
+export { e as MediaPlaylist, x as MediaPlaylist__content, i as MediaPlaylist__heading, o as MediaPlaylist__headingCounter, a as MediaPlaylist__headingLabel, p as MediaPlaylist__item, m as MediaPlaylist__itemHeading, h as MediaPlaylist__itemHeadingContent, g as MediaPlaylist__itemHeadingDetails, _ as MediaPlaylist__itemHeadingTitle, n as MediaPlaylist__layout, u as MediaPlaylist__media, c as MediaPlaylist__mediaPanel, s as MediaPlaylist__mediaPanels, f as MediaPlaylist__pagination, l as MediaPlaylist__panel, t as MediaPlaylist__panelContent, r as MediaPlaylist__playlist, v as MediaPlaylist__tab, y as MediaPlaylist__tabContent, d as MediaPlaylist__tablist, b as MediaPlaylist__thumbnail, S as default };
 
 //# sourceMappingURL=MediaPlaylist.module.js.map

package/esm/MediaPlaylist/useMediaPlaylist.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMediaPlaylist.js","names":[],"sources":["../../src/MediaPlaylist/useMediaPlaylist.ts"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useRef} from 'react'\n\nimport type {PaginationPageType} from '../Pagination/model'\nimport {useTabs} from '../hooks/useTabs'\n\ntype UseMediaPlaylistProps = {\n  children: React.ReactNode\n  components: MediaPlaylistComponentTypes\n  defaultSelectedIndex: number\n  onChange?: (selectedIndex: number) => void\n  selectedIndex?: number\n}\n\n/**\n * Internal only hook used by MediaPlaylist to manage state and behavior.\n * @private\n * @internal\n */\nexport type MediaPlaylistComponentTypes = {\n  Heading: React.ElementType\n  Item: React.ElementType\n  ItemHeading: React.ElementType\n  ItemContent: React.ElementType\n  ItemMedia: React.ElementType\n}\n\ntype MediaPlaylistHeadingChildProps = {\n  activeIndex?: number | null\n  id?: string\n  itemCount?: number\n}\n\ntype MediaPlaylistItemProps = React.PropsWithChildren<{\n  className?: string\n  thumbnail?: React.ReactNode\n}>\n\ntype MediaPlaylistItemChildProps = React.PropsWithChildren<Record<string, unknown>>\n\ntype MediaPlaylistItemChild = React.ReactElement<MediaPlaylistItemChildProps>\n\ntype MediaPlaylistItemData = {\n  className?: string\n  content: MediaPlaylistItemChild\n  heading: MediaPlaylistItemChild\n  media: MediaPlaylistItemChild\n  thumbnail?: React.ReactNode\n}\n\n/**\n * Internal only hook used by MediaPlaylist to manage state and behavior.\n * @private\n * @internal\n */\nexport function useMediaPlaylist({\n  children,\n  components,\n  defaultSelectedIndex,\n  onChange,\n  selectedIndex,\n}: UseMediaPlaylistProps) {\n  const {headingChild, items} = useMemo(() => getMediaPlaylistChildren(children, components), [children, components])\n  const itemCount = items.length\n  const defaultActiveIndex = getValidIndex(defaultSelectedIndex, itemCount)\n\n  const controlledActiveIndex =\n    typeof selectedIndex === 'number' && Number.isFinite(selectedIndex) ? getValidIndex(selectedIndex, itemCount) : null\n\n  const initialActiveIndex = controlledActiveIndex ?? defaultActiveIndex\n  const initialActiveTab = initialActiveIndex === null ? undefined : String(initialActiveIndex)\n  const hasOverflowItems = itemCount > 3\n  const tabListRef = useRef<HTMLDivElement>(null)\n  const itemRefs = useRef<Array<HTMLDivElement | null>>([])\n  const suppressOnTabActivateRef = useRef(false)\n\n  const scrollListToIndex = useCallback((index: number) => {\n    const tabList = tabListRef.current\n    const item = itemRefs.current[index]\n\n    if (!tabList || !item || typeof tabList.scrollTo !== 'function') return\n\n    tabList.scrollTo({\n      top: Math.max(0, item.offsetTop - tabList.offsetTop),\n      behavior: 'smooth',\n    })\n  }, [])\n\n  const handleTabActivate = useCallback(\n    (id: string) => {\n      const nextIndex = Number(id)\n      if (Number.isNaN(nextIndex)) return\n\n      if (hasOverflowItems) {\n        scrollListToIndex(nextIndex)\n      }\n\n      if (suppressOnTabActivateRef.current) {\n        suppressOnTabActivateRef.current = false\n        return\n      }\n\n      onChange?.(nextIndex)\n    },\n    [hasOverflowItems, onChange, scrollListToIndex],\n  )\n\n  const {activeTab, activateTab, getTabListProps, getTabPanelProps, getTabProps} = useTabs({\n    defaultTab: initialActiveTab,\n    onTabActivate: handleTabActivate,\n    orientation: 'vertical',\n  })\n\n  const activeIndex = activeTab === null ? initialActiveIndex : getValidIndex(Number(activeTab), itemCount)\n  const currentItemPage = activeIndex === null ? 1 : activeIndex + 1\n\n  useEffect(() => {\n    if (controlledActiveIndex === null) return\n\n    const controlledTab = String(controlledActiveIndex)\n    if (activeTab !== controlledTab) {\n      suppressOnTabActivateRef.current = true\n      activateTab(controlledTab)\n    }\n  }, [activateTab, activeTab, controlledActiveIndex])\n\n  useEffect(() => {\n    if (activeIndex === null || activeTab === String(activeIndex)) return\n\n    suppressOnTabActivateRef.current = true\n    activateTab(String(activeIndex))\n  }, [activateTab, activeIndex, activeTab])\n\n  const handlePageChange = useCallback(\n    (event: React.MouseEvent, page: number) => {\n      event.preventDefault()\n\n      const nextIndex = getValidIndex(page - 1, itemCount)\n      if (nextIndex === null) return\n\n      scrollListToIndex(nextIndex)\n\n      if (activeTab !== String(nextIndex)) {\n        activateTab(String(nextIndex))\n      }\n    },\n    [activateTab, activeTab, itemCount, scrollListToIndex],\n  )\n\n  const isItemSelected = useCallback((index: number) => activeTab === String(index), [activeTab])\n\n  const setItemRef = useCallback((index: number, element: HTMLDivElement | null) => {\n    itemRefs.current[index] = element\n  }, [])\n\n  const getPaginationAttributes = useCallback((pageNumber: number, page: PaginationPageType) => {\n    switch (page.type) {\n      case 'PREV':\n        return {'aria-label': 'Previous video'}\n      case 'NEXT':\n        return {'aria-label': 'Next video'}\n      case 'NUM': {\n        const attributes: {[key: string]: string} = {'aria-label': `Video ${pageNumber}`}\n\n        if (page.selected) {\n          attributes['aria-current'] = 'step'\n        }\n\n        return attributes\n      }\n      case 'BREAK':\n        return {}\n    }\n  }, [])\n\n  return {\n    activeIndex,\n    currentItemPage,\n    getPaginationAttributes,\n    getTabListProps,\n    getTabPanelProps,\n    getTabProps,\n    handlePageChange,\n    hasOverflowItems,\n    headingChild,\n    isItemSelected,\n    items,\n    setItemRef,\n    tabListRef,\n  }\n}\n\nconst createComponentTypeGuard =\n  <T>(componentType: React.ElementType) =>\n  (element: unknown): element is React.ReactElement<T> =>\n    React.isValidElement<T>(element) && element.type === componentType\n\nfunction getMediaPlaylistChildren(children: React.ReactNode, components: MediaPlaylistComponentTypes) {\n  const isHeading = createComponentTypeGuard<MediaPlaylistHeadingChildProps>(components.Heading)\n  const isItem = createComponentTypeGuard<MediaPlaylistItemProps>(components.Item)\n  const isItemHeading = createComponentTypeGuard<MediaPlaylistItemChildProps>(components.ItemHeading)\n  const isItemContent = createComponentTypeGuard<MediaPlaylistItemChildProps>(components.ItemContent)\n  const isItemMedia = createComponentTypeGuard<MediaPlaylistItemChildProps>(components.ItemMedia)\n\n  const playlistChildren = {\n    headingChild: null as React.ReactElement<MediaPlaylistHeadingChildProps> | null,\n    items: [] as MediaPlaylistItemData[],\n  }\n\n  for (const child of React.Children.toArray(children)) {\n    if (isHeading(child)) {\n      playlistChildren.headingChild = child\n      continue\n    }\n\n    if (!isItem(child)) {\n      continue\n    }\n\n    const itemChildren = React.Children.toArray(child.props.children)\n\n    const itemParts = {\n      heading: null as MediaPlaylistItemChild | null,\n      content: null as MediaPlaylistItemChild | null,\n      media: null as MediaPlaylistItemChild | null,\n    }\n\n    for (const itemChild of itemChildren) {\n      if (isItemHeading(itemChild)) {\n        itemParts.heading = itemChild\n      }\n\n      if (isItemContent(itemChild)) {\n        itemParts.content = itemChild\n      }\n\n      if (isItemMedia(itemChild)) {\n        itemParts.media = itemChild\n      }\n    }\n\n    if (!itemParts.heading || !itemParts.content || !itemParts.media) {\n      continue\n    }\n\n    playlistChildren.items.push({\n      className: child.props.className,\n      content: itemParts.content,\n      heading: itemParts.heading,\n      media: itemParts.media,\n      thumbnail: child.props.thumbnail,\n    })\n  }\n\n  return playlistChildren\n}\n\nconst getValidIndex = (index: number, length: number) => {\n  if (length < 1) return null\n\n  const normalizedIndex = Number.isFinite(index) ? Math.trunc(index) : 0\n  return Math.min(Math.max(normalizedIndex, 0), length - 1)\n}\n"],"mappings":"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"}
+{"version":3,"file":"useMediaPlaylist.js","names":[],"sources":["../../src/MediaPlaylist/useMediaPlaylist.ts"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useRef} from 'react'\n\nimport type {PaginationPageType} from '../Pagination/model'\nimport {useTabs} from '../hooks/useTabs'\n\ntype UseMediaPlaylistProps = {\n  children: React.ReactNode\n  components: MediaPlaylistComponentTypes\n  defaultSelectedIndex: number\n  onChange?: (selectedIndex: number) => void\n  selectedIndex?: number\n}\n\n/**\n * Internal only hook used by MediaPlaylist to manage state and behavior.\n * @private\n * @internal\n */\nexport type MediaPlaylistComponentTypes = {\n  Heading: React.ElementType\n  Item: React.ElementType\n  ItemHeading: React.ElementType\n  ItemContent: React.ElementType\n  ItemMedia: React.ElementType\n}\n\ntype MediaPlaylistHeadingChildProps = {\n  activeIndex?: number | null\n  id?: string\n  itemCount?: number\n}\n\ntype MediaPlaylistItemProps = React.PropsWithChildren<{\n  className?: string\n  thumbnail?: React.ReactNode\n}>\n\ntype MediaPlaylistItemChildProps = React.PropsWithChildren<Record<string, unknown>>\n\ntype MediaPlaylistItemChild = React.ReactElement<MediaPlaylistItemChildProps>\n\ntype MediaPlaylistItemData = {\n  className?: string\n  content: MediaPlaylistItemChild\n  heading: MediaPlaylistItemChild\n  media: MediaPlaylistItemChild\n  thumbnail?: React.ReactNode\n}\n\n/**\n * Internal only hook used by MediaPlaylist to manage state and behavior.\n * @private\n * @internal\n */\nexport function useMediaPlaylist({\n  children,\n  components,\n  defaultSelectedIndex,\n  onChange,\n  selectedIndex,\n}: UseMediaPlaylistProps) {\n  const {headingChild, items} = useMemo(() => getMediaPlaylistChildren(children, components), [children, components])\n  const itemCount = items.length\n  const defaultActiveIndex = getValidIndex(defaultSelectedIndex, itemCount)\n\n  const controlledActiveIndex =\n    typeof selectedIndex === 'number' && Number.isFinite(selectedIndex) ? getValidIndex(selectedIndex, itemCount) : null\n\n  const initialActiveIndex = controlledActiveIndex ?? defaultActiveIndex\n  const initialActiveTab = initialActiveIndex === null ? undefined : String(initialActiveIndex)\n  const hasOverflowItems = itemCount > 3\n  const tabListRef = useRef<HTMLDivElement>(null)\n  const itemRefs = useRef<Array<HTMLDivElement | null>>([])\n  const suppressOnTabActivateRef = useRef(false)\n\n  const scrollListToIndex = useCallback((index: number) => {\n    const tabList = tabListRef.current\n    const item = itemRefs.current[index]\n\n    if (!tabList || !item || typeof tabList.scrollTo !== 'function') return\n\n    tabList.scrollTo({\n      top: Math.max(0, item.offsetTop - tabList.offsetTop),\n      behavior: 'smooth',\n    })\n  }, [])\n\n  const handleTabActivate = useCallback(\n    (id: string) => {\n      const nextIndex = Number(id)\n      if (Number.isNaN(nextIndex)) return\n\n      if (hasOverflowItems) {\n        scrollListToIndex(nextIndex)\n      }\n\n      if (suppressOnTabActivateRef.current) {\n        suppressOnTabActivateRef.current = false\n        return\n      }\n\n      onChange?.(nextIndex)\n    },\n    [hasOverflowItems, onChange, scrollListToIndex],\n  )\n\n  const {activeTab, activateTab, getTabListProps, getTabPanelProps, getTabProps} = useTabs({\n    defaultTab: initialActiveTab,\n    onTabActivate: handleTabActivate,\n    orientation: 'vertical',\n  })\n\n  const activeIndex = activeTab === null ? initialActiveIndex : getValidIndex(Number(activeTab), itemCount)\n  const currentItemPage = activeIndex === null ? 1 : activeIndex + 1\n\n  useEffect(() => {\n    if (controlledActiveIndex === null) return\n\n    const controlledTab = String(controlledActiveIndex)\n    if (activeTab !== controlledTab) {\n      suppressOnTabActivateRef.current = true\n      activateTab(controlledTab)\n    }\n  }, [activateTab, activeTab, controlledActiveIndex])\n\n  useEffect(() => {\n    if (activeIndex === null || activeTab === String(activeIndex)) return\n\n    suppressOnTabActivateRef.current = true\n    activateTab(String(activeIndex))\n  }, [activateTab, activeIndex, activeTab])\n\n  const handlePageChange = useCallback(\n    (event: React.MouseEvent, page: number) => {\n      event.preventDefault()\n\n      const nextIndex = getValidIndex(page - 1, itemCount)\n      if (nextIndex === null) return\n\n      scrollListToIndex(nextIndex)\n\n      if (activeTab !== String(nextIndex)) {\n        activateTab(String(nextIndex))\n      }\n    },\n    [activateTab, activeTab, itemCount, scrollListToIndex],\n  )\n\n  const isItemSelected = useCallback((index: number) => activeTab === String(index), [activeTab])\n\n  const setItemRef = useCallback((index: number, element: HTMLDivElement | null) => {\n    itemRefs.current[index] = element\n  }, [])\n\n  const getPaginationAttributes = useCallback((pageNumber: number, page: PaginationPageType) => {\n    switch (page.type) {\n      case 'PREV':\n        return {'aria-label': 'Previous video'}\n      case 'NEXT':\n        return {'aria-label': 'Next video'}\n      case 'NUM': {\n        const attributes: {[key: string]: string} = {'aria-label': `Video ${pageNumber}`}\n\n        if (page.selected) {\n          attributes['aria-current'] = 'step'\n        }\n\n        return attributes\n      }\n      case 'BREAK':\n        return {}\n    }\n  }, [])\n\n  return {\n    activeIndex,\n    currentItemPage,\n    getPaginationAttributes,\n    getTabListProps,\n    getTabPanelProps,\n    getTabProps,\n    handlePageChange,\n    hasOverflowItems,\n    headingChild,\n    isItemSelected,\n    items,\n    setItemRef,\n    tabListRef,\n  }\n}\n\nconst createComponentTypeGuard =\n  <T>(componentType: React.ElementType) =>\n  (element: unknown): element is React.ReactElement<T> =>\n    React.isValidElement<T>(element) && element.type === componentType\n\nfunction getMediaPlaylistChildren(children: React.ReactNode, components: MediaPlaylistComponentTypes) {\n  const isHeading = createComponentTypeGuard<MediaPlaylistHeadingChildProps>(components.Heading)\n  const isItem = createComponentTypeGuard<MediaPlaylistItemProps>(components.Item)\n  const isItemHeading = createComponentTypeGuard<MediaPlaylistItemChildProps>(components.ItemHeading)\n  const isItemContent = createComponentTypeGuard<MediaPlaylistItemChildProps>(components.ItemContent)\n  const isItemMedia = createComponentTypeGuard<MediaPlaylistItemChildProps>(components.ItemMedia)\n\n  const playlistChildren = {\n    headingChild: null as React.ReactElement<MediaPlaylistHeadingChildProps> | null,\n    items: [] as MediaPlaylistItemData[],\n  }\n\n  for (const child of React.Children.toArray(children)) {\n    if (isHeading(child)) {\n      playlistChildren.headingChild = child\n      continue\n    }\n\n    if (!isItem(child)) {\n      continue\n    }\n\n    const itemChildren = React.Children.toArray(child.props.children)\n\n    const itemParts = {\n      heading: null as MediaPlaylistItemChild | null,\n      content: null as MediaPlaylistItemChild | null,\n      media: null as MediaPlaylistItemChild | null,\n    }\n\n    for (const itemChild of itemChildren) {\n      if (isItemHeading(itemChild)) {\n        itemParts.heading = itemChild\n      }\n\n      if (isItemContent(itemChild)) {\n        itemParts.content = itemChild\n      }\n\n      if (isItemMedia(itemChild)) {\n        itemParts.media = itemChild\n      }\n    }\n\n    if (!itemParts.heading || !itemParts.content || !itemParts.media) {\n      continue\n    }\n\n    playlistChildren.items.push({\n      className: child.props.className,\n      content: itemParts.content,\n      heading: itemParts.heading,\n      media: itemParts.media,\n      thumbnail: child.props.thumbnail,\n    })\n  }\n\n  return playlistChildren\n}\n\nconst getValidIndex = (index: number, length: number) => {\n  if (length < 1) return null\n\n  const normalizedIndex = Number.isFinite(index) ? Math.trunc(index) : 0\n  return Math.min(Math.max(normalizedIndex, 0), length - 1)\n}\n"],"mappings":"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"}

package/esm/MinimalFooter/MinimalFooter.d.ts

@@ -86,9 +86,9 @@ export type MinimalFooterProps = {
      */
     copyrightStatement?: string | React.ReactElement;
 } & BaseProps<HTMLElement>;
-declare function Root({ centerComponent, className, children, copyrightStatement, logoHref, socialLinks, ...rest }: PropsWithChildren<MinimalFooterProps>): import("react/jsx-runtime").JSX.Element;
+declare function Root({ centerComponent, className, children, copyrightStatement, logoHref, socialLinks, ...rest }: PropsWithChildren<MinimalFooterProps>): React.JSX.Element;
 type FootnoteProps = BaseProps<HTMLElement>;
-declare function Footnotes({ children, className }: PropsWithChildren<FootnoteProps>): import("react/jsx-runtime").JSX.Element;
+declare function Footnotes({ children, className }: PropsWithChildren<FootnoteProps>): React.JSX.Element;
 type LinkProps<C extends React.ElementType> = BaseProps<C> & {
     as?: 'a' | 'button';
 } & Omit<React.ComponentPropsWithoutRef<C>, keyof C>;
@@ -113,7 +113,7 @@ export type MinimalFooterBackToTopProps = {
  */
 export declare const MinimalFooter: typeof Root & {
     Footnotes: typeof Footnotes;
-    Link: <C extends React.ElementType = "a">({ as, children, ...rest }: PropsWithChildren<LinkProps<C>>) => import("react/jsx-runtime").JSX.Element;
+    Link: <C extends React.ElementType = "a">({ as, children, ...rest }: PropsWithChildren<LinkProps<C>>) => React.JSX.Element;
     BackToTop: React.ForwardRefExoticComponent<Omit<MinimalFooterBackToTopProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 };
 export {};

package/esm/MinimalFooter/MinimalFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MinimalFooter.d.ts","sourceRoot":"","sources":["../../src/MinimalFooter/MinimalFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,iBAAiB,EAAc,MAAM,OAAO,CAAA;AAKvE,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAG9C;;GAEG;AACH,OAAO,0GAA0G,CAAA;AACjH,OAAO,6FAA6F,CAAA;AAOpG,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDV,CAAA;AAEV,KAAK,cAAc,GAAG,MAAM,OAAO,cAAc,CAAA;AAGjD,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,YAAY,CAAA;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IACtC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAA;CACjD,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE1B,iBAAS,IAAI,CAAC,EACZ,eAAe,EACf,SAAS,EACT,QAAQ,EACR,kBAAkB,EAClB,QAA+B,EAC/B,WAAW,EACX,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,2CA4EvC;AAED,KAAK,aAAa,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE3C,iBAAS,SAAS,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,2CA2BzE;AAmDD,KAAK,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,SAAS,CAAC,CAAC,CAAC,GAAG;IAAC,EAAE,CAAC,EAAE,GAAG,GAAG,QAAQ,CAAA;CAAC,GAAG,IAAI,CACrF,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EACjC,MAAM,CAAC,CACR,CAAA;AAyBH,MAAM,MAAM,2BAA2B,GAAG;IACxC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD,GAAG,SAAS,CAAC,iBAAiB,CAAC,GAC9B,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC,CAAA;AAuE7E;;;GAGG;AACH,eAAO,MAAM,aAAa;;WAjHZ,CAAC,SAAS,KAAK,CAAC,WAAW,mCAAiC,iBAAiB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;;CAqHvG,CAAA"}
+{"version":3,"file":"MinimalFooter.d.ts","sourceRoot":"","sources":["../../src/MinimalFooter/MinimalFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,iBAAiB,EAAc,MAAM,OAAO,CAAA;AAKvE,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAG9C;;GAEG;AACH,OAAO,0GAA0G,CAAA;AACjH,OAAO,6FAA6F,CAAA;AAOpG,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDV,CAAA;AAEV,KAAK,cAAc,GAAG,MAAM,OAAO,cAAc,CAAA;AAGjD,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,YAAY,CAAA;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IACtC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAA;CACjD,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE1B,iBAAS,IAAI,CAAC,EACZ,eAAe,EACf,SAAS,EACT,QAAQ,EACR,kBAAkB,EAClB,QAA+B,EAC/B,WAAW,EACX,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,qBA4EvC;AAED,KAAK,aAAa,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE3C,iBAAS,SAAS,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,qBA2BzE;AAmDD,KAAK,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,SAAS,CAAC,CAAC,CAAC,GAAG;IAAC,EAAE,CAAC,EAAE,GAAG,GAAG,QAAQ,CAAA;CAAC,GAAG,IAAI,CACrF,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EACjC,MAAM,CAAC,CACR,CAAA;AAyBH,MAAM,MAAM,2BAA2B,GAAG;IACxC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD,GAAG,SAAS,CAAC,iBAAiB,CAAC,GAC9B,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC,CAAA;AAuE7E;;;GAGG;AACH,eAAO,MAAM,aAAa;;WAjHZ,CAAC,SAAS,KAAK,CAAC,WAAW,mCAAiC,iBAAiB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;;CAqHvG,CAAA"}

package/esm/MinimalFooter/MinimalFooter.js

@@ -1,8 +1,9 @@
-import e from "../node_modules/clsx/dist/clsx.js";
+import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
 import { useReducedMotion as t } from "../hooks/useReducedMotion.js";
 import { Text as n } from "../Text/Text.js";
-import { ArrowUpIcon as r, MarkGithubIcon as i } from "../node_modules/@primer/octicons-react/dist/index.esm.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes-CMFhnjfv.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/footer/base-C0fjI9_t.css';/* empty css                                                                                                    */
+import { ArrowUpIcon as r } from "../node_modules/@primer/octicons-react/dist/icons/ArrowUpIcon.js";
+import { MarkGithubIcon as i } from "../node_modules/@primer/octicons-react/dist/icons/MarkGithubIcon.js";
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/footer/base-C0fjI9_t.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes-CMFhnjfv.css';/* empty css                                                                                                    */
 /* empty css                                                                                       */
 import a from "./MinimalFooter.module.js";
 import o, { forwardRef as s, useCallback as c } from "react";

package/esm/MinimalFooter/MinimalFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"MinimalFooter.js","names":[],"sources":["../../src/MinimalFooter/MinimalFooter.tsx"],"sourcesContent":["import React, {forwardRef, PropsWithChildren, useCallback} from 'react'\nimport {clsx} from 'clsx'\nimport {ArrowUpIcon, MarkGithubIcon} from '@primer/octicons-react'\n\nimport {Text} from '../'\nimport {BaseProps} from '../component-helpers'\nimport {useReducedMotion} from '../hooks/useReducedMotion'\n\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/footer/base.css'\n\n/**\n * Main Stylesheet (as a CSS Module)\n */\nimport styles from './MinimalFooter.module.css'\n\nconst socialLinkData = {\n  x: {\n    fullName: 'X',\n    url: 'https://x.com/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/x.svg',\n    iconWidth: 20,\n    iconHeight: 16,\n  },\n  github: {\n    fullName: 'GitHub',\n    url: 'https://github.com/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/github-mark.svg',\n    iconWidth: 20,\n    iconHeight: 20,\n  },\n  linkedin: {\n    fullName: 'LinkedIn',\n    url: 'https://www.linkedin.com/company/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/linkedin.svg',\n    iconWidth: 19,\n    iconHeight: 18,\n  },\n  youtube: {\n    fullName: 'YouTube',\n    url: 'https://www.youtube.com/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/youtube.svg',\n    iconWidth: 23,\n    iconHeight: 16,\n  },\n  facebook: {\n    fullName: 'Facebook',\n    url: 'https://www.facebook.com/GitHub',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/facebook.svg',\n    iconWidth: 18,\n    iconHeight: 18,\n  },\n  twitch: {\n    fullName: 'Twitch',\n    url: 'https://www.twitch.tv/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/twitch.svg',\n    iconWidth: 18,\n    iconHeight: 18,\n  },\n  tiktok: {\n    fullName: 'TikTok',\n    url: 'https://www.tiktok.com/@github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/tiktok.svg',\n    iconWidth: 18,\n    iconHeight: 18,\n  },\n  instagram: {\n    fullName: 'Instagram',\n    url: 'https://www.instagram.com/github/',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/instagram.svg',\n    iconWidth: 24,\n    iconHeight: 24,\n  },\n} as const\n\ntype SocialLinkName = keyof typeof socialLinkData\nconst socialLinkNames = Object.keys(socialLinkData) as SocialLinkName[]\n\nexport type MinimalFooterProps = {\n  /**\n   * Escape-hatch for inserting custom React components.\n   * Warning:\n   *   This prop isn't advertised in our docs but remains part of the public API for edge-cases.\n   *   Need to use this prop? Please check in with #primer-brand first to confirm correct usage.\n   */\n  centerComponent?: React.ReactElement\n  /**\n   * An array of social links to be displayed in the footer.\n   */\n  socialLinks?: SocialLinkName[] | false\n  /**\n   * The href for the GitHub logo.\n   */\n  logoHref?: string\n  /**\n   * The copyright statement to be displayed in the footer.\n   * If not provided, the copyright statement will be the default GitHub copyright statement.\n   */\n  copyrightStatement?: string | React.ReactElement\n} & BaseProps<HTMLElement>\n\nfunction Root({\n  centerComponent,\n  className,\n  children,\n  copyrightStatement,\n  logoHref = 'https://github.com',\n  socialLinks,\n  ...rest\n}: PropsWithChildren<MinimalFooterProps>) {\n  let footnotes: React.ReactElement | undefined\n  let backToTop: React.ReactElement | undefined\n  const links: React.ReactElement[] = []\n\n  for (const child of React.Children.toArray(children)) {\n    if (!React.isValidElement(child)) {\n      continue\n    }\n\n    if (child.type === Footnotes) {\n      footnotes ??= child\n    } else if (child.type === BackToTop) {\n      backToTop ??= child\n    } else if (child.type === Link && links.length < 5) {\n      links.push(child)\n    }\n  }\n\n  const currentYear = new Date().getFullYear()\n  const resolvedSocialLinks = socialLinks === undefined ? socialLinkNames : socialLinks\n  const renderedSocialLinks = resolvedSocialLinks === false ? [] : resolvedSocialLinks\n  const hasSocialLinks = renderedSocialLinks.length > 0\n  const hasLinks = links.length > 0\n  const renderedLinks = hasLinks ? <div className={styles.MinimalFooter__links}>{links}</div> : null\n  const copyright = (\n    <Text\n      as=\"p\"\n      size=\"100\"\n      font=\"monospace\"\n      weight={{narrow: 'medium', wide: 'normal'}}\n      variant=\"muted\"\n      className={clsx(styles.MinimalFooter__copyright, styles.MinimalFooter__metaText)}\n    >\n      {copyrightStatement ? copyrightStatement : `\\u00A9 ${currentYear} GitHub. All rights reserved.`}\n    </Text>\n  )\n\n  return (\n    <footer\n      className={clsx(styles.MinimalFooter, footnotes && styles['MinimalFooter--withFootnotes'], className)}\n      {...rest}\n    >\n      {footnotes}\n      <div className={styles.MinimalFooter__section}>\n        <section className={styles.MinimalFooter__top}>\n          <div className={styles.MinimalFooter__container}>\n            <div className={styles['MinimalFooter__top-row']}>\n              <LogoLink logoHref={logoHref} />\n              {hasLinks || backToTop ? (\n                <div className={styles['MinimalFooter__top-actions']}>\n                  {backToTop}\n                  {renderedLinks}\n                </div>\n              ) : null}\n            </div>\n          </div>\n        </section>\n      </div>\n      {centerComponent ? (\n        <div className={clsx(styles.MinimalFooter__section, styles['MinimalFooter__section--center'])}>\n          <section className={styles.MinimalFooter__container}>{centerComponent}</section>\n        </div>\n      ) : null}\n      <div className={clsx(styles.MinimalFooter__section, styles['MinimalFooter__section--bottom'])}>\n        <section className={styles.MinimalFooter__bottom}>\n          <div className={styles.MinimalFooter__container}>\n            <div className={styles['MinimalFooter__bottom-row']}>\n              {copyright}\n              {hasSocialLinks ? <SocialLinks socialLinks={renderedSocialLinks} /> : null}\n            </div>\n          </div>\n        </section>\n      </div>\n    </footer>\n  )\n}\n\ntype FootnoteProps = BaseProps<HTMLElement>\n\nfunction Footnotes({children, className}: PropsWithChildren<FootnoteProps>) {\n  const styledChildren = React.Children.map(children, child => {\n    if (React.isValidElement<React.ComponentProps<typeof Text>>(child) && child.type === Text) {\n      const textChild = child as React.ReactElement<React.ComponentProps<typeof Text>>\n      const overrideProps: Partial<React.ComponentProps<typeof Text>> = {\n        variant: 'muted',\n        size: '100',\n        className: clsx(styles['MinimalFooter__terms-item'], textChild.props.className),\n      }\n\n      if (!textChild.props.as) {\n        overrideProps.as = 'p'\n      }\n\n      return React.cloneElement(textChild, overrideProps)\n    }\n\n    return null\n  })\n\n  return (\n    <div className={clsx(styles.MinimalFooter__section, styles['MinimalFooter__section--footnotes'])}>\n      <section className={styles.MinimalFooter__container}>\n        <div className={clsx(styles.MinimalFooter__terms, className)}>{styledChildren}</div>\n      </section>\n    </div>\n  )\n}\n\ntype SocialLinkProps = {name: SocialLinkName}\n\nconst SocialLink = ({name}: SocialLinkProps) => {\n  const link = socialLinkData[name]\n  return (\n    <li>\n      <a\n        href={link.url}\n        className={styles['MinimalFooter__social-link']}\n        data-analytics-event={`{\"category\":\"Footer\",\"action\":\"go to ${link.fullName}\",\"label\":\"text:${name}\"}`}\n      >\n        <img\n          className={styles['MinimalFooter__social-icon']}\n          src={link.icon}\n          height={link.iconHeight}\n          width={link.iconWidth}\n          loading=\"lazy\"\n          decoding=\"async\"\n          alt=\"\"\n        />\n        <span className=\"visually-hidden\">GitHub on {link.fullName}</span>\n      </a>\n    </li>\n  )\n}\n\nfunction LogoLink({logoHref}: {logoHref?: string}) {\n  return (\n    <a\n      href={logoHref}\n      className={styles.MinimalFooter__logo}\n      data-analytics-event='{\"category\":\"Footer\",\"action\":\"go to home\",\"label\":\"text:home\"}'\n      aria-label=\"GitHub\"\n    >\n      <MarkGithubIcon size={24} />\n    </a>\n  )\n}\n\nfunction SocialLinks({socialLinks}: {socialLinks: SocialLinkName[]}) {\n  return (\n    <ul className={styles['MinimalFooter__social-links']}>\n      {socialLinks.map(name => (\n        <SocialLink key={name} name={name} />\n      ))}\n    </ul>\n  )\n}\n\ntype LinkProps<C extends React.ElementType> = BaseProps<C> & {as?: 'a' | 'button'} & Omit<\n    React.ComponentPropsWithoutRef<C>,\n    keyof C\n  >\n\nconst Link = <C extends React.ElementType = 'a'>({as, children, ...rest}: PropsWithChildren<LinkProps<C>>) => {\n  const Component = as || 'a'\n  return (\n    <Component\n      className={styles.MinimalFooter__link}\n      data-analytics-event={\n        rest['href'] ? `{\"category\":\"Footer\",\"action\":\"go to ${rest['href']}\",\"label\":\"text:${children}\"}` : undefined\n      }\n      {...rest}\n    >\n      <Text\n        variant=\"muted\"\n        size=\"100\"\n        font=\"monospace\"\n        weight={{narrow: 'medium', wide: 'normal'}}\n        className={styles.MinimalFooter__metaText}\n      >\n        {children}\n      </Text>\n    </Component>\n  )\n}\n\nexport type MinimalFooterBackToTopProps = {\n  /**\n   * The visible and accessible label.\n   */\n  children: React.ReactNode\n  /**\n   * The ID of the semantic top-of-page element that receives focus after keyboard activation.\n   * Defaults to the first `<main>` element, then falls back to `<body>`.\n   */\n  focusTargetId?: string\n  /**\n   * Runs before the built-in behavior. Call `event.preventDefault()` to cancel scrolling and focus transfer.\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>\n} & BaseProps<HTMLButtonElement> &\n  Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'children'>\n\n/**\n * Scrolls to the top and, after keyboard activation, moves focus to the configured top-of-page destination.\n */\nconst BackToTop = forwardRef<HTMLButtonElement, MinimalFooterBackToTopProps>(\n  ({children, className, focusTargetId, onClick, type = 'button', ...rest}, ref) => {\n    const prefersReducedMotion = useReducedMotion()\n\n    const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(\n      event => {\n        onClick?.(event)\n\n        if (event.defaultPrevented) {\n          return\n        }\n\n        window.scrollTo({\n          top: 0,\n          behavior: prefersReducedMotion ? 'instant' : 'smooth',\n        })\n\n        if (event.detail === 0) {\n          const focusTarget = focusTargetId\n            ? document.getElementById(focusTargetId)\n            : document.querySelector<HTMLElement>('main') ??\n              document.querySelector<HTMLElement>('body') ??\n              document.documentElement\n\n          if (!focusTarget) {\n            if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {\n              // eslint-disable-next-line no-console\n              console.warn(`MinimalFooter.BackToTop: No element found with id \"${focusTargetId}\".`)\n            }\n            return\n          }\n\n          const hadTabIndex = focusTarget.hasAttribute('tabindex')\n\n          if (!hadTabIndex) {\n            focusTarget.tabIndex = -1\n            focusTarget.addEventListener('blur', () => focusTarget.removeAttribute('tabindex'), {once: true})\n          }\n\n          focusTarget.focus({preventScroll: true})\n        }\n      },\n      [focusTargetId, onClick, prefersReducedMotion],\n    )\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={clsx(styles.MinimalFooter__backToTop, className)}\n        onClick={handleClick}\n        {...rest}\n      >\n        <span className={styles['MinimalFooter__backToTop-content']}>\n          <Text as=\"span\" size=\"100\" weight=\"medium\" className={styles.MinimalFooter__metaText}>\n            {children}\n          </Text>\n          <span className={styles['MinimalFooter__backToTop-icon']} aria-hidden=\"true\">\n            <ArrowUpIcon />\n          </span>\n        </span>\n      </button>\n    )\n  },\n)\n\n/**\n * Use MinimalFooter to render a global footer on all GitHub pages.\n * @see https://primer.style/brand/components/MinimalFooter\n */\nexport const MinimalFooter = Object.assign(Root, {\n  Footnotes,\n  Link,\n  BackToTop,\n})\n"],"mappings":"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"}
+{"version":3,"file":"MinimalFooter.js","names":[],"sources":["../../src/MinimalFooter/MinimalFooter.tsx"],"sourcesContent":["import React, {forwardRef, PropsWithChildren, useCallback} from 'react'\nimport {clsx} from 'clsx'\nimport {ArrowUpIcon, MarkGithubIcon} from '@primer/octicons-react'\n\nimport {Text} from '../'\nimport {BaseProps} from '../component-helpers'\nimport {useReducedMotion} from '../hooks/useReducedMotion'\n\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/footer/base.css'\n\n/**\n * Main Stylesheet (as a CSS Module)\n */\nimport styles from './MinimalFooter.module.css'\n\nconst socialLinkData = {\n  x: {\n    fullName: 'X',\n    url: 'https://x.com/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/x.svg',\n    iconWidth: 20,\n    iconHeight: 16,\n  },\n  github: {\n    fullName: 'GitHub',\n    url: 'https://github.com/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/github-mark.svg',\n    iconWidth: 20,\n    iconHeight: 20,\n  },\n  linkedin: {\n    fullName: 'LinkedIn',\n    url: 'https://www.linkedin.com/company/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/linkedin.svg',\n    iconWidth: 19,\n    iconHeight: 18,\n  },\n  youtube: {\n    fullName: 'YouTube',\n    url: 'https://www.youtube.com/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/youtube.svg',\n    iconWidth: 23,\n    iconHeight: 16,\n  },\n  facebook: {\n    fullName: 'Facebook',\n    url: 'https://www.facebook.com/GitHub',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/facebook.svg',\n    iconWidth: 18,\n    iconHeight: 18,\n  },\n  twitch: {\n    fullName: 'Twitch',\n    url: 'https://www.twitch.tv/github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/twitch.svg',\n    iconWidth: 18,\n    iconHeight: 18,\n  },\n  tiktok: {\n    fullName: 'TikTok',\n    url: 'https://www.tiktok.com/@github',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/tiktok.svg',\n    iconWidth: 18,\n    iconHeight: 18,\n  },\n  instagram: {\n    fullName: 'Instagram',\n    url: 'https://www.instagram.com/github/',\n    icon: 'https://github.githubassets.com/images/modules/site/icons/footer/instagram.svg',\n    iconWidth: 24,\n    iconHeight: 24,\n  },\n} as const\n\ntype SocialLinkName = keyof typeof socialLinkData\nconst socialLinkNames = Object.keys(socialLinkData) as SocialLinkName[]\n\nexport type MinimalFooterProps = {\n  /**\n   * Escape-hatch for inserting custom React components.\n   * Warning:\n   *   This prop isn't advertised in our docs but remains part of the public API for edge-cases.\n   *   Need to use this prop? Please check in with #primer-brand first to confirm correct usage.\n   */\n  centerComponent?: React.ReactElement\n  /**\n   * An array of social links to be displayed in the footer.\n   */\n  socialLinks?: SocialLinkName[] | false\n  /**\n   * The href for the GitHub logo.\n   */\n  logoHref?: string\n  /**\n   * The copyright statement to be displayed in the footer.\n   * If not provided, the copyright statement will be the default GitHub copyright statement.\n   */\n  copyrightStatement?: string | React.ReactElement\n} & BaseProps<HTMLElement>\n\nfunction Root({\n  centerComponent,\n  className,\n  children,\n  copyrightStatement,\n  logoHref = 'https://github.com',\n  socialLinks,\n  ...rest\n}: PropsWithChildren<MinimalFooterProps>) {\n  let footnotes: React.ReactElement | undefined\n  let backToTop: React.ReactElement | undefined\n  const links: React.ReactElement[] = []\n\n  for (const child of React.Children.toArray(children)) {\n    if (!React.isValidElement(child)) {\n      continue\n    }\n\n    if (child.type === Footnotes) {\n      footnotes ??= child\n    } else if (child.type === BackToTop) {\n      backToTop ??= child\n    } else if (child.type === Link && links.length < 5) {\n      links.push(child)\n    }\n  }\n\n  const currentYear = new Date().getFullYear()\n  const resolvedSocialLinks = socialLinks === undefined ? socialLinkNames : socialLinks\n  const renderedSocialLinks = resolvedSocialLinks === false ? [] : resolvedSocialLinks\n  const hasSocialLinks = renderedSocialLinks.length > 0\n  const hasLinks = links.length > 0\n  const renderedLinks = hasLinks ? <div className={styles.MinimalFooter__links}>{links}</div> : null\n  const copyright = (\n    <Text\n      as=\"p\"\n      size=\"100\"\n      font=\"monospace\"\n      weight={{narrow: 'medium', wide: 'normal'}}\n      variant=\"muted\"\n      className={clsx(styles.MinimalFooter__copyright, styles.MinimalFooter__metaText)}\n    >\n      {copyrightStatement ? copyrightStatement : `\\u00A9 ${currentYear} GitHub. All rights reserved.`}\n    </Text>\n  )\n\n  return (\n    <footer\n      className={clsx(styles.MinimalFooter, footnotes && styles['MinimalFooter--withFootnotes'], className)}\n      {...rest}\n    >\n      {footnotes}\n      <div className={styles.MinimalFooter__section}>\n        <section className={styles.MinimalFooter__top}>\n          <div className={styles.MinimalFooter__container}>\n            <div className={styles['MinimalFooter__top-row']}>\n              <LogoLink logoHref={logoHref} />\n              {hasLinks || backToTop ? (\n                <div className={styles['MinimalFooter__top-actions']}>\n                  {backToTop}\n                  {renderedLinks}\n                </div>\n              ) : null}\n            </div>\n          </div>\n        </section>\n      </div>\n      {centerComponent ? (\n        <div className={clsx(styles.MinimalFooter__section, styles['MinimalFooter__section--center'])}>\n          <section className={styles.MinimalFooter__container}>{centerComponent}</section>\n        </div>\n      ) : null}\n      <div className={clsx(styles.MinimalFooter__section, styles['MinimalFooter__section--bottom'])}>\n        <section className={styles.MinimalFooter__bottom}>\n          <div className={styles.MinimalFooter__container}>\n            <div className={styles['MinimalFooter__bottom-row']}>\n              {copyright}\n              {hasSocialLinks ? <SocialLinks socialLinks={renderedSocialLinks} /> : null}\n            </div>\n          </div>\n        </section>\n      </div>\n    </footer>\n  )\n}\n\ntype FootnoteProps = BaseProps<HTMLElement>\n\nfunction Footnotes({children, className}: PropsWithChildren<FootnoteProps>) {\n  const styledChildren = React.Children.map(children, child => {\n    if (React.isValidElement<React.ComponentProps<typeof Text>>(child) && child.type === Text) {\n      const textChild = child as React.ReactElement<React.ComponentProps<typeof Text>>\n      const overrideProps: Partial<React.ComponentProps<typeof Text>> = {\n        variant: 'muted',\n        size: '100',\n        className: clsx(styles['MinimalFooter__terms-item'], textChild.props.className),\n      }\n\n      if (!textChild.props.as) {\n        overrideProps.as = 'p'\n      }\n\n      return React.cloneElement(textChild, overrideProps)\n    }\n\n    return null\n  })\n\n  return (\n    <div className={clsx(styles.MinimalFooter__section, styles['MinimalFooter__section--footnotes'])}>\n      <section className={styles.MinimalFooter__container}>\n        <div className={clsx(styles.MinimalFooter__terms, className)}>{styledChildren}</div>\n      </section>\n    </div>\n  )\n}\n\ntype SocialLinkProps = {name: SocialLinkName}\n\nconst SocialLink = ({name}: SocialLinkProps) => {\n  const link = socialLinkData[name]\n  return (\n    <li>\n      <a\n        href={link.url}\n        className={styles['MinimalFooter__social-link']}\n        data-analytics-event={`{\"category\":\"Footer\",\"action\":\"go to ${link.fullName}\",\"label\":\"text:${name}\"}`}\n      >\n        <img\n          className={styles['MinimalFooter__social-icon']}\n          src={link.icon}\n          height={link.iconHeight}\n          width={link.iconWidth}\n          loading=\"lazy\"\n          decoding=\"async\"\n          alt=\"\"\n        />\n        <span className=\"visually-hidden\">GitHub on {link.fullName}</span>\n      </a>\n    </li>\n  )\n}\n\nfunction LogoLink({logoHref}: {logoHref?: string}) {\n  return (\n    <a\n      href={logoHref}\n      className={styles.MinimalFooter__logo}\n      data-analytics-event='{\"category\":\"Footer\",\"action\":\"go to home\",\"label\":\"text:home\"}'\n      aria-label=\"GitHub\"\n    >\n      <MarkGithubIcon size={24} />\n    </a>\n  )\n}\n\nfunction SocialLinks({socialLinks}: {socialLinks: SocialLinkName[]}) {\n  return (\n    <ul className={styles['MinimalFooter__social-links']}>\n      {socialLinks.map(name => (\n        <SocialLink key={name} name={name} />\n      ))}\n    </ul>\n  )\n}\n\ntype LinkProps<C extends React.ElementType> = BaseProps<C> & {as?: 'a' | 'button'} & Omit<\n    React.ComponentPropsWithoutRef<C>,\n    keyof C\n  >\n\nconst Link = <C extends React.ElementType = 'a'>({as, children, ...rest}: PropsWithChildren<LinkProps<C>>) => {\n  const Component = as || 'a'\n  return (\n    <Component\n      className={styles.MinimalFooter__link}\n      data-analytics-event={\n        rest['href'] ? `{\"category\":\"Footer\",\"action\":\"go to ${rest['href']}\",\"label\":\"text:${children}\"}` : undefined\n      }\n      {...rest}\n    >\n      <Text\n        variant=\"muted\"\n        size=\"100\"\n        font=\"monospace\"\n        weight={{narrow: 'medium', wide: 'normal'}}\n        className={styles.MinimalFooter__metaText}\n      >\n        {children}\n      </Text>\n    </Component>\n  )\n}\n\nexport type MinimalFooterBackToTopProps = {\n  /**\n   * The visible and accessible label.\n   */\n  children: React.ReactNode\n  /**\n   * The ID of the semantic top-of-page element that receives focus after keyboard activation.\n   * Defaults to the first `<main>` element, then falls back to `<body>`.\n   */\n  focusTargetId?: string\n  /**\n   * Runs before the built-in behavior. Call `event.preventDefault()` to cancel scrolling and focus transfer.\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>\n} & BaseProps<HTMLButtonElement> &\n  Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'children'>\n\n/**\n * Scrolls to the top and, after keyboard activation, moves focus to the configured top-of-page destination.\n */\nconst BackToTop = forwardRef<HTMLButtonElement, MinimalFooterBackToTopProps>(\n  ({children, className, focusTargetId, onClick, type = 'button', ...rest}, ref) => {\n    const prefersReducedMotion = useReducedMotion()\n\n    const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(\n      event => {\n        onClick?.(event)\n\n        if (event.defaultPrevented) {\n          return\n        }\n\n        window.scrollTo({\n          top: 0,\n          behavior: prefersReducedMotion ? 'instant' : 'smooth',\n        })\n\n        if (event.detail === 0) {\n          const focusTarget = focusTargetId\n            ? document.getElementById(focusTargetId)\n            : document.querySelector<HTMLElement>('main') ??\n              document.querySelector<HTMLElement>('body') ??\n              document.documentElement\n\n          if (!focusTarget) {\n            if (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {\n              // eslint-disable-next-line no-console\n              console.warn(`MinimalFooter.BackToTop: No element found with id \"${focusTargetId}\".`)\n            }\n            return\n          }\n\n          const hadTabIndex = focusTarget.hasAttribute('tabindex')\n\n          if (!hadTabIndex) {\n            focusTarget.tabIndex = -1\n            focusTarget.addEventListener('blur', () => focusTarget.removeAttribute('tabindex'), {once: true})\n          }\n\n          focusTarget.focus({preventScroll: true})\n        }\n      },\n      [focusTargetId, onClick, prefersReducedMotion],\n    )\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={clsx(styles.MinimalFooter__backToTop, className)}\n        onClick={handleClick}\n        {...rest}\n      >\n        <span className={styles['MinimalFooter__backToTop-content']}>\n          <Text as=\"span\" size=\"100\" weight=\"medium\" className={styles.MinimalFooter__metaText}>\n            {children}\n          </Text>\n          <span className={styles['MinimalFooter__backToTop-icon']} aria-hidden=\"true\">\n            <ArrowUpIcon />\n          </span>\n        </span>\n      </button>\n    )\n  },\n)\n\n/**\n * Use MinimalFooter to render a global footer on all GitHub pages.\n * @see https://primer.style/brand/components/MinimalFooter\n */\nexport const MinimalFooter = Object.assign(Root, {\n  Footnotes,\n  Link,\n  BackToTop,\n})\n"],"mappings":"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"}