1010
1111An accordion organizes related content into expandable and collapsible sections, reducing page scrolling and helping users focus on relevant information. Each section has a trigger button and a content panel. Clicking a trigger toggles the visibility of its associated panel.
1212
13- <docs-code-multifile preview hideCode path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. ts " >
14- <docs-code header =" TS " path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. ts " />
15- <docs-code header =" HTML " path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. html " />
16- <docs-code header =" CSS " path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. css " />
13+ <docs-code-multifile preview hideCode path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.ts " >
14+ <docs-code header =" TS " path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.ts " />
15+ <docs-code header =" HTML " path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.html " />
16+ <docs-code header =" CSS " path =" adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.css " />
1717</docs-code-multifile >
1818
1919## Usage
@@ -52,24 +52,24 @@ Set `[multiExpandable]="false"` to allow only one panel to be open at a time. Op
5252
5353<docs-tab-group >
5454 <docs-tab label =" Basic " >
55- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. ts">
56- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. ts"/>
57- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. html"/>
58- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.component. css"/>
55+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.ts">
56+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.ts"/>
57+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.html"/>
58+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/single-expansion/basic/app/app.css"/>
5959 </docs-code-multifile>
6060 </docs-tab >
6161 <docs-tab label =" Material " >
62- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.component. ts">
63- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.component. ts"/>
64- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.component. html"/>
65- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.component. css"/>
62+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.ts">
63+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.ts"/>
64+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.html"/>
65+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/single-expansion/material/app/app.css"/>
6666 </docs-code-multifile>
6767 </docs-tab >
6868 <docs-tab label =" Retro " >
69- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.component. ts">
70- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.component. ts"/>
71- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.component. html"/>
72- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.component. css"/>
69+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.ts">
70+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.ts"/>
71+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.html"/>
72+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/single-expansion/retro/app/app.css"/>
7373 </docs-code-multifile>
7474 </docs-tab >
7575</docs-tab-group >
@@ -82,24 +82,24 @@ Set `[multiExpandable]="true"` to allow multiple panels to be open simultaneousl
8282
8383<docs-tab-group >
8484 <docs-tab label =" Basic " >
85- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.component. ts">
86- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.component. ts"/>
87- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.component. html"/>
88- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.component. css"/>
85+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.ts">
86+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.ts"/>
87+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.html"/>
88+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/basic/app/app.css"/>
8989 </docs-code-multifile>
9090 </docs-tab >
9191 <docs-tab label =" Material " >
92- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.component. ts">
93- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.component. ts"/>
94- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.component. html"/>
95- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.component. css"/>
92+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.ts">
93+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.ts"/>
94+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.html"/>
95+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/material/app/app.css"/>
9696 </docs-code-multifile>
9797 </docs-tab >
9898 <docs-tab label =" Retro " >
99- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.component. ts">
100- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.component. ts"/>
101- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.component. html"/>
102- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.component. css"/>
99+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.ts">
100+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.ts"/>
101+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.html"/>
102+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/multi-expansion/retro/app/app.css"/>
103103 </docs-code-multifile>
104104 </docs-tab >
105105</docs-tab-group >
@@ -114,24 +114,24 @@ Disable specific triggers using the `disabled` input. Control how disabled items
114114
115115<docs-tab-group >
116116 <docs-tab label =" Basic " >
117- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.component. ts">
118- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.component. ts"/>
119- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.component. html"/>
120- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.component. css"/>
117+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.ts">
118+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.ts"/>
119+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.html"/>
120+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/basic/app/app.css"/>
121121 </docs-code-multifile>
122122 </docs-tab >
123123 <docs-tab label =" Material " >
124- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.component. ts">
125- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.component. ts"/>
126- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.component. html"/>
127- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.component. css"/>
124+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.ts">
125+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.ts"/>
126+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.html"/>
127+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/material/app/app.css"/>
128128 </docs-code-multifile>
129129 </docs-tab >
130130 <docs-tab label =" Retro " >
131- <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.component. ts">
132- <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.component. ts"/>
133- <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.component. html"/>
134- <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.component. css"/>
131+ <docs-code-multifile preview hideCode path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.ts">
132+ <docs-code header="TS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.ts"/>
133+ <docs-code header="HTML" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.html"/>
134+ <docs-code header="CSS" path="adev/src/content/examples/aria/accordion/src/disabled-focusable/retro/app/app.css"/>
135135 </docs-code-multifile>
136136 </docs-tab >
137137</docs-tab-group >
0 commit comments