--- title: Components description: "The props of every built-in component, the live references, the gate blocks and this site's own components, with what each renders as server HTML and as agent Markdown." url: 'https://larecipe.saleem.dev/3.x/reference/components' version: 3.x locale: en last_updated: '2026-10-18' --- > Docs index: https://larecipe.saleem.dev/3.x/llms.txt · MCP: https://larecipe.saleem.dev/mcp · Skill: https://larecipe.saleem.dev/skill.md # Components Every component a page on this site can use: its props, the HTML the server renders and the Markdown agents read. For live examples, see [Components](https://larecipe.saleem.dev/3.x/writing/components.md). ## How props are checked - A missing required prop, or a value outside the allowed values, is a `components.props` error. An unknown tag is a `components.unknown` error and renders as escaped text. `larecipe:validate` reports both, and a page that renders with errors is not cached. - Props a component does not declare are dropped before anything renders, for every built-in component and for every component on a database set. Only a custom component on a repository set keeps them, so it can accept data LaRecipe does not describe. Props LaRecipe derives, such as a video's `embed` or a tab group's `labels`, always come from LaRecipe, never from the page. - `boolean` props read `"false"`, `"0"`, `"no"` and `""` as false; `integer` props are converted from their string. - Components marked **island** are also mounted by the React UI. Their server HTML is wrapped in `
`, where the props are JSON with defaults filled in. The server HTML is complete without JavaScript. - In agent Markdown, every URL is absolute. ## Built-in components ### Callout A highlighted note, tip or warning. A GitHub alert (`> [!WARNING]`) and a `:::warning` directive produce the same component. | Prop | Type | Required | Default | Allowed values | Description | | --- | --- | --- | --- | --- | --- | | `type` | string | no | `note` | `note`, `tip`, `important`, `warning`, `danger`, `caution`, `info`, `success` | The kind of callout, and its label. | | `title` | string | no | | | A label shown above the content, in place of the type. | - **HTML:** `