@opentrons/components 0.1.6-alpha.2 → 0.1.6-alpha.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (373) hide show
  1. package/Makefile +5 -1
  2. package/package.json +6 -7
  3. package/src/__mocks__/file.js +10 -0
  4. package/src/alerts/AlertItem.stories.tsx +49 -0
  5. package/src/alerts/AlertItem.tsx +85 -0
  6. package/src/alerts/index.ts +3 -0
  7. package/src/atoms/Checkbox/Checkbox.stories.tsx +24 -0
  8. package/src/atoms/Checkbox/index.tsx +127 -0
  9. package/src/atoms/CheckboxField/CheckboxField.stories.tsx +30 -0
  10. package/src/atoms/CheckboxField/index.tsx +171 -0
  11. package/src/atoms/Chip/Chip.stories.tsx +59 -0
  12. package/src/atoms/Chip/index.tsx +172 -0
  13. package/src/atoms/Divider/index.tsx +15 -0
  14. package/src/atoms/InputField/InputField.stories.tsx +77 -0
  15. package/src/atoms/InputField/index.tsx +383 -0
  16. package/src/atoms/ListButton/ListButton.stories.tsx +133 -0
  17. package/src/atoms/ListButton/ListButtonChildren/ListButtonAccordion.tsx +65 -0
  18. package/src/atoms/ListButton/ListButtonChildren/ListButtonAccordionContainer.tsx +23 -0
  19. package/src/atoms/ListButton/ListButtonChildren/ListButtonRadioButton.tsx +108 -0
  20. package/src/atoms/ListButton/ListButtonChildren/index.ts +3 -0
  21. package/src/atoms/ListButton/index.tsx +72 -0
  22. package/src/atoms/ListItem/ListItem.stories.tsx +96 -0
  23. package/src/atoms/ListItem/ListItemChildren/ListItemCustomize.tsx +78 -0
  24. package/src/atoms/ListItem/ListItemChildren/ListItemDescriptor.tsx +42 -0
  25. package/src/atoms/ListItem/ListItemChildren/index.ts +2 -0
  26. package/src/atoms/ListItem/index.tsx +89 -0
  27. package/src/atoms/MenuList/MenuItem.stories.tsx +20 -0
  28. package/src/atoms/MenuList/MenuItem.tsx +55 -0
  29. package/src/atoms/MenuList/MenuList.stories.tsx +31 -0
  30. package/src/atoms/MenuList/OverflowBtn.stories.tsx +17 -0
  31. package/src/atoms/MenuList/OverflowBtn.tsx +76 -0
  32. package/src/atoms/MenuList/index.tsx +50 -0
  33. package/src/atoms/Snackbar/Snackbar.stories.tsx +67 -0
  34. package/src/atoms/Snackbar/index.tsx +91 -0
  35. package/src/atoms/StepMeter/index.tsx +53 -0
  36. package/src/atoms/StyledText/LegacyStyledText.stories.tsx +106 -0
  37. package/src/atoms/StyledText/LegacyStyledText.tsx +95 -0
  38. package/src/atoms/StyledText/StyledText.stories.tsx +46 -0
  39. package/src/atoms/StyledText/StyledText.tsx +323 -0
  40. package/src/atoms/StyledText/index.ts +2 -0
  41. package/src/atoms/Tag/Tag.stories.tsx +48 -0
  42. package/src/atoms/Tag/index.tsx +116 -0
  43. package/src/atoms/Toast/ODDToast.stories.tsx +68 -0
  44. package/src/atoms/Toast/Toast.stories.tsx +55 -0
  45. package/src/atoms/Toast/index.tsx +439 -0
  46. package/src/atoms/ToggleGroup/ToggleGroup.stories.tsx +39 -0
  47. package/src/atoms/ToggleGroup/index.tsx +91 -0
  48. package/src/atoms/Tooltip/Tooltip.stories.tsx +99 -0
  49. package/src/atoms/Tooltip/index.tsx +38 -0
  50. package/src/atoms/buttons/AlertPrimaryButton.tsx +26 -0
  51. package/src/atoms/buttons/AltPrimaryButton.tsx +31 -0
  52. package/src/atoms/buttons/EmptySelectorButton.stories.tsx +36 -0
  53. package/src/atoms/buttons/EmptySelectorButton.tsx +83 -0
  54. package/src/atoms/buttons/LargeButton.stories.tsx +99 -0
  55. package/src/atoms/buttons/LargeButton.tsx +320 -0
  56. package/src/atoms/buttons/PrimaryButton.tsx +36 -0
  57. package/src/atoms/buttons/RadioButton.stories.tsx +35 -0
  58. package/src/atoms/buttons/RadioButton.tsx +217 -0
  59. package/src/atoms/buttons/SecondaryButton.tsx +62 -0
  60. package/src/atoms/buttons/buttons.stories.tsx +78 -0
  61. package/src/atoms/buttons/index.ts +6 -0
  62. package/src/atoms/index.ts +20 -0
  63. package/src/barrel.ts +10 -0
  64. package/src/buttons/Button.tsx +96 -0
  65. package/src/buttons/DeprecatedPrimaryButton.tsx +24 -0
  66. package/src/buttons/FlatButton.tsx +21 -0
  67. package/src/buttons/IconButton.tsx +37 -0
  68. package/src/buttons/OutlineButton.tsx +24 -0
  69. package/src/buttons/index.ts +7 -0
  70. package/src/controls/ControlInfo.tsx +13 -0
  71. package/src/controls/LabeledButton.tsx +28 -0
  72. package/src/controls/LabeledCheckbox.tsx +35 -0
  73. package/src/controls/LabeledControl.tsx +24 -0
  74. package/src/controls/LabeledRadioGroup.tsx +27 -0
  75. package/src/controls/LabeledSelect.tsx +34 -0
  76. package/src/controls/LabeledToggle.tsx +35 -0
  77. package/src/controls/StackedLabeledControl.tsx +28 -0
  78. package/src/controls/ToggleButton.tsx +25 -0
  79. package/src/controls/index.ts +10 -0
  80. package/src/forms/DeprecatedCheckboxField.stories.tsx +31 -0
  81. package/src/forms/DeprecatedCheckboxField.tsx +94 -0
  82. package/src/forms/DropdownField.stories.tsx +44 -0
  83. package/src/forms/DropdownField.tsx +106 -0
  84. package/src/forms/FormGroup.stories.tsx +31 -0
  85. package/src/forms/FormGroup.tsx +53 -0
  86. package/src/forms/InputField.stories.tsx +41 -0
  87. package/src/forms/LegacyInputField.tsx +123 -0
  88. package/src/forms/RadioGroup.stories.tsx +44 -0
  89. package/src/forms/RadioGroup.tsx +87 -0
  90. package/src/forms/Select.stories.tsx +117 -0
  91. package/src/forms/Select.tsx +132 -0
  92. package/src/forms/SelectField.tsx +94 -0
  93. package/src/forms/ToggleField.stories.tsx +31 -0
  94. package/src/forms/ToggleField.tsx +59 -0
  95. package/src/forms/index.ts +8 -0
  96. package/src/hardware-sim/BaseDeck/BaseDeck.stories.tsx +94 -0
  97. package/src/hardware-sim/BaseDeck/BaseDeck.tsx +423 -0
  98. package/src/hardware-sim/BaseDeck/SingleSlotFixture.tsx +199 -0
  99. package/src/hardware-sim/BaseDeck/SlotBase.tsx +5 -0
  100. package/src/hardware-sim/BaseDeck/SlotClip.tsx +15 -0
  101. package/src/hardware-sim/BaseDeck/StagingAreaFixture.tsx +114 -0
  102. package/src/hardware-sim/BaseDeck/WasteChuteFixture.tsx +114 -0
  103. package/src/hardware-sim/BaseDeck/WasteChuteStagingAreaFixture.tsx +68 -0
  104. package/src/hardware-sim/BaseDeck/__fixtures__/index.ts +165 -0
  105. package/src/hardware-sim/BaseDeck/index.ts +5 -0
  106. package/src/hardware-sim/BaseDeck/something.test.tsx +7 -0
  107. package/src/hardware-sim/Deck/DeckFromLayers.tsx +58 -0
  108. package/src/hardware-sim/Deck/FlexTrash.tsx +128 -0
  109. package/src/hardware-sim/Deck/MoveLabwareOnDeck.stories.tsx +97 -0
  110. package/src/hardware-sim/Deck/MoveLabwareOnDeck.tsx +251 -0
  111. package/src/hardware-sim/Deck/OT2Layers.tsx +153 -0
  112. package/src/hardware-sim/Deck/RobotCoordsForeignDiv.tsx +46 -0
  113. package/src/hardware-sim/Deck/RobotCoordsForeignObject.tsx +42 -0
  114. package/src/hardware-sim/Deck/RobotCoordsText.tsx +32 -0
  115. package/src/hardware-sim/Deck/RobotWorkSpace.tsx +90 -0
  116. package/src/hardware-sim/Deck/SlotLabels.tsx +111 -0
  117. package/src/hardware-sim/Deck/__mocks__/getDeckDefinitions.ts +29 -0
  118. package/src/hardware-sim/Deck/constants.ts +12 -0
  119. package/src/hardware-sim/Deck/index.tsx +8 -0
  120. package/src/hardware-sim/DeckConfigurator/AbsorbanceReaderFixture.tsx +91 -0
  121. package/src/hardware-sim/DeckConfigurator/DeckConfigurator.stories.tsx +110 -0
  122. package/src/hardware-sim/DeckConfigurator/EmptyConfigFixture.tsx +131 -0
  123. package/src/hardware-sim/DeckConfigurator/HeaterShakerFixture.tsx +102 -0
  124. package/src/hardware-sim/DeckConfigurator/MagneticBlockFixture.tsx +130 -0
  125. package/src/hardware-sim/DeckConfigurator/StagingAreaConfigFixture.tsx +89 -0
  126. package/src/hardware-sim/DeckConfigurator/StaticFixture.tsx +54 -0
  127. package/src/hardware-sim/DeckConfigurator/TemperatureModuleFixture.tsx +103 -0
  128. package/src/hardware-sim/DeckConfigurator/ThermocyclerFixture.tsx +89 -0
  129. package/src/hardware-sim/DeckConfigurator/TrashBinConfigFixture.tsx +99 -0
  130. package/src/hardware-sim/DeckConfigurator/WasteChuteConfigFixture.tsx +96 -0
  131. package/src/hardware-sim/DeckConfigurator/constants.ts +81 -0
  132. package/src/hardware-sim/DeckConfigurator/index.tsx +285 -0
  133. package/src/hardware-sim/DeckSlotLocation/index.tsx +88 -0
  134. package/src/hardware-sim/Labware/Labware.tsx +173 -0
  135. package/src/hardware-sim/Labware/LabwareAdapter/Opentrons96DeepWellAdapter.tsx +23 -0
  136. package/src/hardware-sim/Labware/LabwareAdapter/Opentrons96FlatBottomAdapter.tsx +7 -0
  137. package/src/hardware-sim/Labware/LabwareAdapter/OpentronsAluminumFlatBottomPlate.tsx +13 -0
  138. package/src/hardware-sim/Labware/LabwareAdapter/OpentronsAutoclavableDeckRiser.tsx +100 -0
  139. package/src/hardware-sim/Labware/LabwareAdapter/OpentronsFlex96TiprackAdapter.tsx +13 -0
  140. package/src/hardware-sim/Labware/LabwareAdapter/OpentronsToughPCRAutoSealingLid.tsx +83 -0
  141. package/src/hardware-sim/Labware/LabwareAdapter/OpentronsUniversalFlatAdapter.tsx +13 -0
  142. package/src/hardware-sim/Labware/LabwareAdapter/index.tsx +73 -0
  143. package/src/hardware-sim/Labware/LabwareRender.stories.tsx +96 -0
  144. package/src/hardware-sim/Labware/LabwareRender.tsx +173 -0
  145. package/src/hardware-sim/Labware/LabwareStackRender.tsx +272 -0
  146. package/src/hardware-sim/Labware/index.ts +6 -0
  147. package/src/hardware-sim/Labware/labwareInternals/FilledWells.tsx +39 -0
  148. package/src/hardware-sim/Labware/labwareInternals/LabwareOutline.tsx +133 -0
  149. package/src/hardware-sim/Labware/labwareInternals/LabwareWellLabels.tsx +118 -0
  150. package/src/hardware-sim/Labware/labwareInternals/StaticLabware.tsx +121 -0
  151. package/src/hardware-sim/Labware/labwareInternals/StrokedWells.tsx +38 -0
  152. package/src/hardware-sim/Labware/labwareInternals/StyledWells.tsx +77 -0
  153. package/src/hardware-sim/Labware/labwareInternals/Well.tsx +74 -0
  154. package/src/hardware-sim/Labware/labwareInternals/WellLabels.tsx +121 -0
  155. package/src/hardware-sim/Labware/labwareInternals/index.ts +8 -0
  156. package/src/hardware-sim/Labware/labwareInternals/types.ts +18 -0
  157. package/src/hardware-sim/Module/HeaterShaker.tsx +83 -0
  158. package/src/hardware-sim/Module/MagneticBlock.tsx +49 -0
  159. package/src/hardware-sim/Module/MagneticModule.tsx +51 -0
  160. package/src/hardware-sim/Module/Module.stories.tsx +90 -0
  161. package/src/hardware-sim/Module/ModuleTag.tsx +38 -0
  162. package/src/hardware-sim/Module/PlateReader.tsx +208 -0
  163. package/src/hardware-sim/Module/Temperature.tsx +54 -0
  164. package/src/hardware-sim/Module/Thermocycler/ThermocyclerGEN1.tsx +248 -0
  165. package/src/hardware-sim/Module/Thermocycler/ThermocyclerGEN2.tsx +286 -0
  166. package/src/hardware-sim/Module/Thermocycler/index.tsx +49 -0
  167. package/src/hardware-sim/Module/index.tsx +227 -0
  168. package/src/hardware-sim/Pipette/EightEmanatingNozzles.tsx +23 -0
  169. package/src/hardware-sim/Pipette/EmanatingNozzle.tsx +52 -0
  170. package/src/hardware-sim/Pipette/PipetteRender.stories.tsx +71 -0
  171. package/src/hardware-sim/Pipette/PipetteRender.tsx +92 -0
  172. package/src/hardware-sim/Pipette/constants.ts +10 -0
  173. package/src/hardware-sim/Pipette/index.ts +1 -0
  174. package/src/hardware-sim/ProtocolDeck/LabwareInfo.tsx +68 -0
  175. package/src/hardware-sim/ProtocolDeck/ProtocolDeck.stories.tsx +25 -0
  176. package/src/hardware-sim/ProtocolDeck/__fixtures__/analysis_QIAseqFX24xv4_8.json +47145 -0
  177. package/src/hardware-sim/ProtocolDeck/index.tsx +174 -0
  178. package/src/hardware-sim/ProtocolDeck/types.ts +6 -0
  179. package/src/hardware-sim/ProtocolDeck/utils/getInitiallyLoadedLabwareByAdapter.ts +33 -0
  180. package/src/hardware-sim/ProtocolDeck/utils/getLabwareInSlots.ts +155 -0
  181. package/src/hardware-sim/ProtocolDeck/utils/getLabwareInfoByLiquidId.ts +42 -0
  182. package/src/hardware-sim/ProtocolDeck/utils/getModulesInSlots.ts +129 -0
  183. package/src/hardware-sim/ProtocolDeck/utils/getStandardDeckViewLayerBlockList.ts +29 -0
  184. package/src/hardware-sim/ProtocolDeck/utils/getWellFillFromLabwareId.ts +30 -0
  185. package/src/hardware-sim/ProtocolDeck/utils/index.ts +3 -0
  186. package/src/hardware-sim/RobotCoordinateSpace/RobotCoordinateSpace.tsx +28 -0
  187. package/src/hardware-sim/RobotCoordinateSpace/RobotCoordinateSpaceWithRef.tsx +52 -0
  188. package/src/hardware-sim/RobotCoordinateSpace/index.ts +2 -0
  189. package/src/hardware-sim/index.ts +11 -0
  190. package/src/hardware-sim/utils.ts +18 -0
  191. package/src/helix-design-system/borders.ts +32 -0
  192. package/src/helix-design-system/colors.ts +100 -0
  193. package/src/helix-design-system/index.ts +4 -0
  194. package/src/helix-design-system/product/index.ts +1 -0
  195. package/src/helix-design-system/product/typography.ts +151 -0
  196. package/src/helix-design-system/style.ts +2 -0
  197. package/src/hooks/index.ts +15 -0
  198. package/src/hooks/useConditionalConfirm.ts +70 -0
  199. package/src/hooks/useDrag.ts +90 -0
  200. package/src/hooks/useIdle.ts +68 -0
  201. package/src/hooks/useInterval.ts +38 -0
  202. package/src/hooks/useLongPress.ts +83 -0
  203. package/src/hooks/useMenuHandleClickOutside.tsx +46 -0
  204. package/src/hooks/useMountEffect.ts +12 -0
  205. package/src/hooks/usePrevious.ts +19 -0
  206. package/src/hooks/useScrolling.ts +33 -0
  207. package/src/hooks/useSelectDeckLocation/SelectDeckLocation.stories.tsx +55 -0
  208. package/src/hooks/useSelectDeckLocation/index.tsx +331 -0
  209. package/src/hooks/useSwipe.ts +86 -0
  210. package/src/hooks/useTimeout.ts +33 -0
  211. package/src/hooks/useToggle.ts +27 -0
  212. package/src/icons/Icon.stories.tsx +37 -0
  213. package/src/icons/Icon.tsx +79 -0
  214. package/src/icons/IconList.stories.tsx +108 -0
  215. package/src/icons/ModuleIcon.tsx +48 -0
  216. package/src/icons/NotificationIcon.tsx +41 -0
  217. package/src/icons/icon-data.ts +821 -0
  218. package/src/icons/index.ts +6 -0
  219. package/src/images/index.ts +1 -0
  220. package/src/images/labware/index.ts +1 -0
  221. package/src/images/labware/measurement-guide/images/depth/depth-plate-flat@3x.png +0 -0
  222. package/src/images/labware/measurement-guide/images/depth/depth-plate-round@3x.png +0 -0
  223. package/src/images/labware/measurement-guide/images/depth/depth-plate-v@3x.png +0 -0
  224. package/src/images/labware/measurement-guide/images/depth/depth-reservoir-and-tubes-flat@3x.png +0 -0
  225. package/src/images/labware/measurement-guide/images/depth/depth-reservoir-and-tubes-round@3x.png +0 -0
  226. package/src/images/labware/measurement-guide/images/depth/depth-reservoir-and-tubes-v@3x.png +0 -0
  227. package/src/images/labware/measurement-guide/images/depth/length-tip-rack@3x.png +0 -0
  228. package/src/images/labware/measurement-guide/images/dimensions/footprint@3x.png +0 -0
  229. package/src/images/labware/measurement-guide/images/dimensions/height-alum-block-plate@3x.png +0 -0
  230. package/src/images/labware/measurement-guide/images/dimensions/height-alum-block-tubes@3x.png +0 -0
  231. package/src/images/labware/measurement-guide/images/dimensions/height-plate-and-reservoir@3x.png +0 -0
  232. package/src/images/labware/measurement-guide/images/dimensions/height-tip-rack@3x.png +0 -0
  233. package/src/images/labware/measurement-guide/images/dimensions/height-tube-rack-irregular@3x.png +0 -0
  234. package/src/images/labware/measurement-guide/images/dimensions/height-tube-rack@3x.png +0 -0
  235. package/src/images/labware/measurement-guide/images/offset/offset-reservoir@3x.png +0 -0
  236. package/src/images/labware/measurement-guide/images/offset/offset-well-circular@3x.png +0 -0
  237. package/src/images/labware/measurement-guide/images/offset/offset-well-rectangular@3x.png +0 -0
  238. package/src/images/labware/measurement-guide/images/shape/shape-circular@3x.png +0 -0
  239. package/src/images/labware/measurement-guide/images/shape/shape-rectangular@3x.png +0 -0
  240. package/src/images/labware/measurement-guide/images/spacing/spacing-reservoir-multi-row@3x.png +0 -0
  241. package/src/images/labware/measurement-guide/images/spacing/spacing-reservoir@3x.png +0 -0
  242. package/src/images/labware/measurement-guide/images/spacing/spacing-well-circular@3x.png +0 -0
  243. package/src/images/labware/measurement-guide/images/spacing/spacing-well-rectangular@3x.png +0 -0
  244. package/src/images/labware/measurement-guide/index.ts +272 -0
  245. package/src/index.ts +2 -0
  246. package/src/instrument/InstrumentDiagram.stories.tsx +42 -0
  247. package/src/instrument/InstrumentDiagram.tsx +58 -0
  248. package/src/instrument/InstrumentGroup.stories.tsx +88 -0
  249. package/src/instrument/InstrumentGroup.tsx +35 -0
  250. package/src/instrument/InstrumentInfo.tsx +107 -0
  251. package/src/instrument/PipetteSelect.stories.tsx +40 -0
  252. package/src/instrument/PipetteSelect.tsx +170 -0
  253. package/src/instrument/eight-channel-flex.png +0 -0
  254. package/src/instrument/index.ts +4 -0
  255. package/src/instrument/multi-channel_GEN1_800px.png +0 -0
  256. package/src/instrument/multi-channel_GEN2_800px.png +0 -0
  257. package/src/instrument/ninety-six-channel-gen1.png +0 -0
  258. package/src/instrument/pipetteGEN2Multi.png +0 -0
  259. package/src/instrument/pipetteGEN2Single.png +0 -0
  260. package/src/instrument/pipetteMulti.png +0 -0
  261. package/src/instrument/pipetteSingle.png +0 -0
  262. package/src/instrument/single-channel-flex.png +0 -0
  263. package/src/instrument/single-channel_GEN2_800px.png +0 -0
  264. package/src/instrument/single_channel_GEN1_800px.png +0 -0
  265. package/src/interaction-enhancers/ClickOutside.ts +57 -0
  266. package/src/interaction-enhancers/HandleKeypress.tsx +69 -0
  267. package/src/interaction-enhancers/index.ts +4 -0
  268. package/src/interaction-enhancers/useHover.ts +84 -0
  269. package/src/interaction-enhancers/useOnClickOutside.ts +42 -0
  270. package/src/legacy-hardware-sim/LabwareNameOverlay.tsx +22 -0
  271. package/src/legacy-hardware-sim/ModuleItem.tsx +145 -0
  272. package/src/legacy-hardware-sim/index.ts +2 -0
  273. package/src/lists/SidePanelGroup.tsx +48 -0
  274. package/src/lists/TitledList.tsx +155 -0
  275. package/src/lists/index.ts +3 -0
  276. package/src/modals/AlertModal.tsx +89 -0
  277. package/src/modals/ContinueModal.tsx +32 -0
  278. package/src/modals/LegacyModal.tsx +59 -0
  279. package/src/modals/Modal.stories.tsx +52 -0
  280. package/src/modals/Modal.tsx +96 -0
  281. package/src/modals/ModalHeader.tsx +100 -0
  282. package/src/modals/ModalShell.tsx +155 -0
  283. package/src/modals/Overlay.tsx +38 -0
  284. package/src/modals/SpinnerModal.tsx +35 -0
  285. package/src/modals/SpinnerModalPage.tsx +30 -0
  286. package/src/modals/index.ts +10 -0
  287. package/src/molecules/Banner/Banner.stories.tsx +41 -0
  288. package/src/molecules/Banner/index.tsx +147 -0
  289. package/src/molecules/DeckInfoLabel/DeckInfoLabel.stories.tsx +65 -0
  290. package/src/molecules/DeckInfoLabel/index.tsx +95 -0
  291. package/src/molecules/DeckLabel/DeckLabel.stories.tsx +31 -0
  292. package/src/molecules/DeckLabel/index.tsx +80 -0
  293. package/src/molecules/DropdownMenu/DropdownMenu.stories.tsx +30 -0
  294. package/src/molecules/DropdownMenu/index.tsx +343 -0
  295. package/src/molecules/InfoScreen/InfoScreen.stories.tsx +50 -0
  296. package/src/molecules/InfoScreen/index.tsx +54 -0
  297. package/src/molecules/LiquidIcon/LiquidIcon.stories.tsx +53 -0
  298. package/src/molecules/LiquidIcon/index.tsx +68 -0
  299. package/src/molecules/ParametersTable/ParametersTable.stories.tsx +172 -0
  300. package/src/molecules/ParametersTable/index.tsx +198 -0
  301. package/src/molecules/Tabs/Tabs.stories.tsx +74 -0
  302. package/src/molecules/Tabs/index.tsx +94 -0
  303. package/src/molecules/index.ts +8 -0
  304. package/src/nav/SidePanel.stories.tsx +29 -0
  305. package/src/nav/SidePanel.tsx +21 -0
  306. package/src/nav/index.ts +2 -0
  307. package/src/organisms/DeckLabelSet/DeckLabelSet.stories.tsx +46 -0
  308. package/src/organisms/DeckLabelSet/index.tsx +69 -0
  309. package/src/organisms/EndUserAgreementFooter/index.tsx +49 -0
  310. package/src/organisms/Toolbox/Toolbox.stories.tsx +23 -0
  311. package/src/organisms/Toolbox/index.tsx +160 -0
  312. package/src/organisms/index.ts +3 -0
  313. package/src/primitives/Box.stories.tsx +25 -0
  314. package/src/primitives/Box.tsx +17 -0
  315. package/src/primitives/Btn.stories.tsx +105 -0
  316. package/src/primitives/Btn.tsx +266 -0
  317. package/src/primitives/Flex.stories.tsx +50 -0
  318. package/src/primitives/Flex.tsx +17 -0
  319. package/src/primitives/ForeignObject.tsx +70 -0
  320. package/src/primitives/Link.stories.tsx +27 -0
  321. package/src/primitives/Link.tsx +32 -0
  322. package/src/primitives/README.md +188 -0
  323. package/src/primitives/Svg.stories.tsx +36 -0
  324. package/src/primitives/Svg.tsx +68 -0
  325. package/src/primitives/Text.stories.tsx +17 -0
  326. package/src/primitives/Text.tsx +18 -0
  327. package/src/primitives/index.ts +10 -0
  328. package/src/primitives/style-props.ts +197 -0
  329. package/src/primitives/types.ts +120 -0
  330. package/src/robot-types.ts +4 -0
  331. package/src/slotmap/OT2SlotMap.tsx +73 -0
  332. package/src/slotmap/index.ts +1 -0
  333. package/src/structure/Card.stories.tsx +28 -0
  334. package/src/structure/Card.tsx +64 -0
  335. package/src/structure/LabeledValue.stories.tsx +17 -0
  336. package/src/structure/LabeledValue.tsx +31 -0
  337. package/src/structure/Pill.tsx +43 -0
  338. package/src/structure/Splash.stories.tsx +24 -0
  339. package/src/structure/Splash.tsx +22 -0
  340. package/src/structure/TitleBar.stories.tsx +42 -0
  341. package/src/structure/TitleBar.tsx +81 -0
  342. package/src/structure/index.ts +7 -0
  343. package/src/styles/borders.ts +16 -0
  344. package/src/styles/colors.ts +58 -0
  345. package/src/styles/cursor.ts +12 -0
  346. package/src/styles/flexbox.ts +39 -0
  347. package/src/styles/index.ts +8 -0
  348. package/src/styles/layout.ts +31 -0
  349. package/src/styles/position.ts +5 -0
  350. package/src/styles/spacing.ts +11 -0
  351. package/src/styles/typography.ts +90 -0
  352. package/src/testing/utils/index.ts +2 -0
  353. package/src/testing/utils/matchers.ts +31 -0
  354. package/src/testing/utils/renderWithProviders.tsx +53 -0
  355. package/src/tooltips/DeprecatedTooltip.tsx +105 -0
  356. package/src/tooltips/HoverTooltip.tsx +83 -0
  357. package/src/tooltips/LegacyTooltip.stories.tsx +98 -0
  358. package/src/tooltips/LegacyTooltip.tsx +151 -0
  359. package/src/tooltips/constants.ts +28 -0
  360. package/src/tooltips/index.ts +10 -0
  361. package/src/tooltips/styles.ts +20 -0
  362. package/src/tooltips/types.ts +73 -0
  363. package/src/tooltips/useHoverTooltip.ts +47 -0
  364. package/src/tooltips/usePopper.ts +87 -0
  365. package/src/tooltips/useTooltip.ts +100 -0
  366. package/src/ui-style-constants/index.ts +4 -0
  367. package/src/ui-style-constants/responsiveness.ts +15 -0
  368. package/src/ui-style-constants/spacing.ts +18 -0
  369. package/src/ui-style-constants/typography.ts +258 -0
  370. package/src/ui-style-constants/viewport.ts +18 -0
  371. package/src/utils.ts +56 -0
  372. package/{vite.config.ts → vite.config.mts} +2 -0
  373. package/lib/index.mjs +0 -19869
@@ -0,0 +1,18 @@
1
+ import type * as React from 'react'
2
+
3
+ export interface WellMouseEvent {
4
+ wellName: string
5
+ event: React.MouseEvent
6
+ }
7
+
8
+ // wellName to CSS color, eg {'A1': '#123456'}
9
+ export type WellFill = Record<string, string>
10
+ export type WellStroke = WellFill
11
+
12
+ // Use this like a Set!
13
+ export type WellGroup = Record<string, null>
14
+
15
+ export interface HighlightedWellLabels {
16
+ wells: string[]
17
+ color?: string
18
+ }
@@ -0,0 +1,83 @@
1
+ import { COLORS } from '../../helix-design-system'
2
+
3
+ export interface HeaterShakerVizProps {
4
+ targetTemp: number | null
5
+ }
6
+
7
+ export function HeaterShaker(props: HeaterShakerVizProps): JSX.Element {
8
+ const { targetTemp } = props
9
+ let ledLightColor: string = COLORS.white
10
+ if (targetTemp != null) ledLightColor = COLORS.red30
11
+
12
+ return (
13
+ <g id="heaterShaker">
14
+ <g id="moduleBaseFill">
15
+ <path
16
+ d="M 28.312 87.55 c 0.882 0 1.078 -0.7 1.078 -1.4 v -3.4 c 0 -0.2 -0.196 -0.5 -0.49 -0.5 h -5.096 c -0.196 0 -0.49 -0.2 -0.49 -0.5 v -4.5 c 0 -0.2 -0.196 -0.5 -0.49 -0.5 h -5.586 c -0.98 0 -1.862 -0.8 -1.862 -1.9 V 14.55 c 0 -1 0.784 -1.9 1.862 -1.9 h 5.586 c 0.196 0 0.49 -0.2 0.49 -0.5 V 7.75 c 0 -0.2 0.196 -0.5 0.49 -0.5 H 28.9 c 0.196 0 0.49 -0.2 0.49 -0.5 V 3.45 c 0 -0.8 -0.392 -1.4 -1.078 -1.4 s -23.422 0 -23.422 0 v 85.5 C 4.89 87.55 27.43 87.55 28.312 87.55 z"
17
+ style={{ fill: '#E6E6E6' }}
18
+ ></path>
19
+ </g>
20
+ <g id="moduleOutline">
21
+ <path d="M 149.342 0.05 v 89.6 H 5.478 V 0.05 H 149.342 M 150.322 -1.05 H 4.4 v 91.7 h 145.922 V -1.05 L 150.322 -1.05 z"></path>
22
+ </g>
23
+ <g id="moduleBaseInnerWalls">
24
+ <path d="M 149.832 88.05 H 147.48 v -1.4 H 29.88 c -0.196 1.2 -1.176 1.4 -1.568 1.4 H 4.89 v -1 h 23.324 c 0.294 0 0.686 -0.1 0.686 -0.9 v -0.5 h 119.56 v 1.4 h 1.372 V 88.05 z"></path>
25
+ <path d="M 148.46 3.95 H 28.9 V 3.45 c 0 -0.8 -0.294 -0.9 -0.686 -0.9 H 4.89 v -1 h 23.324 c 0.392 0 1.372 0.1 1.568 1.4 h 117.6 V 1.55 h 2.352 v 1 H 148.46 V 3.95 z"></path>
26
+ </g>
27
+ <g id="statusFill">
28
+ <path
29
+ d="M 9.104 39.25 c 0 -1.1 0.882 -2 1.96 -2 s 1.96 0.9 1.96 2 v 11.2 c 0 1.1 -0.882 2 -1.96 2 s -1.96 -0.9 -1.96 -2 V 39.25 z"
30
+ style={{ fill: ledLightColor }}
31
+ ></path>
32
+ </g>
33
+ <g id="statusOutline">
34
+ <path d="M 11.064 52.65 H 10.966 c -1.176 0 -2.156 -1 -2.156 -2.2 V 39.15 c 0 -1.2 0.98 -2.2 2.156 -2.2 h 0.098 C 12.24 36.95 13.22 37.95 13.22 39.15 v 11.3 C 13.22 51.65 12.24 52.65 11.064 52.65 z M 10.966 37.45 c -0.882 0 -1.666 0.8 -1.666 1.7 v 11.3 c 0 1 0.784 1.7 1.666 1.7 h 0.098 c 0.98 0 1.666 -0.8 1.666 -1.7 V 39.15 c 0 -1 -0.784 -1.7 -1.666 -1.7 H 10.966 z"></path>
35
+ </g>
36
+ <g id="moduleMidFill">
37
+ <path
38
+ d="M 16.258 90.15 L 12.828 84.95 c -0.098 -0.1 -0.098 -0.2 -0.098 -0.3 V 4.95 c 0 -0.1 0 -0.2 0.098 -0.3 l 3.43 -5.2 h 131.516 l 3.43 5.2 c 0.098 0.1 0.098 0.2 0.098 0.3 v 79.7 c 0 0.1 0 0.2 -0.098 0.3 l -3.43 5.2 H 16.258"
39
+ style={{ fill: '#E6E6E6' }}
40
+ ></path>
41
+ </g>
42
+ <g id="moduleMidOutline">
43
+ <path d="M 147.48 0.05 l 3.234 5 v 79.7 l -3.234 5 H 16.454 l -3.234 -5 V 4.95 l 3.234 -4.9 L 147.48 0.05 M 147.97 -1.05 H 15.964 L 12.436 4.35 C 12.338 4.55 12.24 4.75 12.24 4.95 v 79.7 c 0 0.2 0.098 0.4 0.196 0.6 l 3.528 5.4 h 132.104 l 3.528 -5.4 c 0.098 -0.2 0.196 -0.4 0.196 -0.6 V 4.95 c 0 -0.2 -0.098 -0.4 -0.196 -0.6 L 147.97 -1.05 L 147.97 -1.05 z"></path>
44
+ </g>
45
+ <g id="plateBottomFill">
46
+ <path
47
+ d="M 52.518 5.45 c -0.882 0 -1.666 0.6 -1.862 1.6 c -0.392 1.7 -1.862 2.9 -3.626 2.9 s -3.234 -1.2 -3.626 -2.9 c -0.196 -1 -1.078 -1.6 -1.862 -1.6 H 28.312 c -1.568 0 -2.842 1.3 -2.842 2.9 v 72.9 c 0 1.6 1.274 2.9 2.842 2.9 h 13.132 c 0.784 0 1.568 -0.6 1.862 -1.6 c 0.392 -1.7 1.862 -2.9 3.626 -2.9 s 3.234 1.2 3.626 2.9 c 0.196 1 0.98 1.6 1.862 1.6 h 58.996 c 0.882 0 1.666 -0.6 1.862 -1.6 c 0.392 -1.7 1.862 -2.9 3.626 -2.9 c 1.764 0 3.234 1.2 3.626 2.9 c 0.196 1 1.078 1.6 1.862 1.6 H 135.72 c 1.568 0 2.842 -1.3 2.842 -2.9 V 8.35 c 0 -1.6 -1.274 -2.9 -2.842 -2.9 h -13.132 c -0.784 0 -1.568 0.6 -1.862 1.6 c -0.392 1.7 -1.862 2.9 -3.626 2.9 c -1.764 0 -3.234 -1.2 -3.626 -2.9 c -0.196 -1 -0.98 -1.6 -1.862 -1.6 L 52.518 5.45 L 52.518 5.45 z"
48
+ style={{ fill: COLORS.white }}
49
+ ></path>
50
+ </g>
51
+ <g id="plateBottomOutline">
52
+ <path d="M 135.72 84.45 h -13.132 c -0.98 0 -1.764 -0.7 -2.058 -1.7 c -0.392 -1.6 -1.764 -2.7 -3.43 -2.7 s -3.038 1.1 -3.43 2.7 c -0.294 1.1 -1.078 1.7 -2.058 1.7 H 52.518 c -0.98 0 -1.862 -0.7 -2.058 -1.7 c -0.392 -1.6 -1.764 -2.7 -3.43 -2.7 s -3.038 1.1 -3.43 2.7 c -0.294 1 -1.078 1.7 -2.058 1.7 H 28.312 c -1.764 0 -3.136 -1.4 -3.136 -3.2 V 8.35 c 0 -1.8 1.372 -3.2 3.136 -3.2 h 13.132 c 0.98 0 1.764 0.7 2.058 1.7 c 0.392 1.6 1.764 2.7 3.43 2.7 s 3.038 -1.1 3.43 -2.7 c 0.294 -1 0.98 -1.6 1.862 -1.7 l 0 0 h 59.192 c 0.98 0 1.862 0.7 2.058 1.7 c 0.392 1.6 1.764 2.7 3.43 2.7 s 3.038 -1.1 3.43 -2.7 c 0.294 -1 1.078 -1.7 2.058 -1.7 H 135.72 c 1.764 0 3.136 1.4 3.136 3.2 v 72.9 C 138.758 83.05 137.386 84.45 135.72 84.45 z M 117.002 79.55 c 1.862 0 3.43 1.3 3.92 3.1 c 0.196 0.8 0.882 1.4 1.568 1.4 H 135.72 c 1.47 0 2.646 -1.2 2.646 -2.7 v -73 c 0 -1.5 -1.176 -2.7 -2.646 -2.7 h -13.132 c -0.686 0 -1.372 0.6 -1.568 1.4 c -0.49 1.8 -2.058 3.1 -3.92 3.1 s -3.43 -1.3 -3.92 -3.1 c -0.196 -0.8 -0.882 -1.4 -1.666 -1.4 h -58.8 h -0.196 c -0.784 0 -1.372 0.5 -1.666 1.4 c -0.49 1.8 -2.058 3.1 -3.92 3.1 s -3.43 -1.3 -3.92 -3.1 c -0.196 -0.8 -0.882 -1.4 -1.568 -1.4 H 28.312 c -1.47 0 -2.646 1.2 -2.646 2.7 v 72.9 c 0 1.5 1.176 2.7 2.646 2.7 h 13.132 c 0.686 0 1.372 -0.6 1.568 -1.4 c 0.49 -1.8 2.058 -3.1 3.92 -3.1 s 3.43 1.3 3.92 3.1 c 0.196 0.8 0.882 1.4 1.666 1.4 h 58.996 c 0.784 0 1.372 -0.5 1.666 -1.4 C 113.572 80.75 115.14 79.55 117.002 79.55 z"></path>
53
+ </g>
54
+ <g id="plateHolder">
55
+ <path d="M 117.002 1.95 c -2.254 0 -4.018 1.8 -4.018 4.1 s 1.764 4.1 4.018 4.1 s 4.018 -1.8 4.018 -4.1 S 119.256 1.95 117.002 1.95 z M 113.474 6.05 c 0 -0.4 0.098 -0.8 0.196 -1.1 h 6.664 c 0.098 0.4 0.196 0.7 0.196 1.1 c 0 0.2 0 0.4 -0.098 0.6 h -6.958 C 113.572 6.45 113.474 6.25 113.474 6.05 z M 117.002 2.45 c 1.372 0 2.548 0.8 3.136 2 h -6.272 C 114.454 3.25 115.63 2.45 117.002 2.45 z M 117.002 9.65 c -1.568 0 -2.842 -1.1 -3.332 -2.5 h 6.664 C 119.942 8.55 118.57 9.65 117.002 9.65 z M 46.932 1.95 c -2.254 0 -4.018 1.8 -4.018 4.1 s 1.764 4.1 4.018 4.1 s 4.018 -1.8 4.018 -4.1 S 49.186 1.95 46.932 1.95 z M 43.404 6.05 c 0 -0.4 0.098 -0.8 0.196 -1.1 h 6.664 C 50.46 5.25 50.46 5.65 50.46 6.05 c 0 0.2 0 0.4 -0.098 0.6 h -6.958 C 43.502 6.45 43.404 6.25 43.404 6.05 z M 46.932 2.45 c 1.372 0 2.548 0.8 3.136 2 h -6.272 C 44.482 3.25 45.56 2.45 46.932 2.45 z M 46.932 9.65 c -1.568 0 -2.842 -1.1 -3.332 -2.5 h 6.664 C 49.872 8.55 48.5 9.65 46.932 9.65 z M 46.932 79.45 c -2.254 0 -4.018 1.8 -4.018 4.1 s 1.764 4.1 4.018 4.1 s 4.018 -1.8 4.018 -4.1 S 49.186 79.45 46.932 79.45 z M 46.932 79.95 c 1.568 0 2.94 1.1 3.332 2.5 H 43.6 C 44.09 81.05 45.364 79.95 46.932 79.95 z M 50.46 83.55 c 0 0.4 -0.098 0.8 -0.196 1.2 H 43.6 c -0.098 -0.4 -0.196 -0.8 -0.196 -1.2 c 0 -0.2 0 -0.4 0.098 -0.6 H 50.46 C 50.46 83.15 50.46 83.35 50.46 83.55 z M 46.932 87.15 c -1.372 0 -2.548 -0.8 -3.136 -1.9 h 6.174 C 49.48 86.35 48.304 87.15 46.932 87.15 z M 117.002 79.45 c -2.254 0 -4.018 1.8 -4.018 4.1 s 1.764 4.1 4.018 4.1 s 4.018 -1.8 4.018 -4.1 S 119.256 79.45 117.002 79.45 z M 117.002 79.95 c 1.568 0 2.94 1.1 3.332 2.5 h -6.664 C 114.16 81.05 115.434 79.95 117.002 79.95 z M 120.53 83.55 c 0 0.4 -0.098 0.8 -0.196 1.2 h -6.664 c -0.098 -0.4 -0.196 -0.8 -0.196 -1.2 c 0 -0.2 0 -0.4 0.098 -0.6 h 6.958 C 120.53 83.15 120.53 83.35 120.53 83.55 z M 117.002 87.15 c -1.372 0 -2.548 -0.8 -3.136 -1.9 h 6.174 C 119.55 86.35 118.374 87.15 117.002 87.15 z"></path>
56
+ </g>
57
+ <g id="adapterScrew">
58
+ <path
59
+ d="M 82.016 49.45 c -2.548 0 -4.606 -2.1 -4.606 -4.7 s 2.058 -4.7 4.606 -4.7 s 4.606 2.1 4.606 4.7 S 84.466 49.45 82.016 49.45 z M 82.016 40.55 c -2.254 0 -4.116 1.9 -4.116 4.2 s 1.862 4.2 4.116 4.2 c 2.254 0 4.116 -1.9 4.116 -4.2 C 86.132 42.45 84.27 40.55 82.016 40.55 z M 82.016 47.95 c -1.764 0 -3.136 -1.4 -3.136 -3.2 s 1.372 -3.2 3.136 -3.2 s 3.136 1.4 3.136 3.2 C 85.054 46.55 83.682 47.95 82.016 47.95 z M 82.016 42.15 c -1.47 0 -2.646 1.2 -2.646 2.7 s 1.176 2.7 2.646 2.7 s 2.646 -1.2 2.646 -2.7 C 84.564 43.35 83.388 42.15 82.016 42.15 z"
60
+ style={{ fill: '#ADADAD' }}
61
+ ></path>
62
+ </g>
63
+ <g id="leftLatchFill">
64
+ <path
65
+ d="M 18.218 5.55 c 0 -0.4 0.098 -0.8 0.392 -1.2 L 22.824 -1.05 h -6.86 L 12.436 4.35 C 12.338 4.55 12.24 4.75 12.24 4.95 v 79.7 c 0 0.2 0.098 0.4 0.196 0.6 l 3.528 5.4 h 6.86 l -4.214 -5.4 c -0.196 -0.4 -0.392 -0.7 -0.392 -1.2 L 18.218 5.55 L 18.218 5.55 z"
66
+ style={{ fill: '#E6E6E6' }}
67
+ ></path>
68
+ </g>
69
+ <g id="leftLatchOutline">
70
+ <path d="M 20.668 0.05 l -2.842 3.7 c -0.392 0.5 -0.588 1.2 -0.588 1.8 v 78.5 c 0 0.7 0.196 1.3 0.588 1.8 l 2.842 3.7 h -4.214 l -3.234 -5 V 4.95 l 3.234 -4.9 L 20.668 0.05 M 22.824 -1.05 h -6.86 L 12.436 4.35 C 12.338 4.55 12.24 4.75 12.24 4.95 v 79.7 c 0 0.2 0.098 0.4 0.196 0.6 l 3.528 5.4 h 6.86 l -4.214 -5.4 c -0.196 -0.4 -0.392 -0.7 -0.392 -1.2 V 5.55 c 0 -0.4 0.098 -0.8 0.392 -1.2 L 22.824 -1.05 L 22.824 -1.05 z"></path>
71
+ </g>
72
+ <g id="rightLatchFill">
73
+ <path
74
+ d="M 146.794 5.55 c 0 -0.4 -0.098 -0.8 -0.392 -1.2 L 142.188 -1.05 h 6.86 l 3.528 5.4 c 0.098 0.2 0.196 0.4 0.196 0.6 v 79.7 c 0 0.2 -0.098 0.4 -0.196 0.6 l -3.528 5.4 h -6.86 l 4.214 -5.4 c 0.196 -0.4 0.392 -0.7 0.392 -1.2 V 5.55 z"
75
+ style={{ fill: '#E6E6E6' }}
76
+ ></path>
77
+ </g>
78
+ <g id="rightLatchOutline">
79
+ <path d="M 148.558 0.05 l 3.234 5 v 79.7 l -3.234 5 h -4.214 l 2.842 -3.7 c 0.392 -0.5 0.588 -1.2 0.588 -1.8 V 5.55 c 0 -0.7 -0.196 -1.3 -0.588 -1.8 l -2.842 -3.7 L 148.558 0.05 M 149.048 -1.05 h -6.86 l 4.214 5.4 c 0.196 0.4 0.392 0.7 0.392 1.2 v 78.5 c 0 0.4 -0.098 0.8 -0.392 1.2 l -4.214 5.4 h 6.86 l 3.528 -5.4 c 0.098 -0.2 0.196 -0.4 0.196 -0.6 V 4.85 c 0 -0.2 -0.098 -0.4 -0.196 -0.6 L 149.048 -1.05 L 149.048 -1.05 z"></path>
80
+ </g>
81
+ </g>
82
+ )
83
+ }
@@ -0,0 +1,49 @@
1
+ import { COLORS } from '../../helix-design-system'
2
+
3
+ export function MagneticBlock(): JSX.Element {
4
+ return (
5
+ <g id="magneticBlock">
6
+ <g id="footprint">
7
+ <rect
8
+ style={{
9
+ fill: '#e6e6e6',
10
+ stroke: COLORS.black90,
11
+ strokeLinecap: 'round',
12
+ strokeLinejoin: 'round',
13
+ strokeWidth: '0.71px',
14
+ }}
15
+ x=".35"
16
+ y=".36"
17
+ width="136"
18
+ height="94"
19
+ rx="5"
20
+ ry="5"
21
+ ></rect>
22
+ </g>
23
+ <g id="slotClips">
24
+ <path
25
+ style={{
26
+ fill: 'none',
27
+ stroke: COLORS.black90,
28
+ strokeLinecap: 'round',
29
+ strokeLinejoin: 'round',
30
+ strokeWidth: '0.71px',
31
+ }}
32
+ d="m17.37.36v2.6m-2-.93V.36m2,2.6c0-.52-.9-.93-2-.93m104,.93V.36m2,1.67c-1.1,0-2,.42-2,.93m2-2.6v1.67m-2,92.33v-2.6m2,.93v1.67m-2-2.6c0,.52.9.93,2,.93M5.37,2.03v1.99m.18.12c-.06-.05-.12-.08-.18-.12m.18.12c.18.14.4.22.63.22m11.19,0H6.18m11.19-1.4v1.4M5.37,2.03h10M6.18,90.35h11.19m-11.19,0c-.23,0-.45.08-.63.22m-.18.12c.06-.03.13-.07.18-.12m-.18,2.11v-1.99m10,1.99H5.37m10,0c1.1,0,2-.42,2-.93m0-1.4v1.4m-15.33-2.4h1.99m.12-.18c-.05.06-.08.12-.12.18m.12-.18c.14-.18.22-.4.22-.63m0-11.19v11.19m-1.4-11.19h1.4m-1.4,0c-.52,0-.93.9-.93,2m0,10v-10m130.33,9.19v-11.19m0,11.19c0,.23.08.45.22.63m.12.18c-.03-.06-.07-.13-.12-.18m2.11.18h-1.99m1.99-10v10m0-10c0-1.1-.42-2-.93-2m-1.4,0h1.4m-2.4,15.33v-1.99m-.18-.12c.06.05.12.08.18.12m-.18-.12c-.18-.14-.4-.22-.63-.22m-11.19,0h11.19m-11.19,1.4v-1.4m12,2.33h-10m9.19-88.33h-11.19m11.19,0c.23,0,.45-.08.63-.22m.18-.12c-.06.03-.13.07-.18.12m.18-2.11v1.99m-10-1.99h10m-12,2.33v-1.4m15.33,2.4h-1.99m-.12.18c.05-.06.08-.12.12-.18m-.12.18c-.14.18-.22.4-.22.63m0,11.19V6.18m1.4,11.19h-1.4m1.4,0c.52,0,.93-.9.93-2m0-10v10M4.37,6.18v11.19m0-11.19c0-.23-.08-.45-.22-.63m-.12-.18c.03.06.07.13.12.18m-2.11-.19h1.99m-1.99,10V5.36m0,10c0,1.1.42,2,.93,2m1.4,0h-1.4m133.4,0h-2.6m.93-2h1.67m-2.6,62h2.6m0,2h-1.67M2.97,17.37H.36m0-2h1.67m15.33,76.4v2.6m-2,0v-1.67M.36,77.35h2.6m-.93,2H.36M134.68,5.36c0-1.84-1.49-3.33-3.33-3.33m0,1.99c.81-.44,1.78.53,1.34,1.34M2.04,89.37c0,1.84,1.49,3.33,3.33,3.33M5.36,2.04c-1.84,0-3.33,1.49-3.33,3.33m129.33,87.33c1.84,0,3.33-1.49,3.33-3.33m-1.99,0c.44.81-.53,1.78-1.34,1.34m-126,0c-.81.44-1.78-.53-1.34-1.34M4.03,5.37c-.44-.81.53-1.78,1.34-1.34m112,90.34v-4m0,0h2M4.37,19.37H.36m4-2v2M.36,75.35h4m0,0v2M136.36,19.37h-4m0,0v-2m0,58h4m-4,2v-2M117.35,4.37V.36m2,4h-2M19.37.36v4m0,0h-2m2,86v4m-2-4h2"
33
+ ></path>
34
+ </g>
35
+ <g id="wells">
36
+ <path
37
+ style={{
38
+ fill: 'none',
39
+ stroke: COLORS.black90,
40
+ strokeLinecap: 'round',
41
+ strokeLinejoin: 'round',
42
+ strokeWidth: '0.71px',
43
+ }}
44
+ d="M 41.61 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.51 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.61 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.51 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.61 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.51 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.61 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.51 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.61 42.85 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.51 42.85 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.61 42.85 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.51 42.85 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.61 42.85 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.51 42.85 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.61 42.85 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.51 42.85 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.61 33.85 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.51 33.85 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.61 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.51 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.61 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.51 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.61 33.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.51 33.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.61 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.51 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.61 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.51 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.61 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.51 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.61 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.51 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.61 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.51 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.6 24.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.5 24.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.6 15.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.5 15.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.6 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.5 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.6 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.5 42.87 c -0.08 -5.64 8.8 -5.614 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.6 42.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.5 42.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.6 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.5 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.6 60.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.5 60.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.6 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.5 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.6 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.5 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.6 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.5 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.6 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.5 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 104.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 104.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 113.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 113.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.59 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.49 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 59.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 59.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 50.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 50.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 32.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 32.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 68.59 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 68.49 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 77.59 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 77.49 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.59 51.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.49 51.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 41.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 41.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 14.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 14.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 95.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 95.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 86.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 86.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.59 69.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.49 69.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z M 23.59 78.87 c -0.08 -5.52 8.58 -5.52 8.5 0 c 0.08 5.51 -8.58 5.51 -8.5 0 Z M 23.49 78.87 c -0.08 -5.64 8.78 -5.64 8.7 0 c 0.08 5.64 -8.78 5.64 -8.7 0 Z"
45
+ ></path>
46
+ </g>
47
+ </g>
48
+ )
49
+ }
@@ -0,0 +1,51 @@
1
+ export function MagneticModule(): JSX.Element {
2
+ return (
3
+ <g id="magneticModule">
4
+ <g id="moduleVisualization">
5
+ <g id="darkFill">
6
+ <path
7
+ d="M126.4,74.2c-0.8,0-1.4,0.6-1.4,1.4v6.2c0,1.4-1.2,2.6-2.6,2.6H83.6v4.9H0.7V0.7h82.9v4.4h38.8 c1.4,0,2.6,1.2,2.6,2.6v6.2c0,0.8,0.6,1.4,1.4,1.4h8.8v58.9H126.4z M24.4,13.5h-1.9v9.8h1.9V13.5z M24.4,31.1h-1.9V41h1.9V31.1z M24.4,49h-1.9v9.8h1.9V49z M24.4,66.8h-1.9v9.8h1.9V66.8z M42.2,13.5h-1.9v9.8h1.9V13.5z M42.2,31.1h-1.9V41h1.9V31.1z M42.2,49 h-1.9v9.8h1.9V49z M42.2,66.8h-1.9v9.8h1.9V66.8z M59.9,13.5h-1.9v9.8h1.9V13.5z M59.9,31.1h-1.9V41h1.9V31.1z M59.9,49h-1.9v9.8 h1.9V49z M59.9,66.8h-1.9v9.8h1.9V66.8z M77.7,13.5h-1.9v9.8h1.9V13.5z M77.7,31.1h-1.9V41h1.9V31.1z M77.7,49h-1.9v9.8h1.9V49z M77.7,66.8h-1.9v9.8h1.9V66.8z M95.5,13.5h-1.9v9.8h1.9V13.5z M95.5,31.1h-1.9V41h1.9V31.1z M95.5,49h-1.9v9.8h1.9V49z M95.5,66.8h-1.9v9.8h1.9V66.8z M113.3,13.5h-1.9v9.8h1.9V13.5z M113.3,31.1h-1.9V41h1.9V31.1z M113.3,49h-1.9v9.8h1.9V49z M113.3,66.8h-1.9v9.8h1.9V66.8z"
8
+ style={{ fill: '#E6E6E6' }}
9
+ ></path>
10
+ </g>
11
+ <g id="magnetPlate">
12
+ <path d="M118,81.7c2.2,0,4-1.8,4-4V11.9c0-2.2-1.8-4-4-4H18.1c-2.2,0-4,1.8-4,4v65.8c0,2.2,1.8,4,4,4L118,81.7 M118,82.4H18.1 c-2.6,0-4.7-2.1-4.7-4.7V11.9c0-2.6,2.1-4.7,4.7-4.7H118c2.6,0,4.7,2.1,4.7,4.7v65.8C122.7,80.3,120.6,82.4,118,82.4L118,82.4z"></path>
13
+ <path d="M42.2,23.3v-9.8h-1.9v9.8H42.2 M42.9,24h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V24L42.9,24z"></path>
14
+ <path d="M42.2,41v-9.8h-1.9V41H42.2 M42.9,41.7h-0.7h-1.9h-0.7V41v-9.8v-0.7h0.7h1.9h0.7v0.7V41V41.7L42.9,41.7z"></path>
15
+ <path d="M42.2,58.8V49h-1.9v9.8H42.2 M42.9,59.5h-0.7h-1.9h-0.7v-0.7V49v-0.7h0.7h1.9h0.7V49v9.8V59.5L42.9,59.5z"></path>
16
+ <path d="M59.9,76.6v-9.8h-1.9v9.8H59.9 M60.7,77.4h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V77.4L60.7,77.4z"></path>
17
+ <path d="M59.9,23.3v-9.8h-1.9v9.8H59.9 M60.7,24h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V24L60.7,24z"></path>
18
+ <path d="M59.9,41v-9.8h-1.9V41H59.9 M60.7,41.7h-0.7h-1.9h-0.7V41v-9.8v-0.7h0.7h1.9h0.7v0.7V41V41.7L60.7,41.7z"></path>
19
+ <path d="M59.9,58.8V49h-1.9v9.8H59.9 M60.7,59.5h-0.7h-1.9h-0.7v-0.7V49v-0.7h0.7h1.9h0.7V49v9.8V59.5L60.7,59.5z"></path>
20
+ <path d="M77.7,76.6v-9.8h-1.9v9.8H77.7 M78.4,77.4h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V77.4L78.4,77.4z"></path>
21
+ <path d="M77.7,23.3v-9.8h-1.9v9.8H77.7 M78.4,24h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V24L78.4,24z"></path>
22
+ <path d="M77.7,41v-9.8h-1.9V41H77.7 M78.4,41.7h-0.7h-1.9h-0.7V41v-9.8v-0.7h0.7h1.9h0.7v0.7V41V41.7L78.4,41.7z"></path>
23
+ <path d="M77.7,58.8V49h-1.9v9.8H77.7 M78.4,59.5h-0.7h-1.9h-0.7v-0.7V49v-0.7h0.7h1.9h0.7V49v9.8V59.5L78.4,59.5z"></path>
24
+ <path d="M95.5,76.6v-9.8h-1.9v9.8H95.5 M96.2,77.4h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V77.4L96.2,77.4z"></path>
25
+ <path d="M95.5,23.3v-9.8h-1.9v9.8H95.5 M96.2,24h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V24L96.2,24z"></path>
26
+ <path d="M95.5,41v-9.8h-1.9V41H95.5 M96.2,41.7h-0.7h-1.9h-0.7V41v-9.8v-0.7h0.7h1.9h0.7v0.7V41V41.7L96.2,41.7z"></path>
27
+ <path d="M95.5,58.8V49h-1.9v9.8H95.5 M96.2,59.5h-0.7h-1.9h-0.7v-0.7V49v-0.7h0.7h1.9h0.7V49v9.8V59.5L96.2,59.5z"></path>
28
+ <path d="M113.3,76.6v-9.8h-1.9v9.8H113.3 M114,77.4h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V77.4L114,77.4z"></path>
29
+ <path d="M113.3,23.3v-9.8h-1.9v9.8H113.3 M114,24h-0.7h-1.9h-0.7v-0.7v-9.8v-0.7h0.7h1.9h0.7v0.7v9.8V24L114,24z"></path>
30
+ <path d="M113.3,41v-9.8h-1.9V41H113.3 M114,41.7h-0.7h-1.9h-0.7V41v-9.8v-0.7h0.7h1.9h0.7v0.7V41V41.7L114,41.7z"></path>
31
+ <path d="M113.3,58.8V49h-1.9v9.8H113.3 M114,59.5h-0.7h-1.9h-0.7v-0.7V49v-0.7h0.7h1.9h0.7V49v9.8V59.5L114,59.5z"></path>
32
+ </g>
33
+ <g id="innerWall">
34
+ <path d="M135.2,73.8h-8.8c-1,0-1.7,0.8-1.7,1.7v6.2c0,1.2-1,2.2-2.2,2.2H83.6v0.7h38.8c1.6,0,3-1.3,3-3v-6.2c0-0.6,0.5-1,1-1h8.8 V73.8z M122.4,4.7H83.6v0.7h38.8c1.2,0,2.2,1,2.2,2.2v6.2c0,1,0.8,1.7,1.7,1.7h8.8v-0.7h-8.8c-0.6,0-1-0.5-1-1V7.7 C125.4,6.1,124.1,4.7,122.4,4.7z"></path>
35
+ </g>
36
+ <g id="labwareBracket">
37
+ <path d="M84.3,0H0v90h84.4v-9H17.4c-3.4,0-6.1-2.7-6.1-6.1V14.7c0-3.4,2.7-6.1,6.1-6.1h66.9L84.3,0L84.3,0z M1.4,1.4h81.5v5.7 H17.4c-4.1,0-7.5,3.4-7.5,7.5v60.2c0,4.1,3.4,7.5,7.5,7.5h65.5v6.1H1.4V1.4z"></path>
38
+ </g>
39
+ <g id="magnetPlateOverlayFill">
40
+ <path
41
+ d="M118,81.7c2.2,0,4-1.8,4-4V11.9c0-2.2-1.8-4-4-4H18.1c-2.2,0-4,1.8-4,4v65.8c0,2.2,1.8,4,4,4L118,81.7z"
42
+ style={{ fill: '#FFFFFFF0' }}
43
+ ></path>
44
+ </g>
45
+ <g id="outline">
46
+ <path d="M135.9,0H0l0,90h135.9V0z M1.4,1.4h133.1v87.1H1.4V1.4z"></path>
47
+ </g>
48
+ </g>
49
+ </g>
50
+ )
51
+ }
@@ -0,0 +1,90 @@
1
+ import {
2
+ fixture96Plate,
3
+ getModuleDef2,
4
+ MAGNETIC_MODULE_V1,
5
+ MAGNETIC_MODULE_V2,
6
+ TEMPERATURE_MODULE_V1,
7
+ TEMPERATURE_MODULE_V2,
8
+ THERMOCYCLER_MODULE_V1,
9
+ THERMOCYCLER_MODULE_V2,
10
+ HEATERSHAKER_MODULE_V1,
11
+ MAGNETIC_BLOCK_V1,
12
+ } from '@opentrons/shared-data'
13
+ import { LabwareRender } from '../Labware'
14
+ import { RobotCoordinateSpace } from '../RobotCoordinateSpace'
15
+ import { Module as ModuleComponent } from './'
16
+
17
+ import type { Story, Meta } from '@storybook/react'
18
+ import type { LabwareDefinition2, ModuleModel } from '@opentrons/shared-data'
19
+
20
+ const moduleModels: ModuleModel[] = [
21
+ TEMPERATURE_MODULE_V2,
22
+ TEMPERATURE_MODULE_V1,
23
+ THERMOCYCLER_MODULE_V1,
24
+ THERMOCYCLER_MODULE_V2,
25
+ MAGNETIC_MODULE_V1,
26
+ MAGNETIC_MODULE_V2,
27
+ HEATERSHAKER_MODULE_V1,
28
+ MAGNETIC_BLOCK_V1,
29
+ ]
30
+
31
+ export default {
32
+ title: 'Library/Molecules/Simulation/Module',
33
+ } as Meta
34
+
35
+ const Template: Story<{
36
+ model: ModuleModel
37
+ orientation: 'left' | 'right'
38
+ hasLabware: boolean
39
+ innerProps: {}
40
+ }> = args => {
41
+ return (
42
+ <RobotCoordinateSpace height="100vh" width="100vw" viewBox="0 -50 200 320">
43
+ <ModuleComponent
44
+ def={getModuleDef2(args.model)}
45
+ x={0}
46
+ y={0}
47
+ innerProps={args.innerProps}
48
+ orientation={args.orientation}
49
+ >
50
+ {args.hasLabware ? (
51
+ <LabwareRender definition={fixture96Plate as LabwareDefinition2} />
52
+ ) : null}
53
+ </ModuleComponent>
54
+ </RobotCoordinateSpace>
55
+ )
56
+ }
57
+ export const Module = Template.bind({})
58
+ Module.argTypes = {
59
+ model: {
60
+ control: {
61
+ type: 'select',
62
+ options: moduleModels,
63
+ },
64
+ defaultValue: moduleModels[0],
65
+ },
66
+ orientation: {
67
+ control: {
68
+ type: 'select',
69
+ options: ['left', 'right'],
70
+ },
71
+ defaultValue: 'left',
72
+ },
73
+ hasLabware: {
74
+ control: {
75
+ type: 'boolean',
76
+ },
77
+ defaultValue: false,
78
+ },
79
+ innerProps: {
80
+ control: {
81
+ type: 'object',
82
+ },
83
+ defaultValue: {
84
+ lidMotorState: 'open',
85
+ blockTargetTemp: 90,
86
+ targetTemperature: 4,
87
+ targetTemp: 40,
88
+ },
89
+ },
90
+ }
@@ -0,0 +1,38 @@
1
+ import type * as React from 'react'
2
+ import {
3
+ RobotCoordsForeignDiv,
4
+ C_MED_LIGHT_GRAY,
5
+ SPACING_1,
6
+ JUSTIFY_CENTER,
7
+ ALIGN_CENTER,
8
+ } from '../../'
9
+
10
+ export interface ModuleTagProps {
11
+ x: number
12
+ y: number
13
+ height: number
14
+ width: number
15
+ children: React.ReactNode
16
+ }
17
+
18
+ export const ModuleTag = (props: ModuleTagProps): JSX.Element => {
19
+ const { x, y, height, width, children } = props
20
+
21
+ return (
22
+ <RobotCoordsForeignDiv
23
+ x={x}
24
+ y={y}
25
+ height={height}
26
+ width={width}
27
+ innerDivProps={{
28
+ display: 'flex',
29
+ justifyContent: JUSTIFY_CENTER,
30
+ alignItems: ALIGN_CENTER,
31
+ backgroundColor: C_MED_LIGHT_GRAY,
32
+ padding: SPACING_1,
33
+ }}
34
+ >
35
+ {children}
36
+ </RobotCoordsForeignDiv>
37
+ )
38
+ }
@@ -0,0 +1,208 @@
1
+ export function PlateReader(): JSX.Element {
2
+ return (
3
+ <g>
4
+ <g id="plateReader">
5
+ <rect
6
+ style={{
7
+ fill: '#DEDEDE',
8
+ }}
9
+ y="0"
10
+ width="298.9"
11
+ height="101"
12
+ rx="4.7"
13
+ ry="4.7"
14
+ />
15
+ <g>
16
+ <path
17
+ style={{
18
+ fill: '#e6e6e6',
19
+ }}
20
+ d="M163.5,5.7h123.7c3.1,0,5.6,2.5,5.6,5.6v72.7c0,3.1-2.5,5.6-5.6,5.6h-123.7c-3.1,0-5.6-2.5-5.6-5.6V11.3c0-3.1,2.5-5.6,5.6-5.6h0Z"
21
+ />
22
+ <path
23
+ style={{
24
+ fill: '#4c4b4c',
25
+ }}
26
+ d="M287.2,6.1c2.8,0,5.2,2.3,5.2,5.2v72.7c0,2.8-2.3,5.2-5.2,5.2h-123.7c-2.8,0-5.2-2.3-5.2-5.2V11.3c0-2.8,2.3-5.2,5.2-5.2h123.7M287.2,5.2h-123.7c-3.4,0-6.1,2.7-6.1,6.1v72.7c0,3.4,2.7,6.1,6.1,6.1h123.7c3.4,0,6.1-2.7,6.1-6.1V11.3c0-3.4-2.7-6.1-6.1-6.1h0Z"
27
+ />
28
+ </g>
29
+ <path
30
+ style={{
31
+ fill: '#4a4b4c',
32
+ }}
33
+ d="M278,85.6h-105.3c-2.3,0-4.1-1.8-4.1-4.1V13.7c0-2.2,1.8-4.1,4.1-4.1h105.3c2.3,0,4.1,1.8,4.1,4.1v67.9c0,2.2-1.8,4.1-4.1,4.1Z"
34
+ />
35
+ <g>
36
+ <g>
37
+ <path
38
+ style={{
39
+ fill: '#e6e6e5',
40
+ }}
41
+ d="M4.3,8.4h0c1.6,0,2.2,1.3,2.2,3v72.7c0,1.6-.6,3-2.2,3h0c-1.6,0-2.2-1.3-2.2-3V11.4c0-1.6.6-3,2.2-3h0Z"
42
+ />
43
+ <path
44
+ style={{
45
+ fill: '#4b4b4b',
46
+ }}
47
+ d="M4.3,87.5c-1.7,0-2.7-1.2-2.7-3.4V11.4c0-2.2,1-3.4,2.7-3.4s2.7,1.2,2.7,3.4v72.7c0,2.2-1,3.4-2.7,3.4ZM4.3,8.9c-1.2,0-1.8.8-1.8,2.5v72.7c0,1.7.6,2.5,1.8,2.5s1.8-.8,1.8-2.5V11.4c0-1.7-.6-2.5-1.8-2.5h0Z"
48
+ />
49
+ </g>
50
+ <rect
51
+ style={{
52
+ fill: '#4b4b4b',
53
+ }}
54
+ x="2"
55
+ y="15.8"
56
+ width="4.5"
57
+ height=".9"
58
+ />
59
+ <rect
60
+ style={{
61
+ fill: '#4b4b4b',
62
+ }}
63
+ x="2"
64
+ y="78.9"
65
+ width="4.5"
66
+ height=".9"
67
+ />
68
+ </g>
69
+ <g>
70
+ <g>
71
+ <rect
72
+ style={{
73
+ fill: '#e6e6e6',
74
+ }}
75
+ x="8.9"
76
+ y="3.5"
77
+ width="143.3"
78
+ height="88.6"
79
+ rx="6.2"
80
+ ry="6.2"
81
+ />
82
+ <path
83
+ style={{
84
+ fill: '#4d4b4d',
85
+ }}
86
+ d="M146,3.9c3.2,0,5.8,2.6,5.8,5.8v76.1c0,3.2-2.6,5.8-5.8,5.8H15.1c-3.2,0-5.8-2.6-5.8-5.8V9.7c0-3.2,2.6-5.8,5.8-5.8h130.9M146,3H15.1c-3.7,0-6.7,3-6.7,6.7v76.1c0,3.7,3,6.7,6.7,6.7h130.9c3.7,0,6.7-3,6.7-6.7V9.7c0-3.7-3-6.7-6.7-6.7h0Z"
87
+ />
88
+ </g>
89
+ <path
90
+ style={{
91
+ fill: '#4d4b4d',
92
+ }}
93
+ d="M144.7,6.6c2.3,0,4.2,1.9,4.2,4.2v74c0,2.3-1.9,4.2-4.2,4.2H16.3c-2.3,0-4.2-1.9-4.2-4.2V10.8c0-2.3,1.9-4.2,4.2-4.2h128.5M144.7,5.7H16.3c-2.8,0-5.1,2.3-5.1,5.1v74c0,2.8,2.3,5.1,5.1,5.1h128.5c2.8,0,5.1-2.3,5.1-5.1V10.8c0-2.8-2.3-5.1-5.1-5.1h0Z"
94
+ />
95
+ <rect
96
+ style={{
97
+ fill: '#4b4b4b',
98
+ }}
99
+ x="142.1"
100
+ y="29.3"
101
+ width="3.3"
102
+ height="10.3"
103
+ rx="1.7"
104
+ ry="1.7"
105
+ />
106
+ <circle
107
+ style={{
108
+ fill: '#fff',
109
+ }}
110
+ cx="143.7"
111
+ cy="31.1"
112
+ r=".8"
113
+ />
114
+ <circle
115
+ style={{
116
+ fill: '#fff',
117
+ }}
118
+ cx="143.7"
119
+ cy="33.4"
120
+ r=".8"
121
+ />
122
+ <circle
123
+ style={{
124
+ fill: '#fff',
125
+ }}
126
+ cx="143.7"
127
+ cy="35.6"
128
+ r=".8"
129
+ />
130
+ <circle
131
+ style={{
132
+ fill: '#fff',
133
+ }}
134
+ cx="143.7"
135
+ cy="37.9"
136
+ r=".8"
137
+ />
138
+ <rect
139
+ style={{
140
+ fill: '#4b4b4b',
141
+ }}
142
+ x="142.1"
143
+ y="53.8"
144
+ width="3.3"
145
+ height="10.3"
146
+ rx="1.7"
147
+ ry="1.7"
148
+ />
149
+ <circle
150
+ style={{
151
+ fill: '#fff',
152
+ }}
153
+ cx="143.7"
154
+ cy="55.6"
155
+ r=".8"
156
+ />
157
+ <circle
158
+ style={{
159
+ fill: '#fff',
160
+ }}
161
+ cx="143.7"
162
+ cy="57.9"
163
+ r=".8"
164
+ />
165
+ <circle
166
+ style={{
167
+ fill: '#fff',
168
+ }}
169
+ cx="143.7"
170
+ cy="60.1"
171
+ r=".8"
172
+ />
173
+ <circle
174
+ style={{
175
+ fill: '#fff',
176
+ }}
177
+ cx="143.7"
178
+ cy="62.4"
179
+ r=".8"
180
+ />
181
+ <path
182
+ style={{
183
+ fill: '#4b4b4b',
184
+ }}
185
+ d="M22.9,89.3h-.7v-2.2h-5.1c-1.2,0-2.1-.3-2.6-.9-.6-.7-.6-1.5-.5-1.6V11.3c0-1,.3-1.8.9-2.3.8-.7,1.8-.6,2-.6h5.6v-2.2h.7v2.9h-6.4s-.9-.1-1.5.4c-.4.4-.6.9-.6,1.7v73.3s0,.6.4,1.1c.4.4,1.1.7,2.1.7h5.8v2.9h0Z"
186
+ />
187
+ <path
188
+ style={{
189
+ fill: '#4b4b4b',
190
+ }}
191
+ d="M123.2,89.3h-.7v-2.9h6.4s.9.1,1.5-.4c.4-.4.6-.9.6-1.7V11s0-.6-.4-1.1c-.4-.4-1.1-.7-2.1-.7h-5.8v-2.9h.7v2.2h5.1c1.2,0,2.1.3,2.6.9.6.7.6,1.5.5,1.6v73.2c0,1-.3,1.8-.9,2.3-.8.7-1.8.6-2,.6h-5.6v2.2h0Z"
192
+ />
193
+ </g>
194
+ <rect
195
+ style={{
196
+ fill: '#fff',
197
+ }}
198
+ x="27.2"
199
+ y="17.6"
200
+ width="92.5"
201
+ height="60.4"
202
+ rx="2.5"
203
+ ry="2.5"
204
+ />
205
+ </g>
206
+ </g>
207
+ )
208
+ }
@@ -0,0 +1,54 @@
1
+ import { COLORS } from '../../helix-design-system'
2
+
3
+ export interface TemperatureVizProps {
4
+ targetTemperature: number | null
5
+ }
6
+
7
+ const ROOM_TEMPERATURE_C = 23
8
+
9
+ export function Temperature(props: TemperatureVizProps): JSX.Element {
10
+ const { targetTemperature } = props
11
+ let ledLightColor = COLORS.transparent
12
+ if (targetTemperature != null) {
13
+ ledLightColor =
14
+ targetTemperature <= ROOM_TEMPERATURE_C ? COLORS.blue35 : COLORS.red30
15
+ }
16
+
17
+ return (
18
+ <>
19
+ <g id="darkFill">
20
+ <path
21
+ d="M74,89.3c-2.2,0-4.2-1.2-5.3-3H6.1V19.2H0.4V9.6h5.7V3.7h62.6c1.1-1.8,3.1-3,5.3-3h123V45v41.3v3H74z M28.5,39.5c0-1.5-1.2-2.7-2.7-2.7l0,0c-1.5,0-2.7,1.2-2.7,2.7v10.9c0,1.5,1.2,2.7,2.7,2.7s2.7-1.2,2.7-2.7V39.5z M46.3,34.4H32.1 v21.2h14.2V34.4L46.3,34.4z"
22
+ style={{
23
+ fillRule: 'evenodd',
24
+ clipRule: 'evenodd',
25
+ fill: 'rgb(230, 230, 230)',
26
+ }}
27
+ ></path>
28
+ </g>
29
+ <g id="outline">
30
+ <path d="M197.7,0H5.3v90h192.4V0z M6.7,1.4h189.6v87.1H6.7V1.4z"></path>
31
+ </g>
32
+ <g id="labwareSurface">
33
+ <path d="M197.7,0H74c-3.8,0-7,3.1-7,7v76c0,3.8,3.1,7,7,7h123.7V0z M74,88.6c-3,0-5.5-2.5-5.5-5.5V7c0-3,2.5-5.5,5.5-5.5h122.3 v87.1H74z"></path>
34
+ </g>
35
+ <g id="innerWalls">
36
+ <path d="M6,86.4h62.5v-0.7H6V86.4z M6,4.1h63.4V3.3H6L6,4.1L6,4.1z"></path>
37
+ </g>
38
+ <g id="powerButton">
39
+ <path d="M6.4,9.2H0v10.3h6.4V9.2z M0.7,9.9h5v8.9h-5V9.9z"></path>
40
+ </g>
41
+ <g id="displayPanel">
42
+ <path d="M46.3,34.1H32.1c-0.2,0-0.4,0.2-0.4,0.4v21.2c0,0.2,0.2,0.4,0.4,0.4h14.2c0.2,0,0.4-0.2,0.4-0.4V34.4 C46.7,34.2,46.5,34.1,46.3,34.1z M32.5,34.8h13.4v20.4H32.5V34.8z"></path>
43
+ </g>
44
+ <g id="statusLight">
45
+ <path
46
+ fill={ledLightColor}
47
+ stroke={COLORS.black90}
48
+ strokeWidth={0.5}
49
+ d="M 25.8 36.5 c -1.7 0 -3.1 1.4 -3.1 3.1 v 10.9 c 0 1.7 1.4 3.1 3.1 3.1 s 3.1 -1.4 3.1 -3.1 v -11 C 28.9 37.8 27.5 36.5 25.8 36.5 z"
50
+ />
51
+ </g>
52
+ </>
53
+ )
54
+ }