---
title: Espandibile
description: Expandable crea un semplice controllo per mostrare o nascondere contenuti non essenziali al flusso principale.
---

> **For AI agents:** the complete documentation index is at [llms.txt](/docs/llms.txt). Append `.md` to any page URL for its markdown version.

Usa Expandable per nascondere risposte API dettagliate, procedure di risoluzione dei problemi o informazioni supplementari che interromperebbero il flusso di lettura. Viene visualizzato come un singolo elemento espandibile cliccabile. È più leggero di Accordion, progettato per sezioni raggruppate e navigabili.

Usa Expandable quando:
- **I dettagli supplementari** interromperebbero la narrazione principale
- **Le informazioni facoltative** sono utili solo per alcuni lettori
- **I contenuti lunghi** (come le risposte API complete) devono essere compressi per impostazione predefinita

## Utilizzo di base

<Expandable title="Mostra più dettagli">
  Questi dettagli sono nascosti per impostazione predefinita e vengono mostrati al clic.
</Expandable>

```mdx
<Expandable title="Show more details">
  These details are hidden by default and revealed when clicked.
</Expandable>
```

## Aperto per impostazione predefinita

Inizia espanso:

<Expandable title="Espanso per impostazione predefinita" defaultOpen>
  Questa sezione è visibile all'apertura.
</Expandable>

```mdx
<Expandable title="Expanded by default" defaultOpen>
  This section starts visible.
</Expandable>
```

## Casi d'uso comuni

### Dettagli della risposta API

Comprimi le risposte dettagliate che interromperebbero altrimenti il flusso della documentazione:

<Expandable title="Visualizza risposta completa">
```json
{
  "id": "123",
  "name": "Example",
  "metadata": {
    "created": "2024-01-01",
    "updated": "2024-01-15"
  }
}
```
</Expandable>

### Procedura di risoluzione dei problemi

<Expandable title="Problemi di connessione?">
  1. Controlla la connessione di rete
  2. Verifica che l'endpoint API sia corretto
  3. Assicurati che la chiave API sia valida
</Expandable>

## Proprietà

<ParamField name="title" type="string" required>
  Testo dell'intestazione della sezione.
</ParamField>

<ParamField name="defaultOpen" type="boolean" default="false">
  Avvia la sezione espansa.
</ParamField>

## Expandable e Accordion

| Funzionalità | Expandable | Accordion |
|---------|------------|-----------|
| Scopo | Nascondere contenuti supplementari | Organizzare sezioni di pari importanza |
| Icone | No | Sì |
| Descrizioni | No | Sì (supporto per sottotitoli) |
| Raggruppamento | Autonomo | Può essere raggruppato con AccordionGroup |
| Ideale per | Dettagli facoltativi, esempi lunghi | Domande frequenti, elenchi di funzionalità, navigazione |

**Regola generale:** se il contenuto è "utile ma non indispensabile", usa Expandable. Se gli utenti devono scegliere tra più sezioni, usa Accordion.

## Cosa fare dopo?

<Columns cols={2}>
  <Card title="Panoramica dei componenti" icon="puzzle-piece" href="/it/components/overview">
    Esplora tutti i componenti disponibili
  </Card>
  <Card title="Nozioni di base su MDX" icon="file-code" href="/it/content/mdx-basics">
    Scopri come usare i componenti in MDX
  </Card>
</Columns>