@opentrons/components 0.1.4 → 0.1.5-alpha.4

package/Makefile

@@ -9,6 +9,9 @@ tests ?=
 cov_opts ?= --coverage=true --ci=true --collectCoverageFrom='components/src/**/*.(js|ts|tsx)'
 test_opts ?=
 
+# override webpack's default hashing algorithm for node 18: https://github.com/webpack/webpack/issues/14532
+export NODE_OPTIONS := --openssl-legacy-provider
+
 # standard targets
 #####################################################################
 
@@ -44,4 +47,4 @@ test:
 
 .PHONY: test-cov
 test-cov:
-	make -C .. test-js-components tests=$(tests) test_opts="$(test_opts)" cov_opts="$(cov_opts)"
+	make -C .. test-js-components tests=$(tests) test_opts="$(test_opts)" cov_opts="$(cov_opts)"

package/lib/alerts/AlertItem.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { IconProps } from '../icons';
-export declare type AlertType = 'success' | 'warning' | 'error' | 'info';
+export type AlertType = 'success' | 'warning' | 'error' | 'info';
 export interface AlertItemProps {
     /** name constant of the icon to display */
     type: AlertType;

package/lib/atoms/buttons/AlertPrimaryButton.d.ts

@@ -1 +1,2 @@
-export declare const AlertPrimaryButton: import("styled-components").StyledComponent<"button", any, import("../../primitives").StyleProps, never>;
+/// <reference types="react" />
+export declare const AlertPrimaryButton: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("../../primitives").StyleProps, any>;

package/lib/atoms/buttons/PrimaryButton.d.ts

@@ -1 +1,2 @@
-export declare const PrimaryButton: import("styled-components").StyledComponent<"button", any, import("../../primitives").StyleProps, never>;
+/// <reference types="react" />
+export declare const PrimaryButton: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("../../primitives").StyleProps, any>;

package/lib/forms/DropdownField.d.ts

@@ -4,7 +4,7 @@ export interface DropdownOption {
     value: string;
     disabled?: boolean;
 }
-export declare type Options = DropdownOption[];
+export type Options = DropdownOption[];
 export interface DropdownFieldProps {
     /** change handler */
     onChange: React.ChangeEventHandler<HTMLSelectElement>;

package/lib/forms/Select.d.ts

@@ -9,7 +9,7 @@ export declare const PLACEMENT_TOP: 'top';
 export declare const CONTEXT_MENU: 'menu';
 export declare const CONTEXT_VALUE: 'value';
 export declare const SELECT_CX_PREFIX = "ot_select";
-export declare type ChangeAction = 'select-option' | 'deselect-option' | 'remove-value' | 'pop-value' | 'set-value' | 'clear' | 'create-option';
+export type ChangeAction = 'select-option' | 'deselect-option' | 'remove-value' | 'pop-value' | 'set-value' | 'clear' | 'create-option';
 export interface SelectOption {
     value: string;
     label?: string;
@@ -19,9 +19,9 @@ export interface SelectOptionGroup {
     options: SelectOption[];
     label?: string;
 }
-export declare type SelectOptionOrGroup = SelectOption | SelectOptionGroup;
-export declare type SelectPlacement = typeof PLACEMENT_AUTO | typeof PLACEMENT_BOTTOM | typeof PLACEMENT_TOP;
-export declare type SelectPosition = typeof POSITION_ABSOLUTE | typeof POSITION_FIXED;
-export declare type SelectOptionContext = typeof CONTEXT_MENU | typeof CONTEXT_VALUE;
-export declare type SelectProps = ReactSelectProps<SelectOption>;
+export type SelectOptionOrGroup = SelectOption | SelectOptionGroup;
+export type SelectPlacement = typeof PLACEMENT_AUTO | typeof PLACEMENT_BOTTOM | typeof PLACEMENT_TOP;
+export type SelectPosition = typeof POSITION_ABSOLUTE | typeof POSITION_FIXED;
+export type SelectOptionContext = typeof CONTEXT_MENU | typeof CONTEXT_VALUE;
+export type SelectProps = ReactSelectProps<SelectOption>;
 export declare function Select(props: SelectProps): JSX.Element;

package/lib/hardware-sim/BaseDeck/StagingAreaFixture.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { DeckDefinition, ModuleType } from '@opentrons/shared-data';
-export declare type StagingAreaLocation = 'cutoutA3' | 'cutoutB3' | 'cutoutC3' | 'cutoutD3';
+export type StagingAreaLocation = 'cutoutA3' | 'cutoutB3' | 'cutoutC3' | 'cutoutD3';
 interface StagingAreaFixtureProps extends React.SVGProps<SVGGElement> {
     cutoutId: StagingAreaLocation;
     deckDefinition: DeckDefinition;

package/lib/hardware-sim/Deck/FlexTrash.d.ts

@@ -1,5 +1,5 @@
 import type { RobotType } from '@opentrons/shared-data';
-export declare type TrashCutoutId = 'cutoutA1' | 'cutoutB1' | 'cutoutC1' | 'cutoutD1' | 'cutoutA3' | 'cutoutB3' | 'cutoutC3' | 'cutoutD3';
+export type TrashCutoutId = 'cutoutA1' | 'cutoutB1' | 'cutoutC1' | 'cutoutD1' | 'cutoutA3' | 'cutoutB3' | 'cutoutC3' | 'cutoutD3';
 interface FlexTrashProps {
     robotType: RobotType;
     trashIconColor: string;

package/lib/hardware-sim/Labware/LabwareAdapter/Opentrons96DeepWellAdapter.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Opentrons96DeepWellAdapter(): JSX.Element;

package/lib/hardware-sim/Labware/LabwareAdapter/Opentrons96FlatBottomAdapter.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Opentrons96FlatBottomAdapter(): JSX.Element;

package/lib/hardware-sim/Labware/LabwareAdapter/OpentronsAluminumFlatBottomPlate.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function OpentronsAluminumFlatBottomPlate(): JSX.Element;

package/lib/hardware-sim/Labware/LabwareAdapter/OpentronsFlex96TiprackAdapter.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function OpentronsFlex96TiprackAdapter(): JSX.Element;

package/lib/hardware-sim/Labware/LabwareAdapter/OpentronsUniversalFlatAdapter.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function OpentronsUniversalFlatAdapter(): JSX.Element;

package/lib/hardware-sim/Labware/LabwareAdapter/index.d.ts

@@ -0,0 +1,19 @@
+import { Opentrons96DeepWellAdapter } from './Opentrons96DeepWellAdapter';
+import { Opentrons96FlatBottomAdapter } from './Opentrons96FlatBottomAdapter';
+import { OpentronsUniversalFlatAdapter } from './OpentronsUniversalFlatAdapter';
+import { OpentronsAluminumFlatBottomPlate } from './OpentronsAluminumFlatBottomPlate';
+import { OpentronsFlex96TiprackAdapter } from './OpentronsFlex96TiprackAdapter';
+declare const LABWARE_ADAPTER_LOADNAME_PATHS: {
+    opentrons_96_deep_well_adapter: typeof Opentrons96DeepWellAdapter;
+    opentrons_96_flat_bottom_adapter: typeof Opentrons96FlatBottomAdapter;
+    opentrons_aluminum_flat_bottom_plate: typeof OpentronsAluminumFlatBottomPlate;
+    opentrons_flex_96_tiprack_adapter: typeof OpentronsFlex96TiprackAdapter;
+    opentrons_universal_flat_adapter: typeof OpentronsUniversalFlatAdapter;
+};
+export type LabwareAdapterLoadName = keyof typeof LABWARE_ADAPTER_LOADNAME_PATHS;
+export declare const labwareAdapterLoadNames: string[];
+export interface LabwareAdapterProps {
+    labwareLoadName: LabwareAdapterLoadName;
+}
+export declare const LabwareAdapter: (props: LabwareAdapterProps) => JSX.Element | null;
+export {};

package/lib/hardware-sim/Labware/LabwareRender.d.ts

@@ -6,10 +6,12 @@ export declare const WELL_LABEL_OPTIONS: {
     readonly SHOW_LABEL_INSIDE: "SHOW_LABEL_INSIDE";
     readonly SHOW_LABEL_OUTSIDE: "SHOW_LABEL_OUTSIDE";
 };
-export declare type WellLabelOption = keyof typeof WELL_LABEL_OPTIONS;
+export type WellLabelOption = keyof typeof WELL_LABEL_OPTIONS;
 export interface LabwareRenderProps {
     /** Labware definition to render */
     definition: LabwareDefinition2;
+    /** Opional Prop for labware on heater shakers sitting on right side of the deck */
+    shouldRotateAdapterOrientation?: boolean;
     /** option to show well labels inside or outside of labware outline */
     wellLabelOption?: WellLabelOption;
     /** wells to highlight */

package/lib/hardware-sim/Labware/labwareInternals/StyledWells.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { WellGroup } from './types';
-declare type WellContents = 'tipPresent' | 'tipMissing' | 'defaultWell' | 'disabledWell' | 'highlightedWell' | 'selectedWell';
+type WellContents = 'tipPresent' | 'tipMissing' | 'defaultWell' | 'disabledWell' | 'highlightedWell' | 'selectedWell';
 export interface StyledWellProps {
     wellContents: WellContents;
     definition: LabwareDefinition2;

package/lib/hardware-sim/Labware/labwareInternals/types.d.ts

@@ -3,9 +3,9 @@ export interface WellMouseEvent {
     wellName: string;
     event: React.MouseEvent;
 }
-export declare type WellFill = Record<string, string>;
-export declare type WellStroke = WellFill;
-export declare type WellGroup = Record<string, null>;
+export type WellFill = Record<string, string>;
+export type WellStroke = WellFill;
+export type WellGroup = Record<string, null>;
 export interface HighlightedWellLabels {
     wells: string[];
     color?: string;

package/lib/hardware-sim/ProtocolDeck/utils/getLabwareInSlots.d.ts

@@ -7,5 +7,6 @@ interface LabwareInSlot {
         slotName: string;
     };
 }
+export declare const getInitialAndMovedLabwareInSlots: (protocolAnalysis: CompletedProtocolAnalysis | ProtocolAnalysisOutput) => LabwareInSlot[];
 export declare const getTopMostLabwareInSlots: (protocolAnalysis: CompletedProtocolAnalysis | ProtocolAnalysisOutput) => LabwareInSlot[];
 export {};

package/lib/helix-design-system/colors.d.ts

@@ -2,9 +2,9 @@
  * green
  */
 export declare const green60 = "#03683E";
-export declare const green50 = "#04AA65";
-export declare const green40 = "#91E2C0";
-export declare const green35 = "#AFEDD3";
+export declare const green50: string;
+export declare const green40: string;
+export declare const green35: string;
 export declare const green30 = "#C4F6E0";
 export declare const green20 = "#E8F7ED";
 /**
@@ -29,13 +29,13 @@ export declare const yellow20 = "#FDF3E2";
 /**
  * purple
  */
-export declare const purple60 = "#562566";
-export declare const purple55 = "#713187";
-export declare const purple50 = "#893BA4";
-export declare const purple40 = "#CEA4DF";
-export declare const purple35 = "#DBBCE7";
-export declare const purple30 = "#E6D5EC";
-export declare const purple20 = "#F1E8F5";
+export declare const purple60: string;
+export declare const purple55: string;
+export declare const purple50: string;
+export declare const purple40: string;
+export declare const purple35: string;
+export declare const purple30: string;
+export declare const purple20: string;
 /**
  * blue
  */
@@ -50,13 +50,13 @@ export declare const blue10 = "#F1F8FF";
  * grey
  */
 export declare const grey60 = "#4A4C4E";
-export declare const grey55 = "#737578";
-export declare const grey50 = "#9C9C9C";
-export declare const grey40 = "#D0D0D0";
+export declare const grey55 = "#626467";
+export declare const grey50 = "#737578";
+export declare const grey40 = "#B7B8B9";
 export declare const grey35 = "#CBCCCC";
 export declare const grey30 = "#DEDEDE";
 export declare const grey20 = "#E9E9E9";
-export declare const grey10 = "#F8F8F8";
+export declare const grey10 = "#F3F3F3";
 /**
  * core
  */

package/lib/hooks/useScrolling.d.ts

@@ -1,8 +1 @@
-/**
- * A custom hook that detects whether an HTMLElement is being scrolled.
- *
- * @param {RefObject<HTMLElement>} ref - A ref object containing the HTMLElement to monitor for scrolling.
- * @returns {boolean} - A boolean indicating whether the HTMLElement is being scrolled.
- */
-import { RefObject } from 'react';
-export declare function useScrolling(ref: RefObject<HTMLElement>): boolean;
+export declare const useScrolling: (node: HTMLElement | null) => boolean;

package/lib/hooks/useSelectDeckLocation/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { CutoutConfig } from '@opentrons/shared-data';
 import type { DeckDefinition, ModuleLocation, RobotType } from '@opentrons/shared-data';
-export declare type DeckLocationSelectThemes = 'default' | 'grey';
+export type DeckLocationSelectThemes = 'default' | 'grey';
 export declare function useDeckLocationSelect(robotType: RobotType, theme?: DeckLocationSelectThemes): {
     DeckLocationSelect: JSX.Element;
     selectedLocation: ModuleLocation;
@@ -10,8 +11,10 @@ interface DeckLocationSelectProps {
     selectedLocation: ModuleLocation;
     theme?: DeckLocationSelectThemes;
     setSelectedLocation?: (loc: ModuleLocation) => void;
-    disabledLocations?: ModuleLocation[];
+    availableSlotNames?: string[];
+    occupiedCutouts?: CutoutConfig[];
     isThermocycler?: boolean;
+    showTooltipOnDisabled?: boolean;
 }
-export declare function DeckLocationSelect({ deckDef, selectedLocation, setSelectedLocation, disabledLocations, theme, isThermocycler, }: DeckLocationSelectProps): JSX.Element;
+export declare function DeckLocationSelect({ deckDef, selectedLocation, setSelectedLocation, availableSlotNames, occupiedCutouts, theme, isThermocycler, showTooltipOnDisabled, }: DeckLocationSelectProps): JSX.Element;
 export {};

package/lib/hooks/useToggle.d.ts

@@ -1,4 +1,4 @@
-export declare type UseToggleResult = [boolean, () => void];
+export type UseToggleResult = [boolean, () => void];
 /**
  * React hook to toggle a boolean value
  *

package/lib/icons/Icon.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ICON_DATA_BY_NAME } from './icon-data';
 import type { SvgProps } from '../primitives';
-export declare type IconName = keyof typeof ICON_DATA_BY_NAME;
+export type IconName = keyof typeof ICON_DATA_BY_NAME;
 export interface IconProps extends SvgProps {
     /** name constant of the icon to display */
     name: IconName;

package/lib/interaction-enhancers/useHover.d.ts

@@ -6,7 +6,7 @@ export interface HoverHandlers {
     onPointerEnter: () => unknown;
     onPointerLeave: () => unknown;
 }
-export declare type UseHoverResult = [boolean, HoverHandlers];
+export type UseHoverResult = [boolean, HoverHandlers];
 /**
  * Hook to track hover state of an element
  *

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

@@ -11,6 +11,6 @@ interface HardwareIconProps extends StyleProps {
     iconName: IconName;
     slotName?: undefined;
 }
-declare type LocationIconProps = SlotLocationProps | HardwareIconProps;
+type LocationIconProps = SlotLocationProps | HardwareIconProps;
 export declare function LocationIcon({ slotName, iconName, color, ...styleProps }: LocationIconProps): JSX.Element;
 export {};