chore: Fix typos (#7174)

Co-authored-by: Josh Black <joshblack@github.com>
Co-authored-by: primer[bot] <119360173+primer[bot]@users.noreply.github.com>

Author: 3 people

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

@@ -208,4 +208,4 @@ Organizational overhead of shared dependencies is something that we will have to
 ## Consequences
 
 - By using `@lit-labs/ssr` today, we introduce a new dependency into Primer React. This may be removed later should React support Custom Elements out of the box (which seems likely for React 19), but for now we will need to continue to ship this dependency.
-- This decision may expediate the need to resolve organisational overhead issues. Deciding to use custom elements to share more code among PVC and PRC may highlight other areas which need to be addressed in subsequent PRs.
+- This decision may expedite the need to resolve organisational overhead issues. Deciding to use custom elements to share more code among PVC and PRC may highlight other areas which need to be addressed in subsequent PRs.

packages/react/src/KeybindingHint/key-names.ts

@@ -75,7 +75,7 @@ export const accessibleKeyName = (key: string, isMacOS: boolean) =>
     printscreen: 'print screen',
     // We don't need to represent _every_ symbol - only those found on standard keyboards.
     // Other symbols should be avoided as keyboard shortcuts anyway.
-    // These should match the colloqiual names of the keys, not the names of the symbols. Ie,
+    // These should match the colloquial names of the keys, not the names of the symbols. Ie,
     // "Equals" not "Equal Sign", "Dash" not "Minus", "Period" not "Dot", etc.
     '`': 'backtick',
     '~': 'tilde',

packages/react/src/NavList/NavList.figma.tsx

@@ -37,7 +37,7 @@ figma.connect(
     example: ({actionList}) => <NavList.Item href="#">{actionList.text}</NavList.Item>,
   },
 )
-/** Collapsable item **/
+/** Collapsible item **/
 figma.connect(
   NavList.Item,
   'https://www.figma.com/design/GCvY3Qv8czRgZgvl1dG6lp/Primer-Web?node-id=16716-62586&m=dev',

packages/react/src/ThemeProvider.tsx

@@ -44,7 +44,7 @@ const getServerHandoff = (id: string) => {
     const serverData = document.getElementById(`__PRIMER_DATA_${id}__`)?.textContent
     if (serverData) return JSON.parse(serverData)
   } catch (_error) {
-    // if document/element does not exist or JSON is invalid, supress error
+    // if document/element does not exist or JSON is invalid, suppress error
   }
   return {}
 }

packages/react/src/VisuallyHidden/VisuallyHidden.tsx

@@ -5,7 +5,7 @@ import classes from './VisuallyHidden.module.css'
 
 /**
  * Provides a component that implements the "visually hidden" technique. This is
- * analagous to the common `sr-only` class. Children that are rendered inside
+ * analogous to the common `sr-only` class. Children that are rendered inside
  * this component will not be visible but will be available to screen readers.
  *
  * Note: if this component, or a descendant, has focus then this component will

packages/react/src/internal/components/UnderlineTabbedInterface.module.css

@@ -8,7 +8,7 @@
   /* make space for the underline */
   min-height: var(--control-xlarge-size, 48px);
 
-  /* using a box-shadow instead of a border to accomodate 'overflow-y: hidden' on UnderlinePanels */
+  /* using a box-shadow instead of a border to accommodate 'overflow-y: hidden' on UnderlinePanels */
   /* stylelint-disable-next-line primer/box-shadow */
   box-shadow: inset 0 -1px var(--borderColor-muted);
 
@@ -136,7 +136,8 @@
 .LoadingCounter {
   display: inline-block;
   width: 1.5rem;
-  height: 1rem; /* 16px */
+  height: 1rem;
+  /* 16px */
   background-color: var(--bgColor-neutral-muted);
   border-color: var(--borderColor-default);
   /* stylelint-disable-next-line primer/borders */