--- title: "Disclosure" description: "A collapsible section built on `
`, animating between open and closed." canonical_url: "https://sanity-id-docs.sanity.build/sanity-id/components/disclosure" md_url: "https://sanity-id-docs.sanity.build/sanity-id/components/disclosure.md" docs_index: "https://sanity-id-docs.sanity.build/sanity-id/llms.txt" version: "1.15.2" --- > Part of the Sanity ID reference. The index of every page is at https://sanity-id-docs.sanity.build/sanity-id/llms.txt. # Disclosure A collapsible section built on `
`, animating between open and closed. ```tsx import { Disclosure } from "@sanity/sanity-id/components/disclosure" ``` ## Props | Prop | Type | Required | Default | Description | | --- | --- | --- | --- | --- | | `summary` | `string` | yes | — | Clickable summary text shown when the disclosure is collapsed | | `children` | `ReactNode` | no | — | Content shown when the disclosure is expanded | | `disableAnimations` | `boolean` | no | — | Disables animation when opening and closing the disclosure contents. Note animations only work in browsers that support interpolate-size | Also accepts every prop of `ComponentProps<"details">`. ## Usage ### Example 1 ```tsx import { Disclosure } from "@sanity/sanity-id/components/disclosure" export default () => { return (

Occaecat dolor ipsum sint labore deserunt elit nulla duis anim ut sit fugiat eiusmod dolore Lorem. Dolore consectetur cillum commodo sint in velit magna duis nisi nisi fugiat dolor culpa. Veniam nostrud id deserunt nulla sit aliqua nostrud nostrud dolor elit voluptate veniam tempor. Veniam Lorem qui sunt. In laborum ea consequat nisi sunt anim labore consequat officia pariatur laborum ullamco voluptate labore sit. Magna do non enim reprehenderit laborum duis. Nulla voluptate cillum adipisicing. Amet voluptate fugiat et.

Enim veniam cillum aliquip culpa est cupidatat reprehenderit deserunt reprehenderit id esse esse. Laborum voluptate laboris amet proident. Officia cupidatat culpa deserunt excepteur sunt esse sit sit sit dolor labore ex ex ullamco Lorem. Ullamco culpa anim irure culpa irure proident do mollit sint deserunt. Deserunt et et incididunt veniam consequat sint voluptate quis ea commodo. Deserunt fugiat id dolor sit. Nulla incididunt nostrud anim consectetur consectetur non. Ad aliqua fugiat magna officia et.

Exercitation enim adipisicing minim sint. Excepteur reprehenderit excepteur consectetur nisi consectetur. Ullamco minim sint exercitation reprehenderit deserunt et eiusmod laborum laborum. Reprehenderit fugiat amet incididunt et eiusmod.

Nulla voluptate laboris aliqua. Adipisicing Lorem irure reprehenderit pariatur eiusmod do consequat do consequat aute. Pariatur officia culpa est ad pariatur velit velit. Consequat amet occaecat exercitation esse eu mollit amet esse fugiat deserunt. Nisi Lorem dolore amet labore duis commodo aute. Velit pariatur ut sit velit esse proident sunt nisi culpa occaecat.

Esse qui aliqua quis elit duis ut ullamco ullamco culpa laborum adipisicing consectetur excepteur dolor. Mollit quis aute deserunt. Id aliqua sit dolor elit eu laborum culpa. Officia mollit nulla anim ex culpa reprehenderit sit non et. Culpa exercitation eu in pariatur ullamco mollit pariatur amet. Qui aliqua est nostrud amet cillum. Amet enim duis commodo officia irure id adipisicing ullamco dolor labore. Pariatur adipisicing occaecat reprehenderit laborum incididunt nisi do consectetur mollit reprehenderit.

Fugiat eu ea dolor cillum irure fugiat labore adipisicing officia irure consectetur enim et. Dolore occaecat velit veniam ex labore ex ex est dolor sint. Officia enim aliqua ea cillum. Culpa laborum occaecat aute magna irure ad fugiat est culpa amet excepteur. Dolore Lorem ea ut aliqua reprehenderit deserunt nostrud excepteur aliquip ut sit. Magna magna veniam consectetur mollit mollit excepteur irure Lorem ad eu est ad dolore elit. Cillum anim et proident commodo sit laborum duis quis voluptate minim sunt in et officia. Anim excepteur magna sint id anim consequat non incididunt esse consectetur laborum esse pariatur est sunt.

Proident excepteur irure amet nulla nisi et esse quis. Excepteur do culpa laborum magna dolor Lorem proident cupidatat voluptate ad tempor. Veniam nostrud enim sint mollit sunt ex dolor dolor est ullamco. Duis laboris amet amet amet incididunt dolor esse pariatur exercitation. Amet nulla ad adipisicing cupidatat incididunt occaecat mollit in enim amet enim exercitation veniam adipisicing sint. Reprehenderit cillum minim aliqua aliqua amet cupidatat. Est excepteur culpa eiusmod.

Irure consequat et consectetur ullamco deserunt deserunt nostrud in. Excepteur non et sint nisi dolore. In sit voluptate enim dolor minim laborum sint ea aliqua consectetur excepteur tempor. Qui enim consequat aliqua et officia excepteur. Nulla do aute esse ullamco culpa mollit nostrud officia elit fugiat nostrud elit anim. Sunt nostrud incididunt ea esse adipisicing cupidatat pariatur duis eiusmod sunt anim do sit.

Id mollit officia deserunt minim qui consequat velit. Esse minim officia sunt ad amet laboris Lorem cillum proident duis laboris cillum. Ad ipsum nostrud nulla consequat occaecat laboris nisi fugiat magna do sit cillum. Officia id esse magna ex et ut sit qui ut. Cupidatat mollit cupidatat proident enim excepteur. Labore Lorem ullamco ea ut commodo elit qui. Officia nisi reprehenderit ut nulla enim commodo qui laborum. Occaecat cillum anim consequat elit non exercitation.

Aliquip proident sit fugiat nisi fugiat qui minim. Cillum ea enim consequat enim nulla quis pariatur. Incididunt proident tempor consectetur et cillum culpa consectetur amet excepteur magna duis ad amet laboris. Magna dolore anim eiusmod laborum laboris sint consectetur exercitation exercitation. Anim nulla sint nostrud quis sunt anim.

Eu proident aliquip non ullamco ut ullamco pariatur est in do duis nulla. Anim consequat aliqua amet velit ad ea exercitation consectetur dolor culpa magna sit in ipsum. Do irure aliqua irure eu proident minim deserunt mollit cupidatat velit. Laboris mollit duis ullamco ullamco nostrud ut officia et ad duis velit incididunt quis nostrud.

Incididunt fugiat do id consectetur aute commodo et eu. Ad ex ut nisi enim esse dolor. Officia sint culpa quis quis excepteur ad in. Cupidatat eu commodo reprehenderit culpa sit amet officia eiusmod reprehenderit ut cillum elit. Amet cillum reprehenderit esse do id cupidatat ex nulla dolor ex veniam labore adipisicing fugiat aliqua. Exercitation sint cillum quis dolor aute adipisicing.

Fugiat reprehenderit irure id Lorem do sint excepteur excepteur duis nulla eu tempor nisi commodo. Reprehenderit in sit pariatur officia. Labore excepteur minim laborum Lorem aliqua elit cupidatat anim aliqua id incididunt. Magna incididunt ut sunt velit adipisicing commodo nulla labore ipsum consectetur consequat proident qui fugiat nostrud. Mollit minim veniam cillum pariatur. Deserunt sunt voluptate enim proident consequat esse Lorem excepteur nulla voluptate sit minim occaecat quis consequat. Anim labore reprehenderit pariatur aute voluptate do esse elit ut.

Irure sit minim quis nostrud officia duis laboris cillum elit deserunt. Eu est anim ex. Nostrud tempor ex magna ad sit dolor. Ad ullamco cillum adipisicing in eu sint velit laboris eiusmod anim cillum aliqua consequat ex. Mollit eiusmod cillum dolor elit sit fugiat sint occaecat officia tempor anim. Minim cupidatat duis incididunt sint commodo mollit aliqua ipsum. Veniam esse occaecat qui elit laborum veniam culpa exercitation in laborum fugiat culpa anim.

) } ``` ### Disabling opening/closing animations ```tsx import { Disclosure } from "@sanity/sanity-id/components/disclosure" export default () => { return (

Occaecat dolor ipsum sint labore deserunt elit nulla duis anim ut sit fugiat eiusmod dolore Lorem. Dolore consectetur cillum commodo sint in velit magna duis nisi nisi fugiat dolor culpa. Veniam nostrud id deserunt nulla sit aliqua nostrud nostrud dolor elit voluptate veniam tempor. Veniam Lorem qui sunt. In laborum ea consequat nisi sunt anim labore consequat officia pariatur laborum ullamco voluptate labore sit. Magna do non enim reprehenderit laborum duis. Nulla voluptate cillum adipisicing. Amet voluptate fugiat et.

) } ```