{/*
 * _____                    _
 *|_   _|_      _____ _ __ | |_ _   _
 *  | | \ \ /\ / / _ \ '_ \| __| | | | Auto-generated file
 *  | |  \ V  V /  __/ | | | |_| |_| | DO NOT EDIT - changes will be overwritten
 *  |_|   \_/\_/ \___|_| |_|\__|\__, | Generated by: npx nx generate:ui twenty-docs
 *                              |___/
 *
 * This file is generated from the documentation data in packages/twenty-ui/generated.
 * To update it, edit the component prop types or design tokens in twenty-ui and run:
 *   npx nx generate:ui twenty-docs
 */}

### Section.Root

<ParamField body="Root.align" type="&quot;center&quot; | &quot;left&quot;" default="left">
  Text alignment within the section. Defaults to `left`.
</ParamField>

<ParamField body="Root.color" type="&quot;primary&quot; | &quot;secondary&quot; | &quot;tertiary&quot;" default="primary">
  Text color within the section. Defaults to `primary`.
</ParamField>

<ParamField body="Root.fullWidth" type="boolean" default="true">
  Whether the section fills the available width. Defaults to `true`.
</ParamField>

<ParamField body="Root.render" type="ReactElement&lt;unknown, string | JSXElementConstructor&lt;any&gt;&gt; | ComponentRenderFn&lt;HTMLProps, {}&gt;">
  Allows you to replace the component's HTML element
  with a different tag, or compose it with another component.

  Accepts a `ReactElement` or a function that returns the element to render.
</ParamField>

### Section.Header

<ParamField body="Header.adornment" type="ReactNode">
  Content alongside the heading, such as an action button or status.
</ParamField>

<ParamField body="Header.color" type="&quot;primary&quot; | &quot;secondary&quot; | &quot;tertiary&quot;" default="primary">
  Theme font color. Defaults to `primary`.
</ParamField>

<ParamField body="Header.description" type="ReactNode">
  Supporting text associated with the heading. Strings support links and overflow tooltips; React nodes render as supplied.
</ParamField>

<ParamField body="Header.descriptionLineClamp" type="number" default="5">
  Maximum visible lines for a string description. Defaults to `5`. Overflowing descriptions can be read in a tooltip on hover or focus.
</ParamField>

<ParamField body="Header.level" type="5 | 1 | 2 | 3 | 4 | 6" default="2">
  Semantic heading level, from `h1` through `h6`. Does not change the visual size. Defaults to `2`.
</ParamField>

<ParamField body="Header.render" type="ReactElement&lt;unknown, string | JSXElementConstructor&lt;any&gt;&gt; | ComponentRenderFn&lt;HTMLProps, {}&gt;">
  Allows you to replace the component's HTML element
  with a different tag, or compose it with another component.

  Accepts a `ReactElement` or a function that returns the element to render.
</ParamField>

<ParamField body="Header.size" type="&quot;sm&quot; | &quot;md&quot; | &quot;lg&quot; | &quot;xs&quot;" default="md">
  Visual font size, independent of the heading level. Defaults to `md`.
</ParamField>

<ParamField body="Header.title" type="ReactNode" required>
  Content of the section heading.
</ParamField>