@versini/ui-dropdown 1.1.3 → 1.2.0

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 (9) hide show
  1. package/README.md +18 -11
  2. package/dist/DropdownMenu/DropdownMenu.d.ts +2 -2
  3. package/dist/DropdownMenu/DropdownMenu.js +28 -10
  4. package/dist/DropdownMenu/DropdownMenuItem.js +3 -3
  5. package/dist/DropdownMenu/DropdownMenuTypes.d.ts +10 -1
  6. package/dist/DropdownMenu/DropdownMenuTypes.js +3 -3
  7. package/dist/DropdownMenu/utilities.js +3 -3
  8. package/dist/index.js +3 -3
  9. package/package.json +2 -2
package/README.md CHANGED
@@ -166,9 +166,11 @@ function SettingsMenu() {
166
166
  <DropdownMenuItem label="Profile" />
167
167
  <DropdownMenuItem label="Preferences" />
168
168
 
169
- {/* Nested sub-menu */}
170
- <DropdownMenuSub label="AI Settings">
171
- <DropdownMenuGroupLabel>Engines</DropdownMenuGroupLabel>
169
+ {/* Nested sub-menu with icon */}
170
+ <DropdownMenuSub label="AI Settings" icon={<IconSettings />}>
171
+ <DropdownMenuGroupLabel icon={<IconSettings />}>
172
+ Engines
173
+ </DropdownMenuGroupLabel>
172
174
  <DropdownMenuItem
173
175
  label="OpenAI"
174
176
  icon={<IconOpenAI />}
@@ -228,13 +230,14 @@ function SettingsMenu() {
228
230
 
229
231
  ### DropdownMenuSub Props
230
232
 
231
- | Prop | Type | Default | Description |
232
- | ------------- | ----------------- | ------- | ----------------------------------- |
233
- | `label` | `string` | - | The label for the sub-menu trigger. |
234
- | `children` | `React.ReactNode` | - | Items to render inside sub-menu. |
235
- | `disabled` | `boolean` | `false` | Whether the sub-menu is disabled. |
236
- | `sideOffset` | `number` | `2` | Offset from sub-menu trigger. |
237
- | `alignOffset` | `number` | `-4` | Alignment offset for sub-menu. |
233
+ | Prop | Type | Default | Description |
234
+ | ------------- | ----------------- | ------- | ----------------------------------------- |
235
+ | `label` | `string` | - | The label for the sub-menu trigger. |
236
+ | `icon` | `React.ReactNode` | - | Icon to display on the left of the label. |
237
+ | `children` | `React.ReactNode` | - | Items to render inside sub-menu. |
238
+ | `disabled` | `boolean` | `false` | Whether the sub-menu is disabled. |
239
+ | `sideOffset` | `number` | `2` | Offset from sub-menu trigger. |
240
+ | `alignOffset` | `number` | `-4` | Alignment offset for sub-menu. |
238
241
 
239
242
  ### DropdownMenuSeparator Props
240
243
 
@@ -242,4 +245,8 @@ Standard `React.HTMLAttributes<HTMLDivElement>` - use `className` for custom sty
242
245
 
243
246
  ### DropdownMenuGroupLabel Props
244
247
 
245
- Standard `React.HTMLAttributes<HTMLDivElement>` - use `className` for custom styling.
248
+ | Prop | Type | Default | Description |
249
+ | ----------- | ----------------- | ------- | ----------------------------------------- |
250
+ | `icon` | `React.ReactNode` | - | Icon to display on the left of the label. |
251
+ | `children` | `React.ReactNode` | - | The label content. |
252
+ | `className` | `string` | - | Custom CSS class for styling. |
package/dist/DropdownMenu/DropdownMenu.d.ts CHANGED
@@ -4,7 +4,7 @@ export declare const DropdownMenu: {
4
4
  displayName: string;
5
5
  };
6
6
  export declare const DropdownMenuSub: {
7
- ({ label, children, disabled, sideOffset, alignOffset, }: DropdownMenuSubProps): import("react/jsx-runtime").JSX.Element;
7
+ ({ label, icon, children, disabled, sideOffset, alignOffset, }: DropdownMenuSubProps): import("react/jsx-runtime").JSX.Element;
8
8
  displayName: string;
9
9
  };
10
10
  export declare const DropdownMenuSeparator: {
@@ -12,6 +12,6 @@ export declare const DropdownMenuSeparator: {
12
12
  displayName: string;
13
13
  };
14
14
  export declare const DropdownMenuGroupLabel: {
15
- ({ className, ...props }: DropdownMenuGroupLabelProps): import("react/jsx-runtime").JSX.Element;
15
+ ({ className, icon, children, ...props }: DropdownMenuGroupLabelProps): import("react/jsx-runtime").JSX.Element;
16
16
  displayName: string;
17
17
  };
package/dist/DropdownMenu/DropdownMenu.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.3
2
+ @versini/ui-dropdown v1.2.0
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.3",
9
- buildTime: "12/16/2025 01:48 PM EST",
8
+ version: "1.2.0",
9
+ buildTime: "12/18/2025 08:37 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
@@ -134,6 +134,7 @@ const DropdownMenu = ({ trigger, children, label = "Open menu", defaultPlacement
134
134
  sideOffset: sideOffset,
135
135
  side: getRadixSide(defaultPlacement),
136
136
  align: getRadixAlign(defaultPlacement),
137
+ loop: true,
137
138
  children: children
138
139
  })
139
140
  })
@@ -141,15 +142,23 @@ const DropdownMenu = ({ trigger, children, label = "Open menu", defaultPlacement
141
142
  });
142
143
  };
143
144
  DropdownMenu.displayName = "DropdownMenu";
144
- const DropdownMenuSub = ({ label, children, disabled = false, sideOffset = 2, alignOffset = -4 })=>{
145
+ const DropdownMenuSub = ({ label, icon, children, disabled = false, sideOffset = 2, alignOffset = -4 })=>{
146
+ const labelSpanClass = icon ? "pl-2" : "";
145
147
  return /*#__PURE__*/ jsxs(Sub, {
146
148
  children: [
147
149
  /*#__PURE__*/ jsxs(SubTrigger, {
148
150
  className: SUB_TRIGGER_CLASS,
149
151
  disabled: disabled,
150
152
  children: [
151
- /*#__PURE__*/ jsx("span", {
152
- children: label
153
+ /*#__PURE__*/ jsxs("span", {
154
+ className: "flex items-center",
155
+ children: [
156
+ icon,
157
+ /*#__PURE__*/ jsx("span", {
158
+ className: labelSpanClass,
159
+ children: label
160
+ })
161
+ ]
153
162
  }),
154
163
  /*#__PURE__*/ jsx(IconNext, {
155
164
  className: "ml-2",
@@ -163,6 +172,7 @@ const DropdownMenuSub = ({ label, children, disabled = false, sideOffset = 2, al
163
172
  className: SUB_CONTENT_CLASS,
164
173
  sideOffset: sideOffset,
165
174
  alignOffset: alignOffset,
175
+ loop: true,
166
176
  children: children
167
177
  })
168
178
  })
@@ -178,11 +188,19 @@ const DropdownMenuSeparator = ({ className, ...props })=>{
178
188
  });
179
189
  };
180
190
  DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
181
- const DropdownMenuGroupLabel = ({ className, ...props })=>{
182
- const groupLabelClass = clsx(className, "pt-1 mb-2", "text-sm text-copy-dark font-bold", "border-b border-border-medium");
183
- return /*#__PURE__*/ jsx(Label, {
191
+ const DropdownMenuGroupLabel = ({ className, icon, children, ...props })=>{
192
+ const groupLabelClass = clsx(className, "pt-1 pb-2 mb-2", "text-sm text-copy-dark font-bold", "border-b border-border-medium", icon && "flex items-center");
193
+ const labelSpanClass = icon ? "pl-2" : "";
194
+ return /*#__PURE__*/ jsxs(Label, {
184
195
  className: groupLabelClass,
185
- ...props
196
+ ...props,
197
+ children: [
198
+ icon,
199
+ /*#__PURE__*/ jsx("span", {
200
+ className: labelSpanClass,
201
+ children: children
202
+ })
203
+ ]
186
204
  });
187
205
  };
188
206
  DropdownMenuGroupLabel.displayName = "DropdownMenuGroupLabel";
package/dist/DropdownMenu/DropdownMenuItem.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.3
2
+ @versini/ui-dropdown v1.2.0
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.3",
9
- buildTime: "12/16/2025 01:48 PM EST",
8
+ version: "1.2.0",
9
+ buildTime: "12/18/2025 08:37 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
package/dist/DropdownMenu/DropdownMenuTypes.d.ts CHANGED
@@ -90,12 +90,21 @@ export type DropdownMenuItemProps = {
90
90
  onFocus?: (event: React.FocusEvent<HTMLDivElement>) => void;
91
91
  };
92
92
  export type DropdownMenuSeparatorProps = React.HTMLAttributes<HTMLDivElement>;
93
- export type DropdownMenuGroupLabelProps = React.HTMLAttributes<HTMLDivElement>;
93
+ export type DropdownMenuGroupLabelProps = {
94
+ /**
95
+ * A React component of type Icon to be placed on the left of the label.
96
+ */
97
+ icon?: React.ReactNode;
98
+ } & React.HTMLAttributes<HTMLDivElement>;
94
99
  export type DropdownMenuSubProps = {
95
100
  /**
96
101
  * The label for the sub-menu trigger.
97
102
  */
98
103
  label: string;
104
+ /**
105
+ * A React component of type Icon to be placed on the left of the label.
106
+ */
107
+ icon?: React.ReactNode;
99
108
  /**
100
109
  * The children to render inside the sub-menu.
101
110
  */
package/dist/DropdownMenu/DropdownMenuTypes.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.3
2
+ @versini/ui-dropdown v1.2.0
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.3",
9
- buildTime: "12/16/2025 01:48 PM EST",
8
+ version: "1.2.0",
9
+ buildTime: "12/18/2025 08:37 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
package/dist/DropdownMenu/utilities.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.3
2
+ @versini/ui-dropdown v1.2.0
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.3",
9
- buildTime: "12/16/2025 01:48 PM EST",
8
+ version: "1.2.0",
9
+ buildTime: "12/18/2025 08:37 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
package/dist/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.3
2
+ @versini/ui-dropdown v1.2.0
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.3",
9
- buildTime: "12/16/2025 01:48 PM EST",
8
+ version: "1.2.0",
9
+ buildTime: "12/18/2025 08:37 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-dropdown",
3
- "version": "1.1.3",
3
+ "version": "1.2.0",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -50,5 +50,5 @@
50
50
  "sideEffects": [
51
51
  "**/*.css"
52
52
  ],
53
- "gitHead": "ef4323fa1f14f9f2a5471d71f063519230762aec"
53
+ "gitHead": "59a78fa649e803c40e8f1910abf64006c5f67ffd"
54
54
  }