1# Dropdown Menu
2 
3Dropdown action menu
4 
5**Parts:** `DropdownMenuRoot`, `DropdownMenuTrigger`, `DropdownMenuPortal`, `DropdownMenuContent`, `DropdownMenuItem`, `DropdownMenuCheckboxItem`, `DropdownMenuRadioGroup`, `DropdownMenuRadioItem`, `DropdownMenuItemIndicator`, `DropdownMenuLabel`, `DropdownMenuGroup`, `DropdownMenuSeparator`, `DropdownMenuSub`, `DropdownMenuSubTrigger`, `DropdownMenuSubContent`, `DropdownMenuArrow`
6 
7## DropdownMenuRoot
8 
9### Props
10| Prop | Type | Default |
11|------|------|---------|
12| `defaultOpen` | `boolean` | - |
13| `dir` | `"ltr" \| "rtl"` | - |
14| `modal` | `boolean` | `true` |
15| `open` | `boolean` | - |
16 
17### Emits
18| Event | Payload |
19|-------|---------|
20| `update:open` | `[payload: boolean]` |
21 
22### Slots
23| Slot | Type |
24|------|------|
25| `open` | `boolean` |
26 
27## DropdownMenuTrigger
28 
29### Props
30| Prop | Type | Default |
31|------|------|---------|
32| `as` | `AsTag \| Component` | `"button"` |
33| `asChild` | `boolean` | - |
34| `disabled` | `boolean` | - |
35 
36## DropdownMenuPortal
37 
38### Props
39| Prop | Type | Default |
40|------|------|---------|
41| `disabled` | `boolean` | - |
42| `forceMount` | `boolean` | - |
43| `to` | `string \| HTMLElement` | - |
44 
45## DropdownMenuContent
46 
47### Props
48| Prop | Type | Default |
49|------|------|---------|
50| `align` | `"start" \| "center" \| "end"` | - |
51| `alignOffset` | `number` | - |
52| `arrowPadding` | `number` | - |
53| `as` | `AsTag \| Component` | `"div"` |
54| `asChild` | `boolean` | - |
55| `avoidCollisions` | `boolean` | - |
56| `collisionBoundary` | `Element \| (Element \| null)[] \| null` | - |
57| `collisionPadding` | `number \| Partial<Record<"top" \| "right" \| "bott...` | - |
58| `forceMount` | `boolean` | - |
59| `hideWhenDetached` | `boolean` | - |
60| `loop` | `boolean` | - |
61| `prioritizePosition` | `boolean` | - |
62| `side` | `"top" \| "right" \| "bottom" \| "left"` | - |
63| `sideOffset` | `number` | - |
64| `sticky` | `"partial" \| "always"` | - |
65| `updatePositionStrategy` | `"always" \| "optimized"` | - |
66 
67### Emits
68| Event | Payload |
69|-------|---------|
70| `closeAutoFocus` | `[event: Event]` |
71| `escapeKeyDown` | `[event: KeyboardEvent]` |
72| `focusOutside` | `[event: FocusOutsideEvent]` |
73| `interactOutside` | `[event: PointerDownOutsideEvent \| FocusOutsideE...` |
74| `pointerDownOutside` | `[event: PointerDownOutsideEvent]` |
75 
76## DropdownMenuItem
77 
78### Props
79| Prop | Type | Default |
80|------|------|---------|
81| `as` | `AsTag \| Component` | `"div"` |
82| `asChild` | `boolean` | - |
83| `disabled` | `boolean` | - |
84| `textValue` | `string` | - |
85 
86### Emits
87| Event | Payload |
88|-------|---------|
89| `select` | `[event: Event]` |
90 
91## DropdownMenuCheckboxItem
92 
93### Props
94| Prop | Type | Default |
95|------|------|---------|
96| `as` | `AsTag \| Component` | `"div"` |
97| `asChild` | `boolean` | - |
98| `checked` | `false \| true \| "indeterminate"` | - |
99| `disabled` | `boolean` | - |
100| `textValue` | `string` | - |
101 
102### Emits
103| Event | Payload |
104|-------|---------|
105| `select` | `[event: Event]` |
106| `update:checked` | `[payload: boolean]` |
107 
108## DropdownMenuRadioGroup
109 
110### Props
111| Prop | Type | Default |
112|------|------|---------|
113| `as` | `AsTag \| Component` | `"div"` |
114| `asChild` | `boolean` | - |
115| `modelValue` | `string` | - |
116 
117### Emits
118| Event | Payload |
119|-------|---------|
120| `update:modelValue` | `[payload: string]` |
121 
122## DropdownMenuRadioItem
123 
124### Props
125| Prop | Type | Default |
126|------|------|---------|
127| `as` | `AsTag \| Component` | `"div"` |
128| `asChild` | `boolean` | - |
129| `disabled` | `boolean` | - |
130| `textValue` | `string` | - |
131| `value`* | `string` | - |
132 
133### Emits
134| Event | Payload |
135|-------|---------|
136| `select` | `[event: Event]` |
137 
138## DropdownMenuItemIndicator
139 
140### Props
141| Prop | Type | Default |
142|------|------|---------|
143| `as` | `AsTag \| Component` | `"div"` |
144| `asChild` | `boolean` | - |
145| `forceMount` | `boolean` | - |
146 
147## DropdownMenuLabel
148 
149### Props
150| Prop | Type | Default |
151|------|------|---------|
152| `as` | `AsTag \| Component` | `"div"` |
153| `asChild` | `boolean` | - |
154 
155## DropdownMenuGroup
156 
157### Props
158| Prop | Type | Default |
159|------|------|---------|
160| `as` | `AsTag \| Component` | `"div"` |
161| `asChild` | `boolean` | - |
162 
163## DropdownMenuSeparator
164 
165### Props
166| Prop | Type | Default |
167|------|------|---------|
168| `as` | `AsTag \| Component` | `"div"` |
169| `asChild` | `boolean` | - |
170 
171## DropdownMenuSub
172 
173### Props
174| Prop | Type | Default |
175|------|------|---------|
176| `defaultOpen` | `boolean` | - |
177| `open` | `boolean` | - |
178 
179### Emits
180| Event | Payload |
181|-------|---------|
182| `update:open` | `[payload: boolean]` |
183 
184### Slots
185| Slot | Type |
186|------|------|
187| `open` | `boolean` |
188 
189## DropdownMenuSubTrigger
190 
191### Props
192| Prop | Type | Default |
193|------|------|---------|
194| `as` | `AsTag \| Component` | `"div"` |
195| `asChild` | `boolean` | - |
196| `disabled` | `boolean` | - |
197| `textValue` | `string` | - |
198 
199## DropdownMenuSubContent
200 
201### Props
202| Prop | Type | Default |
203|------|------|---------|
204| `alignOffset` | `number` | - |
205| `arrowPadding` | `number` | - |
206| `as` | `AsTag \| Component` | `"div"` |
207| `asChild` | `boolean` | - |
208| `avoidCollisions` | `boolean` | - |
209| `collisionBoundary` | `Element \| (Element \| null)[] \| null` | - |
210| `collisionPadding` | `number \| Partial<Record<"top" \| "right" \| "bott...` | - |
211| `forceMount` | `boolean` | - |
212| `hideWhenDetached` | `boolean` | - |
213| `loop` | `boolean` | - |
214| `prioritizePosition` | `boolean` | - |
215| `sideOffset` | `number` | - |
216| `sticky` | `"partial" \| "always"` | - |
217| `updatePositionStrategy` | `"always" \| "optimized"` | - |
218 
219### Emits
220| Event | Payload |
221|-------|---------|
222| `closeAutoFocus` | `[event: Event]` |
223| `entryFocus` | `[event: Event]` |
224| `escapeKeyDown` | `[event: KeyboardEvent]` |
225| `focusOutside` | `[event: FocusOutsideEvent]` |
226| `interactOutside` | `[event: PointerDownOutsideEvent \| FocusOutsideE...` |
227| `openAutoFocus` | `[event: Event]` |
228| `pointerDownOutside` | `[event: PointerDownOutsideEvent]` |
229 
230## DropdownMenuArrow
231 
232### Props
233| Prop | Type | Default |
234|------|------|---------|
235| `as` | `AsTag \| Component` | `"svg"` |
236| `asChild` | `boolean` | - |
237| `height` | `number` | `5` |
238| `width` | `number` | `10` |
239