# layout

- 分组：核心组件（Core）
- 页面：/components/layout
- 源码：packages/react/src/components/layout.tsx

## 导出

```ts
import { AuthLayout, Col, Flex, LAYOUT_BREAKPOINTS, Layout, LayoutContent, LayoutFooter, LayoutHeader, LayoutSider, Row, SiderThemeProvider, Space, useBreakpoint, useSiderCollapsed, useSiderTheme } from "@modra/react";
```

## Props（LayoutSiderProps）

| 名称 | 必填 | 类型 | 说明 |
| --- | --- | --- | --- |
| `breakpoint` | 否 | `Breakpoint` |  |
| `collapsed` | 否 | `boolean` |  |
| `collapsedWidth` | 否 | `number \| string` | Width when collapsed. Defaults to the `--component-layout-sider-collapsed-width` token (80px; 56px in the admin density). |
| `collapsible` | 否 | `boolean` |  |
| `defaultCollapsed` | 否 | `boolean` |  |
| `onBreakpoint` | 否 | `(broken: boolean) => void` |  |
| `onCollapse` | 否 | `(collapsed: boolean, type: SiderCollapseType) => void` |  |
| `reverseArrow` | 否 | `boolean` |  |
| `trigger` | 否 | `React.ReactNode` |  |
| `width` | 否 | `number \| string` | Expanded width. Defaults to the `--component-layout-sider-width` token (256px; 224px in the admin density). |
| `zeroWidthTriggerStyle` | 否 | `React.CSSProperties` |  |
| `theme` | 否 | `"light" \| "dark"` |  |