gladvn 0.2.16 → 0.2.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (315) hide show
  1. package/bin/cli.js +9 -6
  2. package/dist/components/macro/accordion-preset.d.ts.map +1 -1
  3. package/dist/components/macro/alert-dialog-preset.d.ts.map +1 -1
  4. package/dist/components/macro/alert-preset.d.ts.map +1 -1
  5. package/dist/components/macro/avatar-preset.d.ts.map +1 -1
  6. package/dist/components/macro/breadcrumb-preset.d.ts.map +1 -1
  7. package/dist/components/macro/card-preset.d.ts.map +1 -1
  8. package/dist/components/macro/carousel-preset.d.ts.map +1 -1
  9. package/dist/components/macro/checkbox-preset.d.ts.map +1 -1
  10. package/dist/components/macro/combobox-preset.d.ts.map +1 -1
  11. package/dist/components/macro/command-preset.d.ts +1 -1
  12. package/dist/components/macro/command-preset.d.ts.map +1 -1
  13. package/dist/components/macro/date-picker.d.ts.map +1 -1
  14. package/dist/components/macro/dialog-preset.d.ts.map +1 -1
  15. package/dist/components/macro/empty-preset.d.ts.map +1 -1
  16. package/dist/components/macro/field-preset.d.ts.map +1 -1
  17. package/dist/components/macro/input-otp-preset.d.ts +6 -0
  18. package/dist/components/macro/input-otp-preset.d.ts.map +1 -1
  19. package/dist/components/macro/input-preset.d.ts +1 -1
  20. package/dist/components/macro/input-preset.d.ts.map +1 -1
  21. package/dist/components/macro/pagination-preset.d.ts.map +1 -1
  22. package/dist/components/macro/progress-preset.d.ts.map +1 -1
  23. package/dist/components/macro/radio-group-preset.d.ts.map +1 -1
  24. package/dist/components/macro/select-preset.d.ts.map +1 -1
  25. package/dist/components/macro/slider-preset.d.ts.map +1 -1
  26. package/dist/components/macro/switch-preset.d.ts.map +1 -1
  27. package/dist/components/macro/tabs-preset.d.ts +1 -1
  28. package/dist/components/macro/tabs-preset.d.ts.map +1 -1
  29. package/dist/components/macro/textarea-preset.d.ts +1 -1
  30. package/dist/components/macro/textarea-preset.d.ts.map +1 -1
  31. package/dist/components/micro/accordion.d.ts +7 -0
  32. package/dist/components/micro/accordion.d.ts.map +1 -1
  33. package/dist/components/micro/alert-dialog.d.ts.map +1 -1
  34. package/dist/components/micro/alert.d.ts +7 -0
  35. package/dist/components/micro/alert.d.ts.map +1 -1
  36. package/dist/components/micro/aspect-ratio.d.ts +7 -0
  37. package/dist/components/micro/aspect-ratio.d.ts.map +1 -1
  38. package/dist/components/micro/avatar.d.ts.map +1 -1
  39. package/dist/components/micro/badge.d.ts +8 -1
  40. package/dist/components/micro/badge.d.ts.map +1 -1
  41. package/dist/components/micro/breadcrumb.d.ts +7 -0
  42. package/dist/components/micro/breadcrumb.d.ts.map +1 -1
  43. package/dist/components/micro/button.d.ts +8 -1
  44. package/dist/components/micro/button.d.ts.map +1 -1
  45. package/dist/components/micro/calendar.d.ts +2 -2
  46. package/dist/components/micro/calendar.d.ts.map +1 -1
  47. package/dist/components/micro/carousel.d.ts.map +1 -1
  48. package/dist/components/micro/chart.d.ts.map +1 -1
  49. package/dist/components/micro/checkbox.d.ts.map +1 -1
  50. package/dist/components/micro/collapsible.d.ts.map +1 -1
  51. package/dist/components/micro/combobox.d.ts.map +1 -1
  52. package/dist/components/micro/command.d.ts.map +1 -1
  53. package/dist/components/micro/context-menu.d.ts.map +1 -1
  54. package/dist/components/micro/dialog.d.ts.map +1 -1
  55. package/dist/components/micro/drawer.d.ts.map +1 -1
  56. package/dist/components/micro/dropdown-menu.d.ts.map +1 -1
  57. package/dist/components/micro/empty.d.ts +7 -0
  58. package/dist/components/micro/empty.d.ts.map +1 -1
  59. package/dist/components/micro/field.d.ts.map +1 -1
  60. package/dist/components/micro/hover-card.d.ts +1 -1
  61. package/dist/components/micro/hover-card.d.ts.map +1 -1
  62. package/dist/components/micro/input-group.d.ts.map +1 -1
  63. package/dist/components/micro/input-otp.d.ts.map +1 -1
  64. package/dist/components/micro/input.d.ts +7 -0
  65. package/dist/components/micro/input.d.ts.map +1 -1
  66. package/dist/components/micro/item.d.ts.map +1 -1
  67. package/dist/components/micro/label.d.ts.map +1 -1
  68. package/dist/components/micro/menubar.d.ts.map +1 -1
  69. package/dist/components/micro/navigation-menu.d.ts +8 -1
  70. package/dist/components/micro/navigation-menu.d.ts.map +1 -1
  71. package/dist/components/micro/pagination.d.ts.map +1 -1
  72. package/dist/components/micro/popover.d.ts.map +1 -1
  73. package/dist/components/micro/progress.d.ts.map +1 -1
  74. package/dist/components/micro/radio-group.d.ts.map +1 -1
  75. package/dist/components/micro/select.d.ts +1 -1
  76. package/dist/components/micro/select.d.ts.map +1 -1
  77. package/dist/components/micro/sheet.d.ts.map +1 -1
  78. package/dist/components/micro/sidebar.d.ts.map +1 -1
  79. package/dist/components/micro/skeleton.d.ts +7 -0
  80. package/dist/components/micro/skeleton.d.ts.map +1 -1
  81. package/dist/components/micro/slider.d.ts +7 -0
  82. package/dist/components/micro/slider.d.ts.map +1 -1
  83. package/dist/components/micro/sonner.d.ts.map +1 -1
  84. package/dist/components/micro/spinner.d.ts.map +1 -1
  85. package/dist/components/micro/switch.d.ts.map +1 -1
  86. package/dist/components/micro/table.d.ts.map +1 -1
  87. package/dist/components/micro/tabs.d.ts +1 -1
  88. package/dist/components/micro/tabs.d.ts.map +1 -1
  89. package/dist/components/micro/textarea.d.ts +7 -0
  90. package/dist/components/micro/textarea.d.ts.map +1 -1
  91. package/dist/components/micro/toggle-group.d.ts.map +1 -1
  92. package/dist/components/micro/toggle.d.ts.map +1 -1
  93. package/dist/components/micro/tooltip.d.ts +1 -1
  94. package/dist/components/micro/tooltip.d.ts.map +1 -1
  95. package/dist/dev/App.d.ts.map +1 -1
  96. package/dist/dev/components/code-highlighter.d.ts.map +1 -1
  97. package/dist/dev/components/dev-context.d.ts.map +1 -1
  98. package/dist/dev/components/showcase.d.ts +1 -1
  99. package/dist/dev/components/showcase.d.ts.map +1 -1
  100. package/dist/dev/data.d.ts.map +1 -1
  101. package/dist/dev/main.d.ts.map +1 -1
  102. package/dist/dev/sections/buttons.d.ts.map +1 -1
  103. package/dist/dev/sections/feedback.d.ts.map +1 -1
  104. package/dist/dev/sections/overview.d.ts.map +1 -1
  105. package/dist/dev/showcase/accordion.d.ts.map +1 -1
  106. package/dist/dev/showcase/alert-dialog.d.ts.map +1 -1
  107. package/dist/dev/showcase/alert.d.ts.map +1 -1
  108. package/dist/dev/showcase/aspect-ratio.d.ts.map +1 -1
  109. package/dist/dev/showcase/avatar.d.ts.map +1 -1
  110. package/dist/dev/showcase/breadcrumb.d.ts.map +1 -1
  111. package/dist/dev/showcase/button.d.ts.map +1 -1
  112. package/dist/dev/showcase/calendar.d.ts.map +1 -1
  113. package/dist/dev/showcase/card.d.ts.map +1 -1
  114. package/dist/dev/showcase/carousel.d.ts.map +1 -1
  115. package/dist/dev/showcase/chart.d.ts.map +1 -1
  116. package/dist/dev/showcase/checkbox.d.ts.map +1 -1
  117. package/dist/dev/showcase/collapsible.d.ts.map +1 -1
  118. package/dist/dev/showcase/combobox.d.ts.map +1 -1
  119. package/dist/dev/showcase/command.d.ts.map +1 -1
  120. package/dist/dev/showcase/context-menu.d.ts.map +1 -1
  121. package/dist/dev/showcase/dialog.d.ts.map +1 -1
  122. package/dist/dev/showcase/drawer.d.ts.map +1 -1
  123. package/dist/dev/showcase/dropdown-menu.d.ts.map +1 -1
  124. package/dist/dev/showcase/empty.d.ts.map +1 -1
  125. package/dist/dev/showcase/hover-card.d.ts.map +1 -1
  126. package/dist/dev/showcase/input-group.d.ts.map +1 -1
  127. package/dist/dev/showcase/input-otp.d.ts.map +1 -1
  128. package/dist/dev/showcase/input.d.ts.map +1 -1
  129. package/dist/dev/showcase/item.d.ts.map +1 -1
  130. package/dist/dev/showcase/kbd.d.ts.map +1 -1
  131. package/dist/dev/showcase/label.d.ts.map +1 -1
  132. package/dist/dev/showcase/menubar.d.ts.map +1 -1
  133. package/dist/dev/showcase/navigation-menu.d.ts.map +1 -1
  134. package/dist/dev/showcase/overview.d.ts.map +1 -1
  135. package/dist/dev/showcase/pagination.d.ts.map +1 -1
  136. package/dist/dev/showcase/popover.d.ts.map +1 -1
  137. package/dist/dev/showcase/progress.d.ts.map +1 -1
  138. package/dist/dev/showcase/radio-group.d.ts.map +1 -1
  139. package/dist/dev/showcase/resizable.d.ts.map +1 -1
  140. package/dist/dev/showcase/scroll-area.d.ts.map +1 -1
  141. package/dist/dev/showcase/select.d.ts.map +1 -1
  142. package/dist/dev/showcase/separator.d.ts.map +1 -1
  143. package/dist/dev/showcase/sheet.d.ts.map +1 -1
  144. package/dist/dev/showcase/sidebar.d.ts.map +1 -1
  145. package/dist/dev/showcase/skeleton.d.ts.map +1 -1
  146. package/dist/dev/showcase/slider.d.ts.map +1 -1
  147. package/dist/dev/showcase/sonner.d.ts.map +1 -1
  148. package/dist/dev/showcase/spinner.d.ts.map +1 -1
  149. package/dist/dev/showcase/switch.d.ts.map +1 -1
  150. package/dist/dev/showcase/table.d.ts.map +1 -1
  151. package/dist/dev/showcase/tabs.d.ts.map +1 -1
  152. package/dist/dev/showcase/textarea.d.ts.map +1 -1
  153. package/dist/dev/showcase/theme-provider.d.ts.map +1 -1
  154. package/dist/dev/showcase/toast.d.ts.map +1 -1
  155. package/dist/dev/showcase/toggle-group.d.ts.map +1 -1
  156. package/dist/dev/showcase/toggle.d.ts.map +1 -1
  157. package/dist/dev/showcase/tooltip.d.ts.map +1 -1
  158. package/dist/index.cjs +2 -2
  159. package/dist/index.cjs.map +1 -1
  160. package/dist/index.js +2 -2
  161. package/dist/index.js.map +1 -1
  162. package/dist/lib/utils.d.ts.map +1 -1
  163. package/package.json +3 -1
  164. package/scripts/format-codestrings.ts +87 -0
  165. package/scripts/organize-imports.ts +21 -0
  166. package/scripts/regex-format.cjs +67 -0
  167. package/scripts/tmp.tsx +25 -0
  168. package/src/components/macro/accordion-preset.test.tsx +1 -0
  169. package/src/components/macro/accordion-preset.tsx +2 -1
  170. package/src/components/macro/alert-dialog-preset.tsx +44 -43
  171. package/src/components/macro/alert-preset.tsx +7 -3
  172. package/src/components/macro/avatar-preset.tsx +2 -1
  173. package/src/components/macro/breadcrumb-preset.tsx +2 -1
  174. package/src/components/macro/card-preset.tsx +2 -1
  175. package/src/components/macro/carousel-preset.tsx +5 -2
  176. package/src/components/macro/checkbox-preset.test.tsx +1 -0
  177. package/src/components/macro/checkbox-preset.tsx +6 -2
  178. package/src/components/macro/combobox-preset.tsx +6 -3
  179. package/src/components/macro/command-preset.tsx +7 -3
  180. package/src/components/macro/date-picker.tsx +77 -59
  181. package/src/components/macro/dialog-preset.tsx +42 -38
  182. package/src/components/macro/empty-preset.tsx +2 -1
  183. package/src/components/macro/field-preset.test.tsx +1 -0
  184. package/src/components/macro/field-preset.tsx +2 -1
  185. package/src/components/macro/input-otp-preset.tsx +6 -2
  186. package/src/components/macro/input-preset.test.tsx +1 -0
  187. package/src/components/macro/input-preset.tsx +4 -2
  188. package/src/components/macro/pagination-preset.tsx +3 -1
  189. package/src/components/macro/progress-preset.test.tsx +1 -0
  190. package/src/components/macro/progress-preset.tsx +2 -1
  191. package/src/components/macro/radio-group-preset.tsx +4 -1
  192. package/src/components/macro/select-preset.tsx +35 -30
  193. package/src/components/macro/slider-preset.test.tsx +1 -0
  194. package/src/components/macro/slider-preset.tsx +4 -1
  195. package/src/components/macro/switch-preset.test.tsx +1 -0
  196. package/src/components/macro/switch-preset.tsx +4 -1
  197. package/src/components/macro/tabs-preset.test.tsx +1 -0
  198. package/src/components/macro/tabs-preset.tsx +4 -2
  199. package/src/components/macro/textarea-preset.test.tsx +1 -0
  200. package/src/components/macro/textarea-preset.tsx +4 -1
  201. package/src/components/micro/accordion.tsx +3 -2
  202. package/src/components/micro/alert-dialog.tsx +2 -1
  203. package/src/components/micro/alert.tsx +3 -2
  204. package/src/components/micro/aspect-ratio.tsx +2 -1
  205. package/src/components/micro/avatar.tsx +2 -1
  206. package/src/components/micro/badge.tsx +3 -3
  207. package/src/components/micro/breadcrumb.tsx +3 -2
  208. package/src/components/micro/button.test.tsx +1 -0
  209. package/src/components/micro/button.tsx +3 -3
  210. package/src/components/micro/calendar.tsx +10 -9
  211. package/src/components/micro/carousel.tsx +3 -2
  212. package/src/components/micro/chart.tsx +1 -0
  213. package/src/components/micro/checkbox.tsx +2 -2
  214. package/src/components/micro/collapsible.tsx +4 -2
  215. package/src/components/micro/combobox.tsx +47 -29
  216. package/src/components/micro/command.tsx +23 -16
  217. package/src/components/micro/context-menu.tsx +3 -2
  218. package/src/components/micro/dialog.tsx +2 -1
  219. package/src/components/micro/drawer.tsx +2 -1
  220. package/src/components/micro/dropdown-menu.tsx +3 -2
  221. package/src/components/micro/empty.tsx +2 -1
  222. package/src/components/micro/field.tsx +4 -3
  223. package/src/components/micro/hover-card.tsx +20 -19
  224. package/src/components/micro/input-group.tsx +5 -4
  225. package/src/components/micro/input-otp.tsx +3 -2
  226. package/src/components/micro/input.tsx +3 -2
  227. package/src/components/micro/item.tsx +1 -0
  228. package/src/components/micro/label.tsx +2 -1
  229. package/src/components/micro/menubar.tsx +2 -1
  230. package/src/components/micro/navigation-menu.tsx +18 -17
  231. package/src/components/micro/pagination.tsx +2 -1
  232. package/src/components/micro/popover.tsx +2 -1
  233. package/src/components/micro/progress.tsx +2 -1
  234. package/src/components/micro/radio-group.tsx +3 -3
  235. package/src/components/micro/select.tsx +5 -4
  236. package/src/components/micro/sheet.tsx +2 -1
  237. package/src/components/micro/sidebar.tsx +4 -1
  238. package/src/components/micro/skeleton.tsx +2 -1
  239. package/src/components/micro/slider.tsx +4 -1
  240. package/src/components/micro/sonner.tsx +2 -1
  241. package/src/components/micro/spinner.tsx +1 -2
  242. package/src/components/micro/switch.tsx +2 -2
  243. package/src/components/micro/table.tsx +2 -1
  244. package/src/components/micro/tabs.tsx +4 -3
  245. package/src/components/micro/textarea.tsx +2 -1
  246. package/src/components/micro/toggle-group.tsx +1 -0
  247. package/src/components/micro/toggle.tsx +1 -3
  248. package/src/components/micro/tooltip.tsx +9 -3
  249. package/src/dev/App.tsx +66 -41
  250. package/src/dev/components/code-highlighter.tsx +2 -1
  251. package/src/dev/components/dev-context.tsx +1 -0
  252. package/src/dev/components/showcase.tsx +13 -14
  253. package/src/dev/data.ts +206 -52
  254. package/src/dev/main.tsx +4 -4
  255. package/src/dev/sections/buttons.tsx +14 -12
  256. package/src/dev/sections/feedback.tsx +7 -2
  257. package/src/dev/sections/forms.tsx +11 -11
  258. package/src/dev/sections/overview.tsx +2 -1
  259. package/src/dev/showcase/accordion.tsx +399 -314
  260. package/src/dev/showcase/alert-dialog.tsx +387 -384
  261. package/src/dev/showcase/alert.tsx +271 -258
  262. package/src/dev/showcase/aspect-ratio.tsx +102 -105
  263. package/src/dev/showcase/avatar.tsx +216 -145
  264. package/src/dev/showcase/badge.tsx +78 -50
  265. package/src/dev/showcase/breadcrumb.tsx +88 -85
  266. package/src/dev/showcase/button.tsx +72 -96
  267. package/src/dev/showcase/calendar.tsx +41 -39
  268. package/src/dev/showcase/card.tsx +170 -148
  269. package/src/dev/showcase/carousel.tsx +239 -77
  270. package/src/dev/showcase/chart.tsx +5 -4
  271. package/src/dev/showcase/checkbox.tsx +206 -140
  272. package/src/dev/showcase/collapsible.tsx +108 -84
  273. package/src/dev/showcase/combobox.tsx +272 -199
  274. package/src/dev/showcase/command.tsx +31 -28
  275. package/src/dev/showcase/context-menu.tsx +94 -77
  276. package/src/dev/showcase/dialog.tsx +445 -424
  277. package/src/dev/showcase/drawer.tsx +142 -135
  278. package/src/dev/showcase/dropdown-menu.tsx +165 -161
  279. package/src/dev/showcase/empty.tsx +173 -158
  280. package/src/dev/showcase/hover-card.tsx +92 -52
  281. package/src/dev/showcase/input-group.tsx +193 -160
  282. package/src/dev/showcase/input-otp.tsx +109 -99
  283. package/src/dev/showcase/input.tsx +78 -42
  284. package/src/dev/showcase/item.tsx +101 -98
  285. package/src/dev/showcase/kbd.tsx +78 -62
  286. package/src/dev/showcase/label.tsx +16 -23
  287. package/src/dev/showcase/menubar.tsx +274 -251
  288. package/src/dev/showcase/navigation-menu.tsx +175 -170
  289. package/src/dev/showcase/overview.tsx +164 -148
  290. package/src/dev/showcase/pagination.tsx +101 -69
  291. package/src/dev/showcase/popover.tsx +113 -86
  292. package/src/dev/showcase/progress.tsx +99 -69
  293. package/src/dev/showcase/radio-group.tsx +217 -134
  294. package/src/dev/showcase/resizable.tsx +65 -55
  295. package/src/dev/showcase/scroll-area.tsx +32 -22
  296. package/src/dev/showcase/select.tsx +192 -136
  297. package/src/dev/showcase/separator.tsx +28 -24
  298. package/src/dev/showcase/sheet.tsx +182 -134
  299. package/src/dev/showcase/sidebar.tsx +9 -5
  300. package/src/dev/showcase/skeleton.tsx +54 -59
  301. package/src/dev/showcase/slider.tsx +158 -129
  302. package/src/dev/showcase/sonner.tsx +3 -5
  303. package/src/dev/showcase/spinner.tsx +22 -18
  304. package/src/dev/showcase/switch.tsx +207 -110
  305. package/src/dev/showcase/table.tsx +44 -32
  306. package/src/dev/showcase/tabs.tsx +272 -267
  307. package/src/dev/showcase/textarea.tsx +162 -116
  308. package/src/dev/showcase/theme-provider.tsx +596 -534
  309. package/src/dev/showcase/toast.tsx +37 -38
  310. package/src/dev/showcase/toggle-group.tsx +87 -39
  311. package/src/dev/showcase/toggle.tsx +36 -27
  312. package/src/dev/showcase/tooltip.tsx +154 -119
  313. package/src/lib/utils.test.ts +1 -0
  314. package/src/lib/utils.ts +1 -1
  315. package/src/styles/gladvn.css +1 -1
@@ -8,6 +8,7 @@ import {
8
8
  MenubarItem,
9
9
  MenubarLabel,
10
10
  MenubarMenu,
11
+ MenubarPortal,
11
12
  MenubarRadioGroup,
12
13
  MenubarRadioItem,
13
14
  MenubarSeparator,
@@ -15,7 +16,8 @@ import {
15
16
  MenubarSub,
16
17
  MenubarSubContent,
17
18
  MenubarSubTrigger,
18
- MenubarTrigger, MenubarPortal } from "../../components/micro/menubar";
19
+ MenubarTrigger,
20
+ } from "../../components/micro/menubar";
19
21
  import {
20
22
  DocsP,
21
23
  ExampleGrid,
@@ -39,148 +41,160 @@ function MenubarMicroShowcase() {
39
41
  label="Full Menubar"
40
42
  description="Thanh menu đầy đủ: Items, Checkbox, Radio, Submenu, Shortcut, Separator."
41
43
  codeString={`<Menubar className="w-fit">
42
- <MenubarMenu>
43
- <MenubarTrigger>File</MenubarTrigger>
44
- <MenubarContent>
45
- <MenubarItem>
46
- New Tab <MenubarShortcut>⌘T</MenubarShortcut>
47
- </MenubarItem>
48
- <MenubarItem>
49
- New Window <MenubarShortcut>⌘N</MenubarShortcut>
50
- </MenubarItem>
51
- <MenubarItem disabled>New Incognito Window</MenubarItem>
52
- <MenubarSeparator />
53
- <MenubarSub>
54
- <MenubarSubTrigger>Share</MenubarSubTrigger>
55
- <MenubarSubContent>
56
- <MenubarItem>Email link</MenubarItem>
57
- <MenubarItem>Messages</MenubarItem>
58
- <MenubarItem>Notes</MenubarItem>
59
- </MenubarSubContent>
60
- </MenubarSub>
61
- <MenubarSeparator />
62
- <MenubarItem>
63
- Print... <MenubarShortcut>⌘P</MenubarShortcut>
64
- </MenubarItem>
65
- </MenubarContent>
66
- </MenubarMenu>
67
- <MenubarMenu>
68
- <MenubarTrigger>View</MenubarTrigger>
69
- <MenubarContent>
70
- <MenubarCheckboxItem
71
- checked={showBookmarks}
72
- onCheckedChange={setShowBookmarks}
73
- >
74
- Always Show Bookmarks Bar
75
- </MenubarCheckboxItem>
76
- <MenubarCheckboxItem
77
- checked={showFullUrls}
78
- onCheckedChange={setShowFullUrls}
79
- >
80
- Always Show Full URLs
81
- </MenubarCheckboxItem>
82
- <MenubarSeparator />
83
- <MenubarItem inset>
84
- Reload <MenubarShortcut>⌘R</MenubarShortcut>
85
- </MenubarItem>
86
- <MenubarItem disabled inset>
87
- Force Reload <MenubarShortcut>⇧⌘R</MenubarShortcut>
88
- </MenubarItem>
89
- </MenubarContent>
90
- </MenubarMenu>
91
- <MenubarMenu>
92
- <MenubarTrigger>Profiles</MenubarTrigger>
93
- <MenubarContent>
94
- <MenubarGroup>
95
- <MenubarLabel inset>Select Profile</MenubarLabel>
44
+ <MenubarMenu>
45
+ <MenubarTrigger>File</MenubarTrigger>
46
+ <MenubarContent>
47
+ <MenubarItem>
48
+ New Tab <MenubarShortcut>⌘T</MenubarShortcut>
49
+ </MenubarItem>
50
+ <MenubarItem>
51
+ New Window <MenubarShortcut>⌘N</MenubarShortcut>
52
+ </MenubarItem>
53
+ <MenubarItem disabled>
54
+ New Incognito Window
55
+ </MenubarItem>
96
56
  <MenubarSeparator />
97
- <MenubarRadioGroup value={profile} onValueChange={setProfile}>
98
- <MenubarRadioItem value="pedro">Pedro</MenubarRadioItem>
99
- <MenubarRadioItem value="colm">Colm</MenubarRadioItem>
100
- <MenubarRadioItem value="andy">Andy</MenubarRadioItem>
101
- </MenubarRadioGroup>
102
- </MenubarGroup>
103
- <MenubarSeparator />
104
- <MenubarItem inset>Edit...</MenubarItem>
105
- <MenubarSeparator />
106
- <MenubarItem inset>Add Profile...</MenubarItem>
107
- </MenubarContent>
108
- </MenubarMenu>
109
- </Menubar>`}
57
+ <MenubarSub>
58
+ <MenubarSubTrigger>Share</MenubarSubTrigger>
59
+ <MenubarSubContent>
60
+ <MenubarItem>Email link</MenubarItem>
61
+ <MenubarItem>Messages</MenubarItem>
62
+ <MenubarItem>Notes</MenubarItem>
63
+ </MenubarSubContent>
64
+ </MenubarSub>
65
+ <MenubarSeparator />
66
+ <MenubarItem>
67
+ Print... <MenubarShortcut>⌘P</MenubarShortcut>
68
+ </MenubarItem>
69
+ </MenubarContent>
70
+ </MenubarMenu>
71
+ <MenubarMenu>
72
+ <MenubarTrigger>View</MenubarTrigger>
73
+ <MenubarContent>
74
+ <MenubarCheckboxItem
75
+ checked={showBookmarks}
76
+ onCheckedChange={setShowBookmarks}
77
+ >
78
+ Always Show Bookmarks Bar
79
+ </MenubarCheckboxItem>
80
+ <MenubarCheckboxItem
81
+ checked={showFullUrls}
82
+ onCheckedChange={setShowFullUrls}
83
+ >
84
+ Always Show Full URLs
85
+ </MenubarCheckboxItem>
86
+ <MenubarSeparator />
87
+ <MenubarItem inset>
88
+ Reload <MenubarShortcut>⌘R</MenubarShortcut>
89
+ </MenubarItem>
90
+ <MenubarItem disabled inset>
91
+ Force Reload{" "}
92
+ <MenubarShortcut>⇧⌘R</MenubarShortcut>
93
+ </MenubarItem>
94
+ </MenubarContent>
95
+ </MenubarMenu>
96
+ <MenubarMenu>
97
+ <MenubarTrigger>Profiles</MenubarTrigger>
98
+ <MenubarContent>
99
+ <MenubarGroup>
100
+ <MenubarLabel inset>Select Profile</MenubarLabel>
101
+ <MenubarSeparator />
102
+ <MenubarRadioGroup
103
+ value={profile}
104
+ onValueChange={setProfile}
105
+ >
106
+ <MenubarRadioItem value="pedro">
107
+ Pedro
108
+ </MenubarRadioItem>
109
+ <MenubarRadioItem value="colm">
110
+ Colm
111
+ </MenubarRadioItem>
112
+ <MenubarRadioItem value="andy">
113
+ Andy
114
+ </MenubarRadioItem>
115
+ </MenubarRadioGroup>
116
+ </MenubarGroup>
117
+ <MenubarSeparator />
118
+ <MenubarItem inset>Edit...</MenubarItem>
119
+ <MenubarSeparator />
120
+ <MenubarItem inset>Add Profile...</MenubarItem>
121
+ </MenubarContent>
122
+ </MenubarMenu>
123
+ </Menubar>`}
110
124
  >
111
125
  <Menubar className="w-fit">
112
126
  <MenubarMenu>
113
127
  <MenubarTrigger>File</MenubarTrigger>
114
128
  <MenubarPortal>
115
- <MenubarContent>
116
- <MenubarItem>
117
- New Tab <MenubarShortcut>⌘T</MenubarShortcut>
118
- </MenubarItem>
119
- <MenubarItem>
120
- New Window <MenubarShortcut>⌘N</MenubarShortcut>
121
- </MenubarItem>
122
- <MenubarItem disabled>New Incognito Window</MenubarItem>
123
- <MenubarSeparator />
124
- <MenubarSub>
125
- <MenubarSubTrigger>Share</MenubarSubTrigger>
126
- <MenubarSubContent>
127
- <MenubarItem>Email link</MenubarItem>
128
- <MenubarItem>Messages</MenubarItem>
129
- <MenubarItem>Notes</MenubarItem>
130
- </MenubarSubContent>
131
- </MenubarSub>
132
- <MenubarSeparator />
133
- <MenubarItem>
134
- Print... <MenubarShortcut>⌘P</MenubarShortcut>
135
- </MenubarItem>
136
- </MenubarContent>
137
- </MenubarPortal>
129
+ <MenubarContent>
130
+ <MenubarItem>
131
+ New Tab <MenubarShortcut>⌘T</MenubarShortcut>
132
+ </MenubarItem>
133
+ <MenubarItem>
134
+ New Window <MenubarShortcut>⌘N</MenubarShortcut>
135
+ </MenubarItem>
136
+ <MenubarItem disabled>New Incognito Window</MenubarItem>
137
+ <MenubarSeparator />
138
+ <MenubarSub>
139
+ <MenubarSubTrigger>Share</MenubarSubTrigger>
140
+ <MenubarSubContent>
141
+ <MenubarItem>Email link</MenubarItem>
142
+ <MenubarItem>Messages</MenubarItem>
143
+ <MenubarItem>Notes</MenubarItem>
144
+ </MenubarSubContent>
145
+ </MenubarSub>
146
+ <MenubarSeparator />
147
+ <MenubarItem>
148
+ Print... <MenubarShortcut>⌘P</MenubarShortcut>
149
+ </MenubarItem>
150
+ </MenubarContent>
151
+ </MenubarPortal>
138
152
  </MenubarMenu>
139
153
  <MenubarMenu>
140
154
  <MenubarTrigger>View</MenubarTrigger>
141
155
  <MenubarPortal>
142
- <MenubarContent>
143
- <MenubarCheckboxItem
144
- checked={showBookmarks}
145
- onCheckedChange={setShowBookmarks}
146
- >
147
- Always Show Bookmarks Bar
148
- </MenubarCheckboxItem>
149
- <MenubarCheckboxItem
150
- checked={showFullUrls}
151
- onCheckedChange={setShowFullUrls}
152
- >
153
- Always Show Full URLs
154
- </MenubarCheckboxItem>
155
- <MenubarSeparator />
156
- <MenubarItem inset>
157
- Reload <MenubarShortcut>⌘R</MenubarShortcut>
158
- </MenubarItem>
159
- <MenubarItem disabled inset>
160
- Force Reload <MenubarShortcut>⇧⌘R</MenubarShortcut>
161
- </MenubarItem>
162
- </MenubarContent>
163
- </MenubarPortal>
156
+ <MenubarContent>
157
+ <MenubarCheckboxItem
158
+ checked={showBookmarks}
159
+ onCheckedChange={setShowBookmarks}
160
+ >
161
+ Always Show Bookmarks Bar
162
+ </MenubarCheckboxItem>
163
+ <MenubarCheckboxItem
164
+ checked={showFullUrls}
165
+ onCheckedChange={setShowFullUrls}
166
+ >
167
+ Always Show Full URLs
168
+ </MenubarCheckboxItem>
169
+ <MenubarSeparator />
170
+ <MenubarItem inset>
171
+ Reload <MenubarShortcut>⌘R</MenubarShortcut>
172
+ </MenubarItem>
173
+ <MenubarItem disabled inset>
174
+ Force Reload <MenubarShortcut>⇧⌘R</MenubarShortcut>
175
+ </MenubarItem>
176
+ </MenubarContent>
177
+ </MenubarPortal>
164
178
  </MenubarMenu>
165
179
  <MenubarMenu>
166
180
  <MenubarTrigger>Profiles</MenubarTrigger>
167
181
  <MenubarPortal>
168
- <MenubarContent>
169
- <MenubarGroup>
170
- <MenubarLabel inset>Select Profile</MenubarLabel>
171
- <MenubarSeparator />
172
- <MenubarRadioGroup value={profile} onValueChange={setProfile}>
173
- <MenubarRadioItem value="pedro">Pedro</MenubarRadioItem>
174
- <MenubarRadioItem value="colm">Colm</MenubarRadioItem>
175
- <MenubarRadioItem value="andy">Andy</MenubarRadioItem>
176
- </MenubarRadioGroup>
177
- </MenubarGroup>
178
- <MenubarSeparator />
179
- <MenubarItem inset>Edit...</MenubarItem>
180
- <MenubarSeparator />
181
- <MenubarItem inset>Add Profile...</MenubarItem>
182
- </MenubarContent>
183
- </MenubarPortal>
182
+ <MenubarContent>
183
+ <MenubarGroup>
184
+ <MenubarLabel inset>Select Profile</MenubarLabel>
185
+ <MenubarSeparator />
186
+ <MenubarRadioGroup value={profile} onValueChange={setProfile}>
187
+ <MenubarRadioItem value="pedro">Pedro</MenubarRadioItem>
188
+ <MenubarRadioItem value="colm">Colm</MenubarRadioItem>
189
+ <MenubarRadioItem value="andy">Andy</MenubarRadioItem>
190
+ </MenubarRadioGroup>
191
+ </MenubarGroup>
192
+ <MenubarSeparator />
193
+ <MenubarItem inset>Edit...</MenubarItem>
194
+ <MenubarSeparator />
195
+ <MenubarItem inset>Add Profile...</MenubarItem>
196
+ </MenubarContent>
197
+ </MenubarPortal>
184
198
  </MenubarMenu>
185
199
  </Menubar>
186
200
  </ExampleSection>
@@ -191,44 +205,44 @@ function MenubarMicroShowcase() {
191
205
  label="Checkbox Items"
192
206
  description="MenubarCheckboxItem cho phép bật/tắt từng tùy chọn độc lập nhau."
193
207
  codeString={`<Menubar className="w-fit">
194
- <MenubarMenu>
195
- <MenubarTrigger>View</MenubarTrigger>
196
- <MenubarContent>
197
- <MenubarCheckboxItem
198
- checked={showBookmarks}
199
- onCheckedChange={setShowBookmarks}
200
- >
201
- Show Bookmarks Bar
202
- </MenubarCheckboxItem>
203
- <MenubarCheckboxItem
204
- checked={showFullUrls}
205
- onCheckedChange={setShowFullUrls}
206
- >
207
- Show Full URLs
208
- </MenubarCheckboxItem>
209
- </MenubarContent>
210
- </MenubarMenu>
211
- </Menubar>`}
208
+ <MenubarMenu>
209
+ <MenubarTrigger>View</MenubarTrigger>
210
+ <MenubarContent>
211
+ <MenubarCheckboxItem
212
+ checked={showBookmarks}
213
+ onCheckedChange={setShowBookmarks}
214
+ >
215
+ Show Bookmarks Bar
216
+ </MenubarCheckboxItem>
217
+ <MenubarCheckboxItem
218
+ checked={showFullUrls}
219
+ onCheckedChange={setShowFullUrls}
220
+ >
221
+ Show Full URLs
222
+ </MenubarCheckboxItem>
223
+ </MenubarContent>
224
+ </MenubarMenu>
225
+ </Menubar>`}
212
226
  >
213
227
  <Menubar className="w-fit">
214
228
  <MenubarMenu>
215
229
  <MenubarTrigger>View</MenubarTrigger>
216
230
  <MenubarPortal>
217
- <MenubarContent>
218
- <MenubarCheckboxItem
219
- checked={showBookmarks}
220
- onCheckedChange={setShowBookmarks}
221
- >
222
- Show Bookmarks Bar
223
- </MenubarCheckboxItem>
224
- <MenubarCheckboxItem
225
- checked={showFullUrls}
226
- onCheckedChange={setShowFullUrls}
227
- >
228
- Show Full URLs
229
- </MenubarCheckboxItem>
230
- </MenubarContent>
231
- </MenubarPortal>
231
+ <MenubarContent>
232
+ <MenubarCheckboxItem
233
+ checked={showBookmarks}
234
+ onCheckedChange={setShowBookmarks}
235
+ >
236
+ Show Bookmarks Bar
237
+ </MenubarCheckboxItem>
238
+ <MenubarCheckboxItem
239
+ checked={showFullUrls}
240
+ onCheckedChange={setShowFullUrls}
241
+ >
242
+ Show Full URLs
243
+ </MenubarCheckboxItem>
244
+ </MenubarContent>
245
+ </MenubarPortal>
232
246
  </MenubarMenu>
233
247
  </Menubar>
234
248
  </ExampleSection>
@@ -237,34 +251,43 @@ function MenubarMicroShowcase() {
237
251
  label="Radio Group"
238
252
  description="MenubarRadioGroup cho phép chọn một giá trị duy nhất từ danh sách."
239
253
  codeString={`<Menubar className="w-fit">
240
- <MenubarMenu>
241
- <MenubarTrigger>Profile</MenubarTrigger>
242
- <MenubarContent>
243
- <MenubarLabel inset>Account</MenubarLabel>
244
- <MenubarSeparator />
245
- <MenubarRadioGroup value={profile} onValueChange={setProfile}>
246
- <MenubarRadioItem value="pedro">Pedro</MenubarRadioItem>
247
- <MenubarRadioItem value="colm">Colm</MenubarRadioItem>
248
- <MenubarRadioItem value="andy">Andy</MenubarRadioItem>
249
- </MenubarRadioGroup>
250
- </MenubarContent>
251
- </MenubarMenu>
252
- </Menubar>`}
254
+ <MenubarMenu>
255
+ <MenubarTrigger>Profile</MenubarTrigger>
256
+ <MenubarContent>
257
+ <MenubarLabel inset>Account</MenubarLabel>
258
+ <MenubarSeparator />
259
+ <MenubarRadioGroup
260
+ value={profile}
261
+ onValueChange={setProfile}
262
+ >
263
+ <MenubarRadioItem value="pedro">
264
+ Pedro
265
+ </MenubarRadioItem>
266
+ <MenubarRadioItem value="colm">
267
+ Colm
268
+ </MenubarRadioItem>
269
+ <MenubarRadioItem value="andy">
270
+ Andy
271
+ </MenubarRadioItem>
272
+ </MenubarRadioGroup>
273
+ </MenubarContent>
274
+ </MenubarMenu>
275
+ </Menubar>`}
253
276
  >
254
277
  <Menubar className="w-fit">
255
278
  <MenubarMenu>
256
279
  <MenubarTrigger>Profile</MenubarTrigger>
257
280
  <MenubarPortal>
258
- <MenubarContent>
259
- <MenubarLabel inset>Account</MenubarLabel>
260
- <MenubarSeparator />
261
- <MenubarRadioGroup value={profile} onValueChange={setProfile}>
262
- <MenubarRadioItem value="pedro">Pedro</MenubarRadioItem>
263
- <MenubarRadioItem value="colm">Colm</MenubarRadioItem>
264
- <MenubarRadioItem value="andy">Andy</MenubarRadioItem>
265
- </MenubarRadioGroup>
266
- </MenubarContent>
267
- </MenubarPortal>
281
+ <MenubarContent>
282
+ <MenubarLabel inset>Account</MenubarLabel>
283
+ <MenubarSeparator />
284
+ <MenubarRadioGroup value={profile} onValueChange={setProfile}>
285
+ <MenubarRadioItem value="pedro">Pedro</MenubarRadioItem>
286
+ <MenubarRadioItem value="colm">Colm</MenubarRadioItem>
287
+ <MenubarRadioItem value="andy">Andy</MenubarRadioItem>
288
+ </MenubarRadioGroup>
289
+ </MenubarContent>
290
+ </MenubarPortal>
268
291
  </MenubarMenu>
269
292
  </Menubar>
270
293
  </ExampleSection>
@@ -276,42 +299,42 @@ function MenubarMicroShowcase() {
276
299
  label="Submenu"
277
300
  description="MenubarSub tạo menu lồng nhau. Hover hoặc click vào SubTrigger để mở."
278
301
  codeString={`<Menubar className="w-fit">
279
- <MenubarMenu>
280
- <MenubarTrigger>File</MenubarTrigger>
281
- <MenubarContent>
282
- <MenubarSub>
283
- <MenubarSubTrigger>Share</MenubarSubTrigger>
284
- <MenubarSubContent>
285
- <MenubarItem>Email link</MenubarItem>
286
- <MenubarItem>Messages</MenubarItem>
287
- <MenubarItem>Notes</MenubarItem>
288
- </MenubarSubContent>
289
- </MenubarSub>
290
- <MenubarItem>
291
- Print... <MenubarShortcut>⌘P</MenubarShortcut>
292
- </MenubarItem>
293
- </MenubarContent>
294
- </MenubarMenu>
295
- </Menubar>`}
302
+ <MenubarMenu>
303
+ <MenubarTrigger>File</MenubarTrigger>
304
+ <MenubarContent>
305
+ <MenubarSub>
306
+ <MenubarSubTrigger>Share</MenubarSubTrigger>
307
+ <MenubarSubContent>
308
+ <MenubarItem>Email link</MenubarItem>
309
+ <MenubarItem>Messages</MenubarItem>
310
+ <MenubarItem>Notes</MenubarItem>
311
+ </MenubarSubContent>
312
+ </MenubarSub>
313
+ <MenubarItem>
314
+ Print... <MenubarShortcut>⌘P</MenubarShortcut>
315
+ </MenubarItem>
316
+ </MenubarContent>
317
+ </MenubarMenu>
318
+ </Menubar>`}
296
319
  >
297
320
  <Menubar className="w-fit">
298
321
  <MenubarMenu>
299
322
  <MenubarTrigger>File</MenubarTrigger>
300
323
  <MenubarPortal>
301
- <MenubarContent>
302
- <MenubarSub>
303
- <MenubarSubTrigger>Share</MenubarSubTrigger>
304
- <MenubarSubContent>
305
- <MenubarItem>Email link</MenubarItem>
306
- <MenubarItem>Messages</MenubarItem>
307
- <MenubarItem>Notes</MenubarItem>
308
- </MenubarSubContent>
309
- </MenubarSub>
310
- <MenubarItem>
311
- Print... <MenubarShortcut>⌘P</MenubarShortcut>
312
- </MenubarItem>
313
- </MenubarContent>
314
- </MenubarPortal>
324
+ <MenubarContent>
325
+ <MenubarSub>
326
+ <MenubarSubTrigger>Share</MenubarSubTrigger>
327
+ <MenubarSubContent>
328
+ <MenubarItem>Email link</MenubarItem>
329
+ <MenubarItem>Messages</MenubarItem>
330
+ <MenubarItem>Notes</MenubarItem>
331
+ </MenubarSubContent>
332
+ </MenubarSub>
333
+ <MenubarItem>
334
+ Print... <MenubarShortcut>⌘P</MenubarShortcut>
335
+ </MenubarItem>
336
+ </MenubarContent>
337
+ </MenubarPortal>
315
338
  </MenubarMenu>
316
339
  </Menubar>
317
340
  </ExampleSection>
@@ -320,46 +343,46 @@ function MenubarMicroShowcase() {
320
343
  label="Disabled Items"
321
344
  description="Items bị vô hiệu hóa không thể tương tác và hiển thị ở trạng thái mờ."
322
345
  codeString={`<Menubar className="w-fit">
323
- <MenubarMenu>
324
- <MenubarTrigger>Edit</MenubarTrigger>
325
- <MenubarContent>
326
- <MenubarItem>
327
- Undo <MenubarShortcut>⌘Z</MenubarShortcut>
328
- </MenubarItem>
329
- <MenubarItem disabled>
330
- Redo <MenubarShortcut>⌘Y</MenubarShortcut>
331
- </MenubarItem>
332
- <MenubarSeparator />
333
- <MenubarItem disabled>
334
- Cut <MenubarShortcut>⌘X</MenubarShortcut>
335
- </MenubarItem>
336
- <MenubarItem>
337
- Copy <MenubarShortcut>⌘C</MenubarShortcut>
338
- </MenubarItem>
339
- </MenubarContent>
340
- </MenubarMenu>
341
- </Menubar>`}
346
+ <MenubarMenu>
347
+ <MenubarTrigger>Edit</MenubarTrigger>
348
+ <MenubarContent>
349
+ <MenubarItem>
350
+ Undo <MenubarShortcut>⌘Z</MenubarShortcut>
351
+ </MenubarItem>
352
+ <MenubarItem disabled>
353
+ Redo <MenubarShortcut>⌘Y</MenubarShortcut>
354
+ </MenubarItem>
355
+ <MenubarSeparator />
356
+ <MenubarItem disabled>
357
+ Cut <MenubarShortcut>⌘X</MenubarShortcut>
358
+ </MenubarItem>
359
+ <MenubarItem>
360
+ Copy <MenubarShortcut>⌘C</MenubarShortcut>
361
+ </MenubarItem>
362
+ </MenubarContent>
363
+ </MenubarMenu>
364
+ </Menubar>`}
342
365
  >
343
366
  <Menubar className="w-fit">
344
367
  <MenubarMenu>
345
368
  <MenubarTrigger>Edit</MenubarTrigger>
346
369
  <MenubarPortal>
347
- <MenubarContent>
348
- <MenubarItem>
349
- Undo <MenubarShortcut>⌘Z</MenubarShortcut>
350
- </MenubarItem>
351
- <MenubarItem disabled>
352
- Redo <MenubarShortcut>⌘Y</MenubarShortcut>
353
- </MenubarItem>
354
- <MenubarSeparator />
355
- <MenubarItem disabled>
356
- Cut <MenubarShortcut>⌘X</MenubarShortcut>
357
- </MenubarItem>
358
- <MenubarItem>
359
- Copy <MenubarShortcut>⌘C</MenubarShortcut>
360
- </MenubarItem>
361
- </MenubarContent>
362
- </MenubarPortal>
370
+ <MenubarContent>
371
+ <MenubarItem>
372
+ Undo <MenubarShortcut>⌘Z</MenubarShortcut>
373
+ </MenubarItem>
374
+ <MenubarItem disabled>
375
+ Redo <MenubarShortcut>⌘Y</MenubarShortcut>
376
+ </MenubarItem>
377
+ <MenubarSeparator />
378
+ <MenubarItem disabled>
379
+ Cut <MenubarShortcut>⌘X</MenubarShortcut>
380
+ </MenubarItem>
381
+ <MenubarItem>
382
+ Copy <MenubarShortcut>⌘C</MenubarShortcut>
383
+ </MenubarItem>
384
+ </MenubarContent>
385
+ </MenubarPortal>
363
386
  </MenubarMenu>
364
387
  </Menubar>
365
388
  </ExampleSection>