chore: update migration.md

zendeskgarden · Apr 10, 2024 · f42deba · f42deba
1 parent eee833a
commit f42deba
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 7 deletions.
diff --git a/docs/migration.md b/docs/migration.md
@@ -76,7 +76,9 @@ consider additional positioning prop support on a case-by-case basis.
   - `CollapsibleSubNavItem` -> `SubNav.CollapsibleItem`
   - `SubNavItem` -> `SubNav.Item`
   - `SubNavItemText` -> `SubNav.ItemText`
-- Added `Nav.List` as an intemediary `ul` wrapper for `Nav.Item`
+- Added `Nav.List` as a semantic wrapper for `Nav.Item`. See
+  [README](https://github.com/zendeskgarden/react-components/blob/main/packages/chrome/README.md#usages)
+  for details.
 
 #### @zendeskgarden/react-colorpickers
 

diff --git a/packages/chrome/README.md b/packages/chrome/README.md
@@ -17,24 +17,31 @@ npm install react react-dom styled-components @zendeskgarden/react-theming
 import { ThemeProvider } from '@zendeskgarden/react-theming';
 import { Chrome, Nav, SubNav, Body, Header, Content, Main } from '@zendeskgarden/react-chrome';
 import ConnectIcon from '@zendeskgarden/icons/src/26/relationshape-connect.svg';
+import BrandmarkIcon from '@zendeskgarden/svg-icons/src/26/zendesk.svg';
 
 <ThemeProvider>
   <Chrome>
     <Nav isExpanded>
+      <Nav.Item hasLogo product="connect" title="Zendesk Connect">
+        <Nav.ItemIcon>
+          <ConnectIcon />
+        </Nav.ItemIcon>
+        <NavItemText>Zendesk Connect</NavItemText>
+      </Nav.Item>
       <Nav.List>
-        <Nav.Item hasLogo product="connect" title="Zendesk Connect">
-          <Nav.ItemIcon>
-            <ConnectIcon />
-          </Nav.ItemIcon>
-          <NavItemText>Zendesk Connect</NavItemText>
-        </Nav.Item>
         <Nav.Item isCurrent>
           <Nav.ItemIcon>
             <HomeIcon />
           </Nav.ItemIcon>
           <NavItemText>Home</NavItemText>
         </Nav.Item>
       </Nav.List>
+      <Nav.Item hasBrandmark>
+        <Nav.ItemIcon>
+          <BrandmarkIcon />
+        </Nav.ItemIcon>
+        <Nav.ItemText>Brandmark</Nav.ItemText>
+      </Nav.Item>
     </Nav>
     <SubNav>
       <SubNav.Item isCurrent>