fern-api · devalog · Nov 3, 2025 · Oct 30, 2025 · Oct 30, 2025 · Oct 31, 2025
diff --git a/fern/products/docs/pages/component-library/default-components/accordion-groups.mdx b/fern/products/docs/pages/component-library/default-components/accordion-groups.mdx
@@ -6,46 +6,15 @@ description: Display expandable/collapsible options that reveal more information
 Accordion Groups allow you to organize content into collapsible sections, making it easier for users to navigate through information. With recent updates, our Accordion component now supports improved search functionality using the browser's built-in search feature.
 
 <AccordionGroup>
-  <Accordion title="Basic usage">
-    Accordion Groups can contain multiple Accordion items. Each Accordion has a title and content that can be expanded or collapsed. You can use the `defaultOpen` prop to expand specific accordions by default when the page loads.
-
-  ```jsx
-  <AccordionGroup>
-    <Accordion title="Section 1" defaultOpen={true}>
-      Content for section 1, expanded by default
-    </Accordion>
-    <Accordion title="Section 2">
-      Content for section 2
-    </Accordion>
-  </AccordionGroup>
-  ```
-  </Accordion>
-
-  <Accordion title="Searchable content">
-    Accordion components use HTML5 `<details>` and `<summary>` elements, enabling browser search (Cmd+F / Ctrl+F) so users can find content within collapsed sections.
-
-  </Accordion>
-
-  <Accordion title="Accessibility">
-    The Accordion component supports keyboard navigation and screen readers.
-  </Accordion>
-</AccordionGroup>
-
-
-## Usage examples
-
-<Tabs>
-<Tab title="Example">
-  <AccordionGroup>
   <Accordion title="Simple text content" defaultOpen={true}>
     This is a basic example with text content. It's open by default when the page loads. 
   </Accordion>
   <Accordion title="Text content with multimedia">
-  You can embed images, videos, and other media within accordions for rich interactive content.
+    You can embed images, videos, and other media within accordions for rich interactive content.
 
-  <Frame caption="Sample image">
-  <img src="https://images.pexels.com/photos/1867601/pexels-photo-1867601.jpeg" alt="A sample image" />
-  </Frame>
+    <Frame caption="Sample image">
+      <img src="https://images.pexels.com/photos/1867601/pexels-photo-1867601.jpeg" alt="A sample image" />
+    </Frame>
   </Accordion>
   <Accordion title="Nested components">
     Accordions can contain other components, such as code blocks and callouts.
@@ -59,41 +28,28 @@ Accordion Groups allow you to organize content into collapsible sections, making
     <Note>
       Here's a nested callout.
     </Note>
-
   </Accordion>
-  </AccordionGroup>
+</AccordionGroup>
 
-</Tab>
-<Tab title="Markdown">
-  <CodeBlock>
-    ````jsx
-      <AccordionGroup>
-  <Accordion title="Simple text content" defaultOpen={true}>
-    This is a basic example with text content. It's open by default when the page loads. 
-  </Accordion>
-  <Accordion title="Text content with multimedia">
-  You can embed images, videos, and other media within accordions for rich interactive content.
+## Usage
 
-  <Frame caption="Sample image">
-  <img src="https://images.pexels.com/photos/1867601/pexels-photo-1867601.jpeg" alt="A sample image" />
-  </Frame>
+```jsx
+<AccordionGroup>
+  <Accordion title="Section 1" defaultOpen={true}>
+    Content for section 1, expanded by default
   </Accordion>
-  <Accordion title="Nested components">
-    Accordions can contain other components, such as code blocks and callouts.
+  <Accordion title="Section 2">
+    Content for section 2
+  </Accordion>
+</AccordionGroup>
+```
 
-    ```ts
-    export function greet(name: string) {
-      return `Hello, ${name}!`;
-    }   
-    ```
+## Variants
 
-    <Note>
-      Here's a nested callout.
-    </Note>
+### Searchable content
 
-  </Accordion>
-  </AccordionGroup>
-  ````
-  </CodeBlock>
-</Tab>
-</Tabs>
+Accordion components use HTML5 `<details>` and `<summary>` elements, enabling browser search (Cmd+F / Ctrl+F) so users can find content within collapsed sections.
+
+### Accessibility
+
+The Accordion component supports keyboard navigation and screen readers.
diff --git a/fern/products/docs/pages/component-library/default-components/accordions.mdx b/fern/products/docs/pages/component-library/default-components/accordions.mdx
@@ -5,27 +5,31 @@ description: 'Expand or collapse to reveal more information'
 
 The Accordion component allows you to create expandable sections in your documentation. Content within accordions is searchable using browser search (cmd+f) even when collapsed. The component is optimized for SEO with server-side HTML generation, ensuring search engines can properly index all content within accordions.
 
-<Tabs>
-  <Tab title="Examples">
-      <Accordion title='Single Accordion'>
-        This is an example of an accordion component. When clicked, it expands to reveal this additional content. 
-      </Accordion>
-      <Accordion title='Accordion open by default' defaultOpen={true}>
-      You can use the `defaultOpen` property to have specific accordions expanded by default when the page loads. This is useful for highlighting important information or frequently accessed content.
-    </Accordion>
-  </Tab>
-  <Tab title="Markdown">
-    ```jsx
-    <Accordion title='Single Accordion'>
-      This is an example of an accordion component. When clicked, it expands to reveal this additional content.
-    </Accordion>
-
-    <Accordion title='Accordion open by default' defaultOpen={true}>
-      You can use the `defaultOpen` property to have specific accordions expanded by default when the page loads. This is useful for highlighting important information or frequently accessed content.
-    </Accordion>
-    ```
-  </Tab>
-</Tabs>
+<Accordion title='Single accordion'>
+  This is an example of an accordion component. When clicked, it expands to reveal this additional content. 
+</Accordion>
+
+## Usage
+
+```jsx
+<Accordion title='Single accordion'>
+  This is an example of an accordion component. When clicked, it expands to reveal this additional content.
+</Accordion>
+```
+
+## Variants
+
+### Default open
+
+<Accordion title='Accordion open by default' defaultOpen={true}>
+  You can use the `defaultOpen` property to have specific accordions expanded by default when the page loads. This is useful for highlighting important information or frequently accessed content.
+</Accordion>
+
+```jsx
+<Accordion title='Accordion open by default' defaultOpen={true}>
+  You can use the `defaultOpen` property to have specific accordions expanded by default when the page loads. This is useful for highlighting important information or frequently accessed content.
+</Accordion>
+```
 
 ## Properties
 

diff --git a/fern/products/docs/pages/component-library/default-components/anchor.mdx b/fern/products/docs/pages/component-library/default-components/anchor.mdx
@@ -9,88 +9,81 @@ Use the `<Anchor>` component to create links to specific paragraphs, tables, and
   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="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">
+
+## Usage
 
 ```jsx
 <Anchor id="data">This sentence has a custom anchor</Anchor>
 
 You can link to it using `#data` in the URL.
 ```
-</Tab>
-</Tabs>
 
-<Tabs>
-<Tab title="Anchor a table">
+## Variants
+
+### Anchor a table
+
 <Anchor id="api-endpoints">
 
 | Endpoint | Method | Description |
 |----------|--------|-------------|
-| `/users` | GET | Retrieve all users |
-| `/users/:id` | GET | Retrieve a specific user |
-| `/users` | POST | Create a new user |
+| `/plants` | GET | Retrieve all plants |
+| `/plants/:id` | GET | Retrieve a specific plant |
+| `/plants` | POST | Create a new plant |
 
 </Anchor>
 
 You can link directly to the [API endpoints table](#api-endpoints).
-</Tab>
-<Tab title="Markdown">
 
 ```jsx
 <Anchor id="api-endpoints">
 
 | Endpoint | Method | Description |
 |----------|--------|-------------|
-| `/users` | GET | Retrieve all users |
-| `/users/:id` | GET | Retrieve a specific user |
-| `/users` | POST | Create a new user |
+| `/plants` | GET | Retrieve all plants |
+| `/plants/:id` | GET | Retrieve a specific plant |
+| `/plants` | POST | Create a new plant |
 
 </Anchor>
 
 You can link directly to the [API endpoints table](#api-endpoints).
 ```
-</Tab>
-</Tabs>
 
-<Tabs>
-<Tab title="Anchor a Code Block">
+### Anchor a code block
+
 <Anchor id="example-code">
 
 ```python
-def authenticate(api_key):
-    """Authenticate using your API key"""
+def water_plant(plant_id, amount):
+    """Water a plant with specified amount"""
     headers = {"Authorization": f"Bearer {api_key}"}
-    return requests.get("https://api.example.com/auth", headers=headers)
+    return requests.post(f"https://api.example.com/plants/{plant_id}/water", 
+                        json={"amount": amount}, 
+                        headers=headers)
 ```
 
 </Anchor>
 
-Reference the [authentication code example](#example-code) in your implementation.
-</Tab>
-<Tab title="Markdown">
+Reference the [watering code example](#example-code) in your implementation.
 
 ````jsx
 <Anchor id="example-code">
 
 ```python
-def authenticate(api_key):
-    """Authenticate using your API key"""
+def water_plant(plant_id, amount):
+    """Water a plant with specified amount"""
     headers = {"Authorization": f"Bearer {api_key}"}
-    return requests.get("https://api.example.com/auth", headers=headers)
+    return requests.post(f"https://api.example.com/plants/{plant_id}/water", 
+                        json={"amount": amount}, 
+                        headers=headers)
 ```
 
 </Anchor>
 
-Reference the [authentication code example](#example-code) in your implementation.
+Reference the [watering code example](#example-code) in your implementation.
 ````
-</Tab>
-</Tabs>
 
 ## Properties
 

diff --git a/fern/products/docs/pages/component-library/default-components/aside.mdx b/fern/products/docs/pages/component-library/default-components/aside.mdx
@@ -5,14 +5,14 @@ description: 'Push any content inside the Aside component to the right of the pa
 
 The Aside component creates a sticky container that floats content to the right of your page. Use it to showcase code examples, API snippets, or any supplementary content that should stay visible as users scroll.
 
-<CodeBlock title="Markdown">
-```jsx
 <Aside>
-    <EndpointRequestSnippet endpoint='POST /snippets' />
+    <EndpointRequestSnippet endpoint='POST /chat/{domain}' />
 </Aside>
-```
-</CodeBlock>
 
+## Usage
+
+```jsx
 <Aside>
-    <EndpointRequestSnippet endpoint='POST /snippets' />
+    <EndpointRequestSnippet endpoint='POST /chat/{domain}' />
 </Aside>
+```
diff --git a/fern/products/docs/pages/component-library/default-components/badges.mdx b/fern/products/docs/pages/component-library/default-components/badges.mdx
@@ -7,22 +7,15 @@ Use the `Badge` component to display small pieces of information, such as status
 
 To display longer notes, use the [Callouts component](/docs/writing-content/components/callouts) instead. 
 
-<Tabs>
-<Tab title="Badge example">
-
 ### Plant Care API <Badge intent="info">v2.1.0</Badge> <Badge intent="launch" minimal>New</Badge>
 
-</Tab>
-<Tab title="Markdown">
+## Usage
 
 ```jsx
-### Plant Care API <Badge intent="success">v2.1.0</Badge> <Badge intent="launch" minimal>New</Badge>
+### Plant Care API <Badge intent="info">v2.1.0</Badge> <Badge intent="launch" minimal>New</Badge>
 ```
 
-</Tab>
-</Tabs>
-
-## Badge varieties
+## Variants
 
 ### Success
 
@@ -121,4 +114,4 @@ Customize your Badges using the following properties:
 <Badge intent="success" minimal outlined>Minimal and outlined</Badge> 
 ```
 </Tab>
-</Tabs>
+</Tabs>