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

package/src/styles/global.css

@@ -0,0 +1,179 @@
+/* this is global CSS for the components package and all other opentrons projects */
+:root {
+  /* colors */
+
+  /* currently we follow the order of colors.ts file */
+
+  /* green */
+  --green-60: #03683e;
+  --green-35: #afedd3;
+  --green-20: #e8f7ed;
+  --green-50-non-touchscreen: #04aa65;
+  --green-50-touchscreen: #1ca850;
+  --green-50: var(--green-50-non-touchscreen);
+  --green-40-non-touchscreen: #91e2c0;
+  --green-40-touchscreen: #8ef3a8;
+  --green-40: var(--green-40-non-touchscreen);
+  --green-30-non-touchscreen: #c4f6e0;
+  --green-30-touchscreen: #8afbab;
+  --green-30: var(--green-30-non-touchscreen);
+
+  /* red */
+  --red-60: #941313;
+  --red-55: #c71a1b;
+  --red-50: #de1b1b;
+  --red-40: #f5b2b3;
+  --red-35: #f8c8c9;
+  --red-30: #fad6d6;
+  --red-20: #fce9e9;
+
+  /* yellow */
+  --yellow-60: #825512;
+  --yellow-50: #f09d20;
+  --yellow-40: #fcd48b;
+  --yellow-35: #ffe1a4;
+  --yellow-30: #ffe9be;
+  --yellow-20: #fdf3e2;
+
+  /* purple */
+  --purple-60-non-touchscreen: #562566;
+  --purple-60-touchscreen: #612367;
+  --purple-60: var(--purple-60-non-touchscreen);
+  --purple-55-non-touchscreen: #713187;
+  --purple-55-touchscreen: #822e89;
+  --purple-55: var(--purple-55-non-touchscreen);
+  --purple-50-non-touchscreen: #893ba4;
+  --purple-50-touchscreen: #9e39a8;
+  --purple-50: var(--purple-50-non-touchscreen);
+  --purple-40-non-touchscreen: #cea4df;
+  --purple-40-touchscreen: #e2a9ea;
+  --purple-40: var(--purple-40-non-touchscreen);
+  --purple-35-non-touchscreen: #dbbce7;
+  --purple-35-touchscreen: #ecc2f2;
+  --purple-35: var(--purple-35-non-touchscreen);
+  --purple-30-non-touchscreen: #e6d5ec;
+  --purple-30-touchscreen: #f4def7;
+  --purple-30: var(--purple-30-non-touchscreen);
+  --purple-20-non-touchscreen: #f1e8f5;
+  --purple-20-touchscreen: #fff3fe;
+  --purple-20: var(--purple-20-non-touchscreen);
+
+  /* blue */
+  --blue-60: #004196;
+  --blue-55: #0056c8;
+  --blue-40: #a9cefd;
+  --blue-35: #bfdcfd;
+  --blue-30: #d0e6fe;
+  --blue-20: #e1efff;
+  --blue-10: #f1f8ff;
+
+  /* gray */
+  --grey-60: #4a4c4e;
+  --grey-55: #626467;
+  --grey-50: #737578;
+  --grey-40: #b7b8b9;
+  --grey-35: #cbcccc;
+  --grey-30: #dedede;
+  --grey-20: #e9e9e9;
+  --grey-10: #f3f3f3;
+
+  /* core */
+  --black-90: #16212d;
+  --black-80: #24313f;
+  --black-70: #39495b;
+  --white: #fff;
+  --blue-50: #006cfa;
+
+  /* semi-opaques */
+  --transparent-white-80: #fffc;
+  --transparent-white-50: #ffffff80;
+  --transparent-black-80: #16212d80;
+
+  /* flex */
+  --flex-55: #0297cc;
+  --flex-50: #00bdff;
+  --flex-40: #aae3fc;
+
+  /* extras */
+  --transparent: #0000;
+
+  /* spacing */
+  --spacing-2: 0.125rem; /* 2px */
+  --spacing-4: 0.25rem; /* 4px */
+  --spacing-6: 0.375rem; /* 6px */
+  --spacing-8: 0.5rem; /* 8px */
+  --spacing-10: 0.625rem; /* 10px */
+  --spacing-12: 0.75rem; /* 12px */
+  --spacing-16: 1rem; /* 16px */
+  --spacing-20: 1.25rem; /* 20px */
+  --spacing-24: 1.5rem; /* 24px */
+  --spacing-32: 2rem; /* 32px */
+  --spacing-40: 2.5rem; /* 40px */
+  --spacing-44: 2.75rem; /* 44px */
+  --spacing-48: 3rem; /* 48px */
+  --spacing-60: 3.75rem; /* 60px */
+  --spacing-68: 4.25rem; /* 68px */
+  --spacing-80: 5rem; /* 80px */
+  --spacing-120: 7.5rem; /* 120px */
+
+  /* border-radius */
+  --border-radius-2: 0.125rem; /* 2px */
+  --border-radius-4: 0.25rem; /* 4px */
+  --border-radius-8: 0.5rem; /* 8px */
+  --border-radius-12: 0.75rem; /* 12px */
+  --border-radius-16: 1rem; /* 16px */
+  --border-radius-40: 2.5rem; /* 40px */
+  --border-radius-200: 50rem; /* 200px */
+
+  /* font-size */
+  --font-size-80: 5rem; /* 80px */
+  --font-size-38: 2.375rem; /* 38px */
+  --font-size-32: 2rem; /* 32px */
+  --font-size-28: 1.75rem; /* 28px */
+  --font-size-22: 1.375rem; /* 22px */
+  --font-size-20: 1.25rem; /* 20px */
+  --font-size-h1: 1.1875rem; /* H1 19px */
+  --font-size-h2: 0.9375rem; /* H2 15px */
+  --font-size-h3: 0.875rem; /* H3 14px */
+  --font-size-h4: 0.8125rem; /* H4 13px */
+  --font-size-h6: 0.5625rem; /* H6 9px */
+  --font-size-p: 0.8125rem; /* P 13px */
+  --font-size-label: 0.6875rem; /* Label 11px */
+  --font-size-caption: 0.625rem; /* Caption 10px */
+
+  /* line-height */
+  --line-height-96: 6rem; /* 96px */
+  --line-height-48: 3rem; /* 48px */
+  --line-height-42: 2.625rem; /* 42px */
+  --line-height-36: 2.25rem; /* 36px */
+  --line-height-28: 1.75rem; /* 28px */
+  --line-height-24: 1.5rem; /* 24px */
+  --line-height-20: 1.25rem; /* 20px */
+  --line-height-18: 1.125rem; /* 18px */
+  --line-height-16: 1rem; /* 16px */
+  --line-height-12: 0.75rem; /* 12px */
+
+  /* font-weight */
+
+  /* this might be removed. that depends on what StyledText looks like */
+  --font-weight-bold: 700;
+  --font-weight-semi-bold: 600;
+  --font-weight-regular: 400;
+  --font-weight-light: 300;
+}
+
+.enable_touchscreen_colors {
+  /* green */
+  --green-50: var(--green-50-touchscreen);
+  --green-40: var(--green-40-touchscreen);
+  --green-30: var(--green-30-touchscreen);
+
+  /* purple */
+  --purple-60: var(--purple-60-touchscreen);
+  --purple-55: var(--purple-55-touchscreen);
+  --purple-50: var(--purple-50-touchscreen);
+  --purple-40: var(--purple-40-touchscreen);
+  --purple-35: var(--purple-35-touchscreen);
+  --purple-30: var(--purple-30-touchscreen);
+  --purple-20: var(--purple-20-touchscreen);
+}

package/src/styles/index.module.css

@@ -3,6 +3,6 @@
 }
 
 .rotated {
-  transform-origin: center;
   transform: rotate(180deg);
+  transform-origin: center;
 }

package/src/styles/typography.module.css

@@ -1,3 +1,4 @@
+/* ToDo this file will be removed once the labware library, designer, and creator are updated */
 :root {
   --c-font-dark: #4a4a4a;
   --c-font-icon: #6f6f6f;

package/src/testing/utils/matchers.ts

@@ -1,4 +1,5 @@
 import { when } from 'vitest-when'
+
 import type { Matcher } from '@testing-library/react'
 
 // these are needed because under the hood react calls components with two arguments (props and some second argument nobody seems to know)

package/src/testing/utils/renderWithProviders.tsx

@@ -1,21 +1,21 @@
 // render using targetted component using @testing-library/react
 // with wrapping providers for i18next and redux
 
-import { QueryClient, QueryClientProvider } from 'react-query'
 import { I18nextProvider } from 'react-i18next'
+import { QueryClient, QueryClientProvider } from 'react-query'
 import { Provider } from 'react-redux'
-import { vi } from 'vitest'
 import { render } from '@testing-library/react'
-import { createStore } from 'redux'
+import { legacy_createStore } from 'redux'
+import { vi } from 'vitest'
 
+import type { RenderOptions, RenderResult } from '@testing-library/react'
+import type { Store } from 'redux'
 import type {
   ComponentProps,
   ComponentType,
   PropsWithChildren,
   ReactElement,
 } from 'react'
-import type { RenderResult, RenderOptions } from '@testing-library/react'
-import type { PreloadedState, Store } from 'redux'
 
 export interface RenderWithProvidersOptions<State> extends RenderOptions {
   initialState?: State
@@ -29,10 +29,7 @@ export function renderWithProviders<State>(
   // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
   const { initialState = {}, i18nInstance = null } = options || {}
 
-  const store: Store<State> = createStore(
-    vi.fn(),
-    initialState as PreloadedState<State>
-  )
+  const store: Store<State> = legacy_createStore(vi.fn(), initialState)
   store.dispatch = vi.fn()
   store.getState = vi.fn(() => initialState) as () => State
 

package/src/tooltips/DeprecatedTooltip.tsx

@@ -1,5 +1,6 @@
-import { Manager, Reference, Popper } from 'react-popper'
+import { Manager, Popper, Reference } from 'react-popper'
 import cx from 'classnames'
+
 import styles from './tooltips.module.css'
 
 import type {

package/src/tooltips/LegacyTooltip.stories.tsx

@@ -1,19 +1,20 @@
-import type * as React from 'react'
-import { LegacyTooltip } from './LegacyTooltip'
-import { useTooltip } from './useTooltip'
-import { useHoverTooltip } from './useHoverTooltip'
 import {
+  ALIGN_CENTER,
   Box,
+  C_LIGHT_GRAY,
+  C_MED_GRAY,
   Flex,
   JUSTIFY_CENTER,
-  ALIGN_CENTER,
-  SIZE_4,
   SIZE_3,
-  C_LIGHT_GRAY,
-  C_MED_GRAY,
+  SIZE_4,
 } from '@opentrons/components'
 
-import type { Story, Meta } from '@storybook/react'
+import { LegacyTooltip } from './LegacyTooltip'
+import { useHoverTooltip } from './useHoverTooltip'
+import { useTooltip } from './useTooltip'
+
+import type { Meta, Story } from '@storybook/react'
+import type * as React from 'react'
 
 export default {
   title: 'Library/Atoms/LegacyTooltip',

package/src/tooltips/LegacyTooltip.tsx

@@ -2,16 +2,16 @@ import { forwardRef } from 'react'
 import { css } from 'styled-components'
 
 import { BORDERS, COLORS } from '../helix-design-system'
-import { fontSizeH4 } from '../ui-style-constants/typography'
-import { spacing8 } from '../ui-style-constants/spacing'
-import { ARROW_SIZE_PX } from './styles'
 import { Box } from '../primitives'
 import { CURSOR_POINTER } from '../styles'
+import { spacing8 } from '../ui-style-constants/spacing'
+import { fontSizeH4 } from '../ui-style-constants/typography'
+import { ARROW_SIZE_PX } from './styles'
 
-import type { CSSProperties, ForwardedRef, ReactNode, RefCallback } from 'react'
 import type { FlattenSimpleInterpolation } from 'styled-components'
-import type { Placement } from './types'
+import type { CSSProperties, ForwardedRef, ReactNode, RefCallback } from 'react'
 import type { StyleProps } from '../primitives'
+import type { Placement } from './types'
 
 export interface LegacyTooltipProps extends StyleProps {
   /** Whether or not the tooltip should be rendered */

package/src/tooltips/__tests__/Tooltip.test.tsx

@@ -1,4 +1,5 @@
 import { describe, it } from 'vitest'
+
 describe('hook-based Tooltip', () => {
   it.todo('replace deprecated enzyme test')
 })

package/src/tooltips/__tests__/useHoverTooltip.test.tsx

@@ -1,4 +1,5 @@
 import { describe, it } from 'vitest'
+
 describe('useHoverTooltip', () => {
   it.todo('replace deprecated enzyme test')
 })

package/src/tooltips/__tests__/usePopper.test.tsx

@@ -1,4 +1,5 @@
 import { describe, it } from 'vitest'
+
 describe('usePopper hook', () => {
   it.todo('replace deprecated enzyme test')
 })

package/src/tooltips/__tests__/useTooltip.test.tsx

@@ -1,4 +1,5 @@
 import { describe, it } from 'vitest'
+
 describe('useTooltip hook', () => {
   it.todo('replace deprecated enzyme test')
 })

package/src/tooltips/tooltips.module.css

@@ -2,42 +2,42 @@
 @import '../index.module.css';
 
 .tooltip_box {
-  font-size: var(--fs-body-1); /* from legacy --font-body-1-light */
-  font-weight: var(--fw-regular); /* from legacy --font-body-1-light */
-  color: var(--c-font-light); /* from legacy --font-body-1-light */
+  z-index: 9001;
+  padding: 8px;
   background-color: var(--c-bg-dark);
   box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.13), 0 3px 6px 0 rgba(0, 0, 0, 0.23);
-  padding: 8px;
+  color: var(--c-font-light); /* from legacy --font-body-1-light */
   cursor: pointer;
-  z-index: 9001;
+  font-size: var(--fs-body-1); /* from legacy --font-body-1-light */
+  font-weight: var(--fw-regular); /* from legacy --font-body-1-light */
 }
 
 .arrow {
   position: absolute;
   bottom: 0;
   left: 0;
-  margin-bottom: -0.5em;
   width: 1em;
   height: 0.5em;
+  margin-bottom: -0.5em;
 
   &::before {
-    border-width: 0.5em 0.5em 0 0.5em;
-    content: '';
-    margin: auto;
     display: block;
     width: 0;
     height: 0;
+    border-width: 0.5em 0.5em 0 0.5em;
     border-style: solid;
     border-color: var(--c-bg-dark) transparent transparent transparent;
+    margin: auto;
+    content: '';
   }
 }
 
 .arrow.bottom {
   top: 0;
   left: 0;
-  margin-top: -0.5em;
   width: 1em;
   height: 0.5em;
+  margin-top: -0.5em;
 
   &::before {
     border-width: 0 0.5em 0.5em 0.5em;
@@ -48,9 +48,9 @@
 .arrow.right {
   top: 0;
   left: 0;
-  margin-left: -0.5em;
-  height: 1em;
   width: 0.5em;
+  height: 1em;
+  margin-left: -0.5em;
 
   &::before {
     border-width: 0.5em 0.5em 0.5em 0;
@@ -61,9 +61,9 @@
 .arrow.left {
   top: 0;
   right: 0;
-  margin-right: -0.5em;
-  height: 1em;
   width: 0.5em;
+  height: 1em;
+  margin-right: -0.5em;
 
   &::before {
     border-width: 0.5em 0 0.5em 0.5em;

package/src/tooltips/types.ts

@@ -1,8 +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']
 

package/src/tooltips/usePopper.ts

@@ -1,12 +1,12 @@
-import { useRef, useLayoutEffect } from 'react'
+import { useLayoutEffect, useRef } from 'react'
 import { createPopper } from '@popperjs/core'
 
 import type {
+  HandleStateUpdate,
+  PopperModifer,
+  PopperOptions,
   UsePopperOptions,
   UsePopperResult,
-  PopperOptions,
-  PopperModifer,
-  HandleStateUpdate,
 } from './types'
 
 const DISABLED_APPLY_STYLES_MODIFIER = {

package/src/tooltips/useTooltip.ts

@@ -1,10 +1,11 @@
-import { useState, useCallback, useRef } from 'react'
+import { useCallback, useRef, useState } from 'react'
 import uniqueId from 'lodash/uniqueId'
-import { usePopper } from './usePopper'
+
 import * as Styles from './styles'
+import { usePopper } from './usePopper'
 
 import type { CSSProperties } from 'react'
-import type { UseTooltipOptions, UseTooltipResult, Placement } from './types'
+import type { Placement, UseTooltipOptions, UseTooltipResult } from './types'
 
 interface TooltipState {
   placement: Placement | null

package/src/ui-style-constants/typography.ts

@@ -1,4 +1,5 @@
 import { css } from 'styled-components'
+
 import { COLORS } from '../helix-design-system'
 
 // Font Sizes

package/vite.config.mts

@@ -1,23 +1,29 @@
 import path from 'path'
-import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
-import postCssImport from 'postcss-import'
+import lostCss from 'lost'
 import postCssApply from 'postcss-apply'
 import postColorModFunction from 'postcss-color-mod-function'
+import postCssImport from 'postcss-import'
 import postCssPresetEnv from 'postcss-preset-env'
-import lostCss from 'lost'
+import { defineConfig } from 'vite'
+
+import { cssModuleSideEffect } from './cssModuleSideEffect'
 
 export default defineConfig({
   build: {
     // Relative to the root
     ssr: 'src/index.ts',
     outDir: 'lib',
-    // do not delete the outdir, typescript types might live there and we dont want to delete them
+    // Do not delete the outdir, typescript types might live there and we don't want to delete them
     emptyOutDir: false,
     commonjsOptions: {
       transformMixedEsModules: true,
       esmExternals: true,
     },
+    rollupOptions: {
+      // Only @opentrons/shared-data is external; step-generation will be bundled!
+      external: ['@opentrons/shared-data'],
+    },
   },
   plugins: [
     react({
@@ -27,6 +33,7 @@ export default defineConfig({
         configFile: true,
       },
     }),
+    cssModuleSideEffect(),
   ],
   optimizeDeps: {
     esbuildOptions: {

package/lib/atoms/ListButton/ListButtonChildren/ListButtonRadioButton.d.ts

@@ -1,14 +0,0 @@
-import type { ChangeEventHandler } from 'react';
-import type { StyleProps } from '../../../primitives';
-interface ListButtonRadioButtonProps extends StyleProps {
-    buttonText: string;
-    buttonValue: string | number;
-    onChange: ChangeEventHandler<HTMLInputElement>;
-    setNoHover?: () => void;
-    setHovered?: () => void;
-    disabled?: boolean;
-    isSelected?: boolean;
-    id?: string;
-}
-export declare function ListButtonRadioButton(props: ListButtonRadioButtonProps): JSX.Element;
-export {};

package/lib/controls/LabeledToggle.d.ts

@@ -1,11 +0,0 @@
-import type { ReactNode } from 'react';
-export interface LabeledToggleProps {
-    label: string;
-    toggledOn: boolean;
-    disabled?: boolean;
-    children?: ReactNode;
-    onClick: () => unknown;
-    /** optional data test id for the container */
-    'data-test'?: string;
-}
-export declare function LabeledToggle(props: LabeledToggleProps): JSX.Element;

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

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

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

@@ -1,8 +0,0 @@
-import type { CutoutId, DeckDefinition } from '@opentrons/shared-data';
-interface EmptyConfigFixtureProps {
-    deckDefinition: DeckDefinition;
-    fixtureLocation: CutoutId;
-    handleClickAdd: (fixtureLocation: CutoutId) => void;
-}
-export declare function EmptyConfigFixture(props: EmptyConfigFixtureProps): JSX.Element;
-export {};

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

@@ -1,11 +0,0 @@
-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/HeaterShakerFixture.d.ts

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

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

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

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

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

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

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

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

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

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

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

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

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