@fuf-stack/pixels 1.1.2 → 1.2.0

package/dist/Menu/index.cjs

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkXHOAZB2Zcjs = require('../chunk-XHOAZB2Z.cjs');
+var _chunkWFR7OUY7cjs = require('../chunk-WFR7OUY7.cjs');
 require('../chunk-D4TLDLEX.cjs');
 
 
 
-exports.Menu = _chunkXHOAZB2Zcjs.Menu_default; exports.default = _chunkXHOAZB2Zcjs.Menu_default2;
+exports.Menu = _chunkWFR7OUY7cjs.Menu_default; exports.default = _chunkWFR7OUY7cjs.Menu_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Menu/index.d.cts

@@ -1,6 +1,9 @@
-import { M as Menu } from '../Menu-DYi8oagz.cjs';
-export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DYi8oagz.cjs';
+import { M as Menu } from '../Menu-DbeqxeL0.cjs';
+export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DbeqxeL0.cjs';
 import 'react/jsx-runtime';
+import 'tailwind-variants';
+import '@fuf-stack/pixel-utils';
+import '@heroui/button';
 import '@heroui/dropdown';
 import 'react';
 

package/dist/Menu/index.d.ts

@@ -1,6 +1,9 @@
-import { M as Menu } from '../Menu-DYi8oagz.js';
-export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DYi8oagz.js';
+import { M as Menu } from '../Menu-DbeqxeL0.js';
+export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DbeqxeL0.js';
 import 'react/jsx-runtime';
+import 'tailwind-variants';
+import '@fuf-stack/pixel-utils';
+import '@heroui/button';
 import '@heroui/dropdown';
 import 'react';
 

package/dist/Menu/index.js

@@ -1,7 +1,7 @@
 import {
   Menu_default,
   Menu_default2
-} from "../chunk-OP5W7BXY.js";
+} from "../chunk-WFPRB4JT.js";
 import "../chunk-J7N2552D.js";
 export {
   Menu_default as Menu,

package/dist/Menu-DbeqxeL0.d.cts

@@ -0,0 +1,98 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as tailwind_variants from 'tailwind-variants';
+import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
+import { ButtonProps } from '@heroui/button';
+import { DropdownItemProps, DropdownProps } from '@heroui/dropdown';
+import { ReactNode, Key } from 'react';
+
+/**
+ * Menu item type
+ */
+interface MenuItem {
+    /** unique identifier */
+    key: string;
+    /** CSS class name */
+    className?: string;
+    /** additional description shown under the label */
+    description?: string;
+    /** disables the menu item */
+    disabled?: boolean;
+    /** menu item icon  */
+    icon?: ReactNode;
+    /** menu item name */
+    label: ReactNode;
+    /** click event handler */
+    onClick?: DropdownItemProps['onPress'];
+    /** e2e test identifier */
+    testId?: string;
+}
+/**
+ * Menu section type
+ */
+interface MenuSection {
+    /** unique identifier */
+    key: string;
+    /** section label */
+    label: ReactNode;
+    /** section items (array of MenuItem) */
+    items: MenuItem[];
+}
+declare const menuVariants: tailwind_variants.TVReturnType<{
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            trigger?: tailwind_variants.ClassValue;
+            item?: tailwind_variants.ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: tailwind_variants.ClassValue | {
+            trigger?: tailwind_variants.ClassValue;
+            item?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    item: string;
+    trigger: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            trigger?: tailwind_variants.ClassValue;
+            item?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    item: string;
+    trigger: string;
+}, tailwind_variants.TVReturnType<unknown, {
+    item: string;
+    trigger: string;
+}, undefined, unknown, unknown, undefined>>;
+type VariantProps = TVProps<typeof menuVariants>;
+type ClassName = TVClassName<typeof menuVariants>;
+interface MenuProps extends VariantProps {
+    /** sets HTML aria-label attribute */
+    ariaLabel?: string;
+    /** child components */
+    children?: ReactNode;
+    /** CSS class name */
+    className?: ClassName;
+    /** menu item structure */
+    items: (MenuSection | MenuItem)[];
+    /** disable menu trigger */
+    isDisabled?: boolean;
+    /** placement of the menu */
+    placement?: DropdownProps['placement'];
+    /** called if item is selected */
+    onAction?: (key: Key) => void;
+    /** HTML data-testid attribute used in e2e tests */
+    testId?: string;
+    /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */
+    triggerButtonProps?: Pick<ButtonProps, 'aria-label' | 'className' | 'color' | 'disableAnimation' | 'disabled' | 'size' | 'variant'>;
+}
+/**
+ * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
+ */
+declare const Menu: ({ ariaLabel, children, className: _className, isDisabled, items, onAction, placement, testId, triggerButtonProps, }: MenuProps) => react_jsx_runtime.JSX.Element;
+
+export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };

package/dist/Menu-DbeqxeL0.d.ts

@@ -0,0 +1,98 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as tailwind_variants from 'tailwind-variants';
+import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
+import { ButtonProps } from '@heroui/button';
+import { DropdownItemProps, DropdownProps } from '@heroui/dropdown';
+import { ReactNode, Key } from 'react';
+
+/**
+ * Menu item type
+ */
+interface MenuItem {
+    /** unique identifier */
+    key: string;
+    /** CSS class name */
+    className?: string;
+    /** additional description shown under the label */
+    description?: string;
+    /** disables the menu item */
+    disabled?: boolean;
+    /** menu item icon  */
+    icon?: ReactNode;
+    /** menu item name */
+    label: ReactNode;
+    /** click event handler */
+    onClick?: DropdownItemProps['onPress'];
+    /** e2e test identifier */
+    testId?: string;
+}
+/**
+ * Menu section type
+ */
+interface MenuSection {
+    /** unique identifier */
+    key: string;
+    /** section label */
+    label: ReactNode;
+    /** section items (array of MenuItem) */
+    items: MenuItem[];
+}
+declare const menuVariants: tailwind_variants.TVReturnType<{
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            trigger?: tailwind_variants.ClassValue;
+            item?: tailwind_variants.ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: tailwind_variants.ClassValue | {
+            trigger?: tailwind_variants.ClassValue;
+            item?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    item: string;
+    trigger: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            trigger?: tailwind_variants.ClassValue;
+            item?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    item: string;
+    trigger: string;
+}, tailwind_variants.TVReturnType<unknown, {
+    item: string;
+    trigger: string;
+}, undefined, unknown, unknown, undefined>>;
+type VariantProps = TVProps<typeof menuVariants>;
+type ClassName = TVClassName<typeof menuVariants>;
+interface MenuProps extends VariantProps {
+    /** sets HTML aria-label attribute */
+    ariaLabel?: string;
+    /** child components */
+    children?: ReactNode;
+    /** CSS class name */
+    className?: ClassName;
+    /** menu item structure */
+    items: (MenuSection | MenuItem)[];
+    /** disable menu trigger */
+    isDisabled?: boolean;
+    /** placement of the menu */
+    placement?: DropdownProps['placement'];
+    /** called if item is selected */
+    onAction?: (key: Key) => void;
+    /** HTML data-testid attribute used in e2e tests */
+    testId?: string;
+    /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */
+    triggerButtonProps?: Pick<ButtonProps, 'aria-label' | 'className' | 'color' | 'disableAnimation' | 'disabled' | 'size' | 'variant'>;
+}
+/**
+ * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
+ */
+declare const Menu: ({ ariaLabel, children, className: _className, isDisabled, items, onAction, placement, testId, triggerButtonProps, }: MenuProps) => react_jsx_runtime.JSX.Element;
+
+export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };

package/dist/chunk-WFPRB4JT.js

@@ -0,0 +1,115 @@
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-J7N2552D.js";
+
+// src/Menu/Menu.tsx
+import { FaEllipsisVertical } from "react-icons/fa6";
+import { Button } from "@heroui/button";
+import {
+  Dropdown as HeroDropdown,
+  DropdownItem as HeroDropdownItem,
+  DropdownMenu as HeroDropdownMenu,
+  DropdownSection as HeroDropdownSection,
+  DropdownTrigger as HeroDropdownTrigger
+} from "@heroui/dropdown";
+import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+var menuVariants = tv({
+  slots: {
+    item: "",
+    trigger: ""
+  }
+});
+var getDisabledKeys = (items) => {
+  return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
+    return Object.hasOwn(item, "disabled") && item.disabled === true;
+  }).map((item) => item.key);
+};
+var renderMenuItem = (item, itemClassName) => /* @__PURE__ */ jsx(
+  HeroDropdownItem,
+  {
+    className: cn(itemClassName, item.className),
+    "data-testid": item.testId || item.key,
+    description: item.description,
+    onPress: item.onClick,
+    startContent: item.icon,
+    children: item.label
+  },
+  item.key
+);
+var Menu = ({
+  ariaLabel = void 0,
+  children = null,
+  className: _className = void 0,
+  isDisabled = false,
+  items,
+  onAction = void 0,
+  placement = void 0,
+  testId = void 0,
+  triggerButtonProps = void 0
+}) => {
+  const variants = menuVariants();
+  const className = variantsToClassNames(variants, _className, "trigger");
+  let triggerButton = /* @__PURE__ */ jsx("button", { type: "button", children });
+  if (!children) {
+    triggerButton = /* @__PURE__ */ jsx(
+      Button,
+      __spreadProps(__spreadValues({
+        className: cn("min-w-0", className.trigger),
+        size: "sm",
+        variant: "flat"
+      }, triggerButtonProps), {
+        children: /* @__PURE__ */ jsx(FaEllipsisVertical, {})
+      })
+    );
+  } else if (triggerButtonProps) {
+    triggerButton = // eslint-disable-next-line react/jsx-props-no-spreading
+    /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ className: className.trigger }, triggerButtonProps), { children }));
+  }
+  return /* @__PURE__ */ jsxs(
+    HeroDropdown,
+    {
+      "aria-label": ariaLabel,
+      isDisabled,
+      placement,
+      children: [
+        /* @__PURE__ */ jsx(HeroDropdownTrigger, { "data-testid": testId, children: triggerButton }),
+        /* @__PURE__ */ jsx(
+          HeroDropdownMenu,
+          {
+            items,
+            disabledKeys: getDisabledKeys(items),
+            onAction,
+            children: (item) => {
+              if ("items" in item) {
+                return /* @__PURE__ */ jsx(
+                  HeroDropdownSection,
+                  {
+                    items: item.items,
+                    title: item.label,
+                    children: (sectionItem) => {
+                      return renderMenuItem(sectionItem, className.item);
+                    }
+                  },
+                  item.key
+                );
+              }
+              return renderMenuItem(item, className.item);
+            }
+          }
+        )
+      ]
+    }
+  );
+};
+var Menu_default = Menu;
+
+// src/Menu/index.ts
+var Menu_default2 = Menu_default;
+
+export {
+  Menu_default,
+  Menu_default2
+};
+//# sourceMappingURL=chunk-WFPRB4JT.js.map

package/dist/chunk-WFPRB4JT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Menu/Menu.tsx","../src/Menu/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ButtonProps } from '@heroui/button';\nimport type {\n  DropdownItemProps as HeroDropdownItemProps,\n  DropdownProps as HeroDropdownProps,\n  DropdownSectionProps as HeroDropdownSectionProps,\n} from '@heroui/dropdown';\nimport type { Key, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@heroui/button';\nimport {\n  Dropdown as HeroDropdown,\n  DropdownItem as HeroDropdownItem,\n  DropdownMenu as HeroDropdownMenu,\n  DropdownSection as HeroDropdownSection,\n  DropdownTrigger as HeroDropdownTrigger,\n} from '@heroui/dropdown';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: HeroDropdownItemProps['onPress'];\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\n// menu styling variants\nexport const menuVariants = tv({\n  slots: {\n    item: '',\n    trigger: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof menuVariants>;\ntype ClassName = TVClassName<typeof menuVariants>;\n\nexport interface MenuProps extends VariantProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: ClassName;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** placement of the menu */\n  placement?: HeroDropdownProps['placement'];\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */\n  triggerButtonProps?: Pick<\n    ButtonProps,\n    | 'aria-label'\n    | 'className'\n    | 'color'\n    | 'disableAnimation'\n    | 'disabled'\n    | 'size'\n    | 'variant'\n  >;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem, itemClassName?: string) => (\n  <HeroDropdownItem\n    className={cn(itemClassName, item.className)}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onPress={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </HeroDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)\n */\nconst Menu = ({\n  ariaLabel = undefined,\n  children = null,\n  className: _className = undefined,\n  isDisabled = false,\n  items,\n  onAction = undefined,\n  placement = undefined,\n  testId = undefined,\n  triggerButtonProps = undefined,\n}: MenuProps) => {\n  // className from slots\n  const variants = menuVariants();\n  const className = variantsToClassNames(variants, _className, 'trigger');\n\n  // determine trigger button variant\n  let triggerButton = <button type=\"button\">{children}</button>;\n  if (!children) {\n    //  default to ellipsis icon when no children are provided\n    triggerButton = (\n      <Button\n        className={cn('min-w-0', className.trigger)}\n        size=\"sm\"\n        variant=\"flat\"\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...triggerButtonProps}\n      >\n        <FaEllipsisVertical />\n      </Button>\n    );\n  } else if (triggerButtonProps) {\n    // use provided triggerButtonProps with hero button\n    triggerButton = (\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      <Button className={className.trigger} {...triggerButtonProps}>\n        {children}\n      </Button>\n    );\n  }\n\n  return (\n    <HeroDropdown\n      aria-label={ariaLabel}\n      isDisabled={isDisabled}\n      placement={placement}\n    >\n      <HeroDropdownTrigger data-testid={testId}>\n        {/* NOTE: type and aria properties are injected by HeroDropdownTrigger */}\n        {triggerButton}\n      </HeroDropdownTrigger>\n      <HeroDropdownMenu\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <HeroDropdownSection\n                items={item.items}\n                title={item.label as HeroDropdownSectionProps['title']}\n                key={item.key}\n              >\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem, className.item);\n                }}\n              </HeroDropdownSection>\n            );\n          }\n          return renderMenuItem(item, className.item);\n        }}\n      </HeroDropdownMenu>\n    </HeroDropdown>\n  );\n};\n\nexport default Menu;\n","import Menu from './Menu';\n\nexport type { MenuProps, MenuItem, MenuSection } from './Menu';\n\nexport { Menu };\n\nexport default Menu;\n"],"mappings":";;;;;;AASA,SAAS,0BAA0B;AAEnC,SAAS,cAAc;AACvB;AAAA,EACE,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,OACd;AAEP,SAAS,IAAI,IAAI,4BAA4B;AA4F3C,cAwDE,YAxDF;AAvDK,IAAM,eAAe,GAAG;AAAA,EAC7B,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,EACX;AACF,CAAC;AAoCD,IAAM,kBAAkB,CAAC,UAAsC;AAC7D,SACE,MAEG,IAAI,CAAC,SAAU,QAAO,6BAAM,WAAU,cAAc,OAAO,KAAK,KAAM,EACtE,KAAiB,EACjB,OAAO,CAAC,SAAS;AAChB,WAAO,OAAO,OAAO,MAAM,UAAU,KAAK,KAAK,aAAa;AAAA,EAC9D,CAAC,EACA,IAAI,CAAC,SAAS,KAAK,GAAG;AAE7B;AAEA,IAAM,iBAAiB,CAAC,MAAgB,kBACtC;AAAA,EAAC;AAAA;AAAA,IACC,WAAW,GAAG,eAAe,KAAK,SAAS;AAAA,IAC3C,eAAa,KAAK,UAAU,KAAK;AAAA,IACjC,aAAa,KAAK;AAAA,IAElB,SAAS,KAAK;AAAA,IACd,cAAc,KAAK;AAAA,IAElB,eAAK;AAAA;AAAA,EAJD,KAAK;AAKZ;AAMF,IAAM,OAAO,CAAC;AAAA,EACZ,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,WAAW,aAAa;AAAA,EACxB,aAAa;AAAA,EACb;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,qBAAqB;AACvB,MAAiB;AAEf,QAAM,WAAW,aAAa;AAC9B,QAAM,YAAY,qBAAqB,UAAU,YAAY,SAAS;AAGtE,MAAI,gBAAgB,oBAAC,YAAO,MAAK,UAAU,UAAS;AACpD,MAAI,CAAC,UAAU;AAEb,oBACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,GAAG,WAAW,UAAU,OAAO;AAAA,QAC1C,MAAK;AAAA,QACL,SAAQ;AAAA,SAEJ,qBALL;AAAA,QAOC,8BAAC,sBAAmB;AAAA;AAAA,IACtB;AAAA,EAEJ,WAAW,oBAAoB;AAE7B;AAAA,IAEE,oBAAC,uCAAO,WAAW,UAAU,WAAa,qBAAzC,EACE,WACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,cAAY;AAAA,MACZ;AAAA,MACA;AAAA,MAEA;AAAA,4BAAC,uBAAoB,eAAa,QAE/B,yBACH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,cAAc,gBAAgB,KAAK;AAAA,YACnC;AAAA,YAEC,WAAC,SAAS;AACT,kBAAI,WAAW,MAAM;AACnB,uBACE;AAAA,kBAAC;AAAA;AAAA,oBACC,OAAO,KAAK;AAAA,oBACZ,OAAO,KAAK;AAAA,oBAGX,WAAC,gBAAgB;AAChB,6BAAO,eAAe,aAAa,UAAU,IAAI;AAAA,oBACnD;AAAA;AAAA,kBAJK,KAAK;AAAA,gBAKZ;AAAA,cAEJ;AACA,qBAAO,eAAe,MAAM,UAAU,IAAI;AAAA,YAC5C;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,eAAQ;;;ACrMf,IAAOA,gBAAQ;","names":["Menu_default"]}

package/dist/chunk-WFR7OUY7.cjs

@@ -0,0 +1,115 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+var _chunkD4TLDLEXcjs = require('./chunk-D4TLDLEX.cjs');
+
+// src/Menu/Menu.tsx
+var _fa6 = require('react-icons/fa6');
+var _button = require('@heroui/button');
+
+
+
+
+
+
+var _dropdown = require('@heroui/dropdown');
+var _pixelutils = require('@fuf-stack/pixel-utils');
+var _jsxruntime = require('react/jsx-runtime');
+var menuVariants = _pixelutils.tv.call(void 0, {
+  slots: {
+    item: "",
+    trigger: ""
+  }
+});
+var getDisabledKeys = (items) => {
+  return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
+    return Object.hasOwn(item, "disabled") && item.disabled === true;
+  }).map((item) => item.key);
+};
+var renderMenuItem = (item, itemClassName) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  _dropdown.DropdownItem,
+  {
+    className: _pixelutils.cn.call(void 0, itemClassName, item.className),
+    "data-testid": item.testId || item.key,
+    description: item.description,
+    onPress: item.onClick,
+    startContent: item.icon,
+    children: item.label
+  },
+  item.key
+);
+var Menu = ({
+  ariaLabel = void 0,
+  children = null,
+  className: _className = void 0,
+  isDisabled = false,
+  items,
+  onAction = void 0,
+  placement = void 0,
+  testId = void 0,
+  triggerButtonProps = void 0
+}) => {
+  const variants = menuVariants();
+  const className = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "trigger");
+  let triggerButton = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { type: "button", children });
+  if (!children) {
+    triggerButton = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _button.Button,
+      _chunkD4TLDLEXcjs.__spreadProps.call(void 0, _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {
+        className: _pixelutils.cn.call(void 0, "min-w-0", className.trigger),
+        size: "sm",
+        variant: "flat"
+      }, triggerButtonProps), {
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaEllipsisVertical, {})
+      })
+    );
+  } else if (triggerButtonProps) {
+    triggerButton = // eslint-disable-next-line react/jsx-props-no-spreading
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _button.Button, _chunkD4TLDLEXcjs.__spreadProps.call(void 0, _chunkD4TLDLEXcjs.__spreadValues.call(void 0, { className: className.trigger }, triggerButtonProps), { children }));
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _dropdown.Dropdown,
+    {
+      "aria-label": ariaLabel,
+      isDisabled,
+      placement,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _dropdown.DropdownTrigger, { "data-testid": testId, children: triggerButton }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _dropdown.DropdownMenu,
+          {
+            items,
+            disabledKeys: getDisabledKeys(items),
+            onAction,
+            children: (item) => {
+              if ("items" in item) {
+                return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  _dropdown.DropdownSection,
+                  {
+                    items: item.items,
+                    title: item.label,
+                    children: (sectionItem) => {
+                      return renderMenuItem(sectionItem, className.item);
+                    }
+                  },
+                  item.key
+                );
+              }
+              return renderMenuItem(item, className.item);
+            }
+          }
+        )
+      ]
+    }
+  );
+};
+var Menu_default = Menu;
+
+// src/Menu/index.ts
+var Menu_default2 = Menu_default;
+
+
+
+
+exports.Menu_default = Menu_default; exports.Menu_default2 = Menu_default2;
+//# sourceMappingURL=chunk-WFR7OUY7.cjs.map

package/dist/chunk-WFR7OUY7.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-WFR7OUY7.cjs","../src/Menu/Menu.tsx","../src/Menu/index.ts"],"names":["Menu_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-WFR7OUY7.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ButtonProps } from '@heroui/button';\nimport type {\n  DropdownItemProps as HeroDropdownItemProps,\n  DropdownProps as HeroDropdownProps,\n  DropdownSectionProps as HeroDropdownSectionProps,\n} from '@heroui/dropdown';\nimport type { Key, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@heroui/button';\nimport {\n  Dropdown as HeroDropdown,\n  DropdownItem as HeroDropdownItem,\n  DropdownMenu as HeroDropdownMenu,\n  DropdownSection as HeroDropdownSection,\n  DropdownTrigger as HeroDropdownTrigger,\n} from '@heroui/dropdown';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: HeroDropdownItemProps['onPress'];\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\n// menu styling variants\nexport const menuVariants = tv({\n  slots: {\n    item: '',\n    trigger: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof menuVariants>;\ntype ClassName = TVClassName<typeof menuVariants>;\n\nexport interface MenuProps extends VariantProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: ClassName;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** placement of the menu */\n  placement?: HeroDropdownProps['placement'];\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */\n  triggerButtonProps?: Pick<\n    ButtonProps,\n    | 'aria-label'\n    | 'className'\n    | 'color'\n    | 'disableAnimation'\n    | 'disabled'\n    | 'size'\n    | 'variant'\n  >;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem, itemClassName?: string) => (\n  <HeroDropdownItem\n    className={cn(itemClassName, item.className)}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onPress={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </HeroDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)\n */\nconst Menu = ({\n  ariaLabel = undefined,\n  children = null,\n  className: _className = undefined,\n  isDisabled = false,\n  items,\n  onAction = undefined,\n  placement = undefined,\n  testId = undefined,\n  triggerButtonProps = undefined,\n}: MenuProps) => {\n  // className from slots\n  const variants = menuVariants();\n  const className = variantsToClassNames(variants, _className, 'trigger');\n\n  // determine trigger button variant\n  let triggerButton = <button type=\"button\">{children}</button>;\n  if (!children) {\n    //  default to ellipsis icon when no children are provided\n    triggerButton = (\n      <Button\n        className={cn('min-w-0', className.trigger)}\n        size=\"sm\"\n        variant=\"flat\"\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...triggerButtonProps}\n      >\n        <FaEllipsisVertical />\n      </Button>\n    );\n  } else if (triggerButtonProps) {\n    // use provided triggerButtonProps with hero button\n    triggerButton = (\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      <Button className={className.trigger} {...triggerButtonProps}>\n        {children}\n      </Button>\n    );\n  }\n\n  return (\n    <HeroDropdown\n      aria-label={ariaLabel}\n      isDisabled={isDisabled}\n      placement={placement}\n    >\n      <HeroDropdownTrigger data-testid={testId}>\n        {/* NOTE: type and aria properties are injected by HeroDropdownTrigger */}\n        {triggerButton}\n      </HeroDropdownTrigger>\n      <HeroDropdownMenu\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <HeroDropdownSection\n                items={item.items}\n                title={item.label as HeroDropdownSectionProps['title']}\n                key={item.key}\n              >\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem, className.item);\n                }}\n              </HeroDropdownSection>\n            );\n          }\n          return renderMenuItem(item, className.item);\n        }}\n      </HeroDropdownMenu>\n    </HeroDropdown>\n  );\n};\n\nexport default Menu;\n","import Menu from './Menu';\n\nexport type { MenuProps, MenuItem, MenuSection } from './Menu';\n\nexport { Menu };\n\nexport default Menu;\n"]}

package/dist/index.cjs

@@ -52,7 +52,7 @@ var _chunk2OJHNNCUcjs = require('./chunk-2OJHNNCU.cjs');
 var _chunkPHQVYJS2cjs = require('./chunk-PHQVYJS2.cjs');
 
 
-var _chunkXHOAZB2Zcjs = require('./chunk-XHOAZB2Z.cjs');
+var _chunkWFR7OUY7cjs = require('./chunk-WFR7OUY7.cjs');
 
 
 
@@ -131,5 +131,5 @@ require('./chunk-D4TLDLEX.cjs');
 
 
 
-exports.Accordion = _chunk3LEEMSTGcjs.Accordion_default; exports.Alert = _chunkYBMQZ43Tcjs.Alert_default; exports.Avatar = _chunk77J7NZYBcjs.Avatar_default; exports.AvatarGroup = _chunkLIZGYO24cjs.AvatarGroup_default; exports.Badge = _chunkJSANDW3Wcjs.Badge_default; exports.Breadcrumb = _chunkZZOEFQWQcjs.Breadcrumb_default; exports.Button = _chunkPZL3LRGYcjs.Button_default; exports.ButtonGroup = _chunkY3RSI2KVcjs.ButtonGroup_default; exports.Card = _chunk7APFE3MIcjs.Card_default; exports.Drawer = _chunk7RVUB6I5cjs.Drawer_default; exports.Json = _chunk2OJHNNCUcjs.Json_default; exports.Label = _chunkPHQVYJS2cjs.Label_default; exports.Menu = _chunkXHOAZB2Zcjs.Menu_default; exports.Modal = _chunkDTG27JQ7cjs.Modal_default; exports.Popover = _chunkWZZMB5CIcjs.Popover_default; exports.Progress = _chunkXOCP745Xcjs.Progress_default; exports.ProgressCircular = _chunkW2EOAUKEcjs.ProgressCircular_default; exports.Table = _chunkC6VV7NYTcjs.Table_default; exports.Tabs = _chunkRYO74XL7cjs.Tabs_default; exports.Toast = _chunkTLXLWB4Ycjs.Toast; exports.ToastProvider = _chunkTLXLWB4Ycjs.ToastProvider_default; exports.Tooltip = _chunkJ4HCGFN4cjs.Tooltip_default; exports.accordionVariants = _chunk3LEEMSTGcjs.accordionVariants; exports.addToast = _chunkTLXLWB4Ycjs.addToast; exports.alertVariants = _chunkYBMQZ43Tcjs.alertVariants; exports.breadcrumbVariants = _chunkZZOEFQWQcjs.breadcrumbVariants; exports.buttonVariants = _chunkPZL3LRGYcjs.buttonVariants; exports.cardVariants = _chunk7APFE3MIcjs.cardVariants; exports.drawerBackdrops = _chunk7RVUB6I5cjs.drawerBackdrops; exports.drawerPlacements = _chunk7RVUB6I5cjs.drawerPlacements; exports.drawerRadii = _chunk7RVUB6I5cjs.drawerRadii; exports.drawerSizes = _chunk7RVUB6I5cjs.drawerSizes; exports.drawerVariants = _chunk7RVUB6I5cjs.drawerVariants; exports.labelVariants = _chunkPHQVYJS2cjs.labelVariants; exports.modalVariants = _chunkDTG27JQ7cjs.modalVariants; exports.progressCircularVariants = _chunkW2EOAUKEcjs.progressCircularVariants; exports.progressVariants = _chunkXOCP745Xcjs.progressVariants; exports.tableVariants = _chunkC6VV7NYTcjs.tableVariants; exports.tabsVariants = _chunkRYO74XL7cjs.tabsVariants; exports.toastVariants = _chunkTLXLWB4Ycjs.toastVariants; exports.useDebounce = _chunkOLI32URUcjs.useDebounce; exports.useIsInitialRenderCycle = _chunkOLI32URUcjs.useIsInitialRenderCycle; exports.useLocalStorage = _chunkOLI32URUcjs.useLocalStorage;
+exports.Accordion = _chunk3LEEMSTGcjs.Accordion_default; exports.Alert = _chunkYBMQZ43Tcjs.Alert_default; exports.Avatar = _chunk77J7NZYBcjs.Avatar_default; exports.AvatarGroup = _chunkLIZGYO24cjs.AvatarGroup_default; exports.Badge = _chunkJSANDW3Wcjs.Badge_default; exports.Breadcrumb = _chunkZZOEFQWQcjs.Breadcrumb_default; exports.Button = _chunkPZL3LRGYcjs.Button_default; exports.ButtonGroup = _chunkY3RSI2KVcjs.ButtonGroup_default; exports.Card = _chunk7APFE3MIcjs.Card_default; exports.Drawer = _chunk7RVUB6I5cjs.Drawer_default; exports.Json = _chunk2OJHNNCUcjs.Json_default; exports.Label = _chunkPHQVYJS2cjs.Label_default; exports.Menu = _chunkWFR7OUY7cjs.Menu_default; exports.Modal = _chunkDTG27JQ7cjs.Modal_default; exports.Popover = _chunkWZZMB5CIcjs.Popover_default; exports.Progress = _chunkXOCP745Xcjs.Progress_default; exports.ProgressCircular = _chunkW2EOAUKEcjs.ProgressCircular_default; exports.Table = _chunkC6VV7NYTcjs.Table_default; exports.Tabs = _chunkRYO74XL7cjs.Tabs_default; exports.Toast = _chunkTLXLWB4Ycjs.Toast; exports.ToastProvider = _chunkTLXLWB4Ycjs.ToastProvider_default; exports.Tooltip = _chunkJ4HCGFN4cjs.Tooltip_default; exports.accordionVariants = _chunk3LEEMSTGcjs.accordionVariants; exports.addToast = _chunkTLXLWB4Ycjs.addToast; exports.alertVariants = _chunkYBMQZ43Tcjs.alertVariants; exports.breadcrumbVariants = _chunkZZOEFQWQcjs.breadcrumbVariants; exports.buttonVariants = _chunkPZL3LRGYcjs.buttonVariants; exports.cardVariants = _chunk7APFE3MIcjs.cardVariants; exports.drawerBackdrops = _chunk7RVUB6I5cjs.drawerBackdrops; exports.drawerPlacements = _chunk7RVUB6I5cjs.drawerPlacements; exports.drawerRadii = _chunk7RVUB6I5cjs.drawerRadii; exports.drawerSizes = _chunk7RVUB6I5cjs.drawerSizes; exports.drawerVariants = _chunk7RVUB6I5cjs.drawerVariants; exports.labelVariants = _chunkPHQVYJS2cjs.labelVariants; exports.modalVariants = _chunkDTG27JQ7cjs.modalVariants; exports.progressCircularVariants = _chunkW2EOAUKEcjs.progressCircularVariants; exports.progressVariants = _chunkXOCP745Xcjs.progressVariants; exports.tableVariants = _chunkC6VV7NYTcjs.tableVariants; exports.tabsVariants = _chunkRYO74XL7cjs.tabsVariants; exports.toastVariants = _chunkTLXLWB4Ycjs.toastVariants; exports.useDebounce = _chunkOLI32URUcjs.useDebounce; exports.useIsInitialRenderCycle = _chunkOLI32URUcjs.useIsInitialRenderCycle; exports.useLocalStorage = _chunkOLI32URUcjs.useLocalStorage;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.cts

@@ -10,7 +10,7 @@ export { C as Card, a as CardProps, c as cardVariants } from './Card-OBRZ-ssX.cj
 export { D as Drawer, f as DrawerProps, d as drawerBackdrops, a as drawerPlacements, b as drawerRadii, c as drawerSizes, e as drawerVariants } from './Drawer-JpihbwKl.cjs';
 export { J as Json, a as JsonProps } from './Json-Dny90Wml.cjs';
 export { L as Label, a as LabelProps, l as labelVariants } from './Label-B5fd7vp_.cjs';
-export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DYi8oagz.cjs';
+export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DbeqxeL0.cjs';
 export { M as Modal, a as ModalProps, m as modalVariants } from './Modal-BwFQz60I.cjs';
 export { _ as Popover, P as PopoverProps } from './Popover-BUKzm3MQ.cjs';
 export { P as ProgressCircular, a as ProgressCircularProps, p as progressCircularVariants } from './ProgressCircular-CkZsOW4R.cjs';

package/dist/index.d.ts

@@ -10,7 +10,7 @@ export { C as Card, a as CardProps, c as cardVariants } from './Card-OBRZ-ssX.js
 export { D as Drawer, f as DrawerProps, d as drawerBackdrops, a as drawerPlacements, b as drawerRadii, c as drawerSizes, e as drawerVariants } from './Drawer-JpihbwKl.js';
 export { J as Json, a as JsonProps } from './Json-Dny90Wml.js';
 export { L as Label, a as LabelProps, l as labelVariants } from './Label-B5fd7vp_.js';
-export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DYi8oagz.js';
+export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DbeqxeL0.js';
 export { M as Modal, a as ModalProps, m as modalVariants } from './Modal-BwFQz60I.js';
 export { _ as Popover, P as PopoverProps } from './Popover-D6Qv56ms.js';
 export { P as ProgressCircular, a as ProgressCircularProps, p as progressCircularVariants } from './ProgressCircular-CkZsOW4R.js';

package/dist/index.js

@@ -52,7 +52,7 @@ import {
 } from "./chunk-X6JZFO33.js";
 import {
   Menu_default
-} from "./chunk-OP5W7BXY.js";
+} from "./chunk-WFPRB4JT.js";
 import {
   Modal_default,
   modalVariants

package/package.json

@@ -2,7 +2,7 @@
   "name": "@fuf-stack/pixels",
   "description": "fuf core react component library",
   "author": "Fröhlich ∧ Frei",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

package/dist/Menu-DYi8oagz.d.cts

@@ -1,56 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { DropdownItemProps } from '@heroui/dropdown';
-import { ReactNode, Key } from 'react';
-
-/**
- * Menu item type
- */
-interface MenuItem {
-    /** unique identifier */
-    key: string;
-    /** CSS class name */
-    className?: string;
-    /** additional description shown under the label */
-    description?: string;
-    /** disables the menu item */
-    disabled?: boolean;
-    /** menu item icon  */
-    icon?: ReactNode;
-    /** menu item name */
-    label: ReactNode;
-    /** click event handler */
-    onClick?: DropdownItemProps['onPress'];
-    /** e2e test identifier */
-    testId?: string;
-}
-/**
- * Menu section type
- */
-interface MenuSection {
-    /** unique identifier */
-    key: string;
-    /** section label */
-    label: ReactNode;
-    /** section items (array of MenuItem) */
-    items: MenuItem[];
-}
-interface MenuProps {
-    /** child components */
-    children?: ReactNode;
-    /** CSS class name */
-    className?: string | string[];
-    /** HTML data-testid attribute used in e2e tests */
-    testId?: string;
-    /** menu item structure */
-    items: (MenuSection | MenuItem)[];
-    /** disable menu trigger */
-    isDisabled?: boolean;
-    /** called if item is selected */
-    onAction?: (key: Key) => void;
-}
-/**
- * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
- */
-declare const Menu: ({ children, className, onAction, testId, isDisabled, items, }: MenuProps) => react_jsx_runtime.JSX.Element;
-
-export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };

package/dist/Menu-DYi8oagz.d.ts

@@ -1,56 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { DropdownItemProps } from '@heroui/dropdown';
-import { ReactNode, Key } from 'react';
-
-/**
- * Menu item type
- */
-interface MenuItem {
-    /** unique identifier */
-    key: string;
-    /** CSS class name */
-    className?: string;
-    /** additional description shown under the label */
-    description?: string;
-    /** disables the menu item */
-    disabled?: boolean;
-    /** menu item icon  */
-    icon?: ReactNode;
-    /** menu item name */
-    label: ReactNode;
-    /** click event handler */
-    onClick?: DropdownItemProps['onPress'];
-    /** e2e test identifier */
-    testId?: string;
-}
-/**
- * Menu section type
- */
-interface MenuSection {
-    /** unique identifier */
-    key: string;
-    /** section label */
-    label: ReactNode;
-    /** section items (array of MenuItem) */
-    items: MenuItem[];
-}
-interface MenuProps {
-    /** child components */
-    children?: ReactNode;
-    /** CSS class name */
-    className?: string | string[];
-    /** HTML data-testid attribute used in e2e tests */
-    testId?: string;
-    /** menu item structure */
-    items: (MenuSection | MenuItem)[];
-    /** disable menu trigger */
-    isDisabled?: boolean;
-    /** called if item is selected */
-    onAction?: (key: Key) => void;
-}
-/**
- * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
- */
-declare const Menu: ({ children, className, onAction, testId, isDisabled, items, }: MenuProps) => react_jsx_runtime.JSX.Element;
-
-export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };

package/dist/chunk-OP5W7BXY.js

@@ -1,81 +0,0 @@
-// src/Menu/Menu.tsx
-import { FaEllipsisVertical } from "react-icons/fa6";
-import { Button } from "@heroui/button";
-import {
-  Dropdown as HeroDropdown,
-  DropdownItem as HeroDropdownItem,
-  DropdownMenu as HeroDropdownMenu,
-  DropdownSection as HeroDropdownSection,
-  DropdownTrigger as HeroDropdownTrigger
-} from "@heroui/dropdown";
-import { cn } from "@fuf-stack/pixel-utils";
-import { jsx, jsxs } from "react/jsx-runtime";
-var getDisabledKeys = (items) => {
-  return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
-    return Object.hasOwn(item, "disabled") && item.disabled === true;
-  }).map((item) => item.key);
-};
-var renderMenuItem = (item) => /* @__PURE__ */ jsx(
-  HeroDropdownItem,
-  {
-    className: item.className,
-    "data-testid": item.testId || item.key,
-    description: item.description,
-    onPress: item.onClick,
-    startContent: item.icon,
-    children: item.label
-  },
-  item.key
-);
-var Menu = ({
-  children = null,
-  className = void 0,
-  onAction = void 0,
-  testId = void 0,
-  isDisabled = false,
-  items
-}) => {
-  return /* @__PURE__ */ jsxs(HeroDropdown, { isDisabled, children: [
-    /* @__PURE__ */ jsx(HeroDropdownTrigger, { className: cn(className), "data-testid": testId, children: children ? (
-      // eslint-disable-next-line react/button-has-type
-      /* @__PURE__ */ jsx("button", { children })
-    ) : (
-      // INFO: we use hero button here so that ref passing works
-      /* @__PURE__ */ jsx(Button, { size: "sm", variant: "flat", className: "min-w-0", children: /* @__PURE__ */ jsx(FaEllipsisVertical, {}) })
-    ) }),
-    /* @__PURE__ */ jsx(
-      HeroDropdownMenu,
-      {
-        items,
-        disabledKeys: getDisabledKeys(items),
-        onAction,
-        children: (item) => {
-          if ("items" in item) {
-            return /* @__PURE__ */ jsx(
-              HeroDropdownSection,
-              {
-                items: item.items,
-                title: item.label,
-                children: (sectionItem) => {
-                  return renderMenuItem(sectionItem);
-                }
-              },
-              item.key
-            );
-          }
-          return renderMenuItem(item);
-        }
-      }
-    )
-  ] });
-};
-var Menu_default = Menu;
-
-// src/Menu/index.ts
-var Menu_default2 = Menu_default;
-
-export {
-  Menu_default,
-  Menu_default2
-};
-//# sourceMappingURL=chunk-OP5W7BXY.js.map

package/dist/chunk-OP5W7BXY.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Menu/Menu.tsx","../src/Menu/index.ts"],"sourcesContent":["import type {\n  DropdownSectionProps,\n  DropdownItemProps as HeroDropdownItemProps,\n} from '@heroui/dropdown';\nimport type { Key, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@heroui/button';\nimport {\n  Dropdown as HeroDropdown,\n  DropdownItem as HeroDropdownItem,\n  DropdownMenu as HeroDropdownMenu,\n  DropdownSection as HeroDropdownSection,\n  DropdownTrigger as HeroDropdownTrigger,\n} from '@heroui/dropdown';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: HeroDropdownItemProps['onPress'];\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <HeroDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onPress={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </HeroDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  return (\n    <HeroDropdown isDisabled={isDisabled}>\n      <HeroDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          // INFO: we use hero button here so that ref passing works\n          <Button size=\"sm\" variant=\"flat\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </HeroDropdownTrigger>\n      <HeroDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <HeroDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </HeroDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </HeroDropdownMenu>\n    </HeroDropdown>\n  );\n};\n\nexport default Menu;\n","import Menu from './Menu';\n\nexport type { MenuProps, MenuItem, MenuSection } from './Menu';\n\nexport { Menu };\n\nexport default Menu;\n"],"mappings":";AAMA,SAAS,0BAA0B;AAEnC,SAAS,cAAc;AACvB;AAAA,EACE,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,OACd;AAEP,SAAS,UAAU;AAkEjB,cAwBE,YAxBF;AAdF,IAAM,kBAAkB,CAAC,UAAsC;AAC7D,SACE,MAEG,IAAI,CAAC,SAAU,QAAO,6BAAM,WAAU,cAAc,OAAO,KAAK,KAAM,EACtE,KAAiB,EACjB,OAAO,CAAC,SAAS;AAChB,WAAO,OAAO,OAAO,MAAM,UAAU,KAAK,KAAK,aAAa;AAAA,EAC9D,CAAC,EACA,IAAI,CAAC,SAAS,KAAK,GAAG;AAE7B;AAEA,IAAM,iBAAiB,CAAC,SACtB;AAAA,EAAC;AAAA;AAAA,IACC,WAAW,KAAK;AAAA,IAChB,eAAa,KAAK,UAAU,KAAK;AAAA,IACjC,aAAa,KAAK;AAAA,IAElB,SAAS,KAAK;AAAA,IACd,cAAc,KAAK;AAAA,IAElB,eAAK;AAAA;AAAA,EAJD,KAAK;AAKZ;AAMF,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa;AAAA,EACb;AACF,MAAiB;AACf,SACE,qBAAC,gBAAa,YACZ;AAAA,wBAAC,uBAAoB,WAAW,GAAG,SAAS,GAAG,eAAa,QACzD;AAAA;AAAA,MAEC,oBAAC,YAAQ,UAAS;AAAA;AAAA;AAAA,MAGlB,oBAAC,UAAO,MAAK,MAAK,SAAQ,QAAO,WAAU,WACzC,8BAAC,sBAAmB,GACtB;AAAA,OAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QAEC;AAAA,QACA,cAAc,gBAAgB,KAAK;AAAA,QACnC;AAAA,QAEC,WAAC,SAAS;AACT,cAAI,WAAW,MAAM;AACnB,mBACE;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,KAAK;AAAA,gBACZ,OAAO,KAAK;AAAA,gBAGX,WAAC,gBAAgB;AAChB,yBAAO,eAAe,WAAW;AAAA,gBACnC;AAAA;AAAA,cAJK,KAAK;AAAA,YAKZ;AAAA,UAEJ;AACA,iBAAO,eAAe,IAAI;AAAA,QAC5B;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,IAAO,eAAQ;;;AC5If,IAAOA,gBAAQ;","names":["Menu_default"]}

package/dist/chunk-XHOAZB2Z.cjs

@@ -1,81 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/Menu/Menu.tsx
-var _fa6 = require('react-icons/fa6');
-var _button = require('@heroui/button');
-
-
-
-
-
-
-var _dropdown = require('@heroui/dropdown');
-var _pixelutils = require('@fuf-stack/pixel-utils');
-var _jsxruntime = require('react/jsx-runtime');
-var getDisabledKeys = (items) => {
-  return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
-    return Object.hasOwn(item, "disabled") && item.disabled === true;
-  }).map((item) => item.key);
-};
-var renderMenuItem = (item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  _dropdown.DropdownItem,
-  {
-    className: item.className,
-    "data-testid": item.testId || item.key,
-    description: item.description,
-    onPress: item.onClick,
-    startContent: item.icon,
-    children: item.label
-  },
-  item.key
-);
-var Menu = ({
-  children = null,
-  className = void 0,
-  onAction = void 0,
-  testId = void 0,
-  isDisabled = false,
-  items
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _dropdown.Dropdown, { isDisabled, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _dropdown.DropdownTrigger, { className: _pixelutils.cn.call(void 0, className), "data-testid": testId, children: children ? (
-      // eslint-disable-next-line react/button-has-type
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { children })
-    ) : (
-      // INFO: we use hero button here so that ref passing works
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _button.Button, { size: "sm", variant: "flat", className: "min-w-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaEllipsisVertical, {}) })
-    ) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _dropdown.DropdownMenu,
-      {
-        items,
-        disabledKeys: getDisabledKeys(items),
-        onAction,
-        children: (item) => {
-          if ("items" in item) {
-            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _dropdown.DropdownSection,
-              {
-                items: item.items,
-                title: item.label,
-                children: (sectionItem) => {
-                  return renderMenuItem(sectionItem);
-                }
-              },
-              item.key
-            );
-          }
-          return renderMenuItem(item);
-        }
-      }
-    )
-  ] });
-};
-var Menu_default = Menu;
-
-// src/Menu/index.ts
-var Menu_default2 = Menu_default;
-
-
-
-
-exports.Menu_default = Menu_default; exports.Menu_default2 = Menu_default2;
-//# sourceMappingURL=chunk-XHOAZB2Z.cjs.map

package/dist/chunk-XHOAZB2Z.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-XHOAZB2Z.cjs","../src/Menu/Menu.tsx","../src/Menu/index.ts"],"names":["Menu_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-XHOAZB2Z.cjs","sourcesContent":[null,"import type {\n  DropdownSectionProps,\n  DropdownItemProps as HeroDropdownItemProps,\n} from '@heroui/dropdown';\nimport type { Key, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@heroui/button';\nimport {\n  Dropdown as HeroDropdown,\n  DropdownItem as HeroDropdownItem,\n  DropdownMenu as HeroDropdownMenu,\n  DropdownSection as HeroDropdownSection,\n  DropdownTrigger as HeroDropdownTrigger,\n} from '@heroui/dropdown';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: HeroDropdownItemProps['onPress'];\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <HeroDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onPress={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </HeroDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  return (\n    <HeroDropdown isDisabled={isDisabled}>\n      <HeroDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          // INFO: we use hero button here so that ref passing works\n          <Button size=\"sm\" variant=\"flat\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </HeroDropdownTrigger>\n      <HeroDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <HeroDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </HeroDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </HeroDropdownMenu>\n    </HeroDropdown>\n  );\n};\n\nexport default Menu;\n","import Menu from './Menu';\n\nexport type { MenuProps, MenuItem, MenuSection } from './Menu';\n\nexport { Menu };\n\nexport default Menu;\n"]}