@opentrons/components 0.1.6-alpha.8 → 0.1.7-alpha.0

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { ReactNode } from 'react';
 import type { StyleProps } from '../../primitives';
 import type { DeckDefinition, DeckSlot } from '@opentrons/shared-data';
 export interface RobotWorkSpaceRenderProps {
@@ -13,7 +13,7 @@ export interface RobotWorkSpaceRenderProps {
 export interface RobotWorkSpaceProps extends StyleProps {
     deckDef?: DeckDefinition;
     viewBox?: string | null;
-    children?: (props: RobotWorkSpaceRenderProps) => React.ReactNode;
+    children?: (props: RobotWorkSpaceRenderProps) => ReactNode;
     deckLayerBlocklist?: string[];
     showDeckLayers?: boolean;
     id?: string;

package/lib/hardware-sim/Deck/__mocks__/getDeckDefinitions.d.ts

@@ -1 +1 @@
-export declare const getDeckDefinitions: import("@vitest/spy").Mock<[], {}>;
+export declare const getDeckDefinitions: import("@vitest/spy").Mock<() => {}>;

package/lib/hardware-sim/DeckConfigurator/FlexStackerFixture.d.ts

@@ -0,0 +1,11 @@
+import type { CutoutFixtureId, CutoutId, DeckDefinition } from '@opentrons/shared-data';
+interface FlexStackerFixtureProps {
+    deckDefinition: DeckDefinition;
+    fixtureLocation: CutoutId;
+    cutoutFixtureId: CutoutFixtureId;
+    hasWasteChute: boolean;
+    handleClickRemove?: (fixtureLocation: CutoutId, cutoutFixtureId: CutoutFixtureId) => void;
+    selected?: boolean;
+}
+export declare function FlexStackerFixture(props: FlexStackerFixtureProps): JSX.Element;
+export {};

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

@@ -1,5 +1,6 @@
-import type * as React from 'react';
+import type { ReactNode } from 'react';
 import type { CutoutFixtureId, CutoutId, DeckConfiguration } from '@opentrons/shared-data';
+export * from './constants';
 interface DeckConfiguratorProps {
     deckConfig: DeckConfiguration;
     handleClickAdd: (cutoutId: CutoutId) => void;
@@ -8,7 +9,7 @@ interface DeckConfiguratorProps {
     darkFill?: string;
     editableCutoutIds?: CutoutId[];
     showExpansion?: boolean;
-    children?: React.ReactNode;
+    children?: ReactNode;
     additionalStaticFixtures?: Array<{
         location: CutoutId;
         label: string;
@@ -17,4 +18,3 @@ interface DeckConfiguratorProps {
     selectedCutoutId?: CutoutId;
 }
 export declare function DeckConfigurator(props: DeckConfiguratorProps): JSX.Element;
-export {};

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

@@ -1,10 +1,10 @@
-import type * as React from 'react';
+import type { SVGProps } from 'react';
 import type { DeckSlot, RobotType } from '@opentrons/shared-data';
-interface LegacyDeckSlotLocationProps extends React.SVGProps<SVGGElement> {
+interface LegacyDeckSlotLocationProps extends SVGProps<SVGGElement> {
     robotType: RobotType;
     slotName: DeckSlot['id'];
-    slotBaseColor?: React.SVGProps<SVGPathElement>['fill'];
-    slotClipColor?: React.SVGProps<SVGPathElement>['stroke'];
+    slotBaseColor?: SVGProps<SVGPathElement>['fill'];
+    slotClipColor?: SVGProps<SVGPathElement>['stroke'];
 }
 export declare const OT2_FIXED_TRASH_X_DIMENSION = 172.86;
 export declare const OT2_FIXED_TRASH_Y_DIMENSION = 165.86;

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

@@ -1,6 +1,6 @@
-import * as React from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { HighlightedWellLabels, WellMouseEvent, WellFill, WellStroke } from './labwareInternals/types';
+import type { RefObject } from 'react';
 export interface LabwareProps {
     /** Labware definition to render */
     definition: LabwareDefinition2;
@@ -22,7 +22,7 @@ export interface LabwareProps {
     onMouseEnterWell?: (e: WellMouseEvent) => unknown;
     /** Optional callback, called with WellMouseEvent args onMouseLeave */
     onMouseLeaveWell?: (e: WellMouseEvent) => unknown;
-    gRef?: React.RefObject<SVGGElement>;
+    gRef?: RefObject<SVGGElement>;
     onLabwareClick?: () => void;
     /** Hide labware outline */
     hideOutline?: boolean;

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

@@ -1,7 +1,7 @@
-import type * as React from 'react';
 import type { CSSProperties } from 'styled-components';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { HighlightedWellLabels, WellMouseEvent, WellFill, WellStroke, WellGroup } from './labwareInternals/types';
+import type { RefObject } from 'react';
 export declare const WELL_LABEL_OPTIONS: {
     readonly SHOW_LABEL_INSIDE: "SHOW_LABEL_INSIDE";
     readonly SHOW_LABEL_OUTSIDE: "SHOW_LABEL_OUTSIDE";
@@ -38,7 +38,7 @@ export interface LabwareRenderProps {
     onMouseEnterWell?: (e: WellMouseEvent) => unknown;
     /** Optional callback, called with WellMouseEvent args onMouseLeave */
     onMouseLeaveWell?: (e: WellMouseEvent) => unknown;
-    gRef?: React.RefObject<SVGGElement>;
+    gRef?: RefObject<SVGGElement>;
     onLabwareClick?: () => void;
     showBorder?: boolean;
     strokeColor?: string;

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

@@ -1,4 +1,4 @@
-import type * as React from 'react';
+import type { RefObject } from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { HighlightedWellLabels } from './labwareInternals/types';
 import type { WellLabelOption } from '../..';
@@ -11,7 +11,7 @@ export interface LabwareStackRenderProps {
     highlightTop: boolean;
     /** highlight bottom labware if it exists */
     highlightBottom: boolean;
-    gRef?: React.RefObject<SVGGElement>;
+    gRef?: RefObject<SVGGElement>;
     definitionBottom?: LabwareDefinition2 | null;
     shouldRotateAdapterOrientation?: boolean;
     /** option to show well labels inside or outside of labware outline */

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

@@ -1,11 +1,11 @@
-import * as React from 'react';
-import type { LabwareDefinition2 } from '@opentrons/shared-data';
+import type { MemoExoticComponent } from 'react';
 import type { CSSProperties } from 'styled-components';
+import type { LabwareDefinition2 } from '@opentrons/shared-data';
 export interface FilledWellsProps {
     definition: LabwareDefinition2;
     fillByWell: Record<string, CSSProperties['fill']>;
     strokeColor?: string;
 }
 declare function FilledWellsComponent(props: FilledWellsProps): JSX.Element;
-export declare const FilledWells: React.MemoExoticComponent<typeof FilledWellsComponent>;
+export declare const FilledWells: MemoExoticComponent<typeof FilledWellsComponent>;
 export {};

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { MemoExoticComponent } from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { HighlightedWellLabels } from './types';
 interface LabwareWellLabelsProps {
@@ -11,5 +11,5 @@ export declare function LabwareWellLabelsComponent(props: LabwareWellLabelsProps
  * for use in Labware.tsx component
  * has ODD-specific styling
  */
-export declare const LabwareWellLabels: React.MemoExoticComponent<typeof LabwareWellLabelsComponent>;
+export declare const LabwareWellLabels: MemoExoticComponent<typeof LabwareWellLabelsComponent>;
 export {};

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { MemoExoticComponent } from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { WellMouseEvent, WellStroke } from './types';
 import type { CSSProperties } from 'styled-components';
@@ -22,4 +22,4 @@ export interface StaticLabwareProps {
     showBorder?: boolean;
 }
 export declare function StaticLabwareComponent(props: StaticLabwareProps): JSX.Element;
-export declare const StaticLabware: React.MemoExoticComponent<typeof StaticLabwareComponent>;
+export declare const StaticLabware: MemoExoticComponent<typeof StaticLabwareComponent>;

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

@@ -1,9 +1,9 @@
-import * as React from 'react';
-import type { LabwareDefinition2 } from '@opentrons/shared-data';
+import type { MemoExoticComponent } from 'react';
 import type { CSSProperties } from 'styled-components';
+import type { LabwareDefinition2 } from '@opentrons/shared-data';
 export interface StrokedWellProps {
     definition: LabwareDefinition2;
     strokeByWell: Record<string, CSSProperties['stroke']>;
 }
 export declare function StrokedWellsComponent(props: StrokedWellProps): JSX.Element;
-export declare const StrokedWells: React.MemoExoticComponent<typeof StrokedWellsComponent>;
+export declare const StrokedWells: MemoExoticComponent<typeof StrokedWellsComponent>;

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { CSSProperties, MemoExoticComponent } from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { WellGroup } from './types';
 type WellContents = 'tipPresent' | 'tipMissing' | 'defaultWell' | 'disabledWell' | 'highlightedWell' | 'selectedWell';
@@ -9,11 +9,11 @@ export interface StyledWellProps {
 }
 export declare const STYLE_BY_WELL_CONTENTS: {
     [wellContents in WellContents]: {
-        stroke: React.CSSProperties['stroke'];
-        fill: React.CSSProperties['fill'];
-        strokeWidth: React.CSSProperties['strokeWidth'];
+        stroke: CSSProperties['stroke'];
+        fill: CSSProperties['fill'];
+        strokeWidth: CSSProperties['strokeWidth'];
     };
 };
 declare function StyledWellsComponent(props: StyledWellProps): JSX.Element;
-export declare const StyledWells: React.MemoExoticComponent<typeof StyledWellsComponent>;
+export declare const StyledWells: MemoExoticComponent<typeof StyledWellsComponent>;
 export {};

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { CSSProperties, MemoExoticComponent } from 'react';
 import type { LabwareWell } from '@opentrons/shared-data';
 import type { WellMouseEvent } from './types';
 import type { StyleProps } from '../../../primitives';
@@ -7,9 +7,9 @@ export interface WellProps extends StyleProps {
     wellName: string;
     /** well object from labware definition */
     well: LabwareWell;
-    stroke: React.CSSProperties['stroke'];
-    strokeWidth: React.CSSProperties['strokeWidth'];
-    fill: React.CSSProperties['fill'];
+    stroke: CSSProperties['stroke'];
+    strokeWidth: CSSProperties['strokeWidth'];
+    fill: CSSProperties['fill'];
     /** Optional callback, called with WellMouseEvent args onMouseOver */
     onMouseEnterWell?: (e: WellMouseEvent) => unknown;
     onMouseLeaveWell?: (e: WellMouseEvent) => unknown;
@@ -17,4 +17,4 @@ export interface WellProps extends StyleProps {
     isInteractive?: boolean;
 }
 export declare function WellComponent(props: WellProps): JSX.Element;
-export declare const Well: React.MemoExoticComponent<typeof WellComponent>;
+export declare const Well: MemoExoticComponent<typeof WellComponent>;

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { MemoExoticComponent } from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 import type { WellLabelOption } from '../LabwareRender';
 import type { HighlightedWellLabels } from './types';
@@ -9,4 +9,4 @@ export interface WellLabelsProps {
     wellLabelColor?: string;
 }
 export declare function WellLabelsComponent(props: WellLabelsProps): JSX.Element;
-export declare const WellLabels: React.MemoExoticComponent<typeof WellLabelsComponent>;
+export declare const WellLabels: MemoExoticComponent<typeof WellLabelsComponent>;

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

@@ -1,7 +1,7 @@
-import type * as React from 'react';
+import type { MouseEvent } from 'react';
 export interface WellMouseEvent {
     wellName: string;
-    event: React.MouseEvent;
+    event: MouseEvent;
 }
 export type WellFill = Record<string, string>;
 export type WellStroke = WellFill;

package/lib/hardware-sim/Module/ModuleTag.d.ts

@@ -1,9 +1,9 @@
-import type * as React from 'react';
+import type { ReactNode } from 'react';
 export interface ModuleTagProps {
     x: number;
     y: number;
     height: number;
     width: number;
-    children: React.ReactNode;
+    children: ReactNode;
 }
 export declare const ModuleTag: (props: ModuleTagProps) => JSX.Element;

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

@@ -1,7 +1,7 @@
-import type * as React from 'react';
 import { Thermocycler } from './Thermocycler';
 import { HeaterShaker } from './HeaterShaker';
 import { Temperature } from './Temperature';
+import type { ComponentProps, ReactNode } from 'react';
 import type { ModuleDefinition } from '@opentrons/shared-data';
 export * from './Thermocycler';
 interface Props {
@@ -9,9 +9,9 @@ interface Props {
     y: number;
     def: ModuleDefinition;
     orientation?: 'left' | 'right';
-    innerProps?: React.ComponentProps<typeof Thermocycler> | React.ComponentProps<typeof HeaterShaker> | React.ComponentProps<typeof Temperature> | {};
-    statusInfo?: React.ReactNode;
-    children?: React.ReactNode;
+    innerProps?: ComponentProps<typeof Thermocycler> | ComponentProps<typeof HeaterShaker> | ComponentProps<typeof Temperature> | {};
+    statusInfo?: ReactNode;
+    children?: ReactNode;
     targetSlotId?: string;
     targetDeckId?: string;
 }

package/lib/hardware-sim/ProtocolDeck/LabwareInfo.d.ts

@@ -1,6 +1,6 @@
-import type * as React from 'react';
+import type { ReactNode } from 'react';
 import type { LabwareDefinition2 } from '@opentrons/shared-data';
 export declare function LabwareInfo(props: {
     def: LabwareDefinition2;
-    children: React.ReactNode;
+    children: ReactNode;
 }): JSX.Element;

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

@@ -1,14 +1,11 @@
-import type * as React from 'react';
 import { BaseDeck } from '../BaseDeck';
-import type { CompletedProtocolAnalysis, LabwareDefinition2, ProtocolAnalysisOutput } from '@opentrons/shared-data';
+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;
-    /** defaults to false, when set labware nicknames will appear on top level labware. If no nickname specified in protocol, falls back to labware definition display name */
-    showLabwareInfo?: boolean;
-    /** optional labware click handler, highlights labware */
-    handleLabwareClick?: (labwareDef: LabwareDefinition2, labwareId: string) => void;
     /** extra props to pass through to BaseDeck component */
-    baseDeckProps?: Partial<React.ComponentProps<typeof BaseDeck>>;
+    baseDeckProps?: Partial<ComponentProps<typeof BaseDeck>>;
 }
 export declare function ProtocolDeck(props: ProtocolDeckProps): JSX.Element | null;

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

@@ -1,3 +1,4 @@
 export * from './getLabwareInSlots';
 export * from './getStandardDeckViewLayerBlockList';
 export * from './getLabwareInfoByLiquidId';
+export * from './getWellFillFromLabwareId';

package/lib/hardware-sim/RobotCoordinateSpace/RobotCoordinateSpace.d.ts

@@ -1,6 +1,6 @@
-import type * as React from 'react';
 import { Svg } from '../../primitives';
-interface RobotCoordinateSpaceProps extends React.ComponentProps<typeof Svg> {
+import type { ComponentProps } from 'react';
+interface RobotCoordinateSpaceProps extends ComponentProps<typeof Svg> {
     animated?: boolean;
 }
 export declare function RobotCoordinateSpace(props: RobotCoordinateSpaceProps): JSX.Element;

package/lib/hardware-sim/RobotCoordinateSpace/RobotCoordinateSpaceWithRef.d.ts

@@ -1,12 +1,12 @@
 import { Svg } from '../../primitives';
-import type { ReactNode } from 'react';
+import type { ComponentProps, ReactNode } from 'react';
 import type { DeckDefinition, DeckSlot } from '@opentrons/shared-data';
 export interface RobotCoordinateSpaceWithRefRenderProps {
     deckSlotsById: {
         [slotId: string]: DeckSlot;
     };
 }
-interface RobotCoordinateSpaceWithRefProps extends React.ComponentProps<typeof Svg> {
+interface RobotCoordinateSpaceWithRefProps extends ComponentProps<typeof Svg> {
     viewBox?: string | null;
     deckDef?: DeckDefinition;
     zoomed?: boolean;

package/lib/hooks/index.d.ts

@@ -1,6 +1,5 @@
 export * from './useConditionalConfirm';
 export * from './useDrag';
-export * from './useIdle';
 export * from './useInterval';
 export * from './useLongPress';
 export * from './useMountEffect';

package/lib/hooks/useMenuHandleClickOutside.d.ts

@@ -1,9 +1,9 @@
-import * as React from 'react';
+import type { Dispatch, MouseEventHandler, SetStateAction } from 'react';
 interface MenuHandleClickOutside {
     menuOverlay: JSX.Element;
-    handleOverflowClick: React.MouseEventHandler<HTMLButtonElement>;
+    handleOverflowClick: MouseEventHandler<HTMLButtonElement>;
     showOverflowMenu: boolean;
-    setShowOverflowMenu: React.Dispatch<React.SetStateAction<boolean>>;
+    setShowOverflowMenu: Dispatch<SetStateAction<boolean>>;
 }
 export declare function useMenuHandleClickOutside(): MenuHandleClickOutside;
 export {};

package/lib/i18n.d.ts

@@ -0,0 +1,14 @@
+import i18n from 'i18next';
+import type { InitOptions } from 'i18next';
+export declare const US_ENGLISH = "en-US";
+export declare const SIMPLIFIED_CHINESE = "zh-CN";
+export declare const US_ENGLISH_DISPLAY_NAME = "English (US)";
+export declare const SIMPLIFIED_CHINESE_DISPLAY_NAME = "\u4E2D\u6587";
+export type Language = typeof US_ENGLISH | typeof SIMPLIFIED_CHINESE;
+export declare const LANGUAGES: Array<{
+    name: string;
+    value: Language;
+}>;
+declare const i18nConfig: InitOptions;
+declare const i18nCb: (err?: Error) => void;
+export { i18n, i18nCb, i18nConfig };

package/lib/icons/Icon.d.ts

@@ -1,5 +1,5 @@
-import type * as React from 'react';
 import { ICON_DATA_BY_NAME } from './icon-data';
+import type { ReactNode } from 'react';
 import type { SvgProps } from '../primitives';
 export type IconName = keyof typeof ICON_DATA_BY_NAME;
 export interface IconProps extends SvgProps {
@@ -20,7 +20,7 @@ export interface IconProps extends SvgProps {
     /** inline style passed into the icon svg */
     style?: Record<string, string | number>;
     /** optional children */
-    children?: React.ReactNode;
+    children?: ReactNode;
     id?: string;
 }
 /**

package/lib/icons/ModuleIcon.d.ts

@@ -1,6 +1,6 @@
 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';
+export type ModuleIconName = 'ot-magnet-v2' | 'ot-heater-shaker' | 'ot-temperature-v2' | 'ot-magnet-v2' | 'ot-thermocycler' | 'ot-absorbance' | 'stacked';
 export declare const MODULE_ICON_NAME_BY_TYPE: {
     [type in ModuleType]: ModuleIconName;
 };

package/lib/instrument/InstrumentInfo.d.ts

@@ -1,4 +1,4 @@
-import type * as React from 'react';
+import type { ReactNode } from 'react';
 import type { Mount } from '../robot-types';
 import type { InstrumentDiagramProps } from './InstrumentDiagram';
 export interface InstrumentInfoProps {
@@ -11,7 +11,7 @@ export interface InstrumentInfoProps {
     /** paired tiprack models */
     tiprackModels?: string[];
     /** children to display under the info */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /** if true, show labels 'LEFT PIPETTE' / 'RIGHT PIPETTE' */
     showMountLabel?: boolean | null;
 }

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

@@ -1,12 +1,13 @@
-import * as React from 'react';
+import { Component } from 'react';
+import type { RefCallback } from 'react';
 interface ClickOutsideChildParams {
-    ref: React.RefCallback<Element>;
+    ref: RefCallback<Element>;
 }
 export interface ClickOutsideProps {
     onClickOutside: ((e: MouseEvent) => void) | undefined | null;
     children: (params: ClickOutsideChildParams) => JSX.Element;
 }
-export declare class ClickOutside extends React.Component<ClickOutsideProps> {
+export declare class ClickOutside extends Component<ClickOutsideProps> {
     wrapperRef: Element | null;
     constructor(props: ClickOutsideProps);
     componentDidMount(): void;

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

@@ -1,4 +1,5 @@
-import * as React from 'react';
+import { Component } from 'react';
+import type { ReactNode } from 'react';
 export interface KeypressHandler {
     key: string;
     shiftKey?: boolean | null | undefined;
@@ -10,7 +11,7 @@ export interface HandleKeypressProps {
     /** optionally call event.preventDefault if keypress is handled */
     preventDefault?: boolean | null | undefined;
     /** wrapped children */
-    children?: React.ReactNode;
+    children?: ReactNode;
 }
 /**
  * Keypress handler wrapper component. Takes an array of keypress handlers
@@ -18,7 +19,7 @@ export interface HandleKeypressProps {
  * `keyup` event. `event.preventDefault` will be called if a key is handled
  * and `props.preventDefault` is true.
  */
-export declare class HandleKeypress extends React.Component<HandleKeypressProps> {
+export declare class HandleKeypress extends Component<HandleKeypressProps> {
     handlePressIfKey: (event: KeyboardEvent) => void;
     preventDefaultIfKey: (event: KeyboardEvent) => void;
     componentDidMount(): void;

package/lib/lists/SidePanelGroup.d.ts

@@ -1,4 +1,4 @@
-import type * as React from 'react';
+import type { ReactNode } from 'react';
 import type { IconName } from '../icons';
 export interface SidePanelGroupProps {
     /** text of title */
@@ -6,7 +6,7 @@ export interface SidePanelGroupProps {
     /** optional icon left of the title */
     iconName?: IconName;
     /** children, most likely one or more TitledList */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /** additional classnames */
     className?: string;
     /** disables the whole SidePanelGroup if true */

package/lib/lists/TitledList.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type { MouseEvent, ReactNode } from 'react';
 import type { IconName, IconProps } from '../icons';
 export interface TitledListProps {
     /** id attribute */
@@ -12,21 +12,21 @@ export interface TitledListProps {
     /** optional data test id for the container */
     'data-test'?: string;
     /** children must all be `<li>` */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /** additional classnames */
     className?: string;
     /** component with descriptive text about the list */
-    description?: React.ReactNode;
+    description?: ReactNode;
     /** optional click action (on title div, not children) */
-    onClick?: (event: React.MouseEvent) => unknown;
+    onClick?: (event: MouseEvent) => unknown;
     /** optional right click action (on wrapping div) */
-    onContextMenu?: (event: React.MouseEvent) => unknown;
+    onContextMenu?: (event: MouseEvent) => unknown;
     /** optional mouseEnter action */
-    onMouseEnter?: (event: React.MouseEvent) => unknown;
+    onMouseEnter?: (event: MouseEvent) => unknown;
     /** optional mouseLeave action */
-    onMouseLeave?: (event: React.MouseEvent) => unknown;
+    onMouseLeave?: (event: MouseEvent) => unknown;
     /** caret click action; if defined, list is expandable and carat is visible */
-    onCollapseToggle?: (event: React.MouseEvent) => unknown;
+    onCollapseToggle?: (event: MouseEvent) => unknown;
     /** collapse the list if true (false by default) */
     collapsed?: boolean;
     /** set to true when TitledList is selected (eg, user clicked it) */

package/lib/modals/AlertModal.d.ts

@@ -1,15 +1,15 @@
-import type * as React from 'react';
+import type { ReactNode } from 'react';
 import type { ButtonProps } from '../buttons';
 import type { IconName } from '../icons';
 export interface AlertModalProps {
     /** optional handler for overlay click */
     onCloseClick?: () => unknown;
     /** optional modal heading */
-    heading?: React.ReactNode;
+    heading?: ReactNode;
     /** optional array of `ButtonProps` for `OutlineButton`s at bottom of modal */
     buttons?: Array<ButtonProps | null | undefined>;
     /** modal contents */
-    children: React.ReactNode;
+    children: ReactNode;
     /** optional classes to apply */
     className?: string;
     /** optional classes to apply */

package/lib/modals/LegacyModal.d.ts

@@ -1,11 +1,11 @@
-import * as React from 'react';
+import type { MouseEventHandler, ReactNode, Ref } from 'react';
 export interface LegacyModalProps {
     /** handler to close the modal (attached to `Overlay` onClick) */
-    onCloseClick?: React.MouseEventHandler;
+    onCloseClick?: MouseEventHandler;
     /** Optional styled heading **/
     heading?: string;
     /** modal contents */
-    children: React.ReactNode;
+    children: ReactNode;
     /** classes to apply */
     className?: string;
     /** classes to apply to the contents box */
@@ -14,7 +14,7 @@ export interface LegacyModalProps {
     alertOverlay?: boolean;
     /** restricts scroll outside of Modal when open, true by default */
     restrictOuterScroll?: boolean;
-    innerRef?: React.Ref<HTMLDivElement>;
+    innerRef?: Ref<HTMLDivElement>;
 }
 /**
  * @deprecated use Modal instead

package/lib/modals/Modal.d.ts

@@ -1,21 +1,23 @@
-import type * as React from 'react';
+import type { MouseEventHandler, ReactNode } from 'react';
 import type { StyleProps } from '../primitives';
 import type { Position } from './ModalShell';
 type ModalType = 'info' | 'warning' | 'error';
 export interface ModalProps extends StyleProps {
     type?: ModalType;
-    onClose?: React.MouseEventHandler;
+    onClose?: MouseEventHandler;
     closeOnOutsideClick?: boolean;
-    title?: React.ReactNode;
+    title?: ReactNode;
     titleElement1?: JSX.Element;
     titleElement2?: JSX.Element;
+    headerTagElement?: JSX.Element;
     fullPage?: boolean;
     childrenPadding?: string | number;
-    children?: React.ReactNode;
-    footer?: React.ReactNode;
+    children?: ReactNode;
+    footer?: ReactNode;
     zIndexOverlay?: number;
     showOverlay?: boolean;
     position?: Position;
+    hasHeader?: boolean;
 }
 /**
  * For Desktop app and Helix (which includes Protocol Designer) use only.

package/lib/modals/ModalHeader.d.ts

@@ -1,13 +1,14 @@
-import type * as React from 'react';
+import type { MouseEventHandler, ReactNode } from 'react';
 import type { IconProps } from '../icons';
 export interface ModalHeaderProps {
-    title: React.ReactNode;
-    onClose?: React.MouseEventHandler;
+    title: ReactNode;
+    onClose?: MouseEventHandler;
     titleElement1?: JSX.Element;
     titleElement2?: JSX.Element;
+    tagElement?: JSX.Element;
     backgroundColor?: string;
     color?: string;
     icon?: IconProps;
-    closeButton?: React.ReactNode;
+    closeButton?: ReactNode;
 }
 export declare const ModalHeader: (props: ModalHeaderProps) => JSX.Element;