@primer/react-brand 0.46.0 → 0.47.0-rc.92f76d23

package/lib/Accordion/Accordion.d.ts

@@ -30,7 +30,7 @@ type AccordionContentProps = BaseProps<HTMLElement> & {
     handleOpen?: (boolean: any) => void;
     parentRef?: React.RefObject<HTMLDetailsElement>;
 };
-export declare function AccordionContent({ children, className, open, handleOpen, parentRef, ...rest }: AccordionContentProps): JSX.Element;
+export declare function AccordionContent({ children, className, open, handleOpen, parentRef, ...rest }: AccordionContentProps): import("react/jsx-runtime").JSX.Element;
 /**
  * Branded Accordion component
  */

package/lib/ActionMenu/ActionMenu.d.ts

@@ -120,9 +120,9 @@ export declare const ActionMenu: React.NamedExoticComponent<{
     size?: ActionMenuSizes;
     menuSide?: PositionSettings["side"];
 } & BaseProps<HTMLDivElement>> & {
-    readonly type: ({ id, children, "data-testid": testId, disabled, open, selectionVariant, menuAlignment, size, menuSide, onSelect, }: ActionMenuProps) => JSX.Element;
+    readonly type: ({ id, children, "data-testid": testId, disabled, open, selectionVariant, menuAlignment, size, menuSide, onSelect, }: ActionMenuProps) => import("react/jsx-runtime").JSX.Element;
 } & {
-    Button: React.ForwardRefExoticComponent<(Omit<((instance: HTMLButtonElement | null) => void) & {
+    Button: React.ForwardRefExoticComponent<(Omit<((instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) & {
         children?: React.ReactNode | undefined;
     } & {
         id?: string;
@@ -145,8 +145,8 @@ export declare const ActionMenu: React.NamedExoticComponent<{
         'data-testid'?: string;
         size?: ActionMenuSizes;
     }, "ref">) & React.RefAttributes<HTMLButtonElement>>;
-    Item: ({ children, className, disabled, handler, selected, type, value, ...props }: ActionMenuItemProps) => JSX.Element;
-    Overlay: React.ForwardRefExoticComponent<(Omit<((instance: HTMLUListElement | null) => void) & {
+    Item: ({ children, className, disabled, handler, selected, type, value, ...props }: ActionMenuItemProps) => import("react/jsx-runtime").JSX.Element;
+    Overlay: React.ForwardRefExoticComponent<(Omit<((instance: HTMLUListElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) & {
         children?: React.ReactNode | undefined;
     } & {
         'aria-label': string;

package/lib/AnchorNav/AnchorNav.d.ts

@@ -19,7 +19,7 @@ export type AnchorNavProps = BaseProps<HTMLElement> & {
      */
     hideUntilSticky?: boolean;
 } & React.ComponentPropsWithoutRef<'nav'>;
-declare function _AnchorNav({ children, enableDefaultBgColor, hideUntilSticky, ...rest }: AnchorNavProps): JSX.Element;
+declare function _AnchorNav({ children, enableDefaultBgColor, hideUntilSticky, ...rest }: AnchorNavProps): import("react/jsx-runtime").JSX.Element;
 type AnchorNavLinkIntersectionOptions = {
     /**
      * The area of the element that should trigger the next linked section to be highlighted.
@@ -45,15 +45,15 @@ type AnchorNavLinkProps = BaseProps<HTMLAnchorElement> & {
     prefersReducedMotion?: boolean;
     updateCurrentActiveNav?: (id: string | null) => void;
 } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>;
-declare function _AnchorNavLink({ alignment, children, href, isActive, toggleMenuCallback, prefersReducedMotion, intersectionOptions, updateCurrentActiveNav, ...rest }: AnchorNavLinkProps): JSX.Element;
+declare function _AnchorNavLink({ alignment, children, href, isActive, toggleMenuCallback, prefersReducedMotion, intersectionOptions, updateCurrentActiveNav, ...rest }: AnchorNavLinkProps): import("react/jsx-runtime").JSX.Element;
 type AnchorNavActionProps = {
     /**
      * Required path or location for the action button to link to.
      */
     href: string;
 } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & ButtonBaseProps;
-declare function _AnchorNavAction({ children, href, variant, size, ...rest }: AnchorNavActionProps): JSX.Element;
-declare function _AnchorNavActionSecondary({ children, href, variant, size, ...rest }: AnchorNavActionProps): JSX.Element;
+declare function _AnchorNavAction({ children, href, variant, size, ...rest }: AnchorNavActionProps): import("react/jsx-runtime").JSX.Element;
+declare function _AnchorNavActionSecondary({ children, href, variant, size, ...rest }: AnchorNavActionProps): import("react/jsx-runtime").JSX.Element;
 /**
  * AnchorNav allows users to navigate to different sections of a page.
  * @see https://primer.style/brand/components/AnchorNav

package/lib/Bento/Bento.d.ts

@@ -45,10 +45,10 @@ type BentoVisualProps = {
     position?: string;
     padding?: Padding | ResponsivePadding;
 } & React.HTMLAttributes<HTMLDivElement> & BaseProps<HTMLDivElement>;
-export declare const Bento: (({ className, ...rest }: BentoProps) => JSX.Element) & {
-    Item: ({ className, columnStart, columnSpan, rowStart, rowSpan, flow, colorMode, visualAsBackground, order, bgColor, children, ...rest }: BentoItemProps) => JSX.Element;
-    Visual: ({ horizontalAlign, verticalAlign, fillMedia, overflow, position, padding, className, children, ...rest }: BentoVisualProps) => JSX.Element;
-    Content: ({ children, leadingVisual: LeadingVisual, padding, verticalAlign, horizontalAlign, className, ...rest }: BentoContentProps) => JSX.Element;
-    Heading: React.ForwardRefExoticComponent<Omit<BentoHeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+export declare const Bento: (({ className, ...rest }: BentoProps) => import("react/jsx-runtime").JSX.Element) & {
+    Item: ({ className, columnStart, columnSpan, rowStart, rowSpan, flow, colorMode, visualAsBackground, order, bgColor, children, ...rest }: BentoItemProps) => import("react/jsx-runtime").JSX.Element;
+    Visual: ({ horizontalAlign, verticalAlign, fillMedia, overflow, position, padding, className, children, ...rest }: BentoVisualProps) => import("react/jsx-runtime").JSX.Element;
+    Content: ({ children, leadingVisual: LeadingVisual, padding, verticalAlign, horizontalAlign, className, ...rest }: BentoContentProps) => import("react/jsx-runtime").JSX.Element;
+    Heading: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<BentoHeadingProps>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
 };
 export {};

package/lib/Box/Box.d.ts

@@ -77,5 +77,5 @@ type BoxProps = {
  * Use Box to apply fine-grained styling to content.
  * @see https://primer.style/brand/components/Box
  */
-export declare const Box: ({ animate, children, className, "data-testid": testId, style, padding, paddingBlockStart, paddingInlineEnd, paddingBlockEnd, paddingInlineStart, margin, marginBlockStart, marginInlineEnd, marginBlockEnd, marginInlineStart, backgroundColor, borderRadius, borderWidth, borderBlockStartWidth, borderInlineEndWidth, borderBlockEndWidth, borderInlineStartWidth, borderColor, borderStyle, ...rest }: PropsWithChildren<BoxProps>) => JSX.Element;
+export declare const Box: ({ animate, children, className, "data-testid": testId, style, padding, paddingBlockStart, paddingInlineEnd, paddingBlockEnd, paddingInlineStart, margin, marginBlockStart, marginInlineEnd, marginBlockEnd, marginInlineStart, backgroundColor, borderRadius, borderWidth, borderBlockStartWidth, borderInlineEndWidth, borderBlockEndWidth, borderInlineStartWidth, borderColor, borderStyle, ...rest }: PropsWithChildren<BoxProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/BreakoutBanner/BreakoutBanner.d.ts

@@ -1,6 +1,7 @@
 import React, { ReactElement } from 'react';
 import { Icon } from '@primer/octicons-react';
 import type { BaseProps } from '../component-helpers';
+import { HeadingProps, StackProps } from '../';
 type ResponsiveMap<T> = {
     narrow?: T;
     regular?: T;
@@ -39,95 +40,19 @@ export type BreakoutBannerProps = BaseProps<HTMLDivElement> & React.HTMLAttribut
      */
     leadingVisual?: ReactElement | Icon;
 };
+type BreakoutBannerHeadingProps = BaseProps<HTMLHeadingElement> & {
+    children: React.ReactNode | React.ReactNode[];
+} & HeadingProps;
+type BreakoutBannerDescriptionProps = BaseProps<HTMLParagraphElement> & {
+    children: React.ReactNode | React.ReactNode[];
+};
 /**
  * Breakout banner component
  * {@link https://primer.style/brand/components/BreakoutBanner/ See usage examples}.
  */
-export declare const BreakoutBanner: React.ForwardRefExoticComponent<Omit<BaseProps<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
-    children: React.ReactNode | React.ReactNode[];
-    /**
-     * The alignment of the content within the banner
-     */
-    align?: "start" | "center";
-    /**
-     * Optional, custom background color
-     */
-    backgroundColor?: BackgroundColors | ResponsiveBackgroundColorMap;
-    /**
-     * Optional, custom background image
-     */
-    backgroundImageSrc?: string | ResponsiveBackgroundImageSrcMap;
-    /**
-     * Optional, custom background position
-     */
-    backgroundImagePosition?: string | ResponsiveBackgroundImagePositionMap;
-    /**
-     * Optional, custom background size
-     */
-    backgroundImageSize?: string | ResponsiveBackgroundImageSizeMap;
-    /**
-     * An optional leading visual that appears before the heading
-     */
-    leadingVisual?: ReactElement | Icon;
-}, "ref"> & React.RefAttributes<HTMLDivElement>> & {
-    Heading: React.ForwardRefExoticComponent<Omit<BaseProps<HTMLHeadingElement> & {
-        children: React.ReactNode | React.ReactNode[];
-    } & {
-        as?: typeof import("../").HeadingTags[number];
-        size?: typeof import("../").HeadingSizes[number];
-        weight?: ("medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight") | {
-            narrow?: "medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight";
-            regular?: "medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight";
-            wide?: "medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight";
-        };
-        stretch?: ("normal" | "condensed" | "expanded") | {
-            narrow?: "normal" | "condensed" | "expanded";
-            regular?: "normal" | "condensed" | "expanded";
-            wide?: "normal" | "condensed" | "expanded";
-        };
-        letterSpacing?: ("normal" | "condensed" | "none") | {
-            narrow?: "normal" | "condensed" | "none";
-            regular?: "normal" | "condensed" | "none";
-            wide?: "normal" | "condensed" | "none";
-        };
-        font?: "mona-sans" | "hubot-sans" | "monospace";
-    } & React.HTMLAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
-    Description: React.ForwardRefExoticComponent<Omit<BaseProps<HTMLParagraphElement> & {
-        children: React.ReactNode | React.ReactNode[];
-    }, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-    LinkGroup: React.ForwardRefExoticComponent<Omit<Omit<BaseProps<HTMLElement> & {
-        children: React.ReactNode[] | React.ReactNode;
-        direction?: ("horizontal" | "vertical") | {
-            narrow?: "horizontal" | "vertical";
-            regular?: "horizontal" | "vertical";
-            wide?: "horizontal" | "vertical";
-        };
-        gap?: ("normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128) | {
-            narrow?: "normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128;
-            regular?: "normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128;
-            wide?: "normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128;
-        };
-        alignItems?: ("center" | "flex-end" | "flex-start") | {
-            narrow?: "center" | "flex-end" | "flex-start";
-            regular?: "center" | "flex-end" | "flex-start";
-            wide?: "center" | "flex-end" | "flex-start";
-        };
-        padding?: ("normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128) | {
-            narrow?: "normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128;
-            regular?: "normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128;
-            wide?: "normal" | 8 | 4 | "condensed" | "none" | 12 | "spacious" | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 64 | 80 | 96 | 112 | 128;
-        };
-        justifyContent?: ("center" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start") | {
-            narrow?: "center" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start";
-            regular?: "center" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start";
-            wide?: "center" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start";
-        };
-        style?: React.CSSProperties;
-        flexWrap?: ("nowrap" | "wrap") | {
-            narrow?: "nowrap" | "wrap";
-            regular?: "nowrap" | "wrap";
-            wide?: "nowrap" | "wrap";
-        };
-    } & BaseProps<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<unknown>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const BreakoutBanner: React.ForwardRefExoticComponent<Omit<BreakoutBannerProps, "ref"> & React.RefAttributes<HTMLDivElement>> & {
+    Heading: React.ForwardRefExoticComponent<Omit<BreakoutBannerHeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+    Description: React.ForwardRefExoticComponent<Omit<BreakoutBannerDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+    LinkGroup: React.ForwardRefExoticComponent<Omit<Omit<StackProps, "ref"> & React.RefAttributes<unknown>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 };
 export {};

package/lib/Button/Button.d.ts

@@ -35,12 +35,8 @@ export type ButtonBaseProps = {
 export type ButtonProps<C extends React.ElementType> = BaseProps<C> & {
     as?: C;
 } & ButtonBaseProps & React.ComponentPropsWithoutRef<C>;
-export declare const _Button: React.ForwardRefExoticComponent<Omit<BaseProps<React.ElementType<any>> & {
-    as?: React.ElementType<any> | undefined;
-} & ButtonBaseProps & Omit<any, "ref">, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-export declare const Button: React.ForwardRefExoticComponent<Omit<BaseProps<React.ElementType<any>> & {
-    as?: React.ElementType<any> | undefined;
-} & ButtonBaseProps & Omit<any, "ref">, "ref"> & React.RefAttributes<HTMLButtonElement>> & {
+export declare const _Button: React.ForwardRefExoticComponent<Omit<ButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLButtonElement>> & {
     testIds: {
         root: string;
         readonly leadingVisual: string;

package/lib/ButtonGroup/ButtonGroup.d.ts

@@ -7,9 +7,5 @@ export type ButtonGroupProps = BaseProps<HTMLDivElement> & {
     buttonSize?: ButtonProps<'button' | 'a'>['size'];
     buttonsAs?: React.ElementType;
 };
-export declare const ButtonGroup: React.ForwardRefExoticComponent<Omit<BaseProps<HTMLDivElement> & {
-    children: PrimerBrandButtonType[] | PrimerBrandButtonType;
-    buttonSize?: ButtonProps<"button" | "a">["size"];
-    buttonsAs?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ButtonGroup: React.ForwardRefExoticComponent<Omit<ButtonGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/lib/CTABanner/CTABanner.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { BaseProps } from '../component-helpers';
+import { HeadingProps } from '../Heading';
 import { TextProps } from '../Text';
 /**
  * Design tokens
@@ -57,76 +58,15 @@ export type CTABannerProps = BaseProps<HTMLElement> & React.HTMLAttributes<HTMLE
      */
     trailingComponent?: React.FunctionComponent;
 };
-export declare const CTABanner: React.ForwardRefExoticComponent<Omit<BaseProps<HTMLElement> & React.HTMLAttributes<HTMLElement> & {
-    /**
-     * The alignment of the content within the banner.
-     */
-    align?: "start" | "center";
-    /**
-     * A flag to add a border to the banner.
-     */
-    hasBorder?: boolean;
-    /**
-     * A flag to remove the shadow from the banner.
-     */
-    hasShadow?: boolean;
-    /**
-     * A flag to remove the background from the banner.
-     */
-    hasBackground?: boolean;
-    /**
-     * Optional, custom background color.
-     */
-    backgroundColor?: BackgroundColors | ResponsiveBackgroundColorMap;
-    /**
-     * Optional, custom background image.
-     */
-    backgroundImageSrc?: string | ResponsiveBackgroundImageSrcMap;
-    /**
-     * Optional, custom background position.
-     */
-    backgroundImagePosition?: string | ResponsiveBackgroundImagePositionMap;
-    /**
-     * Optional, custom background size.
-     */
-    backgroundImageSize?: string | ResponsiveBackgroundImageSizeMap;
-    /**
-     * Escape-hatch for inserting custom React components.
-     * Warning:
-     *   This prop isn't advertised in our docs but remains part of the public API for edge-cases.
-     *   Need to use this prop? Please check in with #primer-brand first to confirm correct usage.
-     */
-    trailingComponent?: React.FunctionComponent;
-}, "ref"> & React.RefAttributes<HTMLElement>> & {
-    Heading: React.ForwardRefExoticComponent<Omit<BaseProps<HTMLHeadingElement> & {
-        children: React.ReactNode | React.ReactNode[];
-    } & {
-        as?: typeof import("../Heading").HeadingTags[number];
-        size?: typeof import("../Heading").HeadingSizes[number];
-        weight?: ("medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight") | {
-            narrow?: "medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight";
-            regular?: "medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight";
-            wide?: "medium" | "light" | "heavy" | "extrabold" | "bold" | "semibold" | "normal" | "extralight";
-        };
-        stretch?: ("normal" | "condensed" | "expanded") | {
-            narrow?: "normal" | "condensed" | "expanded";
-            regular?: "normal" | "condensed" | "expanded";
-            wide?: "normal" | "condensed" | "expanded";
-        };
-        letterSpacing?: ("normal" | "condensed" | "none") | {
-            narrow?: "normal" | "condensed" | "none";
-            regular?: "normal" | "condensed" | "none";
-            wide?: "normal" | "condensed" | "none";
-        };
-        font?: "mona-sans" | "hubot-sans" | "monospace";
-    } & React.HTMLAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
-    Description: React.ForwardRefExoticComponent<Omit<React.HtmlHTMLAttributes<HTMLParagraphElement> & BaseProps<HTMLParagraphElement> & {
-        variant?: TextProps["variant"];
-    }, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-    ButtonGroup: React.ForwardRefExoticComponent<Omit<Omit<BaseProps<HTMLDivElement> & {
-        children: React.ReactElement<import("..").ButtonProps<React.ElementType<"a" | "button">>, string | React.JSXElementConstructor<any>>[] | React.ReactElement<import("..").ButtonProps<React.ElementType<"a" | "button">>, string | React.JSXElementConstructor<any>>;
-        buttonSize?: import("..").ButtonProps<"button" | "a">["size"];
-        buttonsAs?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+type CTABannerHeadingProps = BaseProps<HTMLHeadingElement> & {
+    children: React.ReactNode | React.ReactNode[];
+} & HeadingProps;
+type CTABannerDescriptionProps = React.HtmlHTMLAttributes<HTMLParagraphElement> & BaseProps<HTMLParagraphElement> & {
+    variant?: TextProps['variant'];
+};
+export declare const CTABanner: React.ForwardRefExoticComponent<Omit<CTABannerProps, "ref"> & React.RefAttributes<HTMLElement>> & {
+    Heading: React.ForwardRefExoticComponent<Omit<CTABannerHeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+    Description: React.ForwardRefExoticComponent<Omit<CTABannerDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+    ButtonGroup: React.ForwardRefExoticComponent<Omit<Omit<import("../ButtonGroup").ButtonGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 };
 export {};

package/lib/CTAForm/CTAForm.d.ts

@@ -2,7 +2,5 @@ import React from 'react';
 export declare const CTAForm: React.ForwardRefExoticComponent<React.FormHTMLAttributes<HTMLFormElement> & React.RefAttributes<HTMLFormElement>> & {
     Input: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
     Confirm: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-    Action: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("../component-helpers").BaseProps<React.ElementType<any>> & {
-        as?: React.ElementType<any> | undefined;
-    } & import("../").ButtonBaseProps & Omit<any, "ref">, "ref"> & React.RefAttributes<HTMLButtonElement>, "variant" | "type">, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Action: React.ForwardRefExoticComponent<Omit<Omit<import("../").ButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 };

package/lib/Card/Card.d.ts

@@ -37,7 +37,7 @@ export type CardProps = {
     fullWidth?: boolean;
 } & Omit<BaseProps<HTMLDivElement>, 'animate'> & Omit<React.ComponentPropsWithoutRef<'div'>, 'onMouseEnter' | 'onMouseLeave' | 'onFocus' | 'onBlur'> & Pick<React.ComponentPropsWithoutRef<'a'>, 'onMouseEnter' | 'onMouseLeave' | 'onFocus' | 'onBlur'>;
 type CardImageProps = ImageProps;
-declare function CardImage({ className, ...rest }: CardImageProps): JSX.Element;
+declare function CardImage({ className, ...rest }: CardImageProps): import("react/jsx-runtime").JSX.Element;
 type CardIconProps = IconProps;
 type CardLabelProps = BaseProps<HTMLSpanElement> & {
     children: React.ReactNode | React.ReactNode[];
@@ -58,7 +58,7 @@ type CardDescriptionProps = BaseProps<HTMLParagraphElement> & {
 export declare const Card: React.ForwardRefExoticComponent<Omit<CardProps, "ref"> & React.RefAttributes<HTMLDivElement>> & {
     Image: typeof CardImage;
     Label: React.ForwardRefExoticComponent<Omit<CardLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
-    Icon: ({ className, ...props }: IconProps) => JSX.Element;
+    Icon: ({ className, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
     Heading: React.ForwardRefExoticComponent<Omit<CardHeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
     Description: React.ForwardRefExoticComponent<Omit<CardDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
 };

package/lib/Card/CardSkewEffect.d.ts

@@ -4,5 +4,5 @@ type CardSkewEffectProps = {
     perspective?: number;
     disableSkew?: boolean;
 } & BaseProps<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>;
-export declare const CardSkewEffect: ({ color, children, className, perspective, disableSkew, ...rest }: PropsWithChildren<CardSkewEffectProps>) => JSX.Element;
+export declare const CardSkewEffect: ({ color, children, className, perspective, disableSkew, ...rest }: PropsWithChildren<CardSkewEffectProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/ComparisonTable/ComparisonTable.d.ts

@@ -11,12 +11,7 @@ export type ComparisonTableProps<C extends React.ElementType> = BaseProps<C> & {
     variant?: 'default' | 'minimal';
     featuredColumn?: number;
 } & React.ComponentPropsWithoutRef<C>;
-export declare const _ComparisonTable: React.ForwardRefExoticComponent<Omit<BaseProps<React.ElementType<any>> & {
-    as?: React.ElementType<any> | undefined;
-    heading?: string;
-    variant?: "default" | "minimal";
-    featuredColumn?: number;
-} & Omit<any, "ref">, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const _ComparisonTable: React.ForwardRefExoticComponent<Omit<ComparisonTableProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 type RowProps = {
     header?: boolean;
 };
@@ -30,14 +25,9 @@ export type FootnoteProps = BaseProps<HTMLParagraphElement>;
  *  They are useful for comparing products, plans, or features in marketing pages.
  * @see https://primer.style/brand/components/ComparisonTable
  */
-export declare const ComparisonTable: React.ForwardRefExoticComponent<Omit<BaseProps<React.ElementType<any>> & {
-    as?: React.ElementType<any> | undefined;
-    heading?: string;
-    variant?: "default" | "minimal";
-    featuredColumn?: number;
-} & Omit<any, "ref">, "ref"> & React.RefAttributes<HTMLDivElement>> & {
-    Row: ({ children, ...rest }: PropsWithChildren<RowProps>) => JSX.Element;
-    Cell: ({ as, children, ...props }: PropsWithChildren<CellProps>) => JSX.Element;
-    Footnote: ({ children, ...props }: PropsWithChildren<FootnoteProps>) => JSX.Element;
+export declare const ComparisonTable: React.ForwardRefExoticComponent<Omit<ComparisonTableProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLDivElement>> & {
+    Row: ({ children, ...rest }: PropsWithChildren<RowProps>) => import("react/jsx-runtime").JSX.Element;
+    Cell: ({ as, children, ...props }: PropsWithChildren<CellProps>) => import("react/jsx-runtime").JSX.Element;
+    Footnote: ({ children, ...props }: PropsWithChildren<FootnoteProps>) => import("react/jsx-runtime").JSX.Element;
 };
 export {};

package/lib/ExpandableArrow/ExpandableArrow.d.ts

@@ -5,5 +5,5 @@ type ExpandableArrowProps = {
     hidden?: boolean;
     reverse?: boolean;
 };
-export declare function ExpandableArrow({ className, expanded, reverse, hidden, ...rest }: ExpandableArrowProps): JSX.Element;
+export declare function ExpandableArrow({ className, expanded, reverse, hidden, ...rest }: ExpandableArrowProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/FAQ/FAQ.d.ts

@@ -18,7 +18,7 @@ export type FAQSubheadingProps = BaseProps<HTMLHeadingElement> & {
     children: React.ReactNode | React.ReactNode[];
     as?: Exclude<HeadingProps['as'], 'h1'>;
 } & HeadingProps;
-declare function FAQSubheading({ children, className, as, size, weight, ...rest }: FAQSubheadingProps): JSX.Element;
+declare function FAQSubheading({ children, className, as, size, weight, ...rest }: FAQSubheadingProps): import("react/jsx-runtime").JSX.Element;
 /**
  * FAQ component:
  * {@link https://primer.style/brand/components/FAQ/ See usage examples}.

package/lib/FAQ/FAQGroup.d.ts

@@ -6,13 +6,13 @@ import { FAQSubheadingProps } from './';
 import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/faq/base.css';
 import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes.css';
 import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/faq/faq.css';
-declare function _Heading({ children, className, as, ...rest }: FAQSubheadingProps): JSX.Element;
+declare function _Heading({ children, className, as, ...rest }: FAQSubheadingProps): import("react/jsx-runtime").JSX.Element;
 export type FAQGroupProps = React.PropsWithChildren<{
     id?: string;
     defaultSelectedIndex?: number;
     tabAttributes?: (children: ReactElement, index: number) => Record<string, unknown>;
 }>;
-declare function _FAQGroup({ children, id, defaultSelectedIndex, tabAttributes, ...rest }: FAQGroupProps): JSX.Element;
+declare function _FAQGroup({ children, id, defaultSelectedIndex, tabAttributes, ...rest }: FAQGroupProps): import("react/jsx-runtime").JSX.Element;
 /**
  * FAQGroup component:
  * {@link https://primer.style/brand/components/FAQ#grouped-faqs See usage examples}.

package/lib/Footnotes/Footnotes.d.ts

@@ -10,7 +10,7 @@ type FootnotesProps = {
     as?: (typeof FootnotesTags)[number];
     visuallyHiddenHeading?: string;
 } & FootnotesRestrictedPolymorphism;
-declare function Root({ as, className, children, visuallyHiddenHeading, ...rest }: FootnotesProps): JSX.Element;
+declare function Root({ as, className, children, visuallyHiddenHeading, ...rest }: FootnotesProps): import("react/jsx-runtime").JSX.Element;
 export declare const FootnotesItemTags: readonly ["a", "p"];
 type DefaultFootnotesItemProps = {
     _variant?: 'disclaimer';
@@ -20,7 +20,7 @@ type CitationFootnotesItemProps = {
     href?: string;
 };
 type FootnotesItemProps = (DefaultFootnotesItemProps | CitationFootnotesItemProps) & React.HTMLAttributes<HTMLParagraphElement> & BaseProps<HTMLParagraphElement>;
-declare function Item({ className, children, _variant, ...rest }: FootnotesItemProps): JSX.Element;
+declare function Item({ className, children, _variant, ...rest }: FootnotesItemProps): import("react/jsx-runtime").JSX.Element;
 /**
  * Footnotes component
  * {@link https://primer.style/brand/components/Footnotes/ See usage examples}.

package/lib/FrostedGlassVFX/FrostedGlassVFX.d.ts

@@ -22,4 +22,4 @@ export type FrostedGlassVFXProps = BaseProps<HTMLDivElement> & React.HTMLAttribu
  * FrostedGlassVFX component
  * {@link https://primer.style/brand/components/FrostedGlassVFX/ See usage examples}.
  */
-export declare function FrostedGlassVFX({ hasBorderRadius, children, className, intensity, ...rest }: FrostedGlassVFXProps): JSX.Element;
+export declare function FrostedGlassVFX({ hasBorderRadius, children, className, intensity, ...rest }: FrostedGlassVFXProps): import("react/jsx-runtime").JSX.Element;

package/lib/Grid/Grid.d.ts

@@ -67,9 +67,9 @@ export declare const Grid: React.NamedExoticComponent<React.HTMLAttributes<"div"
 } & BaseProps<HTMLDivElement> & {
     children?: React.ReactNode | undefined;
 }> & {
-    readonly type: ({ className, children, as, fullWidth, enableOverlay, ["data-testid"]: testId, ...rest }: PropsWithChildren<GridProps>) => JSX.Element;
+    readonly type: ({ className, children, as, fullWidth, enableOverlay, ["data-testid"]: testId, ...rest }: PropsWithChildren<GridProps>) => import("react/jsx-runtime").JSX.Element;
 } & {
-    Column: React.MemoExoticComponent<({ children, as, span, start, className, ...rest }: PropsWithChildren<GridColumnProps>) => JSX.Element>;
+    Column: React.MemoExoticComponent<({ children, as, span, start, className, ...rest }: PropsWithChildren<GridColumnProps>) => import("react/jsx-runtime").JSX.Element>;
     testIds: {
         root: string;
     };

package/lib/Heading/Heading.d.ts

@@ -43,5 +43,5 @@ export type HeadingProps = {
     letterSpacing?: HeadingLetterSpacingVariants | ResponsiveLetterSpacingMap;
     font?: HeadingFontVariants;
 } & React.HTMLAttributes<HTMLHeadingElement> & BaseProps<HTMLHeadingElement>;
-export declare const Heading: React.ForwardRefExoticComponent<Omit<HeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+export declare const Heading: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<HeadingProps>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
 export {};

package/lib/IDE/IDE.d.ts

@@ -50,6 +50,40 @@ export type IDEChatMessage = {
     codeSnippet?: string;
     highlighter?: 'hljs';
 } & (IDEChatMessageUser | IDEChatMessageAssistant);
+type IDEEditorProps = {
+    /**
+     * The index of the active tab.
+     */
+    activeTab?: number;
+    /**
+     * An array of IDE editor files.
+     */
+    files: IDEEditorFile[];
+    /**
+     * Determines whether line numbers should be shown in the editor.
+     */
+    showLineNumbers?: boolean;
+    /**
+     * Controls the size of the editor text.
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * Used for triggering animation externally.
+     */
+    triggerAnimation?: boolean;
+    /**
+     * Determines whether the replay button should be shown.
+     */
+    showReplayButton?: boolean;
+    /**
+     * Test id for the IDE.
+     */
+    'data-testid'?: string;
+    /**
+     * Enable user customisation of the icons used in file tabs.
+     */
+    tabIcons?: IDEEditorTabIcon;
+} & BaseProps<HTMLDivElement>;
 export type IDEEditorFile = {
     name: string;
     /**
@@ -86,7 +120,7 @@ export declare const IDE: React.NamedExoticComponent<{
 } & BaseProps<HTMLDivElement> & {
     children?: React.ReactNode | undefined;
 }> & {
-    readonly type: ({ children, className, "data-testid": testId, height, variant, ...rest }: PropsWithChildren<IDEProps>) => JSX.Element;
+    readonly type: ({ children, className, "data-testid": testId, height, variant, ...rest }: PropsWithChildren<IDEProps>) => import("react/jsx-runtime").JSX.Element;
 } & {
     testIds: {
         root: string;
@@ -95,40 +129,7 @@ export declare const IDE: React.NamedExoticComponent<{
         readonly editorContent: string;
         readonly editorTabs: string;
     };
-    Chat: React.MemoExoticComponent<({ "data-testid": testId, script, animationDelay, alternativeText, ...rest }: IDEChatProps) => JSX.Element>;
-    Editor: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<{
-        /**
-         * The index of the active tab.
-         */
-        activeTab?: number;
-        /**
-         * An array of IDE editor files.
-         */
-        files: IDEEditorFile[];
-        /**
-         * Determines whether line numbers should be shown in the editor.
-         */
-        showLineNumbers?: boolean;
-        /**
-         * Controls the size of the editor text.
-         */
-        size?: "small" | "medium" | "large";
-        /**
-         * Used for triggering animation externally.
-         */
-        triggerAnimation?: boolean;
-        /**
-         * Determines whether the replay button should be shown.
-         */
-        showReplayButton?: boolean;
-        /**
-         * Test id for the IDE.
-         */
-        'data-testid'?: string;
-        /**
-         * Enable user customisation of the icons used in file tabs.
-         */
-        tabIcons?: IDEEditorTabIcon;
-    } & BaseProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>>;
+    Chat: React.MemoExoticComponent<({ "data-testid": testId, script, animationDelay, alternativeText, ...rest }: IDEChatProps) => import("react/jsx-runtime").JSX.Element>;
+    Editor: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<IDEEditorProps, "ref"> & React.RefAttributes<HTMLDivElement>>>;
 };
 export {};

package/lib/Icon/Icon.d.ts

@@ -19,4 +19,4 @@ export type IconProps = SVGAttributes<SVGElement> & {
     hasBackground?: boolean;
     size?: IconSize;
 };
-export declare const Icon: ({ icon: Octicon, className, color, hasBackground, size, ...rest }: IconProps) => JSX.Element;
+export declare const Icon: ({ icon: Octicon, className, color, hasBackground, size, ...rest }: IconProps) => import("react/jsx-runtime").JSX.Element;

package/lib/Image/Image.d.ts

@@ -21,4 +21,4 @@ export type ImageProps = React.ImgHTMLAttributes<HTMLImageElement> & BaseProps<H
     }[];
     srcSet?: undefined;
 });
-export declare const Image: ({ animate, aspectRatio, className, as, ref, alt, width, height, media, srcSet, style, borderRadius, ...rest }: ImageProps) => JSX.Element;
+export declare const Image: ({ animate, aspectRatio, className, as, ref, alt, width, height, media, srcSet, style, borderRadius, ...rest }: ImageProps) => import("react/jsx-runtime").JSX.Element;

package/lib/InlineLink/InlineLink.d.ts

@@ -14,4 +14,4 @@ export type InlineLinkProps = BaseProps<HTMLAnchorElement> & {
 /**
  * A HTML anchor link component that renders inline with adjacent text.
  */
-export declare const InlineLink: React.ForwardRefExoticComponent<Omit<InlineLinkProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+export declare const InlineLink: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<InlineLinkProps>, "ref"> & React.RefAttributes<HTMLAnchorElement>>;

package/lib/Label/Label.d.ts

@@ -4,6 +4,7 @@ import type { BaseProps } from '../component-helpers';
  * Design tokens
  */
 import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/label/colors-with-modes.css';
+import { Icon } from '@primer/octicons-react';
 export declare const LabelColors: readonly ["default", "blue", "coral", "green", "gray", "indigo", "lemon", "lime", "orange", "pink", "purple", "red", "teal", "yellow", "blue-purple", "green-blue", "pink-blue", "purple-red", "red-orange"];
 export declare const LabelSizes: readonly ["medium", "large"];
 export declare const defaultLabelColor: "default";
@@ -12,7 +13,7 @@ export type LabelProps = BaseProps<HTMLSpanElement> & {
     /**
      * The leading visual appears before the Label content
      */
-    leadingVisual?: React.ReactNode;
+    leadingVisual?: React.ReactNode | Icon;
     /**
      * The color variations available in Label
      */