import{r as e,h as c}from"./p-D0dWnGvB.js";const o=class{constructor(c){e(this,c)}render(){return c("div",{key:"e82fcc5ddc95454f9fd3e403d13d410dda7770bb"},c("h1",{key:"830bba313963a6594ed7ec915673cd15d5ab3d5f"},"Accordion Example"),c("div",{key:"4aa7f2463291e2ab44c5c41d5b95475567f5e913",style:{padding:"50px",display:"flex",gap:"20px"}},c("div",{key:"4e0b33591fd51725171903b33ddc9f65159ec7ca",style:{display:"flex",flexDirection:"column",gap:"20px"}},c("nds-accordion",{key:"84490ce0470aa7c79fbca625afd999de8f8d90bc",title:"Accordion Title",size:"lg",content:"The accordion component delivers large amounts of content in a small space through progressive disclosure. The user gets key details about the underlying content and can choose to expand that content within the constraints of the accordion."}),c("nds-accordion",{key:"5d527b4f49117a7c382ffcab08b05387f70c2ce4",title:"Accordion Title",size:"lg",content:"The accordion component delivers large amounts of content in a small space through progressive disclosure. The user gets key details about the underlying content and can choose to expand that content within the constraints of the accordion."},c("div",{key:"a6a7afef6c50157313167820b77fcb8e1745c78b"},c("p",{key:"36cf4446ab537c11677a78fca980e2562fb1b799"},"This is a ",c("span",{key:"9768f52db6a46d01c49cd77168084b8ddecbc943",style:{color:"red"}},"custom")," content inside the accordion."),c("p",{key:"cc23685b58dcbd5b1e69e13b709501359d8c5304"},"You can put any React nodes here."))))))}};export{o as nds_accordion_usage}