restructure and condense content

Author: devalog

fern/products/docs/pages/component-library/default-components/anchor.mdx

@@ -1,41 +1,33 @@
 ---
-title: 'Anchor'
-description: 'Create custom anchor links within your documentation pages'
+title: Anchor
+description: Create linkable anchors for paragraphs, tables, and other content without headings
 ---
 
-The Anchor component allows you to create custom anchor points within your documentation that can be linked to directly. This is useful for creating deep links to specific sections of content that don't have headings.
+Use the `<Anchor>` component to create links to specific paragraphs, tables, and other sections of content that don't have headings. Wrap your content with the `<Anchor>` tag and assign it a custom anchor ID, which you can link to in URLs using the hash symbol (example: `https://website.com/page#data`).
 
-## Usage
-
-Use the `<Anchor>` component to wrap content and assign it a custom anchor ID. The anchor ID can then be referenced in URLs using the hash symbol (`#`).
+<Note>
+  Headings automatically generate anchor links based on their text content, so you don't need to use the `<Anchor>` component for headings.
+</Note>
 
 <Tabs>
-<Tab title="Rendered">
-<Anchor id="data">This content has a custom anchor</Anchor>
+<Tab title="Basic anchor">
+
+<Anchor id="data">This sentence has a custom anchor</Anchor>
 
 You can link to it using `#data` in the URL.
 </Tab>
 <Tab title="Markdown">
+
 ```jsx
-<Anchor id="data">This content has a custom anchor</Anchor>
+<Anchor id="data">This sentence has a custom anchor</Anchor>
 
 You can link to it using `#data` in the URL.
 ```
 </Tab>
 </Tabs>
 
-## Properties
-
-<ParamField path="id" type="string" required={true}>
-  The anchor ID to assign to this content. This will be used in the URL hash (e.g., `#data`)
-</ParamField>
-
-## Examples
-
-### Anchor with a table
-
 <Tabs>
-<Tab title="Rendered">
+<Tab title="Anchor a table">
 <Anchor id="api-endpoints">
 
 | Endpoint | Method | Description |
@@ -49,6 +41,7 @@ You can link to it using `#data` in the URL.
 You can link directly to the [API endpoints table](#api-endpoints).
 </Tab>
 <Tab title="Markdown">
+
 ```jsx
 <Anchor id="api-endpoints">
 
@@ -65,10 +58,8 @@ You can link directly to the [API endpoints table](#api-endpoints).
 </Tab>
 </Tabs>
 
-### Anchor with a code block
-
 <Tabs>
-<Tab title="Rendered">
+<Tab title="Anchor a Code Block">
 <Anchor id="example-code">
 
 ```python
@@ -83,6 +74,7 @@ def authenticate(api_key):
 Reference the [authentication code example](#example-code) in your implementation.
 </Tab>
 <Tab title="Markdown">
+
 ````jsx
 <Anchor id="example-code">
 
@@ -100,15 +92,10 @@ Reference the [authentication code example](#example-code) in your implementatio
 </Tab>
 </Tabs>
 
-## Use Cases
+## Properties
 
-The Anchor component is particularly useful for:
+<ParamField path="id" type="string" required={true}>
+  The anchor ID for this content. Reference it in URLs using the hash (example: `#data`)
+</ParamField>
 
-- Creating links to specific paragraphs or content blocks that don't have headings
-- Providing deep links to important information within a page
-- Building table of contents or navigation that references specific content
-- Enabling users to share links to exact locations in your documentation
 
-<Note>
-Headings automatically generate anchor links based on their text content, so you don't need to use the Anchor component for headings. Use Anchor for non-heading content that you want to make linkable.
-</Note>