@opentrons/components 0.1.7-alpha.0 → 0.2.0-alpha.0

package/lib/hocs/withStyleProps.d.ts

@@ -0,0 +1,26 @@
+import type { ComponentProps, ComponentType } from 'react';
+import type { StyleProps } from '../primitives';
+/**
+ * A Higher-Order Component (HOC) that enhances a component by enabling it to
+ * accept `StyleProps`.
+ *
+ * This function wraps a component, processes any provided `StyleProps` into a
+ * React style object, and merges it with the component's existing `style` prop.
+ * Styles from the passed `style` prop will override any generated styles from `StyleProps`
+ * in case of conflict.
+ *
+ * @template T - The type of the React component being wrapped.
+ * @param Component The React component to enhance with `StyleProps`.
+ * @returns A new component that accepts the original component's props plus `StyleProps`.
+ *
+ * @example
+ * ```tsx
+ * <Icon
+ *  name="wifi"
+ *  size="1.25rem"
+ *  color={COLORS.green50}
+ *  style={{ marginLeft: SPACING.spacing8 }}
+ *  />
+ * ```
+ */
+export declare function withStyleProps<T extends ComponentType<any>>(Component: T): T & ComponentType<ComponentProps<T> & StyleProps>;

package/lib/hooks/useConditionalConfirm.d.ts

@@ -38,4 +38,8 @@ export interface UseConditionalConfirmResult<T extends any[]> {
     showConfirmation: boolean;
     cancel: () => unknown;
 }
+/**
+ * Provides conditional confirmation logic, allowing certain actions to be blocked
+ * until explicitly confirmed.
+ */
 export declare const useConditionalConfirm: <T extends any[]>(handleContinue: (...args: T) => any, shouldBlock: boolean) => UseConditionalConfirmResult<T>;

package/lib/hooks/useSwipe.d.ts

@@ -1,4 +1,4 @@
-import type { MutableRefObject, CSSProperties } from 'react';
+import type { CSSProperties, MutableRefObject } from 'react';
 interface UseSwipeResult {
     ref: MutableRefObject<null>;
     style: CSSProperties;

package/lib/icons/Icon.d.ts

@@ -1,14 +1,13 @@
 import { ICON_DATA_BY_NAME } from './icon-data';
-import type { ReactNode } from 'react';
-import type { SvgProps } from '../primitives';
+import type { ReactNode, SVGProps } from 'react';
 export type IconName = keyof typeof ICON_DATA_BY_NAME;
-export interface IconProps extends SvgProps {
+export interface IconProps extends SVGProps<SVGSVGElement> {
     /** name constant of the icon to display */
     name: IconName;
-    /** classes to apply */
-    className?: string;
     /** spin the icon with a CSS animation */
     spin?: boolean;
+    /** override default size */
+    size?: string | number;
     /** x attribute as a number or string (for nesting inside another SVG) */
     x?: number | string;
     /** y attribute as a number or string (for nesting inside another SVG) */
@@ -21,7 +20,6 @@ export interface IconProps extends SvgProps {
     style?: Record<string, string | number>;
     /** optional children */
     children?: ReactNode;
-    id?: string;
 }
 /**
  * Inline SVG icon component
@@ -31,4 +29,6 @@ export interface IconProps extends SvgProps {
  * import type { IconName } from '@opentrons/components'
  * ```
  */
-export declare function Icon(props: IconProps): JSX.Element | null;
+declare function IconComponent(props: IconProps): JSX.Element | null;
+export declare const Icon: typeof IconComponent & import("react").ComponentType<IconProps & import("..").StyleProps>;
+export {};

package/lib/icons/ModuleIcon.d.ts

@@ -1,11 +1,12 @@
+/// <reference types="react" />
 import type { ModuleType } from '@opentrons/shared-data';
-import type { StyleProps } from '../primitives/types';
-export type ModuleIconName = 'ot-magnet-v2' | 'ot-heater-shaker' | 'ot-temperature-v2' | 'ot-magnet-v2' | 'ot-thermocycler' | 'ot-absorbance' | 'stacked';
+export type ModuleIconName = 'ot-magnet-v2' | 'ot-heater-shaker' | 'ot-temperature-v2' | 'ot-magnet-v2' | 'ot-thermocycler' | 'ot-absorbance' | 'ot-flex-stacker';
 export declare const MODULE_ICON_NAME_BY_TYPE: {
     [type in ModuleType]: ModuleIconName;
 };
-interface ModuleIconProps extends StyleProps {
+interface ModuleIconProps {
     moduleType: ModuleType;
 }
-export declare function ModuleIcon(props: ModuleIconProps): JSX.Element;
+declare function ModuleIconComponent(props: ModuleIconProps): JSX.Element;
+export declare const ModuleIcon: typeof ModuleIconComponent & import("react").ComponentType<ModuleIconProps & import("..").StyleProps>;
 export {};

package/lib/icons/NotificationIcon.d.ts

@@ -1,4 +1,4 @@
-import type { IconProps, IconName } from './Icon';
+import type { IconName, IconProps } from './Icon';
 export interface NotificationIconProps extends IconProps {
     /** name constant of the optional notifcation icon to display */
     childName: IconName | null;

package/lib/instrument/InstrumentDiagram.d.ts

@@ -1,7 +1,7 @@
 import type { FlattenSimpleInterpolation } from 'styled-components';
 import type { PipetteV2Specs } from '@opentrons/shared-data';
-import type { Mount } from '../robot-types';
 import type { StyleProps } from '..';
+import type { Mount } from '../robot-types';
 export interface InstrumentDiagramProps extends StyleProps {
     mount: Mount;
     pipetteSpecs?: Pick<PipetteV2Specs, 'displayCategory' | 'channels'> | null;

package/lib/instrument/index.d.ts

@@ -1,4 +1 @@
 export * from './InstrumentDiagram';
-export * from './InstrumentGroup';
-export * from './InstrumentInfo';
-export * from './PipetteSelect';

package/lib/legacy-hardware-sim/index.d.ts

@@ -1,2 +1 @@
 export * from './LabwareNameOverlay';
-export * from './ModuleItem';

package/lib/lists/index.d.ts

@@ -1,2 +1 @@
 export * from './SidePanelGroup';
-export * from './TitledList';

package/lib/molecules/Banner/index.d.ts

@@ -1,6 +1,6 @@
 import type { MouseEventHandler, ReactNode } from 'react';
-import type { StyleProps } from '../../primitives';
 import type { IconProps } from '../../icons';
+import type { StyleProps } from '../../primitives';
 export type BannerType = 'success' | 'warning' | 'error' | 'updating' | 'informing';
 export interface BannerProps extends StyleProps {
     /** name constant of the icon to display */

package/lib/molecules/CustomizeExpandButton/__tests__/CustomizeExpandButton.test.d.ts

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

package/lib/molecules/CustomizeExpandButton/index.d.ts

@@ -0,0 +1,29 @@
+import type { ChangeEvent, ChangeEventHandler, MemoExoticComponent } from 'react';
+import type { LabwareDefinition2 } from '@opentrons/shared-data';
+import type { StyleProps } from '../../primitives';
+export interface StackingProps {
+    onInputFieldChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    inputFieldValue: number;
+    inputTitle: string;
+    errorMessage: string;
+    inputCaption: string;
+    definition: LabwareDefinition2;
+    onCheckboxChange?: () => void;
+    checked?: boolean;
+    checkboxCaption?: string;
+}
+interface CustomizeExpandButtonProps extends StyleProps {
+    enableStackingFF: boolean;
+    allowInputField: boolean;
+    loadName: string;
+    buttonText: string;
+    buttonValue: string | number;
+    onChange: ChangeEventHandler<HTMLInputElement>;
+    stackingProps?: StackingProps;
+    disabled?: boolean;
+    isSelected?: boolean;
+    id?: string;
+}
+export declare function CustomizeExpandButtonComponent(props: CustomizeExpandButtonProps): JSX.Element;
+export declare const CustomizeExpandButton: MemoExoticComponent<typeof CustomizeExpandButtonComponent>;
+export {};

package/lib/molecules/DeckInfoLabel/index.d.ts

@@ -1,19 +1,11 @@
-import type { IconName, ModuleIconName } from '../../icons';
-import type { StyleProps } from '../../primitives';
-interface DeckLabelProps extends StyleProps {
-    /** deck label to display */
-    deckLabel: string;
-    iconName?: IconName;
-}
-interface HardwareIconProps extends StyleProps {
-    /** hardware icon name */
-    iconName: ModuleIconName | 'stacked';
+export interface DeckInfoLabelProps {
     deckLabel?: string;
-}
-export type DeckInfoLabelProps = (DeckLabelProps | HardwareIconProps) & {
+    iconName?: string;
     highlight?: boolean;
+    size?: 'large' | 'default';
+    height?: string | number;
+    width?: string | number;
     svgSize?: string | number;
-};
-export declare const DeckInfoLabel: import("styled-components").StyledComponent<typeof DeckInfoLabelComponent, any, {}, never>;
-declare function DeckInfoLabelComponent({ deckLabel, iconName, highlight, ...styleProps }: DeckInfoLabelProps): JSX.Element;
-export {};
+    transform?: string;
+}
+export declare function DeckInfoLabel({ deckLabel, iconName, highlight, size, height, width, transform, svgSize, }: DeckInfoLabelProps): JSX.Element;

package/lib/molecules/DropdownMenu/index.d.ts

@@ -1,5 +1,5 @@
-import type { FocusEventHandler } from 'react';
 import type { FlattenSimpleInterpolation } from 'styled-components';
+import type { FocusEventHandler } from 'react';
 export interface DropdownOption {
     /** dropdown option name */
     name: string;

package/lib/molecules/LiquidIcon/index.d.ts

@@ -1,5 +1,5 @@
-type LiquidIconSize = 'small' | 'medium';
-interface LiquidIconProps {
+type LiquidIconSize = 'xSmall' | 'small' | 'medium';
+export interface LiquidIconProps {
     color: string;
     size?: LiquidIconSize;
     onClick?: () => void;

package/lib/molecules/index.d.ts

@@ -1,11 +1,12 @@
 export * from './Banner';
+export * from './CustomizeExpandButton';
 export * from './DeckInfoLabel';
 export * from './DeckLabel';
 export * from './DropdownMenu';
 export * from './InfoScreen';
 export * from './LiquidIcon';
+export * from './ListAccordion';
 export * from './ParametersTable';
 export * from './ReleaseNotes';
 export * from './Tabs';
 export * from './TextListTableContent';
-export * from './ListAccordion';

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

@@ -1,6 +1,6 @@
 import { LegacyStyledText, StyledText } from '../../atoms';
 import type { ComponentProps } from 'react';
-import type { LabwareDefinition2, RobotType, RunTimeCommand } from '@opentrons/shared-data';
+import type { LabwareDefinition, RobotType, RunTimeCommand } from '@opentrons/shared-data';
 import type { StyleProps } from '../../primitives';
 import type { CommandTextData } from '../ProtocolTimelineScrubber/types';
 export * from './useCommandTextString';
@@ -16,7 +16,7 @@ interface ModernSTProps {
 type STProps = LegacySTProps | ModernSTProps;
 interface BaseProps extends StyleProps {
     command: RunTimeCommand;
-    allRunDefs: LabwareDefinition2[];
+    allRunDefs: LabwareDefinition[];
     commandTextData: CommandTextData;
     robotType: RobotType;
     isOnDevice?: boolean;

package/lib/organisms/CommandText/useCommandTextString/index.d.ts

@@ -1,11 +1,11 @@
 import type { TFunction } from 'i18next';
-import type { RunTimeCommand, RobotType, LabwareDefinition2 } from '@opentrons/shared-data';
+import type { LabwareDefinition, RobotType, RunTimeCommand } from '@opentrons/shared-data';
 import type { CommandTextData } from '../../ProtocolTimelineScrubber/types';
-import type { TCProfileStepText, TCProfileCycleText } from './utils';
+import type { TCProfileCycleText, TCProfileStepText } from './utils';
 export * from './utils';
 export interface UseCommandTextStringParams {
     command: RunTimeCommand | null;
-    allRunDefs: LabwareDefinition2[];
+    allRunDefs: LabwareDefinition[];
     commandTextData: CommandTextData | null;
     robotType: RobotType;
 }

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/__tests__/getFlexStackerCommandText.test.d.ts

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

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/__tests__/getRobotCommandText.test.d.ts

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

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/getAbsorbanceReaderCommandText.d.ts

@@ -1,4 +1,4 @@
-import type { AbsorbanceReaderOpenLidRunTimeCommand, AbsorbanceReaderCloseLidRunTimeCommand, AbsorbanceReaderInitializeRunTimeCommand, AbsorbanceReaderReadRunTimeCommand, RunTimeCommand } from '@opentrons/shared-data';
+import type { AbsorbanceReaderCloseLidRunTimeCommand, AbsorbanceReaderInitializeRunTimeCommand, AbsorbanceReaderOpenLidRunTimeCommand, AbsorbanceReaderReadRunTimeCommand, RunTimeCommand } from '@opentrons/shared-data';
 import type { HandlesCommands } from '../types';
 export type AbsorbanceCreateCommand = AbsorbanceReaderOpenLidRunTimeCommand | AbsorbanceReaderCloseLidRunTimeCommand | AbsorbanceReaderInitializeRunTimeCommand | AbsorbanceReaderReadRunTimeCommand;
 declare const KEYS_BY_COMMAND_TYPE: {

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/getFlexStackerCommandText.d.ts

@@ -1,9 +1,12 @@
-import type { FlexStackerSetStoredLabwareRunTimeCommand, FlexStackerStoreRunTimeCommand, FlexStackerRetrieveRunTimeCommand, FlexStackerFillRunTimeCommand, FlexStackerEmptyRunTimeCommand, RunTimeCommand } from '@opentrons/shared-data';
+import type { FlexStackerEmptyRunTimeCommand, FlexStackerFillRunTimeCommand, FlexStackerRetrieveRunTimeCommand, FlexStackerSetStoredLabwareRunTimeCommand, FlexStackerStoreRunTimeCommand, RunTimeCommand } from '@opentrons/shared-data';
 import type { HandlesCommands } from '../types';
 export type FlexStackerCommand = FlexStackerSetStoredLabwareRunTimeCommand | FlexStackerStoreRunTimeCommand | FlexStackerRetrieveRunTimeCommand | FlexStackerFillRunTimeCommand | FlexStackerEmptyRunTimeCommand;
+export declare const KEYS_BY_COMMAND_TYPE: {
+    [commandType in FlexStackerCommand['commandType']]: string;
+};
 type HandledCommands = Extract<RunTimeCommand, {
-    commandType: FlexStackerCommand;
+    commandType: keyof typeof KEYS_BY_COMMAND_TYPE;
 }>;
 type GetFlexStackerCommandText = HandlesCommands<HandledCommands>;
-export declare const getFlexStackerCommandText: ({ command, t, }: GetFlexStackerCommandText) => string;
+export declare const getFlexStackerCommandText: ({ command, allRunDefs, commandTextData, t, robotType, }: GetFlexStackerCommandText) => string;
 export {};

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/getRobotCommandText.d.ts

@@ -0,0 +1,4 @@
+import type { RobotCloseGripperJawRunTimeCommand, RobotMoveAxesRelativeRunTimeCommand, RobotMoveAxesToRunTimeCommand, RobotMoveToRunTimeCommand, RobotOpenGripperJawRunTimeCommand } from '@opentrons/shared-data';
+import type { HandlesCommands } from '../../';
+export type SupportedCommands = RobotMoveToRunTimeCommand | RobotMoveAxesToRunTimeCommand | RobotMoveAxesRelativeRunTimeCommand | RobotOpenGripperJawRunTimeCommand | RobotCloseGripperJawRunTimeCommand;
+export declare const getRobotCommandText: ({ command, t, }: HandlesCommands<SupportedCommands>) => string;

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/getTemperatureCommandText.d.ts

@@ -1,4 +1,4 @@
-import type { TemperatureModuleAwaitTemperatureCreateCommand, TemperatureModuleSetTargetTemperatureCreateCommand, TCSetTargetBlockTemperatureCreateCommand, TCSetTargetLidTemperatureCreateCommand, HeaterShakerSetTargetTemperatureCreateCommand, RunTimeCommand } from '@opentrons/shared-data';
+import type { HeaterShakerSetTargetTemperatureCreateCommand, RunTimeCommand, TCSetTargetBlockTemperatureCreateCommand, TCSetTargetLidTemperatureCreateCommand, TemperatureModuleAwaitTemperatureCreateCommand, TemperatureModuleSetTargetTemperatureCreateCommand } from '@opentrons/shared-data';
 import type { HandlesCommands } from '../types';
 export type TemperatureCreateCommand = TemperatureModuleSetTargetTemperatureCreateCommand | TemperatureModuleAwaitTemperatureCreateCommand | TCSetTargetBlockTemperatureCreateCommand | TCSetTargetLidTemperatureCreateCommand | HeaterShakerSetTargetTemperatureCreateCommand;
 declare const T_KEYS_BY_COMMAND_TYPE: {

package/lib/organisms/CommandText/useCommandTextString/utils/commandText/index.d.ts

@@ -24,3 +24,5 @@ export * from './getPipettingCommandText';
 export * from './getLiquidProbeCommandText';
 export * from './getRailLightsCommandText';
 export * from './getAbsorbanceReaderCommandText';
+export * from './getFlexStackerCommandText';
+export * from './getRobotCommandText';

package/lib/organisms/CommandText/useCommandTextString/utils/getAddressableAreaDisplayName.d.ts

@@ -1,3 +1,3 @@
-import type { RunTimeCommand } from '@opentrons/shared-data';
 import type { TFunction } from 'i18next';
+import type { RunTimeCommand } from '@opentrons/shared-data';
 export declare function getAddressableAreaDisplayName(commands: RunTimeCommand[] | undefined, commandId: string, t: TFunction): string;

package/lib/organisms/CommandText/useCommandTextString/utils/getFinalLabwareLocation.d.ts

@@ -1,4 +1,4 @@
-import type { LabwareLocation, RunTimeCommand, LabwareLocationSequence } from '@opentrons/shared-data';
+import type { LabwareLocation, LabwareLocationSequence, RunTimeCommand } from '@opentrons/shared-data';
 /**
  * given a list of commands and a labwareId, calculate the resulting location
  * of the corresponding labware after all given commands are executed

package/lib/organisms/CommandText/useCommandTextString/utils/getLabwareDefinitionsFromCommands.d.ts

@@ -1,2 +1,2 @@
-import type { LabwareDefinition2, RunTimeCommand } from '@opentrons/shared-data';
-export declare function getLabwareDefinitionsFromCommands(commands: RunTimeCommand[]): LabwareDefinition2[];
+import type { LabwareDefinition, RunTimeCommand } from '@opentrons/shared-data';
+export declare function getLabwareDefinitionsFromCommands(commands: RunTimeCommand[]): LabwareDefinition[];

package/lib/organisms/CommandText/useCommandTextString/utils/getLabwareDisplayLocation.d.ts

@@ -1,6 +1,6 @@
 import type { TFunction } from 'i18next';
-import type { LocationFullParams, LocationSlotOnlyParams } from './getLabwareLocation';
 import type { LabwareLocation, LabwareLocationSequence } from '@opentrons/shared-data';
+import type { LocationFullParams, LocationSlotOnlyParams } from './getLabwareLocation';
 export interface DisplayLocationSlotOnlyParams extends Omit<LocationSlotOnlyParams, 'location'> {
     t: TFunction;
     isOnDevice?: boolean;

package/lib/organisms/CommandText/useCommandTextString/utils/getLabwareLocation.d.ts

@@ -1,4 +1,4 @@
-import type { LabwareDefinition2, LabwareLocation, ModuleModel, RobotType, LabwareLocationSequence } from '@opentrons/shared-data';
+import type { LabwareDefinition, LabwareLocation, LabwareLocationSequence, ModuleModel, RobotType } from '@opentrons/shared-data';
 import type { LoadedLabwares, LoadedModules } from './types';
 export interface LocationResult {
     slotName: string;
@@ -23,11 +23,11 @@ export interface SequenceSlotOnlyParams extends SequenceBaseParams {
     detailLevel: 'slot-only';
 }
 export interface LocationFullParams extends BaseParams {
-    allRunDefs: LabwareDefinition2[];
+    allRunDefs: LabwareDefinition[];
     detailLevel?: 'full';
 }
 export interface SequenceFullParams extends SequenceBaseParams {
-    allRunDefs: LabwareDefinition2[];
+    allRunDefs: LabwareDefinition[];
     detailLevel?: 'full';
 }
 export type GetLabwareLocationParams = LocationSlotOnlyParams | LocationFullParams;

package/lib/organisms/CommandText/useCommandTextString/utils/getLabwareName.d.ts

@@ -1,7 +1,7 @@
-import type { LabwareDefinition2 } from '@opentrons/shared-data';
+import type { LabwareDefinition } from '@opentrons/shared-data';
 import type { LoadedLabwares } from './types';
 export interface GetLabwareNameParams {
-    allRunDefs: LabwareDefinition2[];
+    allRunDefs: LabwareDefinition[];
     loadedLabwares: LoadedLabwares;
     labwareId: string;
 }

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

@@ -7,6 +7,7 @@ interface DeckLabelSetProps {
     width: number;
     height: number;
     invert?: boolean;
+    showModuleIcon?: boolean;
 }
 export declare const DeckLabelSet: import("react").ForwardRefExoticComponent<DeckLabelSetProps & import("react").RefAttributes<HTMLDivElement>>;
 export {};

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

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

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

@@ -0,0 +1,10 @@
+import type { MouseEventHandler } from 'react';
+interface FixtureOptionProps {
+    onClickHandler: MouseEventHandler;
+    secondaryOnClickHandler?: MouseEventHandler;
+    optionName: string;
+    secondaryButtonText?: string;
+    buttonText: string;
+}
+export declare function FixtureOption(props: FixtureOptionProps): JSX.Element;
+export {};

package/lib/{hardware-sim → organisms}/ProtocolDeck/index.d.ts

@@ -1,11 +1,10 @@
-import { BaseDeck } from '../BaseDeck';
+import { BaseDeck } from '../../hardware-sim/BaseDeck';
 import type { ComponentProps } from 'react';
 import type { CompletedProtocolAnalysis, ProtocolAnalysisOutput } from '@opentrons/shared-data';
-export * from './utils/getStandardDeckViewLayerBlockList';
-export * from './types';
 interface ProtocolDeckProps {
     protocolAnalysis: CompletedProtocolAnalysis | ProtocolAnalysisOutput | null;
     /** extra props to pass through to BaseDeck component */
     baseDeckProps?: Partial<ComponentProps<typeof BaseDeck>>;
 }
 export declare function ProtocolDeck(props: ProtocolDeckProps): JSX.Element | null;
+export {};

package/lib/organisms/ProtocolTimelineScrubber/CommandItem.d.ts

@@ -1,4 +1,4 @@
-import type { CompletedProtocolAnalysis, LabwareDefinition2, ProtocolAnalysisOutput, RobotType, RunTimeCommand } from '@opentrons/shared-data';
+import type { CompletedProtocolAnalysis, LabwareDefinition, ProtocolAnalysisOutput, RobotType, RunTimeCommand } from '@opentrons/shared-data';
 interface CommandItemProps {
     command: RunTimeCommand;
     index: number;
@@ -6,7 +6,7 @@ interface CommandItemProps {
     setCurrentCommandIndex: (index: number) => void;
     analysis: CompletedProtocolAnalysis | ProtocolAnalysisOutput;
     robotType: RobotType;
-    allRunDefs: LabwareDefinition2[];
+    allRunDefs: LabwareDefinition[];
 }
 export declare function CommandItem({ index, command, currentCommandIndex, setCurrentCommandIndex, analysis, robotType, allRunDefs, }: CommandItemProps): JSX.Element;
 export {};

package/lib/organisms/ProtocolTimelineScrubber/utils.d.ts

@@ -1,6 +1,6 @@
-import type { WellFill } from '../../hardware-sim';
-import type { CompletedProtocolAnalysis, LabwareDefinition2, ProtocolAnalysisOutput, RunTimeCommand } from '@opentrons/shared-data';
+import type { CompletedProtocolAnalysis, LabwareDefinition, ProtocolAnalysisOutput, RunTimeCommand } from '@opentrons/shared-data';
 import type { LabwareEntities, LocationLiquidState, SingleLabwareLiquidState, TimelineFrame } from '@opentrons/step-generation';
+import type { WellFill } from '../../hardware-sim';
 import type { CommandTextData } from './types';
 export interface WellContents {
     groupIds: string[];
@@ -16,7 +16,7 @@ interface WellContentsByLabware {
 export type ContentsByWell = {
     [wellName: string]: WellContents;
 } | null;
-export declare function _wellContentsForLabware(labwareLiquids: SingleLabwareLiquidState, labwareDef: LabwareDefinition2): ContentsByWell;
+export declare function _wellContentsForLabware(labwareLiquids: SingleLabwareLiquidState, labwareDef: LabwareDefinition): ContentsByWell;
 export declare const wellFillFromWellContents: (wellContents: ContentsByWell, displayColors: string[]) => WellFill;
 export declare function getAllWellContentsForActiveItem(labwareEntities: LabwareEntities, robotState: TimelineFrame): WellContentsByLabware | null;
 export declare function getCommandTextData(protocolData: CompletedProtocolAnalysis | ProtocolAnalysisOutput, protocolCommands?: RunTimeCommand[]): CommandTextData;

package/lib/organisms/index.d.ts

@@ -2,3 +2,5 @@ export * from './DeckLabelSet';
 export * from './Toolbox';
 export * from './ProtocolTimelineScrubber';
 export * from './CommandText';
+export * from './FixtureOption';
+export * from './ProtocolDeck';

package/lib/primitives/ForeignObject.d.ts

@@ -1,23 +1,13 @@
-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;
+import type { ReactElement, ReactNode } from 'react';
+export interface ForeignObjectProps {
+    width: string | number;
+    height: string | number;
+    x: string | number;
+    y: string | number;
+    children?: ReactNode;
 }
 /**
  * Foreign Object styled atomic component
- *
  * @component
  */
-export declare const ForeignObject: PrimitiveComponent<'foreignObject', ForeignObjectProps>;
+export declare const ForeignObject: ({ width, height, x, y, children, }: ForeignObjectProps) => ReactElement;

package/lib/primitives/Link.d.ts

@@ -1,4 +1,4 @@
-import type { StyleProps, PrimitiveComponent } from './types';
+import type { PrimitiveComponent, StyleProps } from './types';
 export interface LinkProps extends StyleProps {
     /** render link with target="_blank" */
     external?: boolean;

package/lib/primitives/Svg.d.ts

@@ -1,4 +1,4 @@
-import type { StyleProps, PrimitiveComponent } from './types';
+import type { PrimitiveComponent, StyleProps } from './types';
 export interface SvgProps extends StyleProps {
     /** attach a width attribute to the <svg> element */
     svgWidth?: string | number;

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

@@ -1,7 +1,7 @@
-import type * as Types from './types';
 import type { CSSObject } from 'styled-components';
+import type * as Types from './types';
 type Text = string | number;
-export declare const STYLE_PROPS: ("left" | "right" | "filter" | "overflow" | "overflowX" | "overflowY" | "cursor" | "transformOrigin" | "bottom" | "top" | "color" | "backgroundColor" | "opacity" | "fontSize" | "fontWeight" | "fontStyle" | "lineHeight" | "textAlign" | "textTransform" | "textDecoration" | "margin" | "marginX" | "marginY" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "padding" | "paddingX" | "paddingY" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderRadius" | "borderWidth" | "borderColor" | "boxShadow" | "flex" | "alignItems" | "alignSelf" | "justifyContent" | "flexDirection" | "flexWrap" | "whiteSpace" | "columnGap" | "gridGap" | "gridTemplateAreas" | "gridTemplateRows" | "gridTemplateColumns" | "gridArea" | "gridRow" | "gridColumn" | "display" | "size" | "width" | "minWidth" | "maxWidth" | "height" | "minHeight" | "maxHeight" | "wordSpacing" | "overflowWrap" | "position" | "zIndex" | "transform" | "textOverflow" | "flexGrow" | "gap" | "transition")[];
+export declare const STYLE_PROPS: ("filter" | "height" | "width" | "color" | "top" | "bottom" | "left" | "right" | "overflow" | "overflowX" | "overflowY" | "cursor" | "transformOrigin" | "backgroundColor" | "opacity" | "fontSize" | "fontWeight" | "fontStyle" | "lineHeight" | "textAlign" | "textTransform" | "textDecoration" | "margin" | "marginX" | "marginY" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "padding" | "paddingX" | "paddingY" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderRadius" | "borderWidth" | "borderColor" | "boxShadow" | "flex" | "alignItems" | "alignSelf" | "justifyContent" | "flexDirection" | "flexWrap" | "whiteSpace" | "columnGap" | "gridGap" | "gridTemplateAreas" | "gridTemplateRows" | "gridTemplateColumns" | "gridArea" | "gridRow" | "gridColumn" | "display" | "size" | "minWidth" | "maxWidth" | "minHeight" | "maxHeight" | "wordSpacing" | "overflowWrap" | "position" | "zIndex" | "transform" | "textOverflow" | "flexGrow" | "gap" | "rowGap" | "transition")[];
 export declare const styleProps: (props: Types.StyleProps) => CSSObject;
 export declare const isntStyleProp: (prop: string | Text) => boolean;
 export {};

package/lib/primitives/types.d.ts

@@ -1,5 +1,5 @@
+import type { CSSProperties, StyledComponent } from 'styled-components';
 import type { ComponentType } from 'react';
-import type { StyledComponent, CSSProperties } from 'styled-components';
 export interface ColorProps {
     color?: string;
     backgroundColor?: string;

package/lib/structure/index.d.ts

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

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

@@ -1,7 +1,7 @@
 import { I18nextProvider } from 'react-i18next';
-import type { ComponentProps, ReactElement } from 'react';
-import type { RenderResult, RenderOptions } from '@testing-library/react';
+import type { RenderOptions, RenderResult } from '@testing-library/react';
 import type { Store } from 'redux';
+import type { ComponentProps, ReactElement } from 'react';
 export interface RenderWithProvidersOptions<State> extends RenderOptions {
     initialState?: State;
     i18nInstance: ComponentProps<typeof I18nextProvider>['i18n'];

package/lib/tooltips/LegacyTooltip.d.ts

@@ -1,6 +1,6 @@
 import type { CSSProperties, ReactNode, RefCallback } from 'react';
-import type { Placement } from './types';
 import type { StyleProps } from '../primitives';
+import type { Placement } from './types';
 export interface LegacyTooltipProps extends StyleProps {
     /** Whether or not the tooltip should be rendered */
     visible: boolean;

package/lib/tooltips/types.d.ts

@@ -1,6 +1,6 @@
+import type { Instance, Modifier, Options } from '@popperjs/core/lib/types';
 import type { CSSProperties, RefCallback } from 'react';
-import type { Instance, Options, Modifier } from '@popperjs/core/lib/types';
-import type { UseHoverOptions, HoverHandlers } from '../interaction-enhancers';
+import type { HoverHandlers, UseHoverOptions } from '../interaction-enhancers';
 export type Placement = Options['placement'];
 export type Strategy = Options['strategy'];
 export type PopperInstance = Instance;

package/package.json

@@ -1,12 +1,15 @@
 {
   "name": "@opentrons/components",
-  "version": "0.1.7-alpha.0",
+  "version": "0.2.0-alpha.0",
   "description": "React components library for Opentrons' projects",
   "source": "src/index.ts",
   "types": "lib/index.d.ts",
   "style": "src/index.module.css",
   "main": "src/index.ts",
   "module": "src/index.ts",
+  "exports": {
+    "./styles": "./src/styles/global.css"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Opentrons/opentrons.git"
@@ -22,8 +25,7 @@
     "react-dom": "18.2.0"
   },
   "dependencies": {
-    "@opentrons/shared-data": "0.1.7-alpha.0",
-    "@opentrons/step-generation": "link:../step-generation",
+    "@opentrons/shared-data": "0.2.0-alpha.0",
     "@popperjs/core": "2.1.1",
     "@react-spring/types": "9.6.1",
     "@react-spring/web": "9.6.1",
@@ -41,7 +43,7 @@
     "react-remove-scroll": "2.4.3",
     "react-select": "5.4.0",
     "react-viewport-list": "6.3.0",
-    "redux": "4.0.5",
+    "redux": "5.0.1",
     "styled-components": "5.3.6"
   },
   "devDependencies": {