@rovula/ui 0.1.23 → 0.1.24

package/dist/esm/types/patterns/menu/Menu.d.ts

@@ -14,6 +14,8 @@ export type MenuOption = {
     danger?: boolean;
     checked?: boolean;
     onClick?: () => void;
+    /** data-testid attached to the item element */
+    testId?: string;
 };
 export type MenuItemType = {
     type: "item";

package/dist/index.d.ts

@@ -1379,6 +1379,8 @@ type MenuOption = {
     danger?: boolean;
     checked?: boolean;
     onClick?: () => void;
+    /** data-testid attached to the item element */
+    testId?: string;
 };
 type MenuItemType = {
     type: "item";

package/dist/patterns/menu/Menu.js

@@ -23,7 +23,7 @@ function renderMenuItems(items, selectedValues, onSelect) {
                     onSelect === null || onSelect === void 0 ? void 0 : onSelect(val, opt);
                     (_a = opt.onClick) === null || _a === void 0 ? void 0 : _a.call(opt);
                 }
-            }, children: buffer.map((opt) => (_jsx(DropdownMenuRadioItem, { value: opt.value, disabled: opt.disabled, icon: opt.icon, children: opt.label }, opt.value))) }, key));
+            }, children: buffer.map((opt) => (_jsx(DropdownMenuRadioItem, { value: opt.value, disabled: opt.disabled, icon: opt.icon, "data-testid": opt.testId, children: opt.label }, opt.value))) }, key));
     };
     items.forEach((item, index) => {
         var _a;
@@ -54,7 +54,7 @@ function renderMenuItems(items, selectedValues, onSelect) {
             const opt = item.item;
             const isSelected = (_a = opt.checked) !== null && _a !== void 0 ? _a : selectedValues.includes(opt.value);
             if (opt.type === "checkbox") {
-                result.push(_jsx(DropdownMenuCheckboxItem, { checked: isSelected, disabled: opt.disabled, onCheckedChange: () => {
+                result.push(_jsx(DropdownMenuCheckboxItem, { checked: isSelected, disabled: opt.disabled, "data-testid": opt.testId, onCheckedChange: () => {
                         var _a;
                         onSelect === null || onSelect === void 0 ? void 0 : onSelect(opt.value, opt);
                         (_a = opt.onClick) === null || _a === void 0 ? void 0 : _a.call(opt);
@@ -62,7 +62,7 @@ function renderMenuItems(items, selectedValues, onSelect) {
                 return;
             }
             // default item
-            result.push(_jsx(DropdownMenuItem, { selected: isSelected, icon: opt.icon, disabled: opt.disabled, className: cn(opt.danger && "text-red-500"), onSelect: () => {
+            result.push(_jsx(DropdownMenuItem, { selected: isSelected, icon: opt.icon, disabled: opt.disabled, className: cn(opt.danger && "text-red-500"), "data-testid": opt.testId, onSelect: () => {
                     var _a;
                     onSelect === null || onSelect === void 0 ? void 0 : onSelect(opt.value, opt);
                     (_a = opt.onClick) === null || _a === void 0 ? void 0 : _a.call(opt);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rovula/ui",
-  "version": "0.1.23",
+  "version": "0.1.24",
   "main": "dist/cjs/bundle.js",
   "module": "dist/esm/bundle.js",
   "types": "dist/index.d.ts",

package/src/patterns/menu/Menu.tsx

@@ -36,6 +36,8 @@ export type MenuOption = {
   danger?: boolean;
   checked?: boolean;
   onClick?: () => void;
+  /** data-testid attached to the item element */
+  testId?: string;
 };
 
 export type MenuItemType =
@@ -121,6 +123,7 @@ function renderMenuItems(
             value={opt.value}
             disabled={opt.disabled}
             icon={opt.icon as React.ReactNode}
+            data-testid={opt.testId}
           >
             {opt.label}
           </DropdownMenuRadioItem>
@@ -187,6 +190,7 @@ function renderMenuItems(
             key={opt.value}
             checked={isSelected}
             disabled={opt.disabled}
+            data-testid={opt.testId}
             onCheckedChange={() => {
               onSelect?.(opt.value, opt);
               opt.onClick?.();
@@ -206,6 +210,7 @@ function renderMenuItems(
           icon={opt.icon as React.ReactNode}
           disabled={opt.disabled}
           className={cn(opt.danger && "text-red-500")}
+          data-testid={opt.testId}
           onSelect={() => {
             onSelect?.(opt.value, opt);
             opt.onClick?.();