Merge branch 'chore_release-pd-8.4.0' into mergeback_release-pd-840_i…

…nto_edge

components/src/atoms/ListButton/__tests__/ListButton.test.tsx

@@ -25,7 +25,7 @@ describe('ListButton', () => {
   it('should render correct style - noActive', () => {
     render(props)
     const listButton = screen.getByTestId('ListButton_noActive')
-    expect(listButton).toHaveStyle(`backgroundColor: ${COLORS.grey30}`)
+    expect(listButton).toHaveStyle(`backgroundColor: ${COLORS.grey20}`)
   })
   it('should render correct style - connected', () => {
     props.type = 'connected'

components/src/atoms/ListButton/index.tsx

@@ -23,8 +23,8 @@ const LISTBUTTON_PROPS_BY_TYPE: Record<
   { backgroundColor: string; hoverBackgroundColor: string }
 > = {
   noActive: {
-    backgroundColor: COLORS.grey30,
-    hoverBackgroundColor: COLORS.grey35,
+    backgroundColor: COLORS.grey20,
+    hoverBackgroundColor: COLORS.grey30,
   },
   connected: {
     backgroundColor: COLORS.green30,
@@ -60,13 +60,19 @@ export function ListButton(props: ListButtonProps): JSX.Element {
         ? COLORS.grey20
         : listButtonProps.hoverBackgroundColor};
     }
+
+    &:focus-visible {
+      outline: 2px solid ${COLORS.blue50};
+      outline-offset: 0.25rem;
+    }
   `
 
   return (
     <Flex
       data-testid={`ListButton_${type}`}
       onClick={onClick}
       css={LIST_BUTTON_STYLE}
+      tabIndex={0}
       {...styleProps}
     >
       {children}

components/src/atoms/buttons/EmptySelectorButton.tsx

@@ -4,7 +4,6 @@ import {
   ALIGN_CENTER,
   CURSOR_DEFAULT,
   CURSOR_POINTER,
-  FLEX_MAX_CONTENT,
   Icon,
   JUSTIFY_CENTER,
   JUSTIFY_START,
@@ -62,8 +61,8 @@ interface ButtonProps {
 
 const StyledButton = styled.button<ButtonProps>`
   border: none;
-  width: ${FLEX_MAX_CONTENT};
-  height: ${FLEX_MAX_CONTENT};
+  width: 100%;
+  height: 100%;
   cursor: ${CURSOR_POINTER};
   background-color: ${COLORS.blue30};
   border-radius: ${BORDERS.borderRadius8};

components/src/atoms/buttons/LargeButton.tsx

@@ -206,7 +206,9 @@ export function LargeButton(props: LargeButtonProps): JSX.Element {
 
       border: ${buttonType === 'stroke'
         ? `2px solid ${COLORS.blue55}`
-        : `${computedBorderStyle()}`};
+        : buttonType === 'primary'
+        ? `4px solid ${COLORS.blue55}`
+        : computedBorderStyle()};
     }
 
     &:focus-visible {

components/src/molecules/DropdownMenu/index.tsx

@@ -27,6 +27,7 @@ import { LiquidIcon } from '../LiquidIcon'
 import { DeckInfoLabel } from '../DeckInfoLabel'
 
 import type { FocusEventHandler } from 'react'
+import type { FlattenSimpleInterpolation } from 'styled-components'
 
 export interface DropdownOption {
   name: string
@@ -268,7 +269,7 @@ export function DropdownMenu(props: DropdownMenuProps): JSX.Element {
             >
               <StyledText
                 desktopStyle="captionRegular"
-                css={LINE_CLAMP_TEXT_STYLE}
+                css={LINE_CLAMP_TEXT_STYLE(1)}
               >
                 {currentOption.name}
               </StyledText>
@@ -327,12 +328,15 @@ export function DropdownMenu(props: DropdownMenuProps): JSX.Element {
                       flexDirection={DIRECTION_COLUMN}
                       gridGap={option.subtext != null ? SPACING.spacing4 : '0'}
                     >
-                      <StyledText desktopStyle="captionRegular">
+                      <StyledText
+                        desktopStyle="captionRegular"
+                        css={LINE_CLAMP_TEXT_STYLE(3)}
+                      >
                         {option.name}
                       </StyledText>
                       <StyledText
                         desktopStyle="captionRegular"
-                        color={COLORS.black70}
+                        color={COLORS.grey60}
                       >
                         {option.subtext}
                       </StyledText>
@@ -363,12 +367,17 @@ export function DropdownMenu(props: DropdownMenuProps): JSX.Element {
   )
 }
 
-const LINE_CLAMP_TEXT_STYLE = css`
+export const LINE_CLAMP_TEXT_STYLE = (
+  lineClamp?: number,
+  title?: boolean
+): FlattenSimpleInterpolation => css`
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: ${OVERFLOW_HIDDEN};
   text-overflow: ellipsis;
   word-wrap: break-word;
-  -webkit-line-clamp: 1;
-  word-break: break-all;
+  -webkit-line-clamp: ${lineClamp ?? 1};
+  word-break: ${title === true
+    ? 'normal'
+    : 'break-all'}; // normal for tile and break-all for a non word case like aaaaaaaa
 `

protocol-designer/fixtures/protocol/8/doItAllV4MigratedToV8.json

@@ -25,6 +25,10 @@
         "form": [],
         "timeline": []
       },
+      "dismissedWarnings": {
+        "form": [],
+        "timeline": []
+      },
       "ingredients": {
         "0": {
           "displayName": "Water",
@@ -116,6 +120,86 @@
               "volume": 100
             }
           }
+          "A1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "B1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "C1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "D1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "E1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "F1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "G1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "H1": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "A2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "B2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "C2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "D2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "E2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "F2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "G2": {
+            "0": {
+              "volume": 100
+            }
+          },
+          "H2": {
+            "0": {
+              "volume": 100
+            }
+          }
         }
       },
       "savedStepForms": {
@@ -1336,6 +1420,11 @@
         "y": 0,
         "z": 0
       }
+      "cornerOffsetFromSlot": {
+        "x": 0,
+        "y": 0,
+        "z": 0
+      }
     },
     "opentrons/nest_96_wellplate_100ul_pcr_full_skirt/1": {
       "ordering": [
@@ -2236,6 +2325,9 @@
       },
       "groups": [
         {
+          "metadata": {
+            "wellBottomShape": "v"
+          },
           "metadata": {
             "wellBottomShape": "v"
           },
@@ -2354,6 +2446,11 @@
         "y": 0,
         "z": 0
       }
+      "cornerOffsetFromSlot": {
+        "x": 0,
+        "y": 0,
+        "z": 0
+      }
     },
     "opentrons/opentrons_24_aluminumblock_generic_2ml_screwcap/1": {
       "ordering": [
@@ -2647,13 +2744,23 @@
             "brandId": [],
             "links": []
           }
+          "brand": {
+            "brand": "generic",
+            "brandId": [],
+            "links": []
+          }
         }
       ],
       "cornerOffsetFromSlot": {
         "x": 0,
         "y": 0,
         "z": 0
       }
+      "cornerOffsetFromSlot": {
+        "x": 0,
+        "y": 0,
+        "z": 0
+      }
     }
   },
   "liquidSchemaId": "opentronsLiquidSchemaV1",
@@ -2683,6 +2790,9 @@
         "location": {
           "slotName": "1"
         },
+        "location": {
+          "slotName": "1"
+        },
         "moduleId": "0b419310-75c7-11ea-b42f-4b64e50f43e5:magneticModuleType"
       }
     },
@@ -2694,6 +2804,9 @@
         "location": {
           "slotName": "3"
         },
+        "location": {
+          "slotName": "3"
+        },
         "moduleId": "0b4319b0-75c7-11ea-b42f-4b64e50f43e5:temperatureModuleType"
       }
     },
@@ -2709,6 +2822,9 @@
         "location": {
           "slotName": "2"
         }
+        "location": {
+          "slotName": "2"
+        }
       }
     },
     {
@@ -2813,6 +2929,11 @@
             "x": 0,
             "y": 0
           }
+          "offset": {
+            "z": 1,
+            "x": 0,
+            "y": 0
+          }
         },
         "flowRate": 46.43
       }
@@ -2832,6 +2953,11 @@
             "x": 0,
             "y": 0
           }
+          "offset": {
+            "z": 0.5,
+            "x": 0,
+            "y": 0
+          }
         },
         "flowRate": 46.43
       }
@@ -2847,6 +2973,11 @@
           "y": 0,
           "z": 0
         },
+        "offset": {
+          "x": 0,
+          "y": 0,
+          "z": 0
+        },
         "alternateDropLocation": true
       }
     },
@@ -2881,6 +3012,11 @@
             "x": 0,
             "y": 0
           }
+          "offset": {
+            "z": 1,
+            "x": 0,
+            "y": 0
+          }
         },
         "flowRate": 46.43
       }
@@ -2900,6 +3036,11 @@
             "x": 0,
             "y": 0
           }
+          "offset": {
+            "z": 0.5,
+            "x": 0,
+            "y": 0
+          }
         },
         "flowRate": 46.43
       }
@@ -2915,6 +3056,11 @@
           "y": 0,
           "z": 0
         },
+        "offset": {
+          "x": 0,
+          "y": 0,
+          "z": 0
+        },
         "alternateDropLocation": true
       }
     },