Merge branch 'main' into refactor-actionlist-item-as-button

Author: radglob

contributor-docs/adrs/adr-010-behavior-isolation.md

@@ -84,7 +84,7 @@ Primer React's [recent addition of the Relative Time component](https://github.c
 
 ```typescript
 const root = (typeof globalThis !== 'undefined' ? globalThis : window) as typeof window
-const HTMLElement = root.HTMLElement || (null as unknown as typeof window['HTMLElement'])
+const HTMLElement = root.HTMLElement || (null as unknown as (typeof window)['HTMLElement'])
 ```
 
 These lines could also be added to the global context, to avoid adding it to each element.

package-lock.json

@@ -229,7 +229,7 @@
     "micromark-extension-frontmatter": "1.0.0",
     "micromark-extension-mdxjs": "1.0.1",
     "postcss-custom-properties-fallback": "^1.0.2",
-    "prettier": "2.8.1",
+    "prettier": "2.8.8",
     "react": "18.2.0",
     "react-dnd": "14.0.4",
     "react-dnd-html5-backend": "14.0.2",

package.json

@@ -418,7 +418,7 @@ export const InsideOverlay = () => {
 export const GroupWithSubtleTitle = () => {
   const [assignees, setAssignees] = React.useState(users.slice(0, 1))
 
-  const toggleAssignee = (assignee: typeof users[number]) => {
+  const toggleAssignee = (assignee: (typeof users)[number]) => {
     const assigneeIndex = assignees.findIndex(a => a.login === assignee.login)
 
     if (assigneeIndex === -1) setAssignees([...assignees, assignee])
@@ -450,7 +450,7 @@ export const GroupWithSubtleTitle = () => {
 export const GroupWithFilledTitle = () => {
   const [assignees, setAssignees] = React.useState(users.slice(0, 1))
 
-  const toggleAssignee = (assignee: typeof users[number]) => {
+  const toggleAssignee = (assignee: (typeof users)[number]) => {
     const assigneeIndex = assignees.findIndex(a => a.login === assignee.login)
 
     if (assigneeIndex === -1) setAssignees([...assignees, assignee])

src/ActionList/ActionList.features.stories.tsx

@@ -24,7 +24,7 @@ export const GroupsAndDescriptions = () => {
     {name: 'FY23 - Q2', due: 'December 30, 2022', progress: 0},
   ]
 
-  const [selectedMilestone, setSelectedMilestone] = React.useState<typeof milestones[0] | undefined>()
+  const [selectedMilestone, setSelectedMilestone] = React.useState<(typeof milestones)[0] | undefined>()
 
   return (
     <ActionMenu open>
@@ -241,7 +241,7 @@ export const MixedSelection = () => {
 export const MultipleSections = () => {
   const items = [{name: 'Show code folding buttons'}, {name: 'Wrap lines'}, {name: 'Center content'}]
 
-  const [selectedMilestone, setSelectedMilestone] = React.useState<typeof items[0] | undefined>()
+  const [selectedMilestone, setSelectedMilestone] = React.useState<(typeof items)[0] | undefined>()
 
   return (
     <ActionMenu open>