@primer/react-brand 0.35.1-rc.5f777979 → 0.36.0-rc.93f6b95e

package/lib/PricingOptions/PricingOptions.d.ts

@@ -5,6 +5,7 @@ import { ButtonBaseProps, HeadingProps } from '..';
  * Design tokens
  */
 import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pricing-options/pricing-options.css';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes.css';
 export type PricingOptionsProps = {
     variant?: 'default' | 'cards';
     ['data-testid']?: string;

package/lib/Section/Section.d.ts

@@ -0,0 +1,66 @@
+import React, { PropsWithChildren } from 'react';
+import type { BaseProps } from '../component-helpers';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/section/section.css';
+export declare const SectionPaddingVariants: readonly ["none", "condensed", "normal", "spacious"];
+export declare const SectionBackgroundColors: readonly ["default", "subtle"];
+type ResponsiveMap<T> = {
+    narrow?: T;
+    regular?: T;
+    wide?: T;
+};
+type AnyString = string & NonNullable<unknown>;
+type BackgroundColors = (typeof SectionBackgroundColors)[number] | AnyString;
+type PaddingVariants = (typeof SectionPaddingVariants)[number];
+type ResponsiveBackgroundColorMap = ResponsiveMap<BackgroundColors>;
+type ResponsiveBackgroundImagePositionMap = ResponsiveMap<string | string[]>;
+type ResponsiveBackgroundImageSizeMap = ResponsiveMap<string | string[]>;
+type ResponsiveBackgroundImageSrcMap = ResponsiveMap<string | string[]>;
+type ResponsivePaddingVariantsMap = ResponsiveMap<PaddingVariants>;
+type SectionProps = {
+    /**
+     * The HTML element used to render the section.
+     */
+    as?: 'section' | 'div';
+    /**
+     * The padding applied to the start of the section.
+     */
+    paddingBlockStart?: PaddingVariants | ResponsivePaddingVariantsMap;
+    /**
+     * The padding applied to the end of the section.
+     */
+    paddingBlockEnd?: PaddingVariants | ResponsivePaddingVariantsMap;
+    /**
+     * The system-level or custom background color of the section.
+     */
+    backgroundColor?: BackgroundColors | ResponsiveBackgroundColorMap;
+    /**
+     * The background image of the section.
+     */
+    backgroundImageSrc?: string | string[] | ResponsiveBackgroundImageSrcMap;
+    /**
+     * The position of the background image.
+     */
+    backgroundImagePosition?: string | string[] | ResponsiveBackgroundImagePositionMap;
+    /**
+     * The size of the background image.
+     */
+    backgroundImageSize?: string | string[] | ResponsiveBackgroundImageSizeMap;
+    /**
+     * Makes the content of the section span the full width of its parent container.
+     */
+    fullWidth?: boolean;
+    /**
+     * Adds rounded corners to the top of the section.
+     */
+    rounded?: boolean;
+    /**
+     * Forward inline styles
+     */
+    style?: React.CSSProperties;
+    /**
+     * Optional attirbute for testing
+     */
+    ['data-testid']?: string;
+} & PropsWithChildren<BaseProps<HTMLDivElement>>;
+export declare const Section: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<SectionProps>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/Section/Section.visual.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/Section/index.d.ts

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