@opentrons/components 0.1.1 → 0.1.2-alpha.1

package/lib/primitives/Box.d.ts

@@ -0,0 +1,7 @@
+import type { PrimitiveComponent } from './types';
+/**
+ * Simple Box atom. Renders a `div` by default and accepts all primitive styling props.
+ *
+ * @component
+ */
+export declare const Box: PrimitiveComponent<'div'>;

package/lib/primitives/Btn.d.ts

@@ -0,0 +1,60 @@
+import type { PrimitiveComponent } from './types';
+export declare const BUTTON_TYPE_SUBMIT: 'submit';
+export declare const BUTTON_TYPE_RESET: 'reset';
+export declare const BUTTON_TYPE_BUTTON: 'button';
+declare type BtnComponent = PrimitiveComponent<'button'>;
+/**
+ * Button primitive
+ *
+ * @component
+ */
+export declare const Btn: BtnComponent;
+/**
+ * Primary button variant
+ *
+ * @component
+ */
+export declare const PrimaryBtn: BtnComponent;
+/**
+ * Secondary button variant
+ *
+ * @component
+ */
+export declare const SecondaryBtn: BtnComponent;
+/**
+ * New primary button variant used in app
+ *
+ * @component
+ */
+export declare const NewPrimaryBtn: BtnComponent;
+/**
+ * New secondary button variant used in app
+ *
+ * @component
+ */
+export declare const NewSecondaryBtn: BtnComponent;
+/**
+ * Red primary button variant used in app
+ *
+ * @component
+ */
+export declare const NewAlertPrimaryBtn: BtnComponent;
+/**
+ * Red secondary button variant used in app
+ *
+ * @component
+ */
+export declare const NewAlertSecondaryBtn: BtnComponent;
+/**
+ * Light secondary button variant
+ *
+ * @component
+ */
+export declare const LightSecondaryBtn: BtnComponent;
+/**
+ * Tertiary button variant
+ *
+ * @component
+ */
+export declare const TertiaryBtn: BtnComponent;
+export {};

package/lib/primitives/Flex.d.ts

@@ -0,0 +1,7 @@
+import type { PrimitiveComponent } from './types';
+/**
+ * Flex primitive
+ *
+ * @component
+ */
+export declare const Flex: PrimitiveComponent<'div'>;

package/lib/primitives/ForeignObject.d.ts

@@ -0,0 +1,23 @@
+import type { StyleProps, PrimitiveComponent } from './types';
+export interface ForeignObjectProps extends StyleProps {
+    /** attach a width attribute to the <svg> element */
+    svgWidth?: string | number;
+    /** attach a height attribute to the <svg> element */
+    svgHeight?: string | number;
+    /**
+     * internal helper prop to remap width style-prop to CSS
+     * @internal
+     */
+    _cssWidth?: string | number;
+    /**
+     * internal helper prop to remap height style-prop to CSS
+     * @internal
+     */
+    _cssHeight?: string | number;
+}
+/**
+ * Foreign Object styled atomic component
+ *
+ * @component
+ */
+export declare const ForeignObject: PrimitiveComponent<'foreignObject', ForeignObjectProps>;

package/lib/primitives/Link.d.ts

@@ -0,0 +1,11 @@
+import type { StyleProps, PrimitiveComponent } from './types';
+export interface LinkProps extends StyleProps {
+    /** render link with target="_blank" */
+    external?: boolean;
+}
+/**
+ * Link primitive
+ *
+ * @component
+ */
+export declare const Link: PrimitiveComponent<'a', LinkProps>;

package/lib/primitives/Svg.d.ts

@@ -0,0 +1,23 @@
+import type { StyleProps, PrimitiveComponent } from './types';
+export interface SvgProps extends StyleProps {
+    /** attach a width attribute to the <svg> element */
+    svgWidth?: string | number;
+    /** attach a height attribute to the <svg> element */
+    svgHeight?: string | number;
+    /**
+     * internal helper prop to remap width style-prop to CSS
+     * @internal
+     */
+    _cssWidth?: string | number;
+    /**
+     * internal helper prop to remap height style-prop to CSS
+     * @internal
+     */
+    _cssHeight?: string | number;
+}
+/**
+ * SVG primitive
+ *
+ * @component
+ */
+export declare const Svg: PrimitiveComponent<'svg', SvgProps>;

package/lib/primitives/Text.d.ts

@@ -0,0 +1,7 @@
+import type { PrimitiveComponent } from './types';
+/**
+ * Text primitive
+ *
+ * @component
+ */
+export declare const Text: PrimitiveComponent<'p'>;

package/lib/primitives/index.d.ts

@@ -0,0 +1,9 @@
+export * from './style-props';
+export * from './Box';
+export * from './Btn';
+export * from './Flex';
+export * from './ForeignObject';
+export * from './Link';
+export * from './Svg';
+export * from './Text';
+export * from './types';

package/lib/primitives/style-props.d.ts

@@ -0,0 +1,4 @@
+import * as Types from './types';
+import type { CSSObject } from 'styled-components';
+export declare const styleProps: (props: Types.StyleProps) => CSSObject;
+export declare const isntStyleProp: (prop: string | React.ReactText) => boolean;

package/lib/primitives/types.d.ts

@@ -0,0 +1,96 @@
+/// <reference types="react" />
+import type { StyledComponent, CSSProperties } from 'styled-components';
+export interface ColorProps {
+    color?: string;
+    backgroundColor?: string;
+    opacity?: string | number;
+}
+export interface TypographyProps {
+    fontSize?: string | number;
+    fontWeight?: string | number;
+    fontStyle?: string;
+    lineHeight?: string | number;
+    textAlign?: string;
+    textTransform?: string;
+    textDecoration?: string;
+}
+export interface SpacingProps {
+    margin?: string | number;
+    marginX?: string | number;
+    marginY?: string | number;
+    marginTop?: string | number;
+    marginRight?: string | number;
+    marginBottom?: string | number;
+    marginLeft?: string | number;
+    padding?: string | number;
+    paddingX?: string | number;
+    paddingY?: string | number;
+    paddingTop?: string | number;
+    paddingRight?: string | number;
+    paddingBottom?: string | number;
+    paddingLeft?: string | number;
+}
+export interface BorderProps {
+    border?: string;
+    borderTop?: string;
+    borderRight?: string;
+    borderBottom?: string;
+    borderLeft?: string;
+    borderRadius?: string | number;
+    borderWidth?: string | number;
+    borderColor?: string;
+    boxShadow?: string;
+}
+export interface FlexboxProps {
+    flex?: string | number;
+    alignItems?: string;
+    alignSelf?: string;
+    justifyContent?: string;
+    flexDirection?: string;
+    flexWrap?: string;
+    whiteSpace?: string;
+}
+export interface GridProps {
+    columnGap?: string | number;
+    gridGap?: string | number;
+    gridTemplateAreas?: string;
+    gridTemplateRows?: string;
+    gridTemplateColumns?: string;
+    gridArea?: string | number;
+    gridRow?: string | number;
+    gridColumn?: string | number;
+}
+export interface LayoutProps {
+    display?: string;
+    size?: string | number;
+    width?: string | number;
+    minWidth?: string | number;
+    maxWidth?: string | number;
+    height?: string | number;
+    minHeight?: string | number;
+    maxHeight?: string | number;
+    overflow?: CSSProperties['overflow'];
+    overflowX?: CSSProperties['overflowX'];
+    overflowY?: CSSProperties['overflowY'];
+    wordSpacing?: string | number;
+    cursor?: CSSProperties['cursor'];
+    overflowWrap?: string;
+}
+export interface PositionProps {
+    position?: string;
+    zIndex?: string | number;
+    top?: string | number;
+    right?: string | number;
+    bottom?: string | number;
+    left?: string | number;
+    transform?: string;
+    filter?: string;
+    transformOrigin?: CSSProperties['transformOrigin'];
+}
+export interface TransitionProps {
+    transition?: string;
+}
+export interface StyleProps extends ColorProps, TypographyProps, SpacingProps, BorderProps, FlexboxProps, GridProps, LayoutProps, PositionProps, TransitionProps {
+    className?: string;
+}
+export declare type PrimitiveComponent<Instance extends keyof JSX.IntrinsicElements | React.ComponentType<any>, Props extends StyleProps = StyleProps> = StyledComponent<Instance, {}, Props>;

package/lib/robot-types.d.ts

@@ -0,0 +1 @@
+export type { PipetteChannels as Channels, PipetteMount as Mount, } from '@opentrons/shared-data';

package/lib/slotmap/SlotMap.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { RobotType } from '@opentrons/shared-data';
+export interface SlotMapProps {
+    /** Slot(s) to highlight */
+    occupiedSlots: string[];
+    /** Optional collision warning */
+    collisionSlots?: string[];
+    /** Optional error styling */
+    isError?: boolean;
+    robotType?: RobotType;
+}
+export declare function SlotMap(props: SlotMapProps): JSX.Element;

package/lib/slotmap/index.d.ts

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

package/lib/structure/Card.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { StyleProps } from '../primitives';
+export interface CardProps extends StyleProps {
+    /** Title for card, all cards should receive a title. */
+    title?: React.ReactNode;
+    /** Card contents */
+    children?: React.ReactNode;
+    /** If card can not be used, gray it out and remove pointer events */
+    disabled?: boolean;
+    /** Additional class names */
+    className?: string;
+}
+/**
+ * Renders a basic card element with a white background, dropshadow, and zero padding.
+ *
+ * Titles and other children handle their own styles and layout.
+ */
+export declare function Card(props: CardProps): JSX.Element;

package/lib/structure/LabeledValue.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+export interface LabeledValueProps {
+    /** Label */
+    label: React.ReactNode;
+    /** Value */
+    value: React.ReactNode;
+    /** Additional className */
+    className?: string;
+    /** Additional value className */
+    valueClassName?: string;
+}
+export declare function LabeledValue(props: LabeledValueProps): JSX.Element;

package/lib/structure/PageTabs.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+interface TabProps {
+    title: string;
+    href: string;
+    isActive: boolean;
+    isDisabled: boolean;
+}
+export interface PageTabProps {
+    pages: TabProps[];
+}
+export declare function PageTabs(props: PageTabProps): JSX.Element;
+export {};

package/lib/structure/Pill.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { UseHoverTooltipTargetProps } from '../tooltips';
+export interface PillProps {
+    /** background color of pill (any CSS color string) */
+    color?: string | null | undefined;
+    /** text black, instead of default white */
+    invertTextColor?: boolean | null | undefined;
+    /** additional class name */
+    className?: string;
+    /** contents of the pill */
+    children?: React.ReactNode;
+    /** handlers for HoverTooltipComponent */
+    hoverTooltipHandlers?: UseHoverTooltipTargetProps | null | undefined;
+}
+/**
+ * Colored Pill containing text or other contents
+ */
+export declare function Pill(props: PillProps): JSX.Element;

package/lib/structure/Splash.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { IconName } from '../icons';
+export interface SplashProps {
+    /** optional alternative icon name. Defaults to 'logo'. */
+    iconName?: IconName;
+    /** additional className for Splash */
+    className?: string;
+}
+export declare function Splash(props: SplashProps): JSX.Element;

package/lib/structure/TitleBar.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { ButtonProps } from '../buttons';
+export interface TitleBarProps {
+    id?: string;
+    title: React.ReactNode;
+    subtitle?: React.ReactNode;
+    back?: ButtonProps;
+    rightNode?: React.ReactNode;
+    className?: string;
+    onBackClick?: () => unknown;
+    backClickDisabled?: boolean;
+    backButtonLabel?: string;
+}
+/**
+ * @deprecated Use `InterstitialTitleBar` instead
+ */
+export declare function TitleBar(props: TitleBarProps): JSX.Element;

package/lib/structure/index.d.ts

@@ -0,0 +1,6 @@
+export * from './PageTabs';
+export * from './TitleBar';
+export * from './Card';
+export * from './Splash';
+export * from './LabeledValue';
+export * from './Pill';

package/lib/styles/borders.d.ts

@@ -0,0 +1,8 @@
+export declare const BORDER_WIDTH_DEFAULT = "1px";
+export declare const BORDER_RADIUS_DEFAULT = "2px";
+export declare const BORDER_RADIUS_1 = "5px";
+export declare const BORDER_STYLE_NONE = "none";
+export declare const BORDER_STYLE_SOLID = "solid";
+export declare const BORDER_SOLID_LIGHT: string;
+export declare const BORDER_SOLID_MEDIUM: string;
+export declare const SHADOW_LIGHT = "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.2)";

package/lib/styles/colors.d.ts

@@ -0,0 +1,37 @@
+export declare const C_BLACK = "#000000";
+export declare const C_DARK_GRAY = "#4a4a4a";
+export declare const C_MED_DARK_GRAY = "#6c6c6c";
+export declare const C_MED_GRAY = "#9b9b9b";
+export declare const C_SILVER_GRAY = "#e3e3e3";
+export declare const C_MED_LIGHT_GRAY = "#d2d2d2";
+export declare const C_LIGHT_GRAY = "#e6e6e6";
+export declare const C_BRIGHT_GRAY = "#f8f8f8";
+export declare const C_HARBOR_GRAY = "#8a8c8e";
+export declare const C_NEAR_WHITE = "#fafafa";
+export declare const C_WHITE = "#ffffff";
+export declare const C_TRANSPARENT = "transparent";
+export declare const C_DARK_BLACK = "#16212d";
+export declare const C_BLUE = "#006cfa";
+export declare const C_MINT = "#00bfa8";
+export declare const C_AQUAMARINE = "#eefff8";
+export declare const C_POWDER_BLUE = "#f1f8ff";
+export declare const C_SKY_BLUE = "#accfff80";
+export declare const C_BLUE_PRESSED = "#0050b8";
+export declare const COLOR_WARNING = "#e28200";
+export declare const COLOR_WARNING_LIGHT = "#ffd58f";
+export declare const COLOR_WARNING_DARK = "#9e5e00";
+export declare const COLOR_ERROR = "#d12929";
+export declare const COLOR_SUCCESS = "#60b120";
+export declare const C_DISABLED = "#9c9c9c";
+export declare const C_SELECTED_DARK = "#00c3e6";
+export declare const C_BG_SELECTED = "#f0f3ff";
+export declare const C_ERROR_DARK = "#ac0505";
+export declare const C_ERROR_LIGHT = "#ffc0c0";
+export declare const OVERLAY_WHITE_10 = "rgba(255, 255, 255, 0.1)";
+export declare const OVERLAY_WHITE_20 = "rgba(255, 255, 255, 0.2)";
+export declare const OVERLAY_LIGHT_GRAY_50 = "rgba(230, 230, 230, 0.4)";
+export declare const OVERLAY_GRAY_90 = "rgba(127, 127, 127, 0.9)";
+export declare const OVERLAY_BLACK_90 = "rgba(0, 0, 0, 0.9)";
+export declare const OVERLAY_BLACK_80 = "rgba(0, 0, 0, 0.8)";
+export declare const OPACITY_DISABLED = 0.3;
+export declare const C_FONT_DISABLED = "#9c9c9c";

package/lib/styles/flexbox.d.ts

@@ -0,0 +1,28 @@
+export declare const FLEX_NONE = "none";
+export declare const FLEX_AUTO = "auto";
+export declare const FLEX_MIN_CONTENT = "min-content";
+export declare const ALIGN_NORMAL = "normal";
+export declare const ALIGN_START = "start";
+export declare const ALIGN_END = "end";
+export declare const ALIGN_FLEX_START = "flex-start";
+export declare const ALIGN_FLEX_END = "flex-end";
+export declare const ALIGN_CENTER = "center";
+export declare const ALIGN_BASELINE = "baseline";
+export declare const ALIGN_STRETCH = "stretch";
+export declare const JUSTIFY_NORMAL = "normal";
+export declare const JUSTIFY_START = "start";
+export declare const JUSTIFY_END = "end";
+export declare const JUSTIFY_FLEX_START = "flex-start";
+export declare const JUSTIFY_FLEX_END = "flex-end";
+export declare const JUSTIFY_CENTER = "center";
+export declare const JUSTIFY_SPACE_BETWEEN = "space-between";
+export declare const JUSTIFY_SPACE_AROUND = "space-around";
+export declare const JUSTIFY_SPACE_EVENLY = "space-evenly";
+export declare const JUSTIFY_STRETCH = "stretch";
+export declare const DIRECTION_ROW = "row";
+export declare const DIRECTION_ROW_REVERSE = "row-reverse";
+export declare const DIRECTION_COLUMN = "column";
+export declare const DIRECTION_COLUMN_REVERSE = "column-reverse";
+export declare const WRAP = "wrap";
+export declare const NO_WRAP = "nowrap";
+export declare const WRAP_REVERSE = "wrap-reverse";

package/lib/styles/index.d.ts

@@ -0,0 +1,7 @@
+export * from './borders';
+export * from './colors';
+export * from './flexbox';
+export * from './layout';
+export * from './position';
+export * from './spacing';
+export * from './typography';

package/lib/styles/layout.d.ts

@@ -0,0 +1,20 @@
+export declare const DISPLAY_NONE = "none";
+export declare const DISPLAY_INLINE = "inline";
+export declare const DISPLAY_BLOCK = "block";
+export declare const DISPLAY_INLINE_BLOCK = "inline-block";
+export declare const DISPLAY_FLEX = "flex";
+export declare const DISPLAY_TABLE = "table";
+export declare const DISPLAY_TABLE_ROW = "table-row";
+export declare const DISPLAY_TABLE_CELL = "table-cell";
+export declare const SIZE_AUTO = "auto";
+export declare const SIZE_1 = "1rem";
+export declare const SIZE_2 = "2rem";
+export declare const SIZE_3 = "4rem";
+export declare const SIZE_4 = "8rem";
+export declare const SIZE_5 = "16rem";
+export declare const SIZE_6 = "32rem";
+export declare const OVERFLOW_VISIBLE = "visible";
+export declare const OVERFLOW_HIDDEN = "hidden";
+export declare const OVERFLOW_CLIP = "clip";
+export declare const OVERFLOW_SCROLL = "scroll";
+export declare const OVERFLOW_AUTO = "auto";

package/lib/styles/position.d.ts

@@ -0,0 +1,5 @@
+export declare const POSITION_STATIC: 'static';
+export declare const POSITION_RELATIVE: 'relative';
+export declare const POSITION_ABSOLUTE: 'absolute';
+export declare const POSITION_FIXED: 'fixed';
+export declare const POSITION_STICKY: 'sticky';

package/lib/styles/spacing.d.ts

@@ -0,0 +1,9 @@
+export declare const SPACING_AUTO = "auto";
+export declare const SPACING_1 = "0.25rem";
+export declare const SPACING_2 = "0.5rem";
+export declare const SPACING_3 = "1rem";
+export declare const SPACING_4 = "2rem";
+export declare const SPACING_5 = "4rem";
+export declare const SPACING_6 = "8rem";
+export declare const SPACING_7 = "16rem";
+export declare const SPACING_8 = "32rem";

package/lib/styles/typography.d.ts

@@ -0,0 +1,36 @@
+import type { FlattenSimpleInterpolation } from 'styled-components';
+export declare const FONT_SIZE_HUGE = "3rem";
+export declare const FONT_SIZE_BIG = "1.5rem";
+export declare const FONT_SIZE_HEADER = "1.125rem";
+export declare const FONT_SIZE_DEFAULT = "1rem";
+export declare const FONT_SIZE_BODY_2 = "0.875rem";
+export declare const FONT_SIZE_BODY_1 = "0.75rem";
+export declare const FONT_SIZE_CAPTION = "0.625rem";
+export declare const FONT_SIZE_TINY = "0.325rem";
+export declare const FONT_SIZE_MICRO = "0.2rem";
+export declare const FONT_SIZE_INHERIT = "inherit";
+export declare const LINE_HEIGHT_SOLID = 1;
+export declare const LINE_HEIGHT_TITLE = 1.25;
+export declare const LINE_HEIGHT_COPY = 1.5;
+export declare const FONT_WEIGHT_LIGHT = 300;
+export declare const FONT_WEIGHT_REGULAR = 400;
+export declare const FONT_WEIGHT_SEMIBOLD = 600;
+export declare const FONT_WEIGHT_BOLD = 800;
+export declare const FONT_STYLE_NORMAL = "normal";
+export declare const FONT_STYLE_ITALIC = "italic";
+export declare const TEXT_ALIGN_LEFT = "left";
+export declare const TEXT_ALIGN_CENTER = "center";
+export declare const TEXT_ALIGN_RIGHT = "right";
+export declare const TEXT_ALIGN_JUSTIFY = "justify";
+export declare const TEXT_TRANSFORM_NONE = "none";
+export declare const TEXT_TRANSFORM_CAPITALIZE = "capitalize";
+export declare const TEXT_TRANSFORM_UPPERCASE = "uppercase";
+export declare const TEXT_TRANSFORM_LOWERCASE = "lowercase";
+export declare const TEXT_DECORATION_UNDERLINE = "underline";
+export declare const FONT_HEADER_DARK: FlattenSimpleInterpolation;
+export declare const FONT_HEADER_THIN: FlattenSimpleInterpolation;
+export declare const FONT_BODY_1_DARK: FlattenSimpleInterpolation;
+export declare const FONT_BODY_1_LIGHT: FlattenSimpleInterpolation;
+export declare const FONT_BODY_2_DARK: FlattenSimpleInterpolation;
+export declare const FONT_BODY_1_DARK_SEMIBOLD: FlattenSimpleInterpolation;
+export declare const FONT_HUGE_DARK_SEMIBOLD: FlattenSimpleInterpolation;

package/lib/tabbedNav/NavTab.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import type { IconName } from '../icons';
+export interface NavTabProps {
+    /** optional click event for nav button */
+    onClick?: React.MouseEventHandler;
+    /** optional url for nav button route */
+    url?: string;
+    /** position a single button on the bottom of the page */
+    isBottom?: boolean;
+    /** classes to apply */
+    className?: string;
+    /** id */
+    id?: string;
+    /** disabled attribute (setting disabled removes onClick) */
+    disabled?: boolean;
+    /** optional title to display below the icon */
+    title?: string;
+    /** Icon name for button's icon */
+    iconName: IconName;
+    /** Display a notification dot */
+    notification?: boolean;
+    /** selected styling (can also use react-router & `activeClassName`) */
+    selected?: boolean;
+}
+export declare function NavTab(props: NavTabProps): JSX.Element;

package/lib/tabbedNav/OutsideLinkTab.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { IconName } from '../icons';
+export interface OutsideLinkTabProps {
+    /** optional click event for nav button */
+    onClick?: React.MouseEventHandler;
+    /** link to outside URL */
+    to: string;
+    /** position a single button on the bottom of the page */
+    isBottom?: boolean;
+    /** classes to apply */
+    className?: string;
+    /** disabled attribute (setting disabled removes onClick) */
+    disabled?: boolean;
+    /** optional title to display below the icon */
+    title?: string;
+    /** Icon name for button's icon */
+    iconName: IconName;
+    /** Display a notification dot */
+    notification?: boolean;
+    /** selected styling (can also use react-router & `activeClassName`) */
+    selected?: boolean;
+}
+/** Very much like NavTab, but used for opening external links in a new tab/window */
+export declare function OutsideLinkTab(props: OutsideLinkTabProps): JSX.Element;

package/lib/tabbedNav/TabbedNavBar.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface TabbedNavBarProps {
+    className?: string;
+    topChildren?: React.ReactNode;
+    bottomChildren?: React.ReactNode;
+}
+export declare function TabbedNavBar(props: TabbedNavBarProps): JSX.Element;

package/lib/tabbedNav/index.d.ts

@@ -0,0 +1,3 @@
+export * from './TabbedNavBar';
+export * from './NavTab';
+export * from './OutsideLinkTab';

package/lib/testing/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './renderWithProviders';
+export * from './matchers';

package/lib/testing/utils/matchers.d.ts

@@ -0,0 +1,6 @@
+import type { Matcher } from '@testing-library/react';
+export declare const componentPropsMatcher: (matcher: unknown) => any;
+export declare const partialComponentPropsMatcher: (argsToMatch: unknown) => any;
+export declare const argAtIndex: (index: number, matcher: unknown) => any;
+export declare const anyProps: () => any;
+export declare const nestedTextMatcher: (textMatch: string | RegExp) => Matcher;