@opentrons/components 0.1.6-alpha.6 → 0.1.6-alpha.8

package/lib/molecules/index.d.ts

@@ -0,0 +1,8 @@
+export * from './Banner';
+export * from './DeckInfoLabel';
+export * from './DeckLabel';
+export * from './DropdownMenu';
+export * from './InfoScreen';
+export * from './LiquidIcon';
+export * from './ParametersTable';
+export * from './Tabs';

package/lib/nav/SidePanel.d.ts

@@ -0,0 +1,6 @@
+import type * as React from 'react';
+export interface SidePanelProps {
+    title?: string;
+    children?: React.ReactNode;
+}
+export declare function SidePanel(props: SidePanelProps): JSX.Element;

package/lib/nav/index.d.ts

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

package/lib/organisms/DeckLabelSet/__tests__/DeckLabelSet.test.d.ts

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

package/lib/organisms/DeckLabelSet/index.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { DeckLabelProps } from '../../molecules/DeckLabel';
+interface DeckLabelSetProps {
+    deckLabels: DeckLabelProps[];
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export declare const DeckLabelSet: React.ForwardRefExoticComponent<DeckLabelSetProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/organisms/EndUserAgreementFooter/__tests__/EndUserAgreementFooter.test.d.ts

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

package/lib/organisms/EndUserAgreementFooter/index.d.ts

@@ -0,0 +1 @@
+export declare function EndUserAgreementFooter(): JSX.Element;

package/lib/organisms/Toolbox/__tests__/Toolbox.test.d.ts

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

package/lib/organisms/Toolbox/index.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+export interface ToolboxProps {
+    title: JSX.Element;
+    children: React.ReactNode;
+    disableCloseButton?: boolean;
+    width?: string;
+    height?: string;
+    confirmButtonText?: string;
+    onConfirmClick?: () => void;
+    confirmButton?: JSX.Element;
+    onCloseClick?: () => void;
+    closeButton?: JSX.Element;
+    side?: 'left' | 'right';
+    horizontalSide?: 'top' | 'bottom';
+    childrenPadding?: string;
+    subHeader?: JSX.Element | null;
+    secondaryHeaderButton?: JSX.Element;
+    position?: string;
+}
+export declare function Toolbox(props: ToolboxProps): JSX.Element;

package/lib/organisms/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DeckLabelSet';
+export * from './EndUserAgreementFooter';
+export * from './Toolbox';

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,59 @@
+import type { StyledComponent } from 'styled-components';
+import type { StyleProps } from './types';
+export declare const BUTTON_TYPE_SUBMIT: 'submit';
+export declare const BUTTON_TYPE_RESET: 'reset';
+export declare const BUTTON_TYPE_BUTTON: 'button';
+/**
+ * Button primitive
+ *
+ * @component
+ */
+export declare const Btn: StyledComponent<'button', any, StyleProps, any>;
+/**
+ * Primary button variant
+ *
+ * @component
+ */
+export declare const PrimaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * Secondary button variant
+ *
+ * @component
+ */
+export declare const SecondaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * New primary button variant used in app
+ *
+ * @component
+ */
+export declare const NewPrimaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * New secondary button variant used in app
+ *
+ * @component
+ */
+export declare const NewSecondaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * Red primary button variant used in app
+ *
+ * @component
+ */
+export declare const NewAlertPrimaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * Red secondary button variant used in app
+ *
+ * @component
+ */
+export declare const NewAlertSecondaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * Light secondary button variant
+ *
+ * @component
+ */
+export declare const LightSecondaryBtn: StyledComponent<"button", any, StyleProps, any>;
+/**
+ * Tertiary button variant
+ *
+ * @component
+ */
+export declare const TertiaryBtn: StyledComponent<"button", any, StyleProps, any>;

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/__tests__/Box.test.d.ts

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

package/lib/primitives/__tests__/Btn.test.d.ts

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

package/lib/primitives/__tests__/Flex.test.d.ts

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

package/lib/primitives/__tests__/Link.test.d.ts

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

package/lib/primitives/__tests__/Svg.test.d.ts

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

package/lib/primitives/__tests__/Text.test.d.ts

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

package/lib/primitives/__tests__/primitives.test.d.ts

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

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

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

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 type * 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,95 @@
+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 type PrimitiveComponent<Instance extends keyof JSX.IntrinsicElements | React.ComponentType<any>, Props extends StyleProps = StyleProps> = StyledComponent<Instance, any, Props, any>;

package/lib/robot-types.d.ts

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

package/lib/slotmap/OT2SlotMap.d.ts

@@ -0,0 +1,9 @@
+export interface SlotMapProps {
+    /** Slot(s) to highlight */
+    occupiedSlots: string[];
+    /** Optional collision warning */
+    collisionSlots?: string[];
+    /** Optional error styling */
+    isError?: boolean;
+}
+export declare function OT2SlotMap(props: SlotMapProps): JSX.Element;

package/lib/slotmap/__tests__/OT2SlotMap.test.d.ts

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

package/lib/slotmap/index.d.ts

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

package/lib/structure/Card.d.ts

@@ -0,0 +1,18 @@
+import type * 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 type * 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/Pill.d.ts

@@ -0,0 +1,18 @@
+import type * 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,8 @@
+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 type * 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 'ModalHeader' instead
+ */
+export declare function TitleBar(props: TitleBarProps): JSX.Element;

package/lib/structure/index.d.ts

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