@versini/ui-menu 6.0.0 → 6.1.1
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.
- package/README.md +7 -27
- package/dist/index.js +1 -1
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
> Accessible and lightweight React menu components built with TypeScript and TailwindCSS — no external UI library required.
|
|
7
7
|
|
|
8
|
-
The Menu package provides dropdown menus with full keyboard navigation, focus management, theming for triggers, and composable items / separators. It offers the same capabilities as `@versini/ui-dropdown` but with a smaller footprint by replacing Radix UI with a custom implementation using the native Popover API.
|
|
8
|
+
The Menu package provides dropdown menus with full keyboard navigation, focus management, theming for triggers, and composable items / separators. It offers the same capabilities as the now deprecated `@versini/ui-dropdown` but with a smaller footprint by replacing Radix UI with a custom implementation using the native Popover API.
|
|
9
9
|
|
|
10
10
|
## Table of Contents
|
|
11
11
|
|
|
@@ -52,18 +52,9 @@ function App() {
|
|
|
52
52
|
</ButtonIcon>
|
|
53
53
|
}
|
|
54
54
|
>
|
|
55
|
-
<MenuItem
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
/>
|
|
59
|
-
<MenuItem
|
|
60
|
-
label="Settings"
|
|
61
|
-
onSelect={() => console.info("Settings")}
|
|
62
|
-
/>
|
|
63
|
-
<MenuItem
|
|
64
|
-
label="Logout"
|
|
65
|
-
onSelect={() => console.info("Logout")}
|
|
66
|
-
/>
|
|
55
|
+
<MenuItem label="Profile" onSelect={() => console.info("Profile")} />
|
|
56
|
+
<MenuItem label="Settings" onSelect={() => console.info("Settings")} />
|
|
57
|
+
<MenuItem label="Logout" onSelect={() => console.info("Logout")} />
|
|
67
58
|
</Menu>
|
|
68
59
|
);
|
|
69
60
|
}
|
|
@@ -74,11 +65,7 @@ function App() {
|
|
|
74
65
|
### Menu with Icons & Selection
|
|
75
66
|
|
|
76
67
|
```tsx
|
|
77
|
-
import {
|
|
78
|
-
Menu,
|
|
79
|
-
MenuItem,
|
|
80
|
-
MenuSeparator
|
|
81
|
-
} from "@versini/ui-menu";
|
|
68
|
+
import { Menu, MenuItem, MenuSeparator } from "@versini/ui-menu";
|
|
82
69
|
import { ButtonIcon } from "@versini/ui-button";
|
|
83
70
|
import {
|
|
84
71
|
IconMenu,
|
|
@@ -144,12 +131,7 @@ function AccountMenu() {
|
|
|
144
131
|
Create hierarchical menus using `MenuSub`:
|
|
145
132
|
|
|
146
133
|
```tsx
|
|
147
|
-
import {
|
|
148
|
-
Menu,
|
|
149
|
-
MenuItem,
|
|
150
|
-
MenuSub,
|
|
151
|
-
MenuGroupLabel
|
|
152
|
-
} from "@versini/ui-menu";
|
|
134
|
+
import { Menu, MenuItem, MenuSub, MenuGroupLabel } from "@versini/ui-menu";
|
|
153
135
|
import { ButtonIcon } from "@versini/ui-button";
|
|
154
136
|
import { IconSettings, IconOpenAI, IconAnthropic } from "@versini/ui-icons";
|
|
155
137
|
|
|
@@ -169,9 +151,7 @@ function SettingsMenu() {
|
|
|
169
151
|
|
|
170
152
|
{/* Nested sub-menu with icon */}
|
|
171
153
|
<MenuSub label="AI Settings" icon={<IconSettings />}>
|
|
172
|
-
<MenuGroupLabel icon={<IconSettings />}>
|
|
173
|
-
Engines
|
|
174
|
-
</MenuGroupLabel>
|
|
154
|
+
<MenuGroupLabel icon={<IconSettings />}>Engines</MenuGroupLabel>
|
|
175
155
|
<MenuItem
|
|
176
156
|
label="OpenAI"
|
|
177
157
|
icon={<IconOpenAI />}
|
package/dist/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-menu",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.1.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -42,12 +42,12 @@
|
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
44
|
"@versini/ui-hooks": "6.1.1",
|
|
45
|
-
"@versini/ui-icons": "4.18.
|
|
45
|
+
"@versini/ui-icons": "4.18.2",
|
|
46
46
|
"clsx": "2.1.1",
|
|
47
|
-
"tailwindcss": "4.2.
|
|
47
|
+
"tailwindcss": "4.2.1"
|
|
48
48
|
},
|
|
49
49
|
"sideEffects": [
|
|
50
50
|
"**/*.css"
|
|
51
51
|
],
|
|
52
|
-
"gitHead": "
|
|
52
|
+
"gitHead": "84d5ac4ea694792080c881a50b4fd5c4ce3750c0"
|
|
53
53
|
}
|