---
alias: "fc.page.section"
aliases:
  - fc.page.section
category: layout
module: Core
---

# fc.page.section

Transparent grouping container that renders all descendants without any visual wrapper.

## When to Use
- Group related components into a logical section within a page
- Organize page layout without adding visual card boundaries
- Pair with `fc.page.section.header` for a titled section
- Wrap multiple descendants into a single logical unit inside tabs or list column components

## Key Props

This component has no props of its own. The source code is `export const Section = () => <Children />;` -- a pure pass-through container.

## Descendants
Yes -- accepts any component as children. All descendants are rendered directly without wrapping markup.

## Composition Patterns
- `fc.page` > `fc.page.section` > `fc.page.section.header` + child components
- `fc.page` > `fc.page.section` > `fc.card.attribute` + `fc.list`
- `fc.tabs.card` > `fc.page.section` per tab for grouped content
- `fc.list` column `type: "component"` > `fc.page.section` > multiple child components
- Use `fc.page.section.column` (alias for `fc.column`) within a section for column layout

## Gotchas
- This component renders zero DOM of its own -- it delegates entirely to `<Children />`. If you need a visual card boundary use `fc.card.attribute` or `fc.card.multi` instead.
- Easily confused with `fc.page.section.header` which adds a visible title bar with icon.
- Registered with category `content` in the component registry despite being a structural grouping element.

## Manifest Example
```json
{
  "component": "fc.page.section",
  "descendants": [
    {
      "component": "fc.page.section.header",
      "props": { "title": "Details", "icon": "MdInfo" }
    },
    {
      "component": "fc.card.attribute",
      "props": { "title": "Order Info" }
    }
  ]
}
```

## AI Parse Notes
- **Primary intent:** Declarative Mystique component definition for manifests.
- **Selection signals:** Match by `alias`, category, and required `Key Props`.
- **Assembly hints:** Combine with compatible parent/child components listed in `Composition Patterns`.
- **Safety checks:** Validate required props and data bindings before manifest generation.
