Coach Mark: Documentation fixes

.all-contributorsrc

@@ -326,6 +326,16 @@
       "contributions": [
         "a11y"
       ]
+    },
+    {
+      "login": "david-corneail",
+      "name": "david-corneail",
+      "avatar_url": "https://avatars.githubusercontent.com/u/104939119?v=4",
+      "profile": "https://github.com/david-corneail",
+      "contributions": [
+        "design",
+        "doc"
+      ]
     }
   ],
   "contributorsPerLine": 7

.changeset/famous-gorillas-poke.md

@@ -0,0 +1,5 @@
+---
+'@ithaka/pharos-site': patch
+---
+
+Fix coach mark documentation issues

README.md

@@ -102,6 +102,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="http://brentswisher.com/"><img src="https://avatars.githubusercontent.com/u/6653970?v=4?s=100" width="100px;" alt="Brent Swisher"/><br /><sub><b>Brent Swisher</b></sub></a><br /><a href="https://github.com/ithaka/pharos/issues?q=author%3Abrentswisher" title="Bug reports">🐛</a> <a href="https://github.com/ithaka/pharos/commits?author=brentswisher" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/henryclong"><img src="https://avatars.githubusercontent.com/u/52258386?v=4?s=100" width="100px;" alt="Henry Long"/><br /><sub><b>Henry Long</b></sub></a><br /><a href="https://github.com/ithaka/pharos/commits?author=henryclong" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://matharris.dev/"><img src="https://avatars.githubusercontent.com/u/6874453?v=4?s=100" width="100px;" alt="Mat Harris"/><br /><sub><b>Mat Harris</b></sub></a><br /><a href="#a11y-sirrah-tam" title="Accessibility">️️️️♿️</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/david-corneail"><img src="https://avatars.githubusercontent.com/u/104939119?v=4?s=100" width="100px;" alt="david-corneail"/><br /><sub><b>david-corneail</b></sub></a><br /><a href="#design-david-corneail" title="Design">🎨</a> <a href="https://github.com/ithaka/pharos/commits?author=david-corneail" title="Documentation">📖</a></td>
     </tr>
   </tbody>
 </table>

packages/pharos-site/src/components/Sidenav.tsx

@@ -117,6 +117,7 @@ const Sidenav: FC = () => {
               'Button',
               'Breadcrumb',
               'Checkbox',
+              'Coach Mark',
               'Combobox',
               'Dropdown menu',
               'Dropdown menu nav',

packages/pharos-site/src/pages/components/component-status/status.json

@@ -155,6 +155,32 @@
       "description": ""
     }
   },
+  "coach-mark": {
+    "design": {
+      "status": "released",
+      "description": ""
+    },
+    "development": {
+      "status": "released",
+      "description": ""
+    },
+    "tests": {
+      "status": "released",
+      "description": ""
+    },
+    "documentation": {
+      "status": "released",
+      "description": ""
+    },
+    "released": {
+      "status": "13.0.0",
+      "description": ""
+    },
+    "updated": {
+      "status": "13.0.0",
+      "description": ""
+    }
+  },
   "combobox": {
     "design": {
       "status": "released",

packages/pharos-site/static/guidelines/coach-mark.docs.mdx

@@ -5,7 +5,7 @@ import BestPractices from '@components/statics/BestPractices.tsx';
   title="Coach Mark"
   description="Coach marks highlight new or unique features, direct users in the right direction, or guide users during onboarding."
   isHeader
-  storyBookType="forms"
+  storyBookType="components"
 ></PageSection>
 
 ## Examples
@@ -25,12 +25,12 @@ import BestPractices from '@components/statics/BestPractices.tsx';
   </div>
   <PharosCoachMark
     id="example-coachmark"
-    hide="false"
+    hide={false}
     side="bottom"
     alignment="start"
     header="Coach Mark"
     delay="short"
-    variant="light"
+    variant="dark"
   >
     This is an example Coach Mark
   </PharosCoachMark>
@@ -91,7 +91,6 @@ import BestPractices from '@components/statics/BestPractices.tsx';
           Use coach marks to focus attention to important functionality and feedback in context
         </li>
         <li>Display coach marks on a page once per session</li>
-        <li>Checkboxes should always include a label</li>
         <li>
           Consider a coach mark to promote new features, functionality, or other changes to layout
           and patterns that may disorient the user