@fuf-stack/pixels 1.1.1 → 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 (36) hide show
  1. package/dist/Accordion/index.cjs +2 -2
  2. package/dist/Accordion/index.js +1 -1
  3. package/dist/Menu/index.cjs +2 -2
  4. package/dist/Menu/index.d.cts +5 -2
  5. package/dist/Menu/index.d.ts +5 -2
  6. package/dist/Menu/index.js +1 -1
  7. package/dist/Menu-DbeqxeL0.d.cts +98 -0
  8. package/dist/Menu-DbeqxeL0.d.ts +98 -0
  9. package/dist/Modal/index.cjs +2 -2
  10. package/dist/Modal/index.js +1 -1
  11. package/dist/{chunk-LCOQDCO4.cjs → chunk-3LEEMSTG.cjs} +2 -2
  12. package/dist/chunk-3LEEMSTG.cjs.map +1 -0
  13. package/dist/{chunk-PEUUQMJS.cjs → chunk-DTG27JQ7.cjs} +4 -4
  14. package/dist/chunk-DTG27JQ7.cjs.map +1 -0
  15. package/dist/{chunk-RW4WTSLJ.js → chunk-MK2S3QUK.js} +4 -4
  16. package/dist/{chunk-PEUUQMJS.cjs.map → chunk-MK2S3QUK.js.map} +1 -1
  17. package/dist/{chunk-7T76DXVT.js → chunk-OAUPTZSC.js} +2 -2
  18. package/dist/chunk-OAUPTZSC.js.map +1 -0
  19. package/dist/chunk-WFPRB4JT.js +115 -0
  20. package/dist/chunk-WFPRB4JT.js.map +1 -0
  21. package/dist/chunk-WFR7OUY7.cjs +115 -0
  22. package/dist/chunk-WFR7OUY7.cjs.map +1 -0
  23. package/dist/index.cjs +4 -4
  24. package/dist/index.d.cts +1 -1
  25. package/dist/index.d.ts +1 -1
  26. package/dist/index.js +3 -3
  27. package/package.json +2 -2
  28. package/dist/Menu-DYi8oagz.d.cts +0 -56
  29. package/dist/Menu-DYi8oagz.d.ts +0 -56
  30. package/dist/chunk-7T76DXVT.js.map +0 -1
  31. package/dist/chunk-LCOQDCO4.cjs.map +0 -1
  32. package/dist/chunk-OP5W7BXY.js +0 -81
  33. package/dist/chunk-OP5W7BXY.js.map +0 -1
  34. package/dist/chunk-RW4WTSLJ.js.map +0 -1
  35. package/dist/chunk-XHOAZB2Z.cjs +0 -81
  36. package/dist/chunk-XHOAZB2Z.cjs.map +0 -1
@@ -2,11 +2,11 @@
2
2
 
3
3
 
4
4
 
5
- var _chunkLCOQDCO4cjs = require('../chunk-LCOQDCO4.cjs');
5
+ var _chunk3LEEMSTGcjs = require('../chunk-3LEEMSTG.cjs');
6
6
  require('../chunk-D4TLDLEX.cjs');
7
7
 
8
8
 
9
9
 
10
10
 
11
- exports.Accordion = _chunkLCOQDCO4cjs.Accordion_default; exports.accordionVariants = _chunkLCOQDCO4cjs.accordionVariants; exports.default = _chunkLCOQDCO4cjs.Accordion_default2;
11
+ exports.Accordion = _chunk3LEEMSTGcjs.Accordion_default; exports.accordionVariants = _chunk3LEEMSTGcjs.accordionVariants; exports.default = _chunk3LEEMSTGcjs.Accordion_default2;
12
12
  //# sourceMappingURL=index.cjs.map
@@ -2,7 +2,7 @@ import {
2
2
  Accordion_default,
3
3
  Accordion_default2,
4
4
  accordionVariants
5
- } from "../chunk-7T76DXVT.js";
5
+ } from "../chunk-OAUPTZSC.js";
6
6
  import "../chunk-J7N2552D.js";
7
7
  export {
8
8
  Accordion_default as Accordion,
@@ -1,10 +1,10 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkXHOAZB2Zcjs = require('../chunk-XHOAZB2Z.cjs');
4
+ var _chunkWFR7OUY7cjs = require('../chunk-WFR7OUY7.cjs');
5
5
  require('../chunk-D4TLDLEX.cjs');
6
6
 
7
7
 
8
8
 
9
- exports.Menu = _chunkXHOAZB2Zcjs.Menu_default; exports.default = _chunkXHOAZB2Zcjs.Menu_default2;
9
+ exports.Menu = _chunkWFR7OUY7cjs.Menu_default; exports.default = _chunkWFR7OUY7cjs.Menu_default2;
10
10
  //# sourceMappingURL=index.cjs.map
@@ -1,6 +1,9 @@
1
- import { M as Menu } from '../Menu-DYi8oagz.cjs';
2
- export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DYi8oagz.cjs';
1
+ import { M as Menu } from '../Menu-DbeqxeL0.cjs';
2
+ export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DbeqxeL0.cjs';
3
3
  import 'react/jsx-runtime';
4
+ import 'tailwind-variants';
5
+ import '@fuf-stack/pixel-utils';
6
+ import '@heroui/button';
4
7
  import '@heroui/dropdown';
5
8
  import 'react';
6
9
 
@@ -1,6 +1,9 @@
1
- import { M as Menu } from '../Menu-DYi8oagz.js';
2
- export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DYi8oagz.js';
1
+ import { M as Menu } from '../Menu-DbeqxeL0.js';
2
+ export { b as MenuItem, a as MenuProps, c as MenuSection } from '../Menu-DbeqxeL0.js';
3
3
  import 'react/jsx-runtime';
4
+ import 'tailwind-variants';
5
+ import '@fuf-stack/pixel-utils';
6
+ import '@heroui/button';
4
7
  import '@heroui/dropdown';
5
8
  import 'react';
6
9
 
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  Menu_default,
3
3
  Menu_default2
4
- } from "../chunk-OP5W7BXY.js";
4
+ } from "../chunk-WFPRB4JT.js";
5
5
  import "../chunk-J7N2552D.js";
6
6
  export {
7
7
  Menu_default as Menu,
@@ -0,0 +1,98 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as tailwind_variants from 'tailwind-variants';
3
+ import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
4
+ import { ButtonProps } from '@heroui/button';
5
+ import { DropdownItemProps, DropdownProps } from '@heroui/dropdown';
6
+ import { ReactNode, Key } from 'react';
7
+
8
+ /**
9
+ * Menu item type
10
+ */
11
+ interface MenuItem {
12
+ /** unique identifier */
13
+ key: string;
14
+ /** CSS class name */
15
+ className?: string;
16
+ /** additional description shown under the label */
17
+ description?: string;
18
+ /** disables the menu item */
19
+ disabled?: boolean;
20
+ /** menu item icon */
21
+ icon?: ReactNode;
22
+ /** menu item name */
23
+ label: ReactNode;
24
+ /** click event handler */
25
+ onClick?: DropdownItemProps['onPress'];
26
+ /** e2e test identifier */
27
+ testId?: string;
28
+ }
29
+ /**
30
+ * Menu section type
31
+ */
32
+ interface MenuSection {
33
+ /** unique identifier */
34
+ key: string;
35
+ /** section label */
36
+ label: ReactNode;
37
+ /** section items (array of MenuItem) */
38
+ items: MenuItem[];
39
+ }
40
+ declare const menuVariants: tailwind_variants.TVReturnType<{
41
+ [key: string]: {
42
+ [key: string]: tailwind_variants.ClassValue | {
43
+ trigger?: tailwind_variants.ClassValue;
44
+ item?: tailwind_variants.ClassValue;
45
+ };
46
+ };
47
+ } | {
48
+ [x: string]: {
49
+ [x: string]: tailwind_variants.ClassValue | {
50
+ trigger?: tailwind_variants.ClassValue;
51
+ item?: tailwind_variants.ClassValue;
52
+ };
53
+ };
54
+ } | {}, {
55
+ item: string;
56
+ trigger: string;
57
+ }, undefined, {
58
+ [key: string]: {
59
+ [key: string]: tailwind_variants.ClassValue | {
60
+ trigger?: tailwind_variants.ClassValue;
61
+ item?: tailwind_variants.ClassValue;
62
+ };
63
+ };
64
+ } | {}, {
65
+ item: string;
66
+ trigger: string;
67
+ }, tailwind_variants.TVReturnType<unknown, {
68
+ item: string;
69
+ trigger: string;
70
+ }, undefined, unknown, unknown, undefined>>;
71
+ type VariantProps = TVProps<typeof menuVariants>;
72
+ type ClassName = TVClassName<typeof menuVariants>;
73
+ interface MenuProps extends VariantProps {
74
+ /** sets HTML aria-label attribute */
75
+ ariaLabel?: string;
76
+ /** child components */
77
+ children?: ReactNode;
78
+ /** CSS class name */
79
+ className?: ClassName;
80
+ /** menu item structure */
81
+ items: (MenuSection | MenuItem)[];
82
+ /** disable menu trigger */
83
+ isDisabled?: boolean;
84
+ /** placement of the menu */
85
+ placement?: DropdownProps['placement'];
86
+ /** called if item is selected */
87
+ onAction?: (key: Key) => void;
88
+ /** HTML data-testid attribute used in e2e tests */
89
+ testId?: string;
90
+ /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */
91
+ triggerButtonProps?: Pick<ButtonProps, 'aria-label' | 'className' | 'color' | 'disableAnimation' | 'disabled' | 'size' | 'variant'>;
92
+ }
93
+ /**
94
+ * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
95
+ */
96
+ declare const Menu: ({ ariaLabel, children, className: _className, isDisabled, items, onAction, placement, testId, triggerButtonProps, }: MenuProps) => react_jsx_runtime.JSX.Element;
97
+
98
+ export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };
@@ -0,0 +1,98 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as tailwind_variants from 'tailwind-variants';
3
+ import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
4
+ import { ButtonProps } from '@heroui/button';
5
+ import { DropdownItemProps, DropdownProps } from '@heroui/dropdown';
6
+ import { ReactNode, Key } from 'react';
7
+
8
+ /**
9
+ * Menu item type
10
+ */
11
+ interface MenuItem {
12
+ /** unique identifier */
13
+ key: string;
14
+ /** CSS class name */
15
+ className?: string;
16
+ /** additional description shown under the label */
17
+ description?: string;
18
+ /** disables the menu item */
19
+ disabled?: boolean;
20
+ /** menu item icon */
21
+ icon?: ReactNode;
22
+ /** menu item name */
23
+ label: ReactNode;
24
+ /** click event handler */
25
+ onClick?: DropdownItemProps['onPress'];
26
+ /** e2e test identifier */
27
+ testId?: string;
28
+ }
29
+ /**
30
+ * Menu section type
31
+ */
32
+ interface MenuSection {
33
+ /** unique identifier */
34
+ key: string;
35
+ /** section label */
36
+ label: ReactNode;
37
+ /** section items (array of MenuItem) */
38
+ items: MenuItem[];
39
+ }
40
+ declare const menuVariants: tailwind_variants.TVReturnType<{
41
+ [key: string]: {
42
+ [key: string]: tailwind_variants.ClassValue | {
43
+ trigger?: tailwind_variants.ClassValue;
44
+ item?: tailwind_variants.ClassValue;
45
+ };
46
+ };
47
+ } | {
48
+ [x: string]: {
49
+ [x: string]: tailwind_variants.ClassValue | {
50
+ trigger?: tailwind_variants.ClassValue;
51
+ item?: tailwind_variants.ClassValue;
52
+ };
53
+ };
54
+ } | {}, {
55
+ item: string;
56
+ trigger: string;
57
+ }, undefined, {
58
+ [key: string]: {
59
+ [key: string]: tailwind_variants.ClassValue | {
60
+ trigger?: tailwind_variants.ClassValue;
61
+ item?: tailwind_variants.ClassValue;
62
+ };
63
+ };
64
+ } | {}, {
65
+ item: string;
66
+ trigger: string;
67
+ }, tailwind_variants.TVReturnType<unknown, {
68
+ item: string;
69
+ trigger: string;
70
+ }, undefined, unknown, unknown, undefined>>;
71
+ type VariantProps = TVProps<typeof menuVariants>;
72
+ type ClassName = TVClassName<typeof menuVariants>;
73
+ interface MenuProps extends VariantProps {
74
+ /** sets HTML aria-label attribute */
75
+ ariaLabel?: string;
76
+ /** child components */
77
+ children?: ReactNode;
78
+ /** CSS class name */
79
+ className?: ClassName;
80
+ /** menu item structure */
81
+ items: (MenuSection | MenuItem)[];
82
+ /** disable menu trigger */
83
+ isDisabled?: boolean;
84
+ /** placement of the menu */
85
+ placement?: DropdownProps['placement'];
86
+ /** called if item is selected */
87
+ onAction?: (key: Key) => void;
88
+ /** HTML data-testid attribute used in e2e tests */
89
+ testId?: string;
90
+ /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */
91
+ triggerButtonProps?: Pick<ButtonProps, 'aria-label' | 'className' | 'color' | 'disableAnimation' | 'disabled' | 'size' | 'variant'>;
92
+ }
93
+ /**
94
+ * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
95
+ */
96
+ declare const Menu: ({ ariaLabel, children, className: _className, isDisabled, items, onAction, placement, testId, triggerButtonProps, }: MenuProps) => react_jsx_runtime.JSX.Element;
97
+
98
+ export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };
@@ -2,11 +2,11 @@
2
2
 
3
3
 
4
4
 
5
- var _chunkPEUUQMJScjs = require('../chunk-PEUUQMJS.cjs');
5
+ var _chunkDTG27JQ7cjs = require('../chunk-DTG27JQ7.cjs');
6
6
  require('../chunk-D4TLDLEX.cjs');
7
7
 
8
8
 
9
9
 
10
10
 
11
- exports.Modal = _chunkPEUUQMJScjs.Modal_default; exports.default = _chunkPEUUQMJScjs.Modal_default2; exports.modalVariants = _chunkPEUUQMJScjs.modalVariants;
11
+ exports.Modal = _chunkDTG27JQ7cjs.Modal_default; exports.default = _chunkDTG27JQ7cjs.Modal_default2; exports.modalVariants = _chunkDTG27JQ7cjs.modalVariants;
12
12
  //# sourceMappingURL=index.cjs.map
@@ -2,7 +2,7 @@ import {
2
2
  Modal_default,
3
3
  Modal_default2,
4
4
  modalVariants
5
- } from "../chunk-RW4WTSLJ.js";
5
+ } from "../chunk-MK2S3QUK.js";
6
6
  import "../chunk-J7N2552D.js";
7
7
  export {
8
8
  Modal_default as Modal,
@@ -19,7 +19,7 @@ var accordionVariants = _pixelutils.tv.call(void 0, {
19
19
  subtitle: "",
20
20
  title: "",
21
21
  titleWrapper: "",
22
- trigger: "",
22
+ trigger: "cursor-pointer",
23
23
  // outer accordion wrapper
24
24
  wrapper: "px-0"
25
25
  },
@@ -99,4 +99,4 @@ var Accordion_default2 = Accordion_default;
99
99
 
100
100
 
101
101
  exports.accordionVariants = accordionVariants; exports.Accordion_default = Accordion_default; exports.Accordion_default2 = Accordion_default2;
102
- //# sourceMappingURL=chunk-LCOQDCO4.cjs.map
102
+ //# sourceMappingURL=chunk-3LEEMSTG.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-3LEEMSTG.cjs","../src/Accordion/Accordion.tsx","../src/Accordion/index.ts"],"names":["Accordion_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-3LEEMSTG.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { DividerProps } from '@heroui/divider';\nimport type { ReactNode } from 'react';\n\nimport {\n Accordion as HeroAccordion,\n AccordionItem as HeroAccordionItem,\n} from '@heroui/accordion';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// accordion styling variants\n// see: https://www.heroui.com//docs/components/accordion#accordion-item-slots\nexport const accordionVariants = tv({\n slots: {\n base: '',\n content: 'px-4',\n heading: 'px-4',\n indicator: '',\n startContent: '',\n subtitle: '',\n title: '',\n titleWrapper: '',\n trigger: 'cursor-pointer',\n // outer accordion wrapper\n wrapper: 'px-0',\n },\n variants: {\n indicatorLeft: {\n true: {\n content: 'pl-7',\n indicator: '-rotate-180 data-[open=true]:-rotate-90',\n trigger: 'flex-row-reverse',\n },\n },\n showDivider: {\n true: {\n wrapper: 'divide-divider divide-y divide-solid',\n },\n },\n showBottomTopDivider: {\n true: {\n wrapper: 'border-divider border-t border-b border-solid',\n },\n },\n },\n});\n\nexport interface AccordionItemProps {\n /** Content of the accordion item */\n children: ReactNode;\n /** Disables the accordion item */\n disabled?: boolean;\n /** Accordion item title */\n title: ReactNode;\n /** Accordion item subtitle */\n subtitle?: ReactNode;\n}\n\ntype VariantProps = TVProps<typeof accordionVariants>;\ntype ClassName = TVClassName<typeof accordionVariants>;\n\nexport interface AccordionProps extends VariantProps {\n /** Props for AccordionItems, will render the accordion items programmatically */\n accordionItems: AccordionItemProps[];\n /** CSS class name */\n className?: ClassName;\n /** Array of keys for the AccordionItem(s) to be expanded by default */\n defaultSelectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Disables the Accordion */\n disabled?: boolean;\n /** Array of keys for the AccordionItems to disable */\n disabledKeys?: Iterable<number | string>;\n /** Force always one AccordionItem to be open. */\n disallowEmptySelection?: boolean;\n /** props for styling the Divider */\n dividerProps?: DividerProps;\n /** Hide the expanded/collapsed indicator icon */\n hideIndicator?: boolean;\n /** Callback function for when a Accordion Item is expanded or collapsed */\n onSelectionChange?: (keys: 'all' | Iterable<number | string>) => unknown;\n /** Selected keys (controlled) */\n selectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Set whether multiple or only a single AccordionItems can be expanded */\n selectionMode?: 'single' | 'multiple';\n /** Enable or disable the divider between each AccordionItem */\n showDivider?: boolean;\n /** Style variant of the Accordion */\n variant?: 'light' | 'shadow' | 'bordered' | 'splitted';\n}\n\n/**\n * Accordion component based on [HeroUI Accordion](https://www.heroui.com//docs/components/accordion)\n */\nconst Accordion = ({\n accordionItems,\n className: _className = undefined,\n defaultSelectedKeys = [],\n disabled = false,\n disabledKeys = [],\n disallowEmptySelection = false,\n dividerProps = {},\n indicatorLeft = false,\n onSelectionChange = undefined,\n selectedKeys = undefined,\n selectionMode = 'multiple',\n showDivider = true,\n variant = 'light',\n}: AccordionProps) => {\n // itemClasses from className slots\n const variants = accordionVariants({\n indicatorLeft,\n showDivider: showDivider && variant !== 'splitted',\n showBottomTopDivider: showDivider && variant === 'light',\n });\n const classNames = variantsToClassNames(variants, _className, 'wrapper');\n\n return (\n <HeroAccordion\n className={classNames.wrapper}\n defaultSelectedKeys={defaultSelectedKeys}\n disabledKeys={disabledKeys}\n disallowEmptySelection={disallowEmptySelection}\n dividerProps={dividerProps}\n isDisabled={disabled}\n itemClasses={classNames}\n onSelectionChange={onSelectionChange}\n selectedKeys={selectedKeys}\n selectionMode={selectionMode}\n showDivider={false}\n variant={variant}\n >\n {accordionItems.map((item, index) => (\n <HeroAccordionItem\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n isDisabled={disabled || item?.disabled}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...item}\n />\n ))}\n </HeroAccordion>\n );\n};\n\nexport default Accordion;\n","import Accordion, { accordionVariants } from './Accordion';\n\nexport type { AccordionProps, AccordionItemProps } from './Accordion';\n\nexport { Accordion, accordionVariants };\n\nexport default Accordion;\n"]}
@@ -12,10 +12,10 @@ var modalVariants = _pixelutils.tv.call(void 0, {
12
12
  slots: {
13
13
  backdrop: "",
14
14
  base: "",
15
- body: "",
15
+ body: "py-4",
16
16
  closeButton: "",
17
- footer: "",
18
- header: "",
17
+ footer: "border-t-divider border-t",
18
+ header: "border-b-divider border-b",
19
19
  wrapper: ""
20
20
  },
21
21
  variants: {
@@ -72,4 +72,4 @@ var Modal_default2 = Modal_default;
72
72
 
73
73
 
74
74
  exports.modalVariants = modalVariants; exports.Modal_default = Modal_default; exports.Modal_default2 = Modal_default2;
75
- //# sourceMappingURL=chunk-PEUUQMJS.cjs.map
75
+ //# sourceMappingURL=chunk-DTG27JQ7.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-DTG27JQ7.cjs","../src/Modal/Modal.tsx","../src/Modal/index.ts"],"names":[],"mappings":"AAAA;ACIA;AACE;AACA;AACA;AACA;AACA;AAAe,sCACV;AAEP,oDAAyC;AAmF/B,+CAAA;AAhFH,IAAM,cAAA,EAAgB,4BAAA;AAAG,EAC9B,KAAA,EAAO;AAAA,IACL,QAAA,EAAU,EAAA;AAAA,IACV,IAAA,EAAM,EAAA;AAAA,IACN,IAAA,EAAM,MAAA;AAAA,IACN,WAAA,EAAa,EAAA;AAAA,IACb,MAAA,EAAQ,2BAAA;AAAA,IACR,MAAA,EAAQ,2BAAA;AAAA,IACR,OAAA,EAAS;AAAA,EACX,CAAA;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,EAAE,IAAA,EAAM,WAAW,CAAA;AAAA,MACvB,EAAA,EAAI,EAAE,IAAA,EAAM,WAAW,CAAA;AAAA,MACvB,EAAA,EAAI,EAAE,IAAA,EAAM,WAAW,CAAA;AAAA,MACvB,EAAA,EAAI,EAAE,IAAA,EAAM,YAAY,CAAA;AAAA,MACxB,IAAA,EAAM,EAAE,IAAA,EAAM,uBAAuB;AAAA,IACvC;AAAA,EACF;AACF,CAAC,CAAA;AA+BD,IAAM,MAAA,EAAQ,CAAC;AAAA,EACb,SAAA,EAAW,IAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,iBAAA,EAAmB,KAAA;AAAA,EACnB,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,MAAA;AAAA,EACA,OAAA;AAAA,EACA,gBAAA,EAAkB,KAAA,CAAA;AAAA,EAClB,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS,KAAA;AACX,CAAA,EAAA,GAAkB;AAEhB,EAAA,MAAM,SAAA,EAAW,aAAA,CAAc,EAAE,KAAK,CAAC,CAAA;AACvC,EAAA,MAAM,WAAA,EAAa,8CAAA,QAAqB,EAAU,SAAA,EAAW,MAAM,CAAA;AAEnE,EAAA,uBACE,6BAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAS,QAAA;AAAA,MACT,UAAA;AAAA,MACA,aAAA,EAAa,MAAA;AAAA,MACb,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA,EAAU,QAAA;AAAA,MACV,eAAA;AAAA,MACA,cAAA,EAAe,QAAA;AAAA,MAEf,QAAA,kBAAA,6BAAA,mBAAC,EAAA,EAAiB,aAAA,EAAa,OAAA,EAAS,CAAA,MAAA,EAAS,MAAM,CAAA,EAAA;AAGb,QAAA;AACK,wBAAA;AACL,QAAA;AAG1C,MAAA;AAAA,IAAA;AACF,EAAA;AAEJ;AAEe;ADzCiF;AACA;AE5DjF;AF8DiF;AACA;AACA;AACA;AACA;AACA","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-DTG27JQ7.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ModalProps as HeroModalProps } from '@heroui/modal';\nimport type { ReactNode } from 'react';\n\nimport {\n Modal as HeroModal,\n ModalBody as HeroModalBody,\n ModalContent as HeroModalContent,\n ModalFooter as HeroModalFooter,\n ModalHeader as HeroModalHeader,\n} from '@heroui/modal';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// modal variants\nexport const modalVariants = tv({\n slots: {\n backdrop: '',\n base: '',\n body: 'py-4',\n closeButton: '',\n footer: 'border-t-divider border-t',\n header: 'border-b-divider border-b',\n wrapper: '',\n },\n variants: {\n size: {\n sm: { base: 'max-w-sm' },\n md: { base: 'max-w-md' },\n lg: { base: 'max-w-lg' },\n xl: { base: 'max-w-5xl' },\n full: { base: 'h-[80dvh] max-w-full' },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof modalVariants>;\ntype ClassName = TVClassName<typeof modalVariants>;\n\nexport interface ModalProps extends VariantProps {\n /** modal body content */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Disable animations completely */\n disableAnimation?: boolean;\n /** modal footer */\n footer?: ReactNode;\n /** modal header */\n header?: ReactNode;\n /** open state (controlled) */\n isOpen: boolean;\n /** close event handler */\n onClose: () => void;\n /** The container element in which the overlay portal will be placed */\n portalContainer?: HeroModalProps['portalContainer'];\n /** modal size */\n size?: VariantProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Modal component based on [HeroUI Modal](https://www.heroui.com//docs/components/modal)\n */\nconst Modal = ({\n children = null,\n className = undefined,\n disableAnimation = false,\n footer = undefined,\n header = undefined,\n isOpen,\n onClose,\n portalContainer = undefined,\n size = 'md',\n testId = undefined,\n}: ModalProps) => {\n // classNames from slots\n const variants = modalVariants({ size });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <HeroModal\n backdrop=\"opaque\"\n classNames={classNames}\n data-testid={testId}\n disableAnimation={disableAnimation}\n isOpen={isOpen}\n onClose={onClose}\n placement=\"center\"\n portalContainer={portalContainer}\n scrollBehavior=\"inside\"\n >\n <HeroModalContent data-testid={testId ? `modal_${testId}` : 'modal'}>\n {() => (\n <>\n {header && <HeroModalHeader>{header}</HeroModalHeader>}\n <HeroModalBody id=\"modal_body\">{children}</HeroModalBody>\n {footer && <HeroModalFooter>{footer}</HeroModalFooter>}\n </>\n )}\n </HeroModalContent>\n </HeroModal>\n );\n};\n\nexport default Modal;\n","import Modal, { modalVariants } from './Modal';\n\nexport type { ModalProps } from './Modal';\n\nexport { Modal, modalVariants };\n\nexport default Modal;\n"]}
@@ -12,10 +12,10 @@ var modalVariants = tv({
12
12
  slots: {
13
13
  backdrop: "",
14
14
  base: "",
15
- body: "",
15
+ body: "py-4",
16
16
  closeButton: "",
17
- footer: "",
18
- header: "",
17
+ footer: "border-t-divider border-t",
18
+ header: "border-b-divider border-b",
19
19
  wrapper: ""
20
20
  },
21
21
  variants: {
@@ -72,4 +72,4 @@ export {
72
72
  Modal_default,
73
73
  Modal_default2
74
74
  };
75
- //# sourceMappingURL=chunk-RW4WTSLJ.js.map
75
+ //# sourceMappingURL=chunk-MK2S3QUK.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-PEUUQMJS.cjs","../src/Modal/Modal.tsx","../src/Modal/index.ts"],"names":[],"mappings":"AAAA;ACIA;AACE;AACA;AACA;AACA;AACA;AAAe,sCACV;AAEP,oDAAyC;AAmF/B,+CAAA;AAhFH,IAAM,cAAA,EAAgB,4BAAA;AAAG,EAC9B,KAAA,EAAO;AAAA,IACL,QAAA,EAAU,EAAA;AAAA,IACV,IAAA,EAAM,EAAA;AAAA,IACN,IAAA,EAAM,EAAA;AAAA,IACN,WAAA,EAAa,EAAA;AAAA,IACb,MAAA,EAAQ,EAAA;AAAA,IACR,MAAA,EAAQ,EAAA;AAAA,IACR,OAAA,EAAS;AAAA,EACX,CAAA;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,EAAE,IAAA,EAAM,WAAW,CAAA;AAAA,MACvB,EAAA,EAAI,EAAE,IAAA,EAAM,WAAW,CAAA;AAAA,MACvB,EAAA,EAAI,EAAE,IAAA,EAAM,WAAW,CAAA;AAAA,MACvB,EAAA,EAAI,EAAE,IAAA,EAAM,YAAY,CAAA;AAAA,MACxB,IAAA,EAAM,EAAE,IAAA,EAAM,uBAAuB;AAAA,IACvC;AAAA,EACF;AACF,CAAC,CAAA;AA+BD,IAAM,MAAA,EAAQ,CAAC;AAAA,EACb,SAAA,EAAW,IAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,iBAAA,EAAmB,KAAA;AAAA,EACnB,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,OAAA,EAAS,KAAA,CAAA;AAAA,EACT,MAAA;AAAA,EACA,OAAA;AAAA,EACA,gBAAA,EAAkB,KAAA,CAAA;AAAA,EAClB,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS,KAAA;AACX,CAAA,EAAA,GAAkB;AAEhB,EAAA,MAAM,SAAA,EAAW,aAAA,CAAc,EAAE,KAAK,CAAC,CAAA;AACvC,EAAA,MAAM,WAAA,EAAa,8CAAA,QAAqB,EAAU,SAAA,EAAW,MAAM,CAAA;AAEnE,EAAA,uBACE,6BAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAS,QAAA;AAAA,MACT,UAAA;AAAA,MACA,aAAA,EAAa,MAAA;AAAA,MACb,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA,EAAU,QAAA;AAAA,MACV,eAAA;AAAA,MACA,cAAA,EAAe,QAAA;AAAA,MAEf,QAAA,kBAAA,6BAAA,mBAAC,EAAA,EAAiB,aAAA,EAAa,OAAA,EAAS,CAAA,MAAA,EAAS,MAAM,CAAA,EAAA;AAGb,QAAA;AACK,wBAAA;AACL,QAAA;AAG1C,MAAA;AAAA,IAAA;AACF,EAAA;AAEJ;AAEe;ADzCiF;AACA;AE5DjF;AF8DiF;AACA;AACA;AACA;AACA;AACA","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-PEUUQMJS.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ModalProps as HeroModalProps } from '@heroui/modal';\nimport type { ReactNode } from 'react';\n\nimport {\n Modal as HeroModal,\n ModalBody as HeroModalBody,\n ModalContent as HeroModalContent,\n ModalFooter as HeroModalFooter,\n ModalHeader as HeroModalHeader,\n} from '@heroui/modal';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// modal variants\nexport const modalVariants = tv({\n slots: {\n backdrop: '',\n base: '',\n body: '',\n closeButton: '',\n footer: '',\n header: '',\n wrapper: '',\n },\n variants: {\n size: {\n sm: { base: 'max-w-sm' },\n md: { base: 'max-w-md' },\n lg: { base: 'max-w-lg' },\n xl: { base: 'max-w-5xl' },\n full: { base: 'h-[80dvh] max-w-full' },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof modalVariants>;\ntype ClassName = TVClassName<typeof modalVariants>;\n\nexport interface ModalProps extends VariantProps {\n /** modal body content */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Disable animations completely */\n disableAnimation?: boolean;\n /** modal footer */\n footer?: ReactNode;\n /** modal header */\n header?: ReactNode;\n /** open state (controlled) */\n isOpen: boolean;\n /** close event handler */\n onClose: () => void;\n /** The container element in which the overlay portal will be placed */\n portalContainer?: HeroModalProps['portalContainer'];\n /** modal size */\n size?: VariantProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Modal component based on [HeroUI Modal](https://www.heroui.com//docs/components/modal)\n */\nconst Modal = ({\n children = null,\n className = undefined,\n disableAnimation = false,\n footer = undefined,\n header = undefined,\n isOpen,\n onClose,\n portalContainer = undefined,\n size = 'md',\n testId = undefined,\n}: ModalProps) => {\n // classNames from slots\n const variants = modalVariants({ size });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <HeroModal\n backdrop=\"opaque\"\n classNames={classNames}\n data-testid={testId}\n disableAnimation={disableAnimation}\n isOpen={isOpen}\n onClose={onClose}\n placement=\"center\"\n portalContainer={portalContainer}\n scrollBehavior=\"inside\"\n >\n <HeroModalContent data-testid={testId ? `modal_${testId}` : 'modal'}>\n {() => (\n <>\n {header && <HeroModalHeader>{header}</HeroModalHeader>}\n <HeroModalBody id=\"modal_body\">{children}</HeroModalBody>\n {footer && <HeroModalFooter>{footer}</HeroModalFooter>}\n </>\n )}\n </HeroModalContent>\n </HeroModal>\n );\n};\n\nexport default Modal;\n","import Modal, { modalVariants } from './Modal';\n\nexport type { ModalProps } from './Modal';\n\nexport { Modal, modalVariants };\n\nexport default Modal;\n"]}
1
+ {"version":3,"sources":["../src/Modal/Modal.tsx","../src/Modal/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ModalProps as HeroModalProps } from '@heroui/modal';\nimport type { ReactNode } from 'react';\n\nimport {\n Modal as HeroModal,\n ModalBody as HeroModalBody,\n ModalContent as HeroModalContent,\n ModalFooter as HeroModalFooter,\n ModalHeader as HeroModalHeader,\n} from '@heroui/modal';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// modal variants\nexport const modalVariants = tv({\n slots: {\n backdrop: '',\n base: '',\n body: 'py-4',\n closeButton: '',\n footer: 'border-t-divider border-t',\n header: 'border-b-divider border-b',\n wrapper: '',\n },\n variants: {\n size: {\n sm: { base: 'max-w-sm' },\n md: { base: 'max-w-md' },\n lg: { base: 'max-w-lg' },\n xl: { base: 'max-w-5xl' },\n full: { base: 'h-[80dvh] max-w-full' },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof modalVariants>;\ntype ClassName = TVClassName<typeof modalVariants>;\n\nexport interface ModalProps extends VariantProps {\n /** modal body content */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Disable animations completely */\n disableAnimation?: boolean;\n /** modal footer */\n footer?: ReactNode;\n /** modal header */\n header?: ReactNode;\n /** open state (controlled) */\n isOpen: boolean;\n /** close event handler */\n onClose: () => void;\n /** The container element in which the overlay portal will be placed */\n portalContainer?: HeroModalProps['portalContainer'];\n /** modal size */\n size?: VariantProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Modal component based on [HeroUI Modal](https://www.heroui.com//docs/components/modal)\n */\nconst Modal = ({\n children = null,\n className = undefined,\n disableAnimation = false,\n footer = undefined,\n header = undefined,\n isOpen,\n onClose,\n portalContainer = undefined,\n size = 'md',\n testId = undefined,\n}: ModalProps) => {\n // classNames from slots\n const variants = modalVariants({ size });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <HeroModal\n backdrop=\"opaque\"\n classNames={classNames}\n data-testid={testId}\n disableAnimation={disableAnimation}\n isOpen={isOpen}\n onClose={onClose}\n placement=\"center\"\n portalContainer={portalContainer}\n scrollBehavior=\"inside\"\n >\n <HeroModalContent data-testid={testId ? `modal_${testId}` : 'modal'}>\n {() => (\n <>\n {header && <HeroModalHeader>{header}</HeroModalHeader>}\n <HeroModalBody id=\"modal_body\">{children}</HeroModalBody>\n {footer && <HeroModalFooter>{footer}</HeroModalFooter>}\n </>\n )}\n </HeroModalContent>\n </HeroModal>\n );\n};\n\nexport default Modal;\n","import Modal, { modalVariants } from './Modal';\n\nexport type { ModalProps } from './Modal';\n\nexport { Modal, modalVariants };\n\nexport default Modal;\n"],"mappings":";AAIA;AAAA,EACE,SAAS;AAAA,EACT,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,eAAe;AAAA,OACV;AAEP,SAAS,IAAI,4BAA4B;AAmF/B,mBACa,KADb;AAhFH,IAAM,gBAAgB,GAAG;AAAA,EAC9B,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI,EAAE,MAAM,WAAW;AAAA,MACvB,IAAI,EAAE,MAAM,WAAW;AAAA,MACvB,IAAI,EAAE,MAAM,WAAW;AAAA,MACvB,IAAI,EAAE,MAAM,YAAY;AAAA,MACxB,MAAM,EAAE,MAAM,uBAAuB;AAAA,IACvC;AAAA,EACF;AACF,CAAC;AA+BD,IAAM,QAAQ,CAAC;AAAA,EACb,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,SAAS;AAAA,EACT,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,OAAO;AAAA,EACP,SAAS;AACX,MAAkB;AAEhB,QAAM,WAAW,cAAc,EAAE,KAAK,CAAC;AACvC,QAAM,aAAa,qBAAqB,UAAU,WAAW,MAAM;AAEnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT;AAAA,MACA,eAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,gBAAe;AAAA,MAEf,8BAAC,oBAAiB,eAAa,SAAS,SAAS,MAAM,KAAK,SACzD,gBACC,iCACG;AAAA,kBAAU,oBAAC,mBAAiB,kBAAO;AAAA,QACpC,oBAAC,iBAAc,IAAG,cAAc,UAAS;AAAA,QACxC,UAAU,oBAAC,mBAAiB,kBAAO;AAAA,SACtC,GAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACpGf,IAAOA,iBAAQ;","names":["Modal_default"]}
@@ -19,7 +19,7 @@ var accordionVariants = tv({
19
19
  subtitle: "",
20
20
  title: "",
21
21
  titleWrapper: "",
22
- trigger: "",
22
+ trigger: "cursor-pointer",
23
23
  // outer accordion wrapper
24
24
  wrapper: "px-0"
25
25
  },
@@ -99,4 +99,4 @@ export {
99
99
  Accordion_default,
100
100
  Accordion_default2
101
101
  };
102
- //# sourceMappingURL=chunk-7T76DXVT.js.map
102
+ //# sourceMappingURL=chunk-OAUPTZSC.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Accordion/Accordion.tsx","../src/Accordion/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { DividerProps } from '@heroui/divider';\nimport type { ReactNode } from 'react';\n\nimport {\n Accordion as HeroAccordion,\n AccordionItem as HeroAccordionItem,\n} from '@heroui/accordion';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// accordion styling variants\n// see: https://www.heroui.com//docs/components/accordion#accordion-item-slots\nexport const accordionVariants = tv({\n slots: {\n base: '',\n content: 'px-4',\n heading: 'px-4',\n indicator: '',\n startContent: '',\n subtitle: '',\n title: '',\n titleWrapper: '',\n trigger: 'cursor-pointer',\n // outer accordion wrapper\n wrapper: 'px-0',\n },\n variants: {\n indicatorLeft: {\n true: {\n content: 'pl-7',\n indicator: '-rotate-180 data-[open=true]:-rotate-90',\n trigger: 'flex-row-reverse',\n },\n },\n showDivider: {\n true: {\n wrapper: 'divide-divider divide-y divide-solid',\n },\n },\n showBottomTopDivider: {\n true: {\n wrapper: 'border-divider border-t border-b border-solid',\n },\n },\n },\n});\n\nexport interface AccordionItemProps {\n /** Content of the accordion item */\n children: ReactNode;\n /** Disables the accordion item */\n disabled?: boolean;\n /** Accordion item title */\n title: ReactNode;\n /** Accordion item subtitle */\n subtitle?: ReactNode;\n}\n\ntype VariantProps = TVProps<typeof accordionVariants>;\ntype ClassName = TVClassName<typeof accordionVariants>;\n\nexport interface AccordionProps extends VariantProps {\n /** Props for AccordionItems, will render the accordion items programmatically */\n accordionItems: AccordionItemProps[];\n /** CSS class name */\n className?: ClassName;\n /** Array of keys for the AccordionItem(s) to be expanded by default */\n defaultSelectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Disables the Accordion */\n disabled?: boolean;\n /** Array of keys for the AccordionItems to disable */\n disabledKeys?: Iterable<number | string>;\n /** Force always one AccordionItem to be open. */\n disallowEmptySelection?: boolean;\n /** props for styling the Divider */\n dividerProps?: DividerProps;\n /** Hide the expanded/collapsed indicator icon */\n hideIndicator?: boolean;\n /** Callback function for when a Accordion Item is expanded or collapsed */\n onSelectionChange?: (keys: 'all' | Iterable<number | string>) => unknown;\n /** Selected keys (controlled) */\n selectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Set whether multiple or only a single AccordionItems can be expanded */\n selectionMode?: 'single' | 'multiple';\n /** Enable or disable the divider between each AccordionItem */\n showDivider?: boolean;\n /** Style variant of the Accordion */\n variant?: 'light' | 'shadow' | 'bordered' | 'splitted';\n}\n\n/**\n * Accordion component based on [HeroUI Accordion](https://www.heroui.com//docs/components/accordion)\n */\nconst Accordion = ({\n accordionItems,\n className: _className = undefined,\n defaultSelectedKeys = [],\n disabled = false,\n disabledKeys = [],\n disallowEmptySelection = false,\n dividerProps = {},\n indicatorLeft = false,\n onSelectionChange = undefined,\n selectedKeys = undefined,\n selectionMode = 'multiple',\n showDivider = true,\n variant = 'light',\n}: AccordionProps) => {\n // itemClasses from className slots\n const variants = accordionVariants({\n indicatorLeft,\n showDivider: showDivider && variant !== 'splitted',\n showBottomTopDivider: showDivider && variant === 'light',\n });\n const classNames = variantsToClassNames(variants, _className, 'wrapper');\n\n return (\n <HeroAccordion\n className={classNames.wrapper}\n defaultSelectedKeys={defaultSelectedKeys}\n disabledKeys={disabledKeys}\n disallowEmptySelection={disallowEmptySelection}\n dividerProps={dividerProps}\n isDisabled={disabled}\n itemClasses={classNames}\n onSelectionChange={onSelectionChange}\n selectedKeys={selectedKeys}\n selectionMode={selectionMode}\n showDivider={false}\n variant={variant}\n >\n {accordionItems.map((item, index) => (\n <HeroAccordionItem\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n isDisabled={disabled || item?.disabled}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...item}\n />\n ))}\n </HeroAccordion>\n );\n};\n\nexport default Accordion;\n","import Accordion, { accordionVariants } from './Accordion';\n\nexport type { AccordionProps, AccordionItemProps } from './Accordion';\n\nexport { Accordion, accordionVariants };\n\nexport default Accordion;\n"],"mappings":";;;;;AAIA;AAAA,EACE,aAAa;AAAA,EACb,iBAAiB;AAAA,OACZ;AAEP,SAAS,IAAI,4BAA4B;AA4HjC;AAxHD,IAAM,oBAAoB,GAAG;AAAA,EAClC,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IACX,cAAc;AAAA,IACd,UAAU;AAAA,IACV,OAAO;AAAA,IACP,cAAc;AAAA,IACd,SAAS;AAAA;AAAA,IAET,SAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,eAAe;AAAA,MACb,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,aAAa;AAAA,MACX,MAAM;AAAA,QACJ,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,sBAAsB;AAAA,MACpB,MAAM;AAAA,QACJ,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAgDD,IAAM,YAAY,CAAC;AAAA,EACjB;AAAA,EACA,WAAW,aAAa;AAAA,EACxB,sBAAsB,CAAC;AAAA,EACvB,WAAW;AAAA,EACX,eAAe,CAAC;AAAA,EAChB,yBAAyB;AAAA,EACzB,eAAe,CAAC;AAAA,EAChB,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,cAAc;AAAA,EACd,UAAU;AACZ,MAAsB;AAEpB,QAAM,WAAW,kBAAkB;AAAA,IACjC;AAAA,IACA,aAAa,eAAe,YAAY;AAAA,IACxC,sBAAsB,eAAe,YAAY;AAAA,EACnD,CAAC;AACD,QAAM,aAAa,qBAAqB,UAAU,YAAY,SAAS;AAEvE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,WAAW;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MAEC,yBAAe,IAAI,CAAC,MAAM,UACzB;AAAA,QAAC;AAAA;AAAA,UAGC,YAAY,aAAY,6BAAM;AAAA,WAE1B;AAAA,QAHC;AAAA,MAIP,CACD;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,oBAAQ;;;AC3If,IAAOA,qBAAQ;","names":["Accordion_default"]}
@@ -0,0 +1,115 @@
1
+ import {
2
+ __spreadProps,
3
+ __spreadValues
4
+ } from "./chunk-J7N2552D.js";
5
+
6
+ // src/Menu/Menu.tsx
7
+ import { FaEllipsisVertical } from "react-icons/fa6";
8
+ import { Button } from "@heroui/button";
9
+ import {
10
+ Dropdown as HeroDropdown,
11
+ DropdownItem as HeroDropdownItem,
12
+ DropdownMenu as HeroDropdownMenu,
13
+ DropdownSection as HeroDropdownSection,
14
+ DropdownTrigger as HeroDropdownTrigger
15
+ } from "@heroui/dropdown";
16
+ import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
17
+ import { jsx, jsxs } from "react/jsx-runtime";
18
+ var menuVariants = tv({
19
+ slots: {
20
+ item: "",
21
+ trigger: ""
22
+ }
23
+ });
24
+ var getDisabledKeys = (items) => {
25
+ return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
26
+ return Object.hasOwn(item, "disabled") && item.disabled === true;
27
+ }).map((item) => item.key);
28
+ };
29
+ var renderMenuItem = (item, itemClassName) => /* @__PURE__ */ jsx(
30
+ HeroDropdownItem,
31
+ {
32
+ className: cn(itemClassName, item.className),
33
+ "data-testid": item.testId || item.key,
34
+ description: item.description,
35
+ onPress: item.onClick,
36
+ startContent: item.icon,
37
+ children: item.label
38
+ },
39
+ item.key
40
+ );
41
+ var Menu = ({
42
+ ariaLabel = void 0,
43
+ children = null,
44
+ className: _className = void 0,
45
+ isDisabled = false,
46
+ items,
47
+ onAction = void 0,
48
+ placement = void 0,
49
+ testId = void 0,
50
+ triggerButtonProps = void 0
51
+ }) => {
52
+ const variants = menuVariants();
53
+ const className = variantsToClassNames(variants, _className, "trigger");
54
+ let triggerButton = /* @__PURE__ */ jsx("button", { type: "button", children });
55
+ if (!children) {
56
+ triggerButton = /* @__PURE__ */ jsx(
57
+ Button,
58
+ __spreadProps(__spreadValues({
59
+ className: cn("min-w-0", className.trigger),
60
+ size: "sm",
61
+ variant: "flat"
62
+ }, triggerButtonProps), {
63
+ children: /* @__PURE__ */ jsx(FaEllipsisVertical, {})
64
+ })
65
+ );
66
+ } else if (triggerButtonProps) {
67
+ triggerButton = // eslint-disable-next-line react/jsx-props-no-spreading
68
+ /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ className: className.trigger }, triggerButtonProps), { children }));
69
+ }
70
+ return /* @__PURE__ */ jsxs(
71
+ HeroDropdown,
72
+ {
73
+ "aria-label": ariaLabel,
74
+ isDisabled,
75
+ placement,
76
+ children: [
77
+ /* @__PURE__ */ jsx(HeroDropdownTrigger, { "data-testid": testId, children: triggerButton }),
78
+ /* @__PURE__ */ jsx(
79
+ HeroDropdownMenu,
80
+ {
81
+ items,
82
+ disabledKeys: getDisabledKeys(items),
83
+ onAction,
84
+ children: (item) => {
85
+ if ("items" in item) {
86
+ return /* @__PURE__ */ jsx(
87
+ HeroDropdownSection,
88
+ {
89
+ items: item.items,
90
+ title: item.label,
91
+ children: (sectionItem) => {
92
+ return renderMenuItem(sectionItem, className.item);
93
+ }
94
+ },
95
+ item.key
96
+ );
97
+ }
98
+ return renderMenuItem(item, className.item);
99
+ }
100
+ }
101
+ )
102
+ ]
103
+ }
104
+ );
105
+ };
106
+ var Menu_default = Menu;
107
+
108
+ // src/Menu/index.ts
109
+ var Menu_default2 = Menu_default;
110
+
111
+ export {
112
+ Menu_default,
113
+ Menu_default2
114
+ };
115
+ //# sourceMappingURL=chunk-WFPRB4JT.js.map
@@ -0,0 +1 @@
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"]}
@@ -0,0 +1,115 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
+
3
+
4
+ var _chunkD4TLDLEXcjs = require('./chunk-D4TLDLEX.cjs');
5
+
6
+ // src/Menu/Menu.tsx
7
+ var _fa6 = require('react-icons/fa6');
8
+ var _button = require('@heroui/button');
9
+
10
+
11
+
12
+
13
+
14
+
15
+ var _dropdown = require('@heroui/dropdown');
16
+ var _pixelutils = require('@fuf-stack/pixel-utils');
17
+ var _jsxruntime = require('react/jsx-runtime');
18
+ var menuVariants = _pixelutils.tv.call(void 0, {
19
+ slots: {
20
+ item: "",
21
+ trigger: ""
22
+ }
23
+ });
24
+ var getDisabledKeys = (items) => {
25
+ return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
26
+ return Object.hasOwn(item, "disabled") && item.disabled === true;
27
+ }).map((item) => item.key);
28
+ };
29
+ var renderMenuItem = (item, itemClassName) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
30
+ _dropdown.DropdownItem,
31
+ {
32
+ className: _pixelutils.cn.call(void 0, itemClassName, item.className),
33
+ "data-testid": item.testId || item.key,
34
+ description: item.description,
35
+ onPress: item.onClick,
36
+ startContent: item.icon,
37
+ children: item.label
38
+ },
39
+ item.key
40
+ );
41
+ var Menu = ({
42
+ ariaLabel = void 0,
43
+ children = null,
44
+ className: _className = void 0,
45
+ isDisabled = false,
46
+ items,
47
+ onAction = void 0,
48
+ placement = void 0,
49
+ testId = void 0,
50
+ triggerButtonProps = void 0
51
+ }) => {
52
+ const variants = menuVariants();
53
+ const className = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "trigger");
54
+ let triggerButton = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { type: "button", children });
55
+ if (!children) {
56
+ triggerButton = /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
57
+ _button.Button,
58
+ _chunkD4TLDLEXcjs.__spreadProps.call(void 0, _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {
59
+ className: _pixelutils.cn.call(void 0, "min-w-0", className.trigger),
60
+ size: "sm",
61
+ variant: "flat"
62
+ }, triggerButtonProps), {
63
+ children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaEllipsisVertical, {})
64
+ })
65
+ );
66
+ } else if (triggerButtonProps) {
67
+ triggerButton = // eslint-disable-next-line react/jsx-props-no-spreading
68
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _button.Button, _chunkD4TLDLEXcjs.__spreadProps.call(void 0, _chunkD4TLDLEXcjs.__spreadValues.call(void 0, { className: className.trigger }, triggerButtonProps), { children }));
69
+ }
70
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
71
+ _dropdown.Dropdown,
72
+ {
73
+ "aria-label": ariaLabel,
74
+ isDisabled,
75
+ placement,
76
+ children: [
77
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _dropdown.DropdownTrigger, { "data-testid": testId, children: triggerButton }),
78
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
79
+ _dropdown.DropdownMenu,
80
+ {
81
+ items,
82
+ disabledKeys: getDisabledKeys(items),
83
+ onAction,
84
+ children: (item) => {
85
+ if ("items" in item) {
86
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
87
+ _dropdown.DropdownSection,
88
+ {
89
+ items: item.items,
90
+ title: item.label,
91
+ children: (sectionItem) => {
92
+ return renderMenuItem(sectionItem, className.item);
93
+ }
94
+ },
95
+ item.key
96
+ );
97
+ }
98
+ return renderMenuItem(item, className.item);
99
+ }
100
+ }
101
+ )
102
+ ]
103
+ }
104
+ );
105
+ };
106
+ var Menu_default = Menu;
107
+
108
+ // src/Menu/index.ts
109
+ var Menu_default2 = Menu_default;
110
+
111
+
112
+
113
+
114
+ exports.Menu_default = Menu_default; exports.Menu_default2 = Menu_default2;
115
+ //# sourceMappingURL=chunk-WFR7OUY7.cjs.map
@@ -0,0 +1 @@
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 CHANGED
@@ -52,11 +52,11 @@ var _chunk2OJHNNCUcjs = require('./chunk-2OJHNNCU.cjs');
52
52
  var _chunkPHQVYJS2cjs = require('./chunk-PHQVYJS2.cjs');
53
53
 
54
54
 
55
- var _chunkXHOAZB2Zcjs = require('./chunk-XHOAZB2Z.cjs');
55
+ var _chunkWFR7OUY7cjs = require('./chunk-WFR7OUY7.cjs');
56
56
 
57
57
 
58
58
 
59
- var _chunkPEUUQMJScjs = require('./chunk-PEUUQMJS.cjs');
59
+ var _chunkDTG27JQ7cjs = require('./chunk-DTG27JQ7.cjs');
60
60
 
61
61
 
62
62
  var _chunkWZZMB5CIcjs = require('./chunk-WZZMB5CI.cjs');
@@ -64,7 +64,7 @@ require('./chunk-FUBGS3G4.cjs');
64
64
 
65
65
 
66
66
 
67
- var _chunkLCOQDCO4cjs = require('./chunk-LCOQDCO4.cjs');
67
+ var _chunk3LEEMSTGcjs = require('./chunk-3LEEMSTG.cjs');
68
68
 
69
69
 
70
70
 
@@ -131,5 +131,5 @@ require('./chunk-D4TLDLEX.cjs');
131
131
 
132
132
 
133
133
 
134
- exports.Accordion = _chunkLCOQDCO4cjs.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 = _chunkPEUUQMJScjs.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 = _chunkLCOQDCO4cjs.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 = _chunkPEUUQMJScjs.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;
134
+ 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;
135
135
  //# sourceMappingURL=index.cjs.map
package/dist/index.d.cts CHANGED
@@ -10,7 +10,7 @@ export { C as Card, a as CardProps, c as cardVariants } from './Card-OBRZ-ssX.cj
10
10
  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';
11
11
  export { J as Json, a as JsonProps } from './Json-Dny90Wml.cjs';
12
12
  export { L as Label, a as LabelProps, l as labelVariants } from './Label-B5fd7vp_.cjs';
13
- export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DYi8oagz.cjs';
13
+ export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DbeqxeL0.cjs';
14
14
  export { M as Modal, a as ModalProps, m as modalVariants } from './Modal-BwFQz60I.cjs';
15
15
  export { _ as Popover, P as PopoverProps } from './Popover-BUKzm3MQ.cjs';
16
16
  export { P as ProgressCircular, a as ProgressCircularProps, p as progressCircularVariants } from './ProgressCircular-CkZsOW4R.cjs';
package/dist/index.d.ts CHANGED
@@ -10,7 +10,7 @@ export { C as Card, a as CardProps, c as cardVariants } from './Card-OBRZ-ssX.js
10
10
  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';
11
11
  export { J as Json, a as JsonProps } from './Json-Dny90Wml.js';
12
12
  export { L as Label, a as LabelProps, l as labelVariants } from './Label-B5fd7vp_.js';
13
- export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DYi8oagz.js';
13
+ export { M as Menu, b as MenuItem, a as MenuProps, c as MenuSection } from './Menu-DbeqxeL0.js';
14
14
  export { M as Modal, a as ModalProps, m as modalVariants } from './Modal-BwFQz60I.js';
15
15
  export { _ as Popover, P as PopoverProps } from './Popover-D6Qv56ms.js';
16
16
  export { P as ProgressCircular, a as ProgressCircularProps, p as progressCircularVariants } from './ProgressCircular-CkZsOW4R.js';
package/dist/index.js CHANGED
@@ -52,11 +52,11 @@ import {
52
52
  } from "./chunk-X6JZFO33.js";
53
53
  import {
54
54
  Menu_default
55
- } from "./chunk-OP5W7BXY.js";
55
+ } from "./chunk-WFPRB4JT.js";
56
56
  import {
57
57
  Modal_default,
58
58
  modalVariants
59
- } from "./chunk-RW4WTSLJ.js";
59
+ } from "./chunk-MK2S3QUK.js";
60
60
  import {
61
61
  Popover_default
62
62
  } from "./chunk-7QUYJEGU.js";
@@ -64,7 +64,7 @@ import "./chunk-WDXULV6M.js";
64
64
  import {
65
65
  Accordion_default,
66
66
  accordionVariants
67
- } from "./chunk-7T76DXVT.js";
67
+ } from "./chunk-OAUPTZSC.js";
68
68
  import {
69
69
  Alert_default,
70
70
  alertVariants
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@fuf-stack/pixels",
3
3
  "description": "fuf core react component library",
4
4
  "author": "Fröhlich ∧ Frei",
5
- "version": "1.1.1",
5
+ "version": "1.2.0",
6
6
  "type": "module",
7
7
  "main": "./dist/index.cjs",
8
8
  "module": "./dist/index.js",
@@ -183,7 +183,7 @@
183
183
  "framer-motion": "12.23.12",
184
184
  "next-themes": "0.4.6",
185
185
  "react-icons": "5.5.0",
186
- "@fuf-stack/pixel-utils": "1.0.3"
186
+ "@fuf-stack/pixel-utils": "1.0.4"
187
187
  },
188
188
  "devDependencies": {
189
189
  "@types/debug": "4.1.12",
@@ -1,56 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { DropdownItemProps } from '@heroui/dropdown';
3
- import { ReactNode, Key } from 'react';
4
-
5
- /**
6
- * Menu item type
7
- */
8
- interface MenuItem {
9
- /** unique identifier */
10
- key: string;
11
- /** CSS class name */
12
- className?: string;
13
- /** additional description shown under the label */
14
- description?: string;
15
- /** disables the menu item */
16
- disabled?: boolean;
17
- /** menu item icon */
18
- icon?: ReactNode;
19
- /** menu item name */
20
- label: ReactNode;
21
- /** click event handler */
22
- onClick?: DropdownItemProps['onPress'];
23
- /** e2e test identifier */
24
- testId?: string;
25
- }
26
- /**
27
- * Menu section type
28
- */
29
- interface MenuSection {
30
- /** unique identifier */
31
- key: string;
32
- /** section label */
33
- label: ReactNode;
34
- /** section items (array of MenuItem) */
35
- items: MenuItem[];
36
- }
37
- interface MenuProps {
38
- /** child components */
39
- children?: ReactNode;
40
- /** CSS class name */
41
- className?: string | string[];
42
- /** HTML data-testid attribute used in e2e tests */
43
- testId?: string;
44
- /** menu item structure */
45
- items: (MenuSection | MenuItem)[];
46
- /** disable menu trigger */
47
- isDisabled?: boolean;
48
- /** called if item is selected */
49
- onAction?: (key: Key) => void;
50
- }
51
- /**
52
- * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
53
- */
54
- declare const Menu: ({ children, className, onAction, testId, isDisabled, items, }: MenuProps) => react_jsx_runtime.JSX.Element;
55
-
56
- export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };
@@ -1,56 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { DropdownItemProps } from '@heroui/dropdown';
3
- import { ReactNode, Key } from 'react';
4
-
5
- /**
6
- * Menu item type
7
- */
8
- interface MenuItem {
9
- /** unique identifier */
10
- key: string;
11
- /** CSS class name */
12
- className?: string;
13
- /** additional description shown under the label */
14
- description?: string;
15
- /** disables the menu item */
16
- disabled?: boolean;
17
- /** menu item icon */
18
- icon?: ReactNode;
19
- /** menu item name */
20
- label: ReactNode;
21
- /** click event handler */
22
- onClick?: DropdownItemProps['onPress'];
23
- /** e2e test identifier */
24
- testId?: string;
25
- }
26
- /**
27
- * Menu section type
28
- */
29
- interface MenuSection {
30
- /** unique identifier */
31
- key: string;
32
- /** section label */
33
- label: ReactNode;
34
- /** section items (array of MenuItem) */
35
- items: MenuItem[];
36
- }
37
- interface MenuProps {
38
- /** child components */
39
- children?: ReactNode;
40
- /** CSS class name */
41
- className?: string | string[];
42
- /** HTML data-testid attribute used in e2e tests */
43
- testId?: string;
44
- /** menu item structure */
45
- items: (MenuSection | MenuItem)[];
46
- /** disable menu trigger */
47
- isDisabled?: boolean;
48
- /** called if item is selected */
49
- onAction?: (key: Key) => void;
50
- }
51
- /**
52
- * Dropdown menu component based on [HeroUI Dropdown](https://www.heroui.com//docs/components/dropdown)
53
- */
54
- declare const Menu: ({ children, className, onAction, testId, isDisabled, items, }: MenuProps) => react_jsx_runtime.JSX.Element;
55
-
56
- export { Menu as M, type MenuProps as a, type MenuItem as b, type MenuSection as c };
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/Accordion/Accordion.tsx","../src/Accordion/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { DividerProps } from '@heroui/divider';\nimport type { ReactNode } from 'react';\n\nimport {\n Accordion as HeroAccordion,\n AccordionItem as HeroAccordionItem,\n} from '@heroui/accordion';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// accordion styling variants\n// see: https://www.heroui.com//docs/components/accordion#accordion-item-slots\nexport const accordionVariants = tv({\n slots: {\n base: '',\n content: 'px-4',\n heading: 'px-4',\n indicator: '',\n startContent: '',\n subtitle: '',\n title: '',\n titleWrapper: '',\n trigger: '',\n // outer accordion wrapper\n wrapper: 'px-0',\n },\n variants: {\n indicatorLeft: {\n true: {\n content: 'pl-7',\n indicator: '-rotate-180 data-[open=true]:-rotate-90',\n trigger: 'flex-row-reverse',\n },\n },\n showDivider: {\n true: {\n wrapper: 'divide-divider divide-y divide-solid',\n },\n },\n showBottomTopDivider: {\n true: {\n wrapper: 'border-divider border-t border-b border-solid',\n },\n },\n },\n});\n\nexport interface AccordionItemProps {\n /** Content of the accordion item */\n children: ReactNode;\n /** Disables the accordion item */\n disabled?: boolean;\n /** Accordion item title */\n title: ReactNode;\n /** Accordion item subtitle */\n subtitle?: ReactNode;\n}\n\ntype VariantProps = TVProps<typeof accordionVariants>;\ntype ClassName = TVClassName<typeof accordionVariants>;\n\nexport interface AccordionProps extends VariantProps {\n /** Props for AccordionItems, will render the accordion items programmatically */\n accordionItems: AccordionItemProps[];\n /** CSS class name */\n className?: ClassName;\n /** Array of keys for the AccordionItem(s) to be expanded by default */\n defaultSelectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Disables the Accordion */\n disabled?: boolean;\n /** Array of keys for the AccordionItems to disable */\n disabledKeys?: Iterable<number | string>;\n /** Force always one AccordionItem to be open. */\n disallowEmptySelection?: boolean;\n /** props for styling the Divider */\n dividerProps?: DividerProps;\n /** Hide the expanded/collapsed indicator icon */\n hideIndicator?: boolean;\n /** Callback function for when a Accordion Item is expanded or collapsed */\n onSelectionChange?: (keys: 'all' | Iterable<number | string>) => unknown;\n /** Selected keys (controlled) */\n selectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Set whether multiple or only a single AccordionItems can be expanded */\n selectionMode?: 'single' | 'multiple';\n /** Enable or disable the divider between each AccordionItem */\n showDivider?: boolean;\n /** Style variant of the Accordion */\n variant?: 'light' | 'shadow' | 'bordered' | 'splitted';\n}\n\n/**\n * Accordion component based on [HeroUI Accordion](https://www.heroui.com//docs/components/accordion)\n */\nconst Accordion = ({\n accordionItems,\n className: _className = undefined,\n defaultSelectedKeys = [],\n disabled = false,\n disabledKeys = [],\n disallowEmptySelection = false,\n dividerProps = {},\n indicatorLeft = false,\n onSelectionChange = undefined,\n selectedKeys = undefined,\n selectionMode = 'multiple',\n showDivider = true,\n variant = 'light',\n}: AccordionProps) => {\n // itemClasses from className slots\n const variants = accordionVariants({\n indicatorLeft,\n showDivider: showDivider && variant !== 'splitted',\n showBottomTopDivider: showDivider && variant === 'light',\n });\n const classNames = variantsToClassNames(variants, _className, 'wrapper');\n\n return (\n <HeroAccordion\n className={classNames.wrapper}\n defaultSelectedKeys={defaultSelectedKeys}\n disabledKeys={disabledKeys}\n disallowEmptySelection={disallowEmptySelection}\n dividerProps={dividerProps}\n isDisabled={disabled}\n itemClasses={classNames}\n onSelectionChange={onSelectionChange}\n selectedKeys={selectedKeys}\n selectionMode={selectionMode}\n showDivider={false}\n variant={variant}\n >\n {accordionItems.map((item, index) => (\n <HeroAccordionItem\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n isDisabled={disabled || item?.disabled}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...item}\n />\n ))}\n </HeroAccordion>\n );\n};\n\nexport default Accordion;\n","import Accordion, { accordionVariants } from './Accordion';\n\nexport type { AccordionProps, AccordionItemProps } from './Accordion';\n\nexport { Accordion, accordionVariants };\n\nexport default Accordion;\n"],"mappings":";;;;;AAIA;AAAA,EACE,aAAa;AAAA,EACb,iBAAiB;AAAA,OACZ;AAEP,SAAS,IAAI,4BAA4B;AA4HjC;AAxHD,IAAM,oBAAoB,GAAG;AAAA,EAClC,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IACX,cAAc;AAAA,IACd,UAAU;AAAA,IACV,OAAO;AAAA,IACP,cAAc;AAAA,IACd,SAAS;AAAA;AAAA,IAET,SAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,eAAe;AAAA,MACb,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,aAAa;AAAA,MACX,MAAM;AAAA,QACJ,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,sBAAsB;AAAA,MACpB,MAAM;AAAA,QACJ,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAgDD,IAAM,YAAY,CAAC;AAAA,EACjB;AAAA,EACA,WAAW,aAAa;AAAA,EACxB,sBAAsB,CAAC;AAAA,EACvB,WAAW;AAAA,EACX,eAAe,CAAC;AAAA,EAChB,yBAAyB;AAAA,EACzB,eAAe,CAAC;AAAA,EAChB,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,cAAc;AAAA,EACd,UAAU;AACZ,MAAsB;AAEpB,QAAM,WAAW,kBAAkB;AAAA,IACjC;AAAA,IACA,aAAa,eAAe,YAAY;AAAA,IACxC,sBAAsB,eAAe,YAAY;AAAA,EACnD,CAAC;AACD,QAAM,aAAa,qBAAqB,UAAU,YAAY,SAAS;AAEvE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,WAAW;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MAEC,yBAAe,IAAI,CAAC,MAAM,UACzB;AAAA,QAAC;AAAA;AAAA,UAGC,YAAY,aAAY,6BAAM;AAAA,WAE1B;AAAA,QAHC;AAAA,MAIP,CACD;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,oBAAQ;;;AC3If,IAAOA,qBAAQ;","names":["Accordion_default"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-LCOQDCO4.cjs","../src/Accordion/Accordion.tsx","../src/Accordion/index.ts"],"names":["Accordion_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-LCOQDCO4.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { DividerProps } from '@heroui/divider';\nimport type { ReactNode } from 'react';\n\nimport {\n Accordion as HeroAccordion,\n AccordionItem as HeroAccordionItem,\n} from '@heroui/accordion';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// accordion styling variants\n// see: https://www.heroui.com//docs/components/accordion#accordion-item-slots\nexport const accordionVariants = tv({\n slots: {\n base: '',\n content: 'px-4',\n heading: 'px-4',\n indicator: '',\n startContent: '',\n subtitle: '',\n title: '',\n titleWrapper: '',\n trigger: '',\n // outer accordion wrapper\n wrapper: 'px-0',\n },\n variants: {\n indicatorLeft: {\n true: {\n content: 'pl-7',\n indicator: '-rotate-180 data-[open=true]:-rotate-90',\n trigger: 'flex-row-reverse',\n },\n },\n showDivider: {\n true: {\n wrapper: 'divide-divider divide-y divide-solid',\n },\n },\n showBottomTopDivider: {\n true: {\n wrapper: 'border-divider border-t border-b border-solid',\n },\n },\n },\n});\n\nexport interface AccordionItemProps {\n /** Content of the accordion item */\n children: ReactNode;\n /** Disables the accordion item */\n disabled?: boolean;\n /** Accordion item title */\n title: ReactNode;\n /** Accordion item subtitle */\n subtitle?: ReactNode;\n}\n\ntype VariantProps = TVProps<typeof accordionVariants>;\ntype ClassName = TVClassName<typeof accordionVariants>;\n\nexport interface AccordionProps extends VariantProps {\n /** Props for AccordionItems, will render the accordion items programmatically */\n accordionItems: AccordionItemProps[];\n /** CSS class name */\n className?: ClassName;\n /** Array of keys for the AccordionItem(s) to be expanded by default */\n defaultSelectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Disables the Accordion */\n disabled?: boolean;\n /** Array of keys for the AccordionItems to disable */\n disabledKeys?: Iterable<number | string>;\n /** Force always one AccordionItem to be open. */\n disallowEmptySelection?: boolean;\n /** props for styling the Divider */\n dividerProps?: DividerProps;\n /** Hide the expanded/collapsed indicator icon */\n hideIndicator?: boolean;\n /** Callback function for when a Accordion Item is expanded or collapsed */\n onSelectionChange?: (keys: 'all' | Iterable<number | string>) => unknown;\n /** Selected keys (controlled) */\n selectedKeys?: undefined | 'all' | Iterable<number | string>;\n /** Set whether multiple or only a single AccordionItems can be expanded */\n selectionMode?: 'single' | 'multiple';\n /** Enable or disable the divider between each AccordionItem */\n showDivider?: boolean;\n /** Style variant of the Accordion */\n variant?: 'light' | 'shadow' | 'bordered' | 'splitted';\n}\n\n/**\n * Accordion component based on [HeroUI Accordion](https://www.heroui.com//docs/components/accordion)\n */\nconst Accordion = ({\n accordionItems,\n className: _className = undefined,\n defaultSelectedKeys = [],\n disabled = false,\n disabledKeys = [],\n disallowEmptySelection = false,\n dividerProps = {},\n indicatorLeft = false,\n onSelectionChange = undefined,\n selectedKeys = undefined,\n selectionMode = 'multiple',\n showDivider = true,\n variant = 'light',\n}: AccordionProps) => {\n // itemClasses from className slots\n const variants = accordionVariants({\n indicatorLeft,\n showDivider: showDivider && variant !== 'splitted',\n showBottomTopDivider: showDivider && variant === 'light',\n });\n const classNames = variantsToClassNames(variants, _className, 'wrapper');\n\n return (\n <HeroAccordion\n className={classNames.wrapper}\n defaultSelectedKeys={defaultSelectedKeys}\n disabledKeys={disabledKeys}\n disallowEmptySelection={disallowEmptySelection}\n dividerProps={dividerProps}\n isDisabled={disabled}\n itemClasses={classNames}\n onSelectionChange={onSelectionChange}\n selectedKeys={selectedKeys}\n selectionMode={selectionMode}\n showDivider={false}\n variant={variant}\n >\n {accordionItems.map((item, index) => (\n <HeroAccordionItem\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n isDisabled={disabled || item?.disabled}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...item}\n />\n ))}\n </HeroAccordion>\n );\n};\n\nexport default Accordion;\n","import Accordion, { accordionVariants } from './Accordion';\n\nexport type { AccordionProps, AccordionItemProps } from './Accordion';\n\nexport { Accordion, accordionVariants };\n\nexport default Accordion;\n"]}
@@ -1,81 +0,0 @@
1
- // src/Menu/Menu.tsx
2
- import { FaEllipsisVertical } from "react-icons/fa6";
3
- import { Button } from "@heroui/button";
4
- import {
5
- Dropdown as HeroDropdown,
6
- DropdownItem as HeroDropdownItem,
7
- DropdownMenu as HeroDropdownMenu,
8
- DropdownSection as HeroDropdownSection,
9
- DropdownTrigger as HeroDropdownTrigger
10
- } from "@heroui/dropdown";
11
- import { cn } from "@fuf-stack/pixel-utils";
12
- import { jsx, jsxs } from "react/jsx-runtime";
13
- var getDisabledKeys = (items) => {
14
- return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
15
- return Object.hasOwn(item, "disabled") && item.disabled === true;
16
- }).map((item) => item.key);
17
- };
18
- var renderMenuItem = (item) => /* @__PURE__ */ jsx(
19
- HeroDropdownItem,
20
- {
21
- className: item.className,
22
- "data-testid": item.testId || item.key,
23
- description: item.description,
24
- onPress: item.onClick,
25
- startContent: item.icon,
26
- children: item.label
27
- },
28
- item.key
29
- );
30
- var Menu = ({
31
- children = null,
32
- className = void 0,
33
- onAction = void 0,
34
- testId = void 0,
35
- isDisabled = false,
36
- items
37
- }) => {
38
- return /* @__PURE__ */ jsxs(HeroDropdown, { isDisabled, children: [
39
- /* @__PURE__ */ jsx(HeroDropdownTrigger, { className: cn(className), "data-testid": testId, children: children ? (
40
- // eslint-disable-next-line react/button-has-type
41
- /* @__PURE__ */ jsx("button", { children })
42
- ) : (
43
- // INFO: we use hero button here so that ref passing works
44
- /* @__PURE__ */ jsx(Button, { size: "sm", variant: "flat", className: "min-w-0", children: /* @__PURE__ */ jsx(FaEllipsisVertical, {}) })
45
- ) }),
46
- /* @__PURE__ */ jsx(
47
- HeroDropdownMenu,
48
- {
49
- items,
50
- disabledKeys: getDisabledKeys(items),
51
- onAction,
52
- children: (item) => {
53
- if ("items" in item) {
54
- return /* @__PURE__ */ jsx(
55
- HeroDropdownSection,
56
- {
57
- items: item.items,
58
- title: item.label,
59
- children: (sectionItem) => {
60
- return renderMenuItem(sectionItem);
61
- }
62
- },
63
- item.key
64
- );
65
- }
66
- return renderMenuItem(item);
67
- }
68
- }
69
- )
70
- ] });
71
- };
72
- var Menu_default = Menu;
73
-
74
- // src/Menu/index.ts
75
- var Menu_default2 = Menu_default;
76
-
77
- export {
78
- Menu_default,
79
- Menu_default2
80
- };
81
- //# sourceMappingURL=chunk-OP5W7BXY.js.map
@@ -1 +0,0 @@
1
- {"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"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/Modal/Modal.tsx","../src/Modal/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ModalProps as HeroModalProps } from '@heroui/modal';\nimport type { ReactNode } from 'react';\n\nimport {\n Modal as HeroModal,\n ModalBody as HeroModalBody,\n ModalContent as HeroModalContent,\n ModalFooter as HeroModalFooter,\n ModalHeader as HeroModalHeader,\n} from '@heroui/modal';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// modal variants\nexport const modalVariants = tv({\n slots: {\n backdrop: '',\n base: '',\n body: '',\n closeButton: '',\n footer: '',\n header: '',\n wrapper: '',\n },\n variants: {\n size: {\n sm: { base: 'max-w-sm' },\n md: { base: 'max-w-md' },\n lg: { base: 'max-w-lg' },\n xl: { base: 'max-w-5xl' },\n full: { base: 'h-[80dvh] max-w-full' },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof modalVariants>;\ntype ClassName = TVClassName<typeof modalVariants>;\n\nexport interface ModalProps extends VariantProps {\n /** modal body content */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Disable animations completely */\n disableAnimation?: boolean;\n /** modal footer */\n footer?: ReactNode;\n /** modal header */\n header?: ReactNode;\n /** open state (controlled) */\n isOpen: boolean;\n /** close event handler */\n onClose: () => void;\n /** The container element in which the overlay portal will be placed */\n portalContainer?: HeroModalProps['portalContainer'];\n /** modal size */\n size?: VariantProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Modal component based on [HeroUI Modal](https://www.heroui.com//docs/components/modal)\n */\nconst Modal = ({\n children = null,\n className = undefined,\n disableAnimation = false,\n footer = undefined,\n header = undefined,\n isOpen,\n onClose,\n portalContainer = undefined,\n size = 'md',\n testId = undefined,\n}: ModalProps) => {\n // classNames from slots\n const variants = modalVariants({ size });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <HeroModal\n backdrop=\"opaque\"\n classNames={classNames}\n data-testid={testId}\n disableAnimation={disableAnimation}\n isOpen={isOpen}\n onClose={onClose}\n placement=\"center\"\n portalContainer={portalContainer}\n scrollBehavior=\"inside\"\n >\n <HeroModalContent data-testid={testId ? `modal_${testId}` : 'modal'}>\n {() => (\n <>\n {header && <HeroModalHeader>{header}</HeroModalHeader>}\n <HeroModalBody id=\"modal_body\">{children}</HeroModalBody>\n {footer && <HeroModalFooter>{footer}</HeroModalFooter>}\n </>\n )}\n </HeroModalContent>\n </HeroModal>\n );\n};\n\nexport default Modal;\n","import Modal, { modalVariants } from './Modal';\n\nexport type { ModalProps } from './Modal';\n\nexport { Modal, modalVariants };\n\nexport default Modal;\n"],"mappings":";AAIA;AAAA,EACE,SAAS;AAAA,EACT,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,eAAe;AAAA,OACV;AAEP,SAAS,IAAI,4BAA4B;AAmF/B,mBACa,KADb;AAhFH,IAAM,gBAAgB,GAAG;AAAA,EAC9B,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI,EAAE,MAAM,WAAW;AAAA,MACvB,IAAI,EAAE,MAAM,WAAW;AAAA,MACvB,IAAI,EAAE,MAAM,WAAW;AAAA,MACvB,IAAI,EAAE,MAAM,YAAY;AAAA,MACxB,MAAM,EAAE,MAAM,uBAAuB;AAAA,IACvC;AAAA,EACF;AACF,CAAC;AA+BD,IAAM,QAAQ,CAAC;AAAA,EACb,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,SAAS;AAAA,EACT,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,OAAO;AAAA,EACP,SAAS;AACX,MAAkB;AAEhB,QAAM,WAAW,cAAc,EAAE,KAAK,CAAC;AACvC,QAAM,aAAa,qBAAqB,UAAU,WAAW,MAAM;AAEnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT;AAAA,MACA,eAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAU;AAAA,MACV;AAAA,MACA,gBAAe;AAAA,MAEf,8BAAC,oBAAiB,eAAa,SAAS,SAAS,MAAM,KAAK,SACzD,gBACC,iCACG;AAAA,kBAAU,oBAAC,mBAAiB,kBAAO;AAAA,QACpC,oBAAC,iBAAc,IAAG,cAAc,UAAS;AAAA,QACxC,UAAU,oBAAC,mBAAiB,kBAAO;AAAA,SACtC,GAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACpGf,IAAOA,iBAAQ;","names":["Modal_default"]}
@@ -1,81 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/Menu/Menu.tsx
2
- var _fa6 = require('react-icons/fa6');
3
- var _button = require('@heroui/button');
4
-
5
-
6
-
7
-
8
-
9
-
10
- var _dropdown = require('@heroui/dropdown');
11
- var _pixelutils = require('@fuf-stack/pixel-utils');
12
- var _jsxruntime = require('react/jsx-runtime');
13
- var getDisabledKeys = (items) => {
14
- return items.map((item) => typeof (item == null ? void 0 : item.items) === "undefined" ? item : item.items).flat().filter((item) => {
15
- return Object.hasOwn(item, "disabled") && item.disabled === true;
16
- }).map((item) => item.key);
17
- };
18
- var renderMenuItem = (item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
19
- _dropdown.DropdownItem,
20
- {
21
- className: item.className,
22
- "data-testid": item.testId || item.key,
23
- description: item.description,
24
- onPress: item.onClick,
25
- startContent: item.icon,
26
- children: item.label
27
- },
28
- item.key
29
- );
30
- var Menu = ({
31
- children = null,
32
- className = void 0,
33
- onAction = void 0,
34
- testId = void 0,
35
- isDisabled = false,
36
- items
37
- }) => {
38
- return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _dropdown.Dropdown, { isDisabled, children: [
39
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _dropdown.DropdownTrigger, { className: _pixelutils.cn.call(void 0, className), "data-testid": testId, children: children ? (
40
- // eslint-disable-next-line react/button-has-type
41
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { children })
42
- ) : (
43
- // INFO: we use hero button here so that ref passing works
44
- /* @__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, {}) })
45
- ) }),
46
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
47
- _dropdown.DropdownMenu,
48
- {
49
- items,
50
- disabledKeys: getDisabledKeys(items),
51
- onAction,
52
- children: (item) => {
53
- if ("items" in item) {
54
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
55
- _dropdown.DropdownSection,
56
- {
57
- items: item.items,
58
- title: item.label,
59
- children: (sectionItem) => {
60
- return renderMenuItem(sectionItem);
61
- }
62
- },
63
- item.key
64
- );
65
- }
66
- return renderMenuItem(item);
67
- }
68
- }
69
- )
70
- ] });
71
- };
72
- var Menu_default = Menu;
73
-
74
- // src/Menu/index.ts
75
- var Menu_default2 = Menu_default;
76
-
77
-
78
-
79
-
80
- exports.Menu_default = Menu_default; exports.Menu_default2 = Menu_default2;
81
- //# sourceMappingURL=chunk-XHOAZB2Z.cjs.map
@@ -1 +0,0 @@
1
- {"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"]}