Components: Fix error in CONTRIBUTING guide (#40682)

packages/components/CONTRIBUTING.md

@@ -495,7 +495,16 @@ Given a component folder (e.g. `packages/components/src/unit-control`):
 6. Create a new `types.ts` file.
 7. Slowly work your way through fixing the TypeScript errors in the folder:
 	1. Try to avoid introducing any runtime changes, if possible. The aim of this refactor is to simply rewrite the component to TypeScript.
-	2. Add a named export for the unconnected, un-forwarded component. This ensures that the docgen can properly extract the types data. The naming should be so that the connected/forwarded component has the plain component name (`MyComponent`), and the raw component is prefixed (`UnconnectedMyComponent` or `UnforwardedMyComponent`). This makes the component's `displayName` look nicer in React devtools and in the autogenerated Storybook code snippets.
+	2. Make sure you have a **named** export for the component, not just the default export ([example](https://github.com/WordPress/gutenberg/blob/trunk/packages/components/src/divider/component.tsx)). This ensures that the docgen can properly extract the types data. The naming should be so that the connected/forwarded component has the plain component name (`MyComponent`), and the raw component is prefixed (`UnconnectedMyComponent` or `UnforwardedMyComponent`). This makes the component's `displayName` look nicer in React devtools and in the autogenerated Storybook code snippets.
+
+		```jsx
+		function UnconnectedMyComponent() { /* ... */ }
+
+		// 👇 Without this named export, the docgen will not work!
+		export const MyComponent = contextConnect( UnconnectedMyComponent, 'MyComponent' );
+		export default MyComponent;
+		```
+
 	3. Extract props to `types.ts`, and use them to type components. The README can be of help when determining a prop’s type.
 	4. Use existing HTML types when possible? (e.g. `required` for an input field?)
 	5. Use the `CSSProperties` type where it makes sense.