@primer/react-brand 0.79.1-rc.ed00156c → 0.80.0-rc.4bfa3a79

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes-CzvPUrZu.css

@@ -0,0 +1 @@
+:root,[data-color-mode=light],[data-color-mode=auto]{--brand-Token-bgColor-default:var(--base-color-scale-gray-0);--brand-Token-bgColor-accent:var(--base-color-scale-green-6);--brand-Token-bgColor-hover-default:var(--base-color-scale-gray-1);--brand-Token-bgColor-hover-accent:var(--base-color-scale-green-7);--brand-Token-bgColor-hover-outline:#0000000f;--brand-Token-bgColor-hover-invisible:#0000000f;--brand-Token-bgColor-invisible:var(--base-color-scale-gray-1);--brand-Token-bgColor-outline:transparent;--brand-Token-border-outline:var(--brand-color-border-muted);--brand-Token-fgColor-default:var(--brand-color-text-default);--brand-Token-fgColor-accent:var(--base-color-scale-white-0);--brand-Token-fgColor-outline:var(--brand-color-text-default);--brand-Token-fgColor-invisible:var(--brand-color-text-default)}[data-color-mode=dark]{--brand-Token-bgColor-default:var(--base-color-scale-gray-7);--brand-Token-bgColor-accent:var(--base-color-scale-green-2);--brand-Token-bgColor-hover-default:var(--base-color-scale-gray-6);--brand-Token-bgColor-hover-accent:var(--base-color-scale-green-1);--brand-Token-bgColor-hover-outline:var(--brand-color-canvas-subtle);--brand-Token-bgColor-hover-invisible:var(--brand-color-canvas-subtle);--brand-Token-bgColor-invisible:transparent;--brand-Token-bgColor-outline:transparent;--brand-Token-border-outline:var(--brand-color-border-default);--brand-Token-fgColor-default:var(--brand-color-text-default);--brand-Token-fgColor-accent:var(--brand-color-text-onEmphasis);--brand-Token-fgColor-outline:var(--brand-color-text-default);--brand-Token-fgColor-invisible:var(--brand-color-text-default)}@media (prefers-color-scheme:dark){[data-color-mode=auto]{--brand-Token-bgColor-default:var(--base-color-scale-gray-7);--brand-Token-bgColor-accent:var(--base-color-scale-green-2);--brand-Token-bgColor-hover-default:var(--base-color-scale-gray-6);--brand-Token-bgColor-hover-accent:var(--base-color-scale-green-1);--brand-Token-bgColor-hover-outline:var(--brand-color-canvas-subtle);--brand-Token-bgColor-hover-invisible:var(--brand-color-canvas-subtle);--brand-Token-bgColor-invisible:transparent;--brand-Token-bgColor-outline:transparent;--brand-Token-border-outline:var(--brand-color-border-default);--brand-Token-fgColor-default:var(--brand-color-text-default);--brand-Token-fgColor-accent:var(--brand-color-text-onEmphasis);--brand-Token-fgColor-outline:var(--brand-color-text-default);--brand-Token-fgColor-invisible:var(--brand-color-text-default)}}

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tooltip/colors-with-modes-CjEAA-Ic.css

@@ -0,0 +1 @@
+:root,[data-color-mode=light],[data-color-mode=auto]{--brand-Tooltip-color-default:var(--brand-color-text-onEmphasis)}[data-color-mode=dark]{--brand-Tooltip-color-default:var(--brand-color-text-default)}@media (prefers-color-scheme:dark){[data-color-mode=auto]{--brand-Tooltip-color-default:var(--brand-color-text-default)}}

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/colors-with-modes-M9ib_BKQ.css

@@ -0,0 +1 @@
+:root,[data-color-mode=light],[data-color-mode=auto],[data-color-mode=dark]{--brand-videoPlayer-playButton-bgColor-rest:var(--base-color-scale-blue-5);--brand-videoPlayer-playButton-fgColor-rest:var(--base-color-scale-gray-0);--brand-videoPlayer-title-bgColor:linear-gradient(180deg, #000000e6, #00000073 66%, transparent);--brand-videoPlayer-title-fgColor:var(--base-color-scale-gray-0);--brand-videoPlayer-controls-bgColor:var(--base-color-scale-black-0);--brand-videoPlayer-controls-fgColor:var(--base-color-scale-gray-0);--brand-videoPlayer-closedCaption-bgColor-enabled:var(--base-color-scale-gray-0);--brand-videoPlayer-closedCaption-fgColor-enabled:var(--base-color-scale-black-0);--brand-videoPlayer-closedCaption-fgColor-disabled:var(--base-color-scale-gray-0);--brand-videoPlayer-closedCaption-borderColor-enabled:var(--base-color-scale-gray-0);--brand-videoPlayer-range-bgColor-default:var(--base-color-scale-gray-0);--brand-videoPlayer-range-bgColor-progress:var(--base-color-scale-blue-4)}@media (prefers-color-scheme:dark){[data-color-mode=auto]{--brand-videoPlayer-playButton-bgColor-rest:var(--base-color-scale-blue-5);--brand-videoPlayer-playButton-fgColor-rest:var(--base-color-scale-gray-0);--brand-videoPlayer-title-bgColor:linear-gradient(180deg, #000000e6, #00000073 66%, transparent);--brand-videoPlayer-title-fgColor:var(--base-color-scale-gray-0);--brand-videoPlayer-controls-bgColor:var(--base-color-scale-black-0);--brand-videoPlayer-controls-fgColor:var(--base-color-scale-gray-0);--brand-videoPlayer-closedCaption-bgColor-enabled:var(--base-color-scale-gray-0);--brand-videoPlayer-closedCaption-fgColor-enabled:var(--base-color-scale-black-0);--brand-videoPlayer-closedCaption-fgColor-disabled:var(--base-color-scale-gray-0);--brand-videoPlayer-closedCaption-borderColor-enabled:var(--base-color-scale-gray-0);--brand-videoPlayer-range-bgColor-default:var(--base-color-scale-gray-0);--brand-videoPlayer-range-bgColor-progress:var(--base-color-scale-blue-4)}}

package/esm/river/River/River.js

@@ -3,7 +3,7 @@ import { useAnimation as t } from "../../animation/useAnimation.js";
 import { Text as n } from "../../Text/Text.js";
 import { EyebrowText as r } from "../../EyebrowText/EyebrowText.js";
 import { Heading as i } from "../../Heading/Heading.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/inline-code/colors-with-modes-Bj7XtHMY.css';import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/base-Ue-p74RC.css';import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/river-DHn1_SEa.css';/* empty css                                                                                          */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/inline-code/colors-with-modes-B72y-n-A.css';import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/base-Ue-p74RC.css';import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river/river-DHn1_SEa.css';/* empty css                                                                                          */
 import a from "../../component-helpers/shared.module.js";
 import { Link as o } from "../../Link/Link.js";
 import { Label as s } from "../../Label/Label.js";

package/esm/river/RiverStoryScroll/RiverStoryScroll.js

@@ -3,7 +3,7 @@ import { RiverStoryScrollProvider as t } from "./RiverStoryScrollProvider.js";
 import n from "./RiverStoryScroll.module.js";
 import { RiverStoryScrollResponder as r } from "./RiverStoryScrollResponder.js";
 import { RiverStoryScrollTracker as i } from "./RiverStoryScrollTracker.js";
-import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river-story-scroll/colors-with-modes-omPmv64b.css';/* empty css                                                                                                                   */
+import '../../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river-story-scroll/colors-with-modes-DOJW-F1w.css';/* empty css                                                                                                                   */
 import a, { useEffect as o, useRef as s } from "react";
 import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/river/RiverStoryScroll/RiverStoryScroll.tsx

package/lib/LogoSuite/LogoSuite.d.ts

@@ -22,7 +22,7 @@ export type LogoSuiteProps = {
     /**
      * Alternative presentation
      */
-    variant?: 'default' | 'gridline-expressive';
+    variant?: 'default' | 'gridline' | 'gridline-expressive';
 } & BaseProps<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>;
 export type LogoSuiteHeadingProps = BaseProps<HTMLHeadingElement> & HeadingProps & {
     /**
@@ -34,6 +34,10 @@ export type LogoSuiteDescriptionProps = BaseProps<HTMLParagraphElement> & TextPr
     children: React.ReactNode | React.ReactNode[];
 };
 export type LogoSuiteLogoBarProps = BaseProps<HTMLDivElement> & {
+    /**
+     * The logos to display in the LogoBar.
+     * Accepts either SVG/Image elements or logos wrapped with links
+     */
     children: React.ReactNode | React.ReactNode[];
     /**
      * The gap between logos

package/lib/PlayIcon.d.ts

@@ -0,0 +1,2 @@
+import React, { type SVGAttributes } from 'react';
+export declare function PlayIcon(props: SVGAttributes<SVGSVGElement>): React.JSX.Element;

package/lib/Spinner/Spinner.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/spinner/base.css';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/spinner/colors-with-modes.css';
+export type SpinnerProps = {
+    size?: 'small' | 'medium' | 'large' | number;
+    accessibleLabel?: string | null;
+    className?: string;
+    'data-testid'?: string;
+};
+export declare function Spinner({ size, accessibleLabel, className, 'data-testid': testId, }: SpinnerProps): React.JSX.Element;

package/lib/Spinner/index.d.ts

@@ -0,0 +1,2 @@
+export { Spinner } from './Spinner';
+export type { SpinnerProps } from './Spinner';

package/lib/ThemeProvider/ThemeProvider.d.ts

@@ -8,6 +8,7 @@ export type ColorMode = `${ColorModesEnum}` | (string & {});
 export type ResolvedColorMode = ColorModesEnum.LIGHT | ColorModesEnum.DARK;
 export type ThemeContextProps = {
     colorMode: ResolvedColorMode;
+    originalColorMode?: ColorMode;
     availableColorModes: ColorModesEnum[];
 };
 export type ThemeProviderProps = {