@primer/react-brand 0.66.0 → 0.67.0-rc.197d7044

package/lib/river/RiverBreakoutTabs/RiverBreakoutTabs.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+import { type HeadingProps } from '../..';
+import { type IconProps } from '../../Icon';
+import { type RiverVisualProps } from '../River/River';
+/**
+ * Design tokens
+ */
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/river/base.css';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/river/river.css';
+export type RiverBreakoutTabsProps = React.PropsWithChildren<{
+    defaultSelectedIndex?: number;
+    selectedIndex?: number;
+    onChange?: (selectedIndex: number) => void;
+}> & Omit<React.HTMLAttributes<HTMLElement>, 'onChange'>;
+export type RiverBreakoutTabsItemProps = React.PropsWithChildren<{
+    className?: string;
+}>;
+export type RiverBreakoutTabsA11yHeadingProps = React.PropsWithChildren<{
+    as?: 'h2' | 'h3';
+    id?: string;
+}>;
+export type RiverBreakoutTabsHeadingProps = HeadingProps;
+export type RiverBreakoutTabsContentProps = React.HTMLAttributes<HTMLDivElement>;
+export type RiverBreakoutTabsIconProps = IconProps;
+/**
+ * Use RiverBreakoutTabs to showcase multiple feature stories within a single immersive surface.
+ */
+export declare const RiverBreakoutTabs: React.ForwardRefExoticComponent<{
+    defaultSelectedIndex?: number;
+    selectedIndex?: number;
+    onChange?: (selectedIndex: number) => void;
+} & {
+    children?: React.ReactNode | undefined;
+} & Omit<React.HTMLAttributes<HTMLElement>, "onChange"> & React.RefAttributes<HTMLElement>> & {
+    A11yHeading: ({ as, children, id }: RiverBreakoutTabsA11yHeadingProps) => import("react/jsx-runtime").JSX.Element;
+    Content: ({ children, className, ...props }: RiverBreakoutTabsContentProps) => import("react/jsx-runtime").JSX.Element;
+    Heading: ({ as, children, className, size, weight, ...props }: RiverBreakoutTabsHeadingProps) => import("react/jsx-runtime").JSX.Element;
+    Icon: ({ color, ...props }: RiverBreakoutTabsIconProps) => import("react/jsx-runtime").JSX.Element;
+    Item: ({ children }: RiverBreakoutTabsItemProps) => import("react/jsx-runtime").JSX.Element;
+    Visual: React.ForwardRefExoticComponent<Omit<RiverVisualProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};

package/lib/river/RiverBreakoutTabs/index.d.ts

@@ -0,0 +1 @@
+export * from './RiverBreakoutTabs';

package/lib/river/index.d.ts

@@ -1,4 +1,5 @@
 export * from './RiverAccordion';
 export * from './River';
 export * from './RiverBreakout';
+export * from './RiverBreakoutTabs';
 export * from './RiverStoryScroll';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/react-brand",
-  "version": "0.66.0",
+  "version": "0.67.0-rc.197d7044",
   "description": "Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.",
   "keywords": [
     "primer",
@@ -48,6 +48,7 @@
     "@figma/code-connect": "^1.4.3",
     "@juggle/resize-observer": "^3.4.0",
     "@primer/octicons-react": "19.23.1",
+    "@primer/octovisuals-react": "0.3.0",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.2",