@fuf-stack/pixels 0.38.0 → 0.39.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Alert/index.cjs +2 -2
- package/dist/Alert/index.d.cts +2 -2
- package/dist/Alert/index.d.ts +2 -2
- package/dist/Alert/index.js +1 -1
- package/dist/{Alert-Bz_lJ_YE.d.cts → Alert-DELD9ZWe.d.cts} +80 -1
- package/dist/{Alert-Bz_lJ_YE.d.ts → Alert-DELD9ZWe.d.ts} +80 -1
- package/dist/Menu/index.cjs +2 -2
- package/dist/Menu/index.d.cts +3 -2
- package/dist/Menu/index.d.ts +3 -2
- package/dist/Menu/index.js +1 -1
- package/dist/{Menu-C7lpY7pY.d.cts → Menu-DYi8oagz.d.cts} +3 -2
- package/dist/{Menu-C7lpY7pY.d.ts → Menu-DYi8oagz.d.ts} +3 -2
- package/dist/Popover/index.cjs +2 -2
- package/dist/Popover/index.d.cts +2 -2
- package/dist/Popover/index.d.ts +2 -2
- package/dist/Popover/index.js +1 -1
- package/dist/{Popover-B2-09nsy.d.ts → Popover-BHPrdRy6.d.ts} +1 -1
- package/dist/{Popover-DAYvOjOY.d.cts → Popover-BXyk9y8I.d.cts} +1 -1
- package/dist/Table/index.cjs +2 -2
- package/dist/Table/index.js +1 -1
- package/dist/{chunk-MOIIBJ6O.js → chunk-5TOE75VE.js} +3 -3
- package/dist/chunk-5TOE75VE.js.map +1 -0
- package/dist/{chunk-QMYSCJEJ.js → chunk-AFGRLKHU.js} +2 -2
- package/dist/{chunk-QMYSCJEJ.js.map → chunk-AFGRLKHU.js.map} +1 -1
- package/dist/{chunk-A4MJ5V64.cjs → chunk-AJCAIA6H.cjs} +2 -2
- package/dist/chunk-AJCAIA6H.cjs.map +1 -0
- package/dist/{chunk-EAJGISR6.cjs → chunk-EAX5J2I2.cjs} +3 -3
- package/dist/chunk-EAX5J2I2.cjs.map +1 -0
- package/dist/{chunk-V2WKZH63.js → chunk-MG3PTEMK.js} +16 -3
- package/dist/chunk-MG3PTEMK.js.map +1 -0
- package/dist/{chunk-LRJVQPVR.js → chunk-OP5W7BXY.js} +2 -2
- package/dist/chunk-OP5W7BXY.js.map +1 -0
- package/dist/{chunk-KBYU4ZF2.cjs → chunk-XHOAZB2Z.cjs} +2 -2
- package/dist/chunk-XHOAZB2Z.cjs.map +1 -0
- package/dist/{chunk-33S6NRVI.cjs → chunk-YVPRFCWI.cjs} +16 -3
- package/dist/chunk-YVPRFCWI.cjs.map +1 -0
- package/dist/index.cjs +171 -6
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +284 -8
- package/dist/index.d.ts +284 -8
- package/dist/index.js +170 -5
- package/dist/index.js.map +1 -1
- package/package.json +24 -23
- package/dist/chunk-33S6NRVI.cjs.map +0 -1
- package/dist/chunk-A4MJ5V64.cjs.map +0 -1
- package/dist/chunk-EAJGISR6.cjs.map +0 -1
- package/dist/chunk-KBYU4ZF2.cjs.map +0 -1
- package/dist/chunk-LRJVQPVR.js.map +0 -1
- package/dist/chunk-MOIIBJ6O.js.map +0 -1
- package/dist/chunk-V2WKZH63.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-EAX5J2I2.cjs","../src/Popover/Popover.tsx","../src/Popover/index.ts"],"names":["Popover_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-EAX5J2I2.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { PopoverProps as HeroPopoverProps } from '@heroui/popover';\nimport type { ReactNode } from 'react';\nimport type { ButtonProps } from '../Button';\n\nimport { Button } from '@heroui/button';\nimport { Popover, PopoverContent, PopoverTrigger } from '@heroui/popover';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport ScrollShadow from '../ScrollShadow/ScrollShadow';\n\n// popover styling variants\nexport const popoverVariants = tv({\n slots: {\n body: 'w-full px-2.5 py-1',\n content: 'flex max-h-[80vh] flex-col p-0',\n footer: 'w-full px-2.5 py-1',\n header: 'w-full px-2.5 py-1',\n trigger: '',\n },\n});\n\ntype VariantProps = TVProps<typeof popoverVariants>;\ntype ClassName = TVClassName<typeof popoverVariants>;\n\nexport interface PopoverProps extends VariantProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** content of the popover */\n content: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n contentTestId?: string;\n /** popover footer */\n footer?: ReactNode;\n /** use as controlled component */\n openControlled?: { open: boolean; setOpen: (open: boolean) => void };\n /** placement of the popover relative to its trigger reference */\n placement?: HeroPopoverProps['placement'];\n /** The container element in which the overlay portal will be placed. */\n portalContainer?: HeroPopoverProps['portalContainer'];\n /** Whether to block scrolling outside the popover */\n shouldBlockScroll?: boolean;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Popover title */\n title?: ReactNode;\n /** When defined a Button will be rendered as trigger (with provided props) instead of unstyled html button */\n triggerButtonProps?: Pick<\n ButtonProps,\n | 'ariaLabel'\n | 'className'\n | 'color'\n | 'disableAnimation'\n | 'disabled'\n | 'size'\n | 'testId'\n | 'variant'\n >;\n}\n\n/**\n * Popover component based on [HeroUI Card](https://www.heroui.com//docs/components/popover)\n */\nexport default ({\n children = null,\n className: _className = undefined,\n content,\n contentTestId = undefined,\n footer = undefined,\n openControlled = undefined,\n placement = 'top',\n portalContainer = undefined,\n shouldBlockScroll = undefined,\n testId = undefined,\n title = undefined,\n triggerButtonProps = undefined,\n}: PopoverProps) => {\n // className from slots\n const variants = popoverVariants();\n const className = variantsToClassNames(variants, _className, 'trigger');\n\n return (\n <Popover\n classNames={className}\n placement={placement}\n portalContainer={portalContainer}\n radius=\"sm\"\n shouldBlockScroll={shouldBlockScroll}\n showArrow\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(openControlled\n ? { isOpen: openControlled.open, onOpenChange: openControlled.setOpen }\n : {})}\n >\n <PopoverTrigger data-testid={testId}>\n {/* NOTE: type and aria properties are injected by PopoverTrigger */}\n {triggerButtonProps ? (\n // TODO: currently we have to use @heroui/button because\n // passing ref does not work (even with forwardRef in Button)\n // eslint-disable-next-line react/jsx-props-no-spreading\n <Button className={className.trigger} {...triggerButtonProps}>\n {children}\n </Button>\n ) : (\n // eslint-disable-next-line react/button-has-type\n <button className={className.trigger}>{children}</button>\n )}\n </PopoverTrigger>\n <PopoverContent data-testid={contentTestId}>\n {title && (\n <div className={className.header}>\n {title}\n <hr />\n </div>\n )}\n <ScrollShadow className={className.body}>{content}</ScrollShadow>\n {footer && (\n <div className={className.footer}>\n <hr />\n {footer}\n </div>\n )}\n </PopoverContent>\n </Popover>\n );\n};\n","import Popover from './Popover';\n\nexport type { PopoverProps } from './Popover';\n\nexport { Popover };\n\nexport default Popover;\n"]}
|
|
@@ -26,7 +26,18 @@ var alertVariants = tv({
|
|
|
26
26
|
description: "text-inherit"
|
|
27
27
|
}
|
|
28
28
|
}, heroAlertVariants.variants.color),
|
|
29
|
-
variant: __spreadValues({}, heroAlertVariants.variants.variant)
|
|
29
|
+
variant: __spreadValues({}, heroAlertVariants.variants.variant),
|
|
30
|
+
sizeLimit: {
|
|
31
|
+
height: {
|
|
32
|
+
base: "max-h-[150px] overflow-y-auto overflow-x-hidden"
|
|
33
|
+
},
|
|
34
|
+
width: {
|
|
35
|
+
base: "max-w-[480px] overflow-x-auto overflow-y-hidden"
|
|
36
|
+
},
|
|
37
|
+
both: {
|
|
38
|
+
base: "max-h-[150px] max-w-[480px] overflow-y-auto overflow-x-hidden"
|
|
39
|
+
}
|
|
40
|
+
}
|
|
30
41
|
},
|
|
31
42
|
compoundVariants: [
|
|
32
43
|
...heroAlertVariants.compoundVariants,
|
|
@@ -79,6 +90,7 @@ var Alert = ({
|
|
|
79
90
|
icon = void 0,
|
|
80
91
|
isClosable = false,
|
|
81
92
|
onClose = void 0,
|
|
93
|
+
sizeLimit = void 0,
|
|
82
94
|
showIcon = true,
|
|
83
95
|
testId = void 0,
|
|
84
96
|
title = void 0,
|
|
@@ -86,7 +98,8 @@ var Alert = ({
|
|
|
86
98
|
}) => {
|
|
87
99
|
const variants = alertVariants({
|
|
88
100
|
color,
|
|
89
|
-
variant
|
|
101
|
+
variant,
|
|
102
|
+
sizeLimit
|
|
90
103
|
});
|
|
91
104
|
const isHeroUIColor = Object.keys(heroAlertVariants.variants.color).includes(
|
|
92
105
|
color
|
|
@@ -119,4 +132,4 @@ export {
|
|
|
119
132
|
Alert_default,
|
|
120
133
|
Alert_default2
|
|
121
134
|
};
|
|
122
|
-
//# sourceMappingURL=chunk-
|
|
135
|
+
//# sourceMappingURL=chunk-MG3PTEMK.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Alert/Alert.tsx","../src/Alert/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { AlertProps as HeroAlertProps } from '@heroui/alert';\nimport type { ReactNode } from 'react';\n\nimport { Alert as HeroAlert } from '@heroui/alert';\nimport { alert as heroAlertVariants } from '@heroui/theme';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const alertVariants = tv({\n slots: {\n base: '',\n title: '',\n description: '',\n mainWrapper: '',\n closeButton: '',\n iconWrapper: '',\n alertIcon: '',\n },\n variants: {\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/alert.ts\n color: {\n info: {\n mainWrapper: 'text-inherit',\n title: 'text-inherit',\n description: 'text-inherit',\n },\n ...heroAlertVariants.variants.color,\n },\n variant: {\n ...heroAlertVariants.variants.variant,\n },\n sizeLimit: {\n height: {\n base: 'max-h-[150px] overflow-y-auto overflow-x-hidden',\n },\n width: {\n base: 'max-w-[480px] overflow-x-auto overflow-y-hidden',\n },\n both: {\n base: 'max-h-[150px] max-w-[480px] overflow-y-auto overflow-x-hidden',\n },\n },\n },\n compoundVariants: [\n ...heroAlertVariants.compoundVariants,\n {\n color: 'info',\n variant: 'solid',\n className: {\n base: 'bg-info text-info-foreground',\n alertIcon: 'text-info-foreground',\n closeButton: 'text-inherit',\n },\n },\n {\n color: 'info',\n variant: 'flat',\n className: {\n alertIcon: 'fill-current',\n base: 'dark:bg-info-50/50 bg-info-50 text-info-600',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n iconWrapper: 'border-info-100 bg-info-50 dark:bg-info-100',\n },\n },\n {\n color: 'info',\n variant: 'faded',\n className: {\n alertIcon: 'fill-current',\n base: 'dark:bg-info-50/50 border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n iconWrapper: 'border-info-100 bg-info-50 dark:bg-info-100',\n },\n },\n {\n color: 'info',\n variant: 'bordered',\n className: {\n alertIcon: 'fill-current',\n base: 'border-small border-info text-info',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n iconWrapper: 'bg-info-100 dark:bg-info-50',\n },\n },\n ],\n});\n\nexport type VariantProps = TVProps<typeof alertVariants>;\ntype ClassName = TVClassName<typeof alertVariants>;\n\nexport interface AlertProps extends VariantProps {\n /** Content displayed inside the Alert if no description is given! */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Color scheme of the Alert */\n color?: VariantProps['color'];\n /** Content displayed at the end of the Alert */\n endContent?: ReactNode;\n /** Icon displayed at the start of the Alert */\n icon?: ReactNode;\n /** Whether the Alert can be closed */\n isClosable?: boolean;\n /** Callback fired when the close button is clicked */\n onClose?: () => void | undefined;\n /** Whether to show the icon at the start */\n showIcon?: boolean;\n /** limit height to 150px or width to 480px or both */\n sizeLimit?: VariantProps['sizeLimit'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Title displayed in the Alert above the content */\n title?: ReactNode;\n /** Style variant of the Alert */\n variant?: VariantProps['variant'];\n}\n\n/**\n * Alert component based on [HeroUI Alert](https://www.heroui.com//docs/components/alert)\n */\nconst Alert = ({\n children = undefined,\n className = undefined,\n color = 'primary',\n endContent = undefined,\n icon = undefined,\n isClosable = false,\n onClose = undefined,\n sizeLimit = undefined,\n showIcon = true,\n testId = undefined,\n title = undefined,\n variant = 'solid',\n}: AlertProps) => {\n const variants = alertVariants({\n color,\n variant,\n sizeLimit,\n });\n const isHeroUIColor = Object.keys(heroAlertVariants.variants.color).includes(\n color,\n );\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <HeroAlert\n classNames={classNames}\n color={isHeroUIColor ? (color as HeroAlertProps['color']) : undefined}\n data-testid={testId}\n description={title ? children : undefined}\n endContent={endContent}\n hideIcon={!showIcon}\n icon={icon}\n isClosable={isClosable}\n onClose={onClose}\n title={(title || children) as string}\n variant={variant}\n />\n );\n};\n\nexport default Alert;\n","import Alert, { alertVariants } from './Alert';\n\nexport type { AlertProps } from './Alert';\n\nexport { Alert, alertVariants };\n\nexport default Alert;\n"],"mappings":";;;;;AAIA,SAAS,SAAS,iBAAiB;AACnC,SAAS,SAAS,yBAAyB;AAE3C,SAAS,IAAI,4BAA4B;AA2IrC;AAzIG,IAAM,gBAAgB,GAAG;AAAA,EAC9B,OAAO;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aAAa;AAAA,IACb,aAAa;AAAA,IACb,aAAa;AAAA,IACb,aAAa;AAAA,IACb,WAAW;AAAA,EACb;AAAA,EACA,UAAU;AAAA;AAAA,IAER,OAAO;AAAA,MACL,MAAM;AAAA,QACJ,aAAa;AAAA,QACb,OAAO;AAAA,QACP,aAAa;AAAA,MACf;AAAA,OACG,kBAAkB,SAAS;AAAA,IAEhC,SAAS,mBACJ,kBAAkB,SAAS;AAAA,IAEhC,WAAW;AAAA,MACT,QAAQ;AAAA,QACN,MAAM;AAAA,MACR;AAAA,MACA,OAAO;AAAA,QACL,MAAM;AAAA,MACR;AAAA,MACA,MAAM;AAAA,QACJ,MAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,GAAG,kBAAkB;AAAA,IACrB;AAAA,MACE,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,QACT,MAAM;AAAA,QACN,WAAW;AAAA,QACX,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,QACT,WAAW;AAAA,QACX,MAAM;AAAA,QACN,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,QACT,WAAW;AAAA,QACX,MAAM;AAAA,QACN,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,QACT,WAAW;AAAA,QACX,MAAM;AAAA,QACN,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAmCD,IAAM,QAAQ,CAAC;AAAA,EACb,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,OAAO;AAAA,EACP,aAAa;AAAA,EACb,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,UAAU;AACZ,MAAkB;AAChB,QAAM,WAAW,cAAc;AAAA,IAC7B;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,gBAAgB,OAAO,KAAK,kBAAkB,SAAS,KAAK,EAAE;AAAA,IAClE;AAAA,EACF;AACA,QAAM,aAAa,qBAAqB,UAAU,WAAW,MAAM;AAEnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,gBAAiB,QAAoC;AAAA,MAC5D,eAAa;AAAA,MACb,aAAa,QAAQ,WAAW;AAAA,MAChC;AAAA,MACA,UAAU,CAAC;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAQ,SAAS;AAAA,MACjB;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;AC5Jf,IAAOA,iBAAQ;","names":["Alert_default"]}
|
|
@@ -21,7 +21,7 @@ var renderMenuItem = (item) => /* @__PURE__ */ jsx(
|
|
|
21
21
|
className: item.className,
|
|
22
22
|
"data-testid": item.testId || item.key,
|
|
23
23
|
description: item.description,
|
|
24
|
-
|
|
24
|
+
onPress: item.onClick,
|
|
25
25
|
startContent: item.icon,
|
|
26
26
|
children: item.label
|
|
27
27
|
},
|
|
@@ -78,4 +78,4 @@ export {
|
|
|
78
78
|
Menu_default,
|
|
79
79
|
Menu_default2
|
|
80
80
|
};
|
|
81
|
-
//# sourceMappingURL=chunk-
|
|
81
|
+
//# sourceMappingURL=chunk-OP5W7BXY.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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"]}
|
|
@@ -21,7 +21,7 @@ var renderMenuItem = (item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
|
21
21
|
className: item.className,
|
|
22
22
|
"data-testid": item.testId || item.key,
|
|
23
23
|
description: item.description,
|
|
24
|
-
|
|
24
|
+
onPress: item.onClick,
|
|
25
25
|
startContent: item.icon,
|
|
26
26
|
children: item.label
|
|
27
27
|
},
|
|
@@ -78,4 +78,4 @@ var Menu_default2 = Menu_default;
|
|
|
78
78
|
|
|
79
79
|
|
|
80
80
|
exports.Menu_default = Menu_default; exports.Menu_default2 = Menu_default2;
|
|
81
|
-
//# sourceMappingURL=chunk-
|
|
81
|
+
//# sourceMappingURL=chunk-XHOAZB2Z.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
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"]}
|
|
@@ -26,7 +26,18 @@ var alertVariants = _pixelutils.tv.call(void 0, {
|
|
|
26
26
|
description: "text-inherit"
|
|
27
27
|
}
|
|
28
28
|
}, _theme.alert.variants.color),
|
|
29
|
-
variant: _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {}, _theme.alert.variants.variant)
|
|
29
|
+
variant: _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {}, _theme.alert.variants.variant),
|
|
30
|
+
sizeLimit: {
|
|
31
|
+
height: {
|
|
32
|
+
base: "max-h-[150px] overflow-y-auto overflow-x-hidden"
|
|
33
|
+
},
|
|
34
|
+
width: {
|
|
35
|
+
base: "max-w-[480px] overflow-x-auto overflow-y-hidden"
|
|
36
|
+
},
|
|
37
|
+
both: {
|
|
38
|
+
base: "max-h-[150px] max-w-[480px] overflow-y-auto overflow-x-hidden"
|
|
39
|
+
}
|
|
40
|
+
}
|
|
30
41
|
},
|
|
31
42
|
compoundVariants: [
|
|
32
43
|
..._theme.alert.compoundVariants,
|
|
@@ -79,6 +90,7 @@ var Alert = ({
|
|
|
79
90
|
icon = void 0,
|
|
80
91
|
isClosable = false,
|
|
81
92
|
onClose = void 0,
|
|
93
|
+
sizeLimit = void 0,
|
|
82
94
|
showIcon = true,
|
|
83
95
|
testId = void 0,
|
|
84
96
|
title = void 0,
|
|
@@ -86,7 +98,8 @@ var Alert = ({
|
|
|
86
98
|
}) => {
|
|
87
99
|
const variants = alertVariants({
|
|
88
100
|
color,
|
|
89
|
-
variant
|
|
101
|
+
variant,
|
|
102
|
+
sizeLimit
|
|
90
103
|
});
|
|
91
104
|
const isHeroUIColor = Object.keys(_theme.alert.variants.color).includes(
|
|
92
105
|
color
|
|
@@ -119,4 +132,4 @@ var Alert_default2 = Alert_default;
|
|
|
119
132
|
|
|
120
133
|
|
|
121
134
|
exports.alertVariants = alertVariants; exports.Alert_default = Alert_default; exports.Alert_default2 = Alert_default2;
|
|
122
|
-
//# sourceMappingURL=chunk-
|
|
135
|
+
//# sourceMappingURL=chunk-YVPRFCWI.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-YVPRFCWI.cjs","../src/Alert/Alert.tsx","../src/Alert/index.ts"],"names":["Alert_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-YVPRFCWI.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { AlertProps as HeroAlertProps } from '@heroui/alert';\nimport type { ReactNode } from 'react';\n\nimport { Alert as HeroAlert } from '@heroui/alert';\nimport { alert as heroAlertVariants } from '@heroui/theme';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const alertVariants = tv({\n slots: {\n base: '',\n title: '',\n description: '',\n mainWrapper: '',\n closeButton: '',\n iconWrapper: '',\n alertIcon: '',\n },\n variants: {\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/alert.ts\n color: {\n info: {\n mainWrapper: 'text-inherit',\n title: 'text-inherit',\n description: 'text-inherit',\n },\n ...heroAlertVariants.variants.color,\n },\n variant: {\n ...heroAlertVariants.variants.variant,\n },\n sizeLimit: {\n height: {\n base: 'max-h-[150px] overflow-y-auto overflow-x-hidden',\n },\n width: {\n base: 'max-w-[480px] overflow-x-auto overflow-y-hidden',\n },\n both: {\n base: 'max-h-[150px] max-w-[480px] overflow-y-auto overflow-x-hidden',\n },\n },\n },\n compoundVariants: [\n ...heroAlertVariants.compoundVariants,\n {\n color: 'info',\n variant: 'solid',\n className: {\n base: 'bg-info text-info-foreground',\n alertIcon: 'text-info-foreground',\n closeButton: 'text-inherit',\n },\n },\n {\n color: 'info',\n variant: 'flat',\n className: {\n alertIcon: 'fill-current',\n base: 'dark:bg-info-50/50 bg-info-50 text-info-600',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n iconWrapper: 'border-info-100 bg-info-50 dark:bg-info-100',\n },\n },\n {\n color: 'info',\n variant: 'faded',\n className: {\n alertIcon: 'fill-current',\n base: 'dark:bg-info-50/50 border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n iconWrapper: 'border-info-100 bg-info-50 dark:bg-info-100',\n },\n },\n {\n color: 'info',\n variant: 'bordered',\n className: {\n alertIcon: 'fill-current',\n base: 'border-small border-info text-info',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n iconWrapper: 'bg-info-100 dark:bg-info-50',\n },\n },\n ],\n});\n\nexport type VariantProps = TVProps<typeof alertVariants>;\ntype ClassName = TVClassName<typeof alertVariants>;\n\nexport interface AlertProps extends VariantProps {\n /** Content displayed inside the Alert if no description is given! */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Color scheme of the Alert */\n color?: VariantProps['color'];\n /** Content displayed at the end of the Alert */\n endContent?: ReactNode;\n /** Icon displayed at the start of the Alert */\n icon?: ReactNode;\n /** Whether the Alert can be closed */\n isClosable?: boolean;\n /** Callback fired when the close button is clicked */\n onClose?: () => void | undefined;\n /** Whether to show the icon at the start */\n showIcon?: boolean;\n /** limit height to 150px or width to 480px or both */\n sizeLimit?: VariantProps['sizeLimit'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Title displayed in the Alert above the content */\n title?: ReactNode;\n /** Style variant of the Alert */\n variant?: VariantProps['variant'];\n}\n\n/**\n * Alert component based on [HeroUI Alert](https://www.heroui.com//docs/components/alert)\n */\nconst Alert = ({\n children = undefined,\n className = undefined,\n color = 'primary',\n endContent = undefined,\n icon = undefined,\n isClosable = false,\n onClose = undefined,\n sizeLimit = undefined,\n showIcon = true,\n testId = undefined,\n title = undefined,\n variant = 'solid',\n}: AlertProps) => {\n const variants = alertVariants({\n color,\n variant,\n sizeLimit,\n });\n const isHeroUIColor = Object.keys(heroAlertVariants.variants.color).includes(\n color,\n );\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <HeroAlert\n classNames={classNames}\n color={isHeroUIColor ? (color as HeroAlertProps['color']) : undefined}\n data-testid={testId}\n description={title ? children : undefined}\n endContent={endContent}\n hideIcon={!showIcon}\n icon={icon}\n isClosable={isClosable}\n onClose={onClose}\n title={(title || children) as string}\n variant={variant}\n />\n );\n};\n\nexport default Alert;\n","import Alert, { alertVariants } from './Alert';\n\nexport type { AlertProps } from './Alert';\n\nexport { Alert, alertVariants };\n\nexport default Alert;\n"]}
|
package/dist/index.cjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkAJCAIA6Hcjs = require('./chunk-AJCAIA6H.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
@@ -36,14 +36,14 @@ var _chunkZASS525Kcjs = require('./chunk-ZASS525K.cjs');
|
|
|
36
36
|
var _chunk2XYKRMUNcjs = require('./chunk-2XYKRMUN.cjs');
|
|
37
37
|
|
|
38
38
|
|
|
39
|
-
var
|
|
39
|
+
var _chunkXHOAZB2Zcjs = require('./chunk-XHOAZB2Z.cjs');
|
|
40
40
|
|
|
41
41
|
|
|
42
42
|
|
|
43
43
|
var _chunkPEUUQMJScjs = require('./chunk-PEUUQMJS.cjs');
|
|
44
44
|
|
|
45
45
|
|
|
46
|
-
var
|
|
46
|
+
var _chunkEAX5J2I2cjs = require('./chunk-EAX5J2I2.cjs');
|
|
47
47
|
require('./chunk-TX2VP4J7.cjs');
|
|
48
48
|
|
|
49
49
|
|
|
@@ -52,7 +52,7 @@ var _chunk2P5WWVQ6cjs = require('./chunk-2P5WWVQ6.cjs');
|
|
|
52
52
|
|
|
53
53
|
|
|
54
54
|
|
|
55
|
-
var
|
|
55
|
+
var _chunkYVPRFCWIcjs = require('./chunk-YVPRFCWI.cjs');
|
|
56
56
|
|
|
57
57
|
|
|
58
58
|
var _chunkLIZGYO24cjs = require('./chunk-LIZGYO24.cjs');
|
|
@@ -70,10 +70,169 @@ var _chunkZZOEFQWQcjs = require('./chunk-ZZOEFQWQ.cjs');
|
|
|
70
70
|
|
|
71
71
|
|
|
72
72
|
var _chunk4X43AGXEcjs = require('./chunk-4X43AGXE.cjs');
|
|
73
|
-
require('./chunk-D4TLDLEX.cjs');
|
|
74
73
|
|
|
75
74
|
|
|
76
75
|
|
|
76
|
+
var _chunkD4TLDLEXcjs = require('./chunk-D4TLDLEX.cjs');
|
|
77
|
+
|
|
78
|
+
// src/Toast/addToast.tsx
|
|
79
|
+
var _theme = require('@heroui/theme');
|
|
80
|
+
var _toast = require('@heroui/toast');
|
|
81
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
82
|
+
var toastVariants = _pixelutils.tv.call(void 0, {
|
|
83
|
+
slots: {
|
|
84
|
+
base: "",
|
|
85
|
+
title: "",
|
|
86
|
+
description: "",
|
|
87
|
+
icon: "",
|
|
88
|
+
loadingIcon: "",
|
|
89
|
+
content: "",
|
|
90
|
+
motionDiv: "",
|
|
91
|
+
progressTrack: "",
|
|
92
|
+
progressIndicator: "",
|
|
93
|
+
closeButton: "",
|
|
94
|
+
closeIcon: ""
|
|
95
|
+
},
|
|
96
|
+
variants: {
|
|
97
|
+
// see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/toast.ts
|
|
98
|
+
color: _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {
|
|
99
|
+
info: {}
|
|
100
|
+
}, _theme.toast.variants.color),
|
|
101
|
+
variant: _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {}, _theme.toast.variants.variant)
|
|
102
|
+
},
|
|
103
|
+
compoundVariants: [
|
|
104
|
+
..._theme.toast.compoundVariants,
|
|
105
|
+
{
|
|
106
|
+
variant: "solid",
|
|
107
|
+
color: "info",
|
|
108
|
+
className: {
|
|
109
|
+
base: "bg-info text-info-foreground",
|
|
110
|
+
title: "text-info-foreground",
|
|
111
|
+
description: "text-info-foreground",
|
|
112
|
+
icon: "text-info-foreground",
|
|
113
|
+
closeIcon: "border-info-400 bg-info-100",
|
|
114
|
+
closeButton: "text-info-400 hover:text-info-600",
|
|
115
|
+
progressIndicator: "bg-info-400"
|
|
116
|
+
}
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
color: "info",
|
|
120
|
+
variant: "flat",
|
|
121
|
+
className: {
|
|
122
|
+
base: "dark:bg-info-50/50 bg-info-50 text-info-600",
|
|
123
|
+
title: "text-info-600",
|
|
124
|
+
description: "text-info-500",
|
|
125
|
+
icon: "text-info-600",
|
|
126
|
+
closeIcon: "border-info-400 bg-info-100",
|
|
127
|
+
closeButton: "text-info-400 hover:text-info-600",
|
|
128
|
+
progressIndicator: "bg-info-400"
|
|
129
|
+
}
|
|
130
|
+
},
|
|
131
|
+
{
|
|
132
|
+
color: "info",
|
|
133
|
+
variant: "bordered",
|
|
134
|
+
className: {
|
|
135
|
+
base: "border-small border-info text-info-600",
|
|
136
|
+
title: "text-info-600",
|
|
137
|
+
description: "text-info-500",
|
|
138
|
+
icon: "text-info-600",
|
|
139
|
+
closeIcon: "border-info-400 bg-info-100",
|
|
140
|
+
closeButton: "text-info-400 hover:text-info-600",
|
|
141
|
+
progressIndicator: "bg-info-400"
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
]
|
|
145
|
+
});
|
|
146
|
+
var addToast = ({
|
|
147
|
+
children = void 0,
|
|
148
|
+
className = void 0,
|
|
149
|
+
closeIcon = void 0,
|
|
150
|
+
color = "default",
|
|
151
|
+
description = void 0,
|
|
152
|
+
endContent = void 0,
|
|
153
|
+
icon = void 0,
|
|
154
|
+
loadingIcon = void 0,
|
|
155
|
+
onClose = void 0,
|
|
156
|
+
// severity = 'default',
|
|
157
|
+
shouldShowTimeoutProgress = false,
|
|
158
|
+
showCloseButton = true,
|
|
159
|
+
showIcon = true,
|
|
160
|
+
// testId = undefined,
|
|
161
|
+
timeout = 5e3,
|
|
162
|
+
title = void 0,
|
|
163
|
+
variant = "bordered"
|
|
164
|
+
}) => {
|
|
165
|
+
const variants = toastVariants({
|
|
166
|
+
color,
|
|
167
|
+
variant
|
|
168
|
+
});
|
|
169
|
+
const isHeroUIColor = Object.keys(_theme.toast.variants.color).includes(
|
|
170
|
+
color
|
|
171
|
+
);
|
|
172
|
+
const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
|
|
173
|
+
_toast.addToast.call(void 0, {
|
|
174
|
+
classNames,
|
|
175
|
+
closeIcon,
|
|
176
|
+
color: isHeroUIColor ? color : void 0,
|
|
177
|
+
// 'data-testid': testId,
|
|
178
|
+
// https://github.com/heroui-inc/heroui/issues/5033
|
|
179
|
+
// @ts-expect-error bug in hero-toast: description should be ReactNode
|
|
180
|
+
description: description || title ? children : void 0,
|
|
181
|
+
endContent,
|
|
182
|
+
hideCloseButton: !showCloseButton,
|
|
183
|
+
hideIcon: !showIcon,
|
|
184
|
+
icon,
|
|
185
|
+
loadingIcon,
|
|
186
|
+
onClose,
|
|
187
|
+
// severity={severity}
|
|
188
|
+
shouldShowTimeoutProgress,
|
|
189
|
+
timeout,
|
|
190
|
+
title: title || children,
|
|
191
|
+
variant
|
|
192
|
+
});
|
|
193
|
+
};
|
|
194
|
+
|
|
195
|
+
// src/Toast/ToastProvider.tsx
|
|
196
|
+
|
|
197
|
+
|
|
198
|
+
|
|
199
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
200
|
+
var ToastProvider = ({
|
|
201
|
+
disableAnimation = false,
|
|
202
|
+
maxVisibleToasts = 5,
|
|
203
|
+
placement = "top-center",
|
|
204
|
+
toastProps = void 0,
|
|
205
|
+
toastOffset = 0,
|
|
206
|
+
regionProps = void 0
|
|
207
|
+
}) => {
|
|
208
|
+
const variants = toastVariants({
|
|
209
|
+
color: toastProps == null ? void 0 : toastProps.color,
|
|
210
|
+
variant: toastProps == null ? void 0 : toastProps.variant
|
|
211
|
+
});
|
|
212
|
+
const isHeroUIColor = Object.keys(_theme.toast.variants.color).includes(
|
|
213
|
+
(toastProps == null ? void 0 : toastProps.color) || ""
|
|
214
|
+
);
|
|
215
|
+
const classNames = _pixelutils.variantsToClassNames.call(void 0,
|
|
216
|
+
variants,
|
|
217
|
+
toastProps == null ? void 0 : toastProps.className,
|
|
218
|
+
"base"
|
|
219
|
+
);
|
|
220
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
221
|
+
_toast.ToastProvider,
|
|
222
|
+
{
|
|
223
|
+
disableAnimation,
|
|
224
|
+
maxVisibleToasts,
|
|
225
|
+
placement,
|
|
226
|
+
regionProps,
|
|
227
|
+
toastOffset,
|
|
228
|
+
toastProps: _chunkD4TLDLEXcjs.__spreadProps.call(void 0, _chunkD4TLDLEXcjs.__spreadValues.call(void 0, {}, toastProps), {
|
|
229
|
+
classNames,
|
|
230
|
+
color: isHeroUIColor ? toastProps == null ? void 0 : toastProps.color : void 0
|
|
231
|
+
})
|
|
232
|
+
}
|
|
233
|
+
);
|
|
234
|
+
};
|
|
235
|
+
var ToastProvider_default = ToastProvider;
|
|
77
236
|
|
|
78
237
|
|
|
79
238
|
|
|
@@ -105,5 +264,11 @@ require('./chunk-D4TLDLEX.cjs');
|
|
|
105
264
|
|
|
106
265
|
|
|
107
266
|
|
|
108
|
-
|
|
267
|
+
|
|
268
|
+
|
|
269
|
+
|
|
270
|
+
|
|
271
|
+
|
|
272
|
+
|
|
273
|
+
exports.Accordion = _chunk2P5WWVQ6cjs.Accordion_default; exports.Alert = _chunkYVPRFCWIcjs.Alert_default; exports.Avatar = _chunk77J7NZYBcjs.Avatar_default; exports.AvatarGroup = _chunkLIZGYO24cjs.AvatarGroup_default; exports.Badge = _chunkJSANDW3Wcjs.Badge_default; exports.Breadcrumb = _chunkZZOEFQWQcjs.Breadcrumb_default; exports.Button = _chunk4X43AGXEcjs.Button_default; exports.ButtonGroup = _chunkY3RSI2KVcjs.ButtonGroup_default; exports.Card = _chunkMHZAWSFJcjs.Card_default; exports.Drawer = _chunk7RVUB6I5cjs.Drawer_default; exports.Json = _chunkZASS525Kcjs.Json_default; exports.Label = _chunk2XYKRMUNcjs.Label_default; exports.Menu = _chunkXHOAZB2Zcjs.Menu_default; exports.Modal = _chunkPEUUQMJScjs.Modal_default; exports.Popover = _chunkEAX5J2I2cjs.Popover_default; exports.Table = _chunkAJCAIA6Hcjs.Table_default; exports.Tabs = _chunkJUHSESWBcjs.Tabs_default; exports.ToastProvider = ToastProvider_default; exports.Tooltip = _chunk25AJSW5Ecjs.Tooltip_default; exports.accordionVariants = _chunk2P5WWVQ6cjs.accordionVariants; exports.addToast = addToast; exports.alertVariants = _chunkYVPRFCWIcjs.alertVariants; exports.breadcrumbVariants = _chunkZZOEFQWQcjs.breadcrumbVariants; exports.buttonVariants = _chunk4X43AGXEcjs.buttonVariants; exports.cardVariants = _chunkMHZAWSFJcjs.cardVariants; exports.drawerBackdrops = _chunk7RVUB6I5cjs.drawerBackdrops; exports.drawerPlacements = _chunk7RVUB6I5cjs.drawerPlacements; exports.drawerRadii = _chunk7RVUB6I5cjs.drawerRadii; exports.drawerSizes = _chunk7RVUB6I5cjs.drawerSizes; exports.drawerVariants = _chunk7RVUB6I5cjs.drawerVariants; exports.modalVariants = _chunkPEUUQMJScjs.modalVariants; exports.tableVariants = _chunkAJCAIA6Hcjs.tableVariants; exports.tabsVariants = _chunkJUHSESWBcjs.tabsVariants; exports.toastVariants = toastVariants; exports.useDebounce = _chunkMWNBYTRNcjs.useDebounce; exports.useLocalStorage = _chunkMWNBYTRNcjs.useLocalStorage;
|
|
109
274
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/index.cjs"],"names":[],"mappings":"AAAA;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACA;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B,gCAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B,gCAA6B;AAC7B;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACF,4wDAAC","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/index.cjs"}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/index.cjs","../src/Toast/addToast.tsx","../src/Toast/ToastProvider.tsx"],"names":["heroToastVariants","variantsToClassNames"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/index.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ToastProps as HeroToastProps } from '@heroui/toast';\nimport type { ReactNode } from 'react';\n\nimport { toast as heroToastVariants } from '@heroui/theme';\nimport { addToast as heroAddToast } from '@heroui/toast';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const toastVariants = tv({\n slots: {\n base: '',\n title: '',\n description: '',\n icon: '',\n loadingIcon: '',\n content: '',\n motionDiv: '',\n progressTrack: '',\n progressIndicator: '',\n closeButton: '',\n closeIcon: '',\n },\n variants: {\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/toast.ts\n color: {\n info: {},\n ...heroToastVariants.variants.color,\n },\n variant: {\n ...heroToastVariants.variants.variant,\n },\n },\n compoundVariants: [\n ...heroToastVariants.compoundVariants,\n {\n variant: 'solid',\n color: 'info',\n className: {\n base: 'bg-info text-info-foreground',\n title: 'text-info-foreground',\n description: 'text-info-foreground',\n icon: 'text-info-foreground',\n closeIcon: 'border-info-400 bg-info-100',\n closeButton: 'text-info-400 hover:text-info-600',\n progressIndicator: 'bg-info-400',\n },\n },\n {\n color: 'info',\n variant: 'flat',\n className: {\n base: 'dark:bg-info-50/50 bg-info-50 text-info-600',\n title: 'text-info-600',\n description: 'text-info-500',\n icon: 'text-info-600',\n closeIcon: 'border-info-400 bg-info-100',\n closeButton: 'text-info-400 hover:text-info-600',\n progressIndicator: 'bg-info-400',\n },\n },\n\n {\n color: 'info',\n variant: 'bordered',\n className: {\n base: 'border-small border-info text-info-600',\n title: 'text-info-600',\n description: 'text-info-500',\n icon: 'text-info-600',\n closeIcon: 'border-info-400 bg-info-100',\n closeButton: 'text-info-400 hover:text-info-600',\n progressIndicator: 'bg-info-400',\n },\n },\n ],\n});\n\nexport type AddToastVariantProps = TVProps<typeof toastVariants>;\ntype ClassName = TVClassName<typeof toastVariants>;\n\nexport interface ToastProps extends AddToastVariantProps {\n children?: ReactNode;\n className?: ClassName;\n closeIcon?: ReactNode;\n color?: AddToastVariantProps['color'];\n description?: ReactNode;\n endContent?: ReactNode;\n icon?: ReactNode;\n loadingIcon?: ReactNode;\n onClose?: () => void;\n // severity?:\n // | 'default'\n // | 'primary'\n // | 'secondary'\n // | 'success'\n // | 'warning'\n // | 'danger';\n shouldShowTimeoutProgress?: boolean;\n showCloseButton?: boolean;\n showIcon?: boolean;\n // testId?: string;\n timeout?: number;\n title?: ReactNode;\n variant?: AddToastVariantProps['variant'];\n}\n\n/**\n * addToast function based on [HeroUI Toast](https://www.heroui.com//docs/components/toast)\n */\nexport const addToast = ({\n children = undefined,\n className = undefined,\n closeIcon = undefined,\n color = 'default',\n description = undefined,\n endContent = undefined,\n icon = undefined,\n loadingIcon = undefined,\n onClose = undefined,\n // severity = 'default',\n shouldShowTimeoutProgress = false,\n showCloseButton = true,\n showIcon = true,\n // testId = undefined,\n timeout = 5000,\n title = undefined,\n variant = 'bordered',\n}: ToastProps) => {\n const variants = toastVariants({\n color,\n variant,\n });\n const isHeroUIColor = Object.keys(heroToastVariants.variants.color).includes(\n color,\n );\n const classNames = variantsToClassNames(variants, className, 'base');\n heroAddToast({\n classNames,\n closeIcon,\n color: isHeroUIColor ? (color as HeroToastProps['color']) : undefined,\n // 'data-testid': testId,\n // https://github.com/heroui-inc/heroui/issues/5033\n // @ts-expect-error bug in hero-toast: description should be ReactNode\n description: description || title ? children : undefined,\n endContent,\n hideCloseButton: !showCloseButton,\n hideIcon: !showIcon,\n icon,\n loadingIcon,\n onClose,\n // severity={severity}\n shouldShowTimeoutProgress,\n timeout,\n title: (title || children) as string,\n variant,\n });\n};\n\nexport default addToast;\n","import type { ToastProps as HeroToastProps } from '@heroui/toast';\nimport type { ToastProps } from './addToast';\n\nimport { toast as heroToastVariants } from '@heroui/theme';\nimport { ToastProvider as HeroToastProvider } from '@heroui/toast';\n\nimport { variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { toastVariants } from './addToast';\n\nexport type ToastProviderToastProps = Omit<\n ToastProps,\n 'description' | 'endContent' | 'title'\n>;\n\nexport interface ToastProviderProps {\n disableAnimation?: boolean;\n maxVisibleToasts?: number;\n placement?:\n | 'bottom-right'\n | 'bottom-left'\n | 'bottom-center'\n | 'top-right'\n | 'top-left'\n | 'top-center';\n\n toastProps?: ToastProviderToastProps;\n toastOffset?: number;\n regionProps?: { classNames?: Record<'base', string> };\n}\n\n/**\n * ToastProvider component based on [HeroUI Toast](https://www.heroui.com//docs/components/toast)\n */\nconst ToastProvider = ({\n disableAnimation = false,\n maxVisibleToasts = 5,\n placement = 'top-center',\n toastProps = undefined,\n toastOffset = 0,\n regionProps = undefined,\n}: ToastProviderProps) => {\n const variants = toastVariants({\n color: toastProps?.color,\n variant: toastProps?.variant,\n });\n const isHeroUIColor = Object.keys(heroToastVariants.variants.color).includes(\n toastProps?.color || '',\n );\n const classNames = variantsToClassNames(\n variants,\n toastProps?.className,\n 'base',\n );\n return (\n <HeroToastProvider\n disableAnimation={disableAnimation}\n maxVisibleToasts={maxVisibleToasts}\n placement={placement}\n regionProps={regionProps}\n toastOffset={toastOffset}\n toastProps={{\n ...toastProps,\n classNames,\n color: isHeroUIColor\n ? (toastProps?.color as HeroToastProps['color'])\n : undefined,\n }}\n />\n );\n};\n\nexport default ToastProvider;\n"]}
|