@fuf-stack/pixels 1.10.2 → 1.11.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.
- package/dist/Alert/Alert.cjs +18 -6
- package/dist/Alert/Alert.cjs.map +1 -1
- package/dist/Alert/Alert.d.cts +12 -0
- package/dist/Alert/Alert.d.cts.map +1 -1
- package/dist/Alert/Alert.d.ts +12 -0
- package/dist/Alert/Alert.d.ts.map +1 -1
- package/dist/Alert/Alert.js +18 -6
- package/dist/Alert/Alert.js.map +1 -1
- package/dist/Avatar/Avatar.d.cts +6 -6
- package/dist/Avatar/Avatar.d.ts +6 -6
- package/dist/Breadcrumb/Breadcrumb.d.cts +3 -3
- package/dist/Breadcrumb/Breadcrumb.d.ts +3 -3
- package/dist/Drawer/Drawer.d.cts +6 -6
- package/dist/Drawer/Drawer.d.ts +6 -6
- package/dist/Menu/Menu.d.cts +3 -3
- package/dist/Menu/Menu.d.ts +3 -3
- package/dist/Modal/Modal.cjs +1 -1
- package/dist/Modal/Modal.cjs.map +1 -1
- package/dist/Modal/Modal.d.cts +5 -1
- package/dist/Modal/Modal.d.cts.map +1 -1
- package/dist/Modal/Modal.d.ts +5 -1
- package/dist/Modal/Modal.d.ts.map +1 -1
- package/dist/Modal/Modal.js +2 -2
- package/dist/Modal/Modal.js.map +1 -1
- package/dist/Modal/ModalHost.cjs +40 -0
- package/dist/Modal/ModalHost.cjs.map +1 -0
- package/dist/Modal/ModalHost.d.cts +16 -0
- package/dist/Modal/ModalHost.d.cts.map +1 -0
- package/dist/Modal/ModalHost.d.ts +16 -0
- package/dist/Modal/ModalHost.d.ts.map +1 -0
- package/dist/Modal/ModalHost.js +39 -0
- package/dist/Modal/ModalHost.js.map +1 -0
- package/dist/Modal/index.cjs +4 -0
- package/dist/Modal/index.cjs.map +1 -1
- package/dist/Modal/index.d.cts +3 -1
- package/dist/Modal/index.d.ts +3 -1
- package/dist/Modal/index.js +3 -1
- package/dist/Modal/index.js.map +1 -1
- package/dist/Modal/modalStore.cjs +80 -0
- package/dist/Modal/modalStore.cjs.map +1 -0
- package/dist/Modal/modalStore.d.cts +31 -0
- package/dist/Modal/modalStore.d.cts.map +1 -0
- package/dist/Modal/modalStore.d.ts +31 -0
- package/dist/Modal/modalStore.d.ts.map +1 -0
- package/dist/Modal/modalStore.js +78 -0
- package/dist/Modal/modalStore.js.map +1 -0
- package/dist/Popover/Popover.d.cts +3 -3
- package/dist/Popover/Popover.d.ts +3 -3
- package/dist/SearchInput/SearchInput.d.cts +3 -3
- package/dist/SearchInput/SearchInput.d.ts +3 -3
- package/dist/Toast/Toaster.cjs +10 -2
- package/dist/Toast/Toaster.cjs.map +1 -1
- package/dist/Toast/Toaster.d.cts +5 -2
- package/dist/Toast/Toaster.d.cts.map +1 -1
- package/dist/Toast/Toaster.d.ts +5 -2
- package/dist/Toast/Toaster.d.ts.map +1 -1
- package/dist/Toast/Toaster.js +10 -2
- package/dist/Toast/Toaster.js.map +1 -1
- package/dist/Toast/index.cjs +3 -3
- package/dist/Toast/index.cjs.map +1 -1
- package/dist/Toast/index.d.cts +1 -1
- package/dist/Toast/index.d.ts +1 -1
- package/dist/Toast/index.js +1 -1
- package/dist/Toast/index.js.map +1 -1
- package/dist/Toast/{Toast.cjs → toast.cjs} +2 -2
- package/dist/Toast/{Toast.cjs.map → toast.cjs.map} +1 -1
- package/dist/Toast/{Toast.d.cts → toast.d.cts} +2 -2
- package/dist/Toast/{Toast.d.cts.map → toast.d.cts.map} +1 -1
- package/dist/Toast/{Toast.d.ts → toast.d.ts} +2 -2
- package/dist/Toast/{Toast.d.ts.map → toast.d.ts.map} +1 -1
- package/dist/Toast/{Toast.js → toast.js} +2 -2
- package/dist/Toast/{Toast.js.map → toast.js.map} +1 -1
- package/dist/index.cjs +6 -2
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +4 -2
- package/package.json +2 -2
package/dist/Alert/Alert.cjs
CHANGED
|
@@ -9,7 +9,7 @@ const alertVariants = (0, _fuf_stack_pixel_utils.tv)({
|
|
|
9
9
|
base: "min-w-72",
|
|
10
10
|
title: "",
|
|
11
11
|
description: "",
|
|
12
|
-
mainWrapper: "gap-1.5",
|
|
12
|
+
mainWrapper: "items-stretch gap-1.5",
|
|
13
13
|
closeButton: "",
|
|
14
14
|
iconWrapper: "",
|
|
15
15
|
alertIcon: ""
|
|
@@ -17,19 +17,31 @@ const alertVariants = (0, _fuf_stack_pixel_utils.tv)({
|
|
|
17
17
|
variants: {
|
|
18
18
|
hasTitleAndChildren: { true: { iconWrapper: "self-start" } },
|
|
19
19
|
variant: {
|
|
20
|
-
danger: {
|
|
21
|
-
|
|
20
|
+
danger: {
|
|
21
|
+
base: "bg-danger-50 dark:bg-danger-50",
|
|
22
|
+
description: "text-foreground"
|
|
23
|
+
},
|
|
24
|
+
default: {
|
|
25
|
+
base: "bg-default-100 dark:bg-default-50",
|
|
26
|
+
description: "text-foreground"
|
|
27
|
+
},
|
|
22
28
|
info: {
|
|
23
29
|
alertIcon: "fill-current",
|
|
24
30
|
base: "border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100 dark:bg-info-50",
|
|
25
31
|
closeButton: "text-info-500 data-[hover]:bg-info-200",
|
|
26
|
-
description: "text-
|
|
32
|
+
description: "text-foreground",
|
|
27
33
|
iconWrapper: "border-info-100 bg-info-50 dark:bg-info-100",
|
|
28
34
|
mainWrapper: "text-inherit",
|
|
29
35
|
title: "text-inherit"
|
|
30
36
|
},
|
|
31
|
-
success: {
|
|
32
|
-
|
|
37
|
+
success: {
|
|
38
|
+
base: "bg-success-50 dark:bg-success-50",
|
|
39
|
+
description: "text-foreground"
|
|
40
|
+
},
|
|
41
|
+
warning: {
|
|
42
|
+
base: "bg-warning-50 dark:bg-warning-50",
|
|
43
|
+
description: "text-foreground"
|
|
44
|
+
}
|
|
33
45
|
}
|
|
34
46
|
}
|
|
35
47
|
});
|
package/dist/Alert/Alert.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.cjs","names":["HeroAlert","heroAlertVariants"],"sources":["../../src/Alert/Alert.tsx"],"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: 'min-w-72',\n title: '',\n description: '',\n mainWrapper: 'gap-1.5',\n closeButton: '',\n iconWrapper: '',\n alertIcon: '',\n },\n variants: {\n // if HeroUI Alert title and description are set the icon is placed on top (looks better)\n hasTitleAndChildren: {\n true: {\n iconWrapper: 'self-start',\n },\n },\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/alert.ts\n variant: {\n danger: {\n base: 'bg-danger-50 dark:bg-danger-50',\n },\n default: {\n base: 'bg-default-100 dark:bg-default-50',\n },\n info: {\n alertIcon: 'fill-current',\n base: 'border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100 dark:bg-info-50',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n description: 'text-
|
|
1
|
+
{"version":3,"file":"Alert.cjs","names":["HeroAlert","heroAlertVariants"],"sources":["../../src/Alert/Alert.tsx"],"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: 'min-w-72',\n title: '',\n description: '',\n mainWrapper: 'items-stretch gap-1.5',\n closeButton: '',\n iconWrapper: '',\n alertIcon: '',\n },\n variants: {\n // if HeroUI Alert title and description are set the icon is placed on top (looks better)\n hasTitleAndChildren: {\n true: {\n iconWrapper: 'self-start',\n },\n },\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/alert.ts\n variant: {\n danger: {\n base: 'bg-danger-50 dark:bg-danger-50',\n description: 'text-foreground',\n },\n default: {\n base: 'bg-default-100 dark:bg-default-50',\n description: 'text-foreground',\n },\n info: {\n alertIcon: 'fill-current',\n base: 'border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100 dark:bg-info-50',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n description: 'text-foreground',\n iconWrapper: 'border-info-100 bg-info-50 dark:bg-info-100',\n mainWrapper: 'text-inherit',\n title: 'text-inherit',\n },\n success: {\n base: 'bg-success-50 dark:bg-success-50',\n description: 'text-foreground',\n },\n warning: {\n base: 'bg-warning-50 dark:bg-warning-50',\n description: 'text-foreground',\n },\n },\n },\n});\n\nexport type VariantProps = TVProps<typeof alertVariants>;\ntype ClassName = TVClassName<typeof alertVariants>;\n\n// hasTitleAndChildren is omitted because its used for automatic icon position\nexport interface AlertProps extends Omit<VariantProps, 'hasTitleAndChildren'> {\n /** Content displayed inside the Alert if no description is given! */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\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 closable?: boolean;\n /** Callback fired when the close button is clicked */\n onClose?: () => void;\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 endContent = undefined,\n icon = undefined,\n closable = false,\n onClose = undefined,\n testId = undefined,\n title = undefined,\n variant = 'info',\n}: AlertProps) => {\n const hasTitleAndChildren = !!children && !!title;\n const variants = alertVariants({\n hasTitleAndChildren,\n variant,\n });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // map variant to HeroUI color prop (only for variants that exist in HeroUI)\n const heroColor = Object.keys(heroAlertVariants.variants.color).includes(\n variant,\n )\n ? (variant as HeroAlertProps['color'])\n : undefined;\n\n return (\n <HeroAlert\n classNames={classNames}\n color={heroColor}\n data-testid={testId}\n description={title ? children : undefined}\n endContent={endContent}\n hideIcon={variant === 'default'}\n icon={icon}\n // map closable to isClosable, because of we do not want \"is\" as prefix\n isClosable={closable}\n onClose={onClose}\n title={(title ?? children) as string}\n variant=\"faded\"\n />\n );\n};\n\nexport default Alert;\n"],"mappings":";;;;;;AASA,MAAa,iBAAA,GAAA,uBAAA,IAAmB;CAC9B,OAAO;EACL,MAAM;EACN,OAAO;EACP,aAAa;EACb,aAAa;EACb,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,UAAU;EAER,qBAAqB,EACnB,MAAM,EACJ,aAAa,aACf,EACF;EAEA,SAAS;GACP,QAAQ;IACN,MAAM;IACN,aAAa;GACf;GACA,SAAS;IACP,MAAM;IACN,aAAa;GACf;GACA,MAAM;IACJ,WAAW;IACX,MAAM;IACN,aAAa;IACb,aAAa;IACb,aAAa;IACb,aAAa;IACb,OAAO;GACT;GACA,SAAS;IACP,MAAM;IACN,aAAa;GACf;GACA,SAAS;IACP,MAAM;IACN,aAAa;GACf;EACF;CACF;AACF,CAAC;;;;AA8BD,MAAM,SAAS,EACb,WAAW,KAAA,GACX,YAAY,KAAA,GACZ,aAAa,KAAA,GACb,OAAO,KAAA,GACP,WAAW,OACX,UAAU,KAAA,GACV,SAAS,KAAA,GACT,QAAQ,KAAA,GACR,UAAU,aACM;CAehB,OACE,iBAAA,GAAA,kBAAA,KAACA,cAAAA,OAAD;EACE,aAAA,GAAA,uBAAA,sBAfa,cAAc;GAC7B,qBAF0B,CAAC,CAAC,YAAY,CAAC,CAAC;GAG1C;EACF,CAC+C,GAAG,WAAW,MAWpC;EACrB,OATc,OAAO,KAAKC,cAAAA,MAAkB,SAAS,KAAK,EAAE,SAC9D,OACF,IACK,UACD,KAAA;EAMA,eAAa;EACb,aAAa,QAAQ,WAAW,KAAA;EACpB;EACZ,UAAU,YAAY;EAChB;EAEN,YAAY;EACH;EACT,OAAQ,SAAS;EACjB,SAAQ;CACT,CAAA;AAEL"}
|
package/dist/Alert/Alert.d.cts
CHANGED
|
@@ -11,9 +11,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
11
11
|
variant: {
|
|
12
12
|
danger: {
|
|
13
13
|
base: string;
|
|
14
|
+
description: string;
|
|
14
15
|
};
|
|
15
16
|
default: {
|
|
16
17
|
base: string;
|
|
18
|
+
description: string;
|
|
17
19
|
};
|
|
18
20
|
info: {
|
|
19
21
|
alertIcon: string;
|
|
@@ -26,9 +28,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
26
28
|
};
|
|
27
29
|
success: {
|
|
28
30
|
base: string;
|
|
31
|
+
description: string;
|
|
29
32
|
};
|
|
30
33
|
warning: {
|
|
31
34
|
base: string;
|
|
35
|
+
description: string;
|
|
32
36
|
};
|
|
33
37
|
};
|
|
34
38
|
}, {
|
|
@@ -48,9 +52,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
48
52
|
variant: {
|
|
49
53
|
danger: {
|
|
50
54
|
base: string;
|
|
55
|
+
description: string;
|
|
51
56
|
};
|
|
52
57
|
default: {
|
|
53
58
|
base: string;
|
|
59
|
+
description: string;
|
|
54
60
|
};
|
|
55
61
|
info: {
|
|
56
62
|
alertIcon: string;
|
|
@@ -63,9 +69,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
63
69
|
};
|
|
64
70
|
success: {
|
|
65
71
|
base: string;
|
|
72
|
+
description: string;
|
|
66
73
|
};
|
|
67
74
|
warning: {
|
|
68
75
|
base: string;
|
|
76
|
+
description: string;
|
|
69
77
|
};
|
|
70
78
|
};
|
|
71
79
|
}, {
|
|
@@ -85,9 +93,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
85
93
|
variant: {
|
|
86
94
|
danger: {
|
|
87
95
|
base: string;
|
|
96
|
+
description: string;
|
|
88
97
|
};
|
|
89
98
|
default: {
|
|
90
99
|
base: string;
|
|
100
|
+
description: string;
|
|
91
101
|
};
|
|
92
102
|
info: {
|
|
93
103
|
alertIcon: string;
|
|
@@ -100,9 +110,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
100
110
|
};
|
|
101
111
|
success: {
|
|
102
112
|
base: string;
|
|
113
|
+
description: string;
|
|
103
114
|
};
|
|
104
115
|
warning: {
|
|
105
116
|
base: string;
|
|
117
|
+
description: string;
|
|
106
118
|
};
|
|
107
119
|
};
|
|
108
120
|
}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.d.cts","names":[],"sources":["../../src/Alert/Alert.tsx"],"mappings":";;;;cASa,aAAA,8BAAa,YAAA
|
|
1
|
+
{"version":3,"file":"Alert.d.cts","names":[],"sources":["../../src/Alert/Alert.tsx"],"mappings":";;;;cASa,aAAA,8BAAa,YAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAgDd,YAAA,GAAe,OAAO,QAAQ,aAAA;AAAA,KACrC,SAAA,GAAY,WAAW,QAAQ,aAAA;AAAA,UAGnB,UAAA,SAAmB,IAAA,CAAK,YAAA;EAAA;EAEvC,QAAA,GAAW,SAAA;EAAA;EAEX,SAAA,GAAY,SAAA;EAAA;EAEZ,UAAA,GAAa,SAAA;EAAA;EAEb,IAAA,GAAO,SAAA;EAAA;EAEP,QAAA;EAEA;EAAA,OAAA;EAIA;EAFA,MAAA;EAIA;EAFA,KAAA,GAAQ,SAAA;EAEc;EAAtB,OAAA,GAAU,YAAA;AAAA;;;;cAMN,KAAA;EAAS,QAAA;EAAA,SAAA;EAAA,UAAA;EAAA,IAAA;EAAA,QAAA;EAAA,OAAA;EAAA,MAAA;EAAA,KAAA;EAAA;AAAA,GAUZ,UAAA,iCAAU,GAAA,CAAA,OAAA"}
|
package/dist/Alert/Alert.d.ts
CHANGED
|
@@ -11,9 +11,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
11
11
|
variant: {
|
|
12
12
|
danger: {
|
|
13
13
|
base: string;
|
|
14
|
+
description: string;
|
|
14
15
|
};
|
|
15
16
|
default: {
|
|
16
17
|
base: string;
|
|
18
|
+
description: string;
|
|
17
19
|
};
|
|
18
20
|
info: {
|
|
19
21
|
alertIcon: string;
|
|
@@ -26,9 +28,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
26
28
|
};
|
|
27
29
|
success: {
|
|
28
30
|
base: string;
|
|
31
|
+
description: string;
|
|
29
32
|
};
|
|
30
33
|
warning: {
|
|
31
34
|
base: string;
|
|
35
|
+
description: string;
|
|
32
36
|
};
|
|
33
37
|
};
|
|
34
38
|
}, {
|
|
@@ -48,9 +52,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
48
52
|
variant: {
|
|
49
53
|
danger: {
|
|
50
54
|
base: string;
|
|
55
|
+
description: string;
|
|
51
56
|
};
|
|
52
57
|
default: {
|
|
53
58
|
base: string;
|
|
59
|
+
description: string;
|
|
54
60
|
};
|
|
55
61
|
info: {
|
|
56
62
|
alertIcon: string;
|
|
@@ -63,9 +69,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
63
69
|
};
|
|
64
70
|
success: {
|
|
65
71
|
base: string;
|
|
72
|
+
description: string;
|
|
66
73
|
};
|
|
67
74
|
warning: {
|
|
68
75
|
base: string;
|
|
76
|
+
description: string;
|
|
69
77
|
};
|
|
70
78
|
};
|
|
71
79
|
}, {
|
|
@@ -85,9 +93,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
85
93
|
variant: {
|
|
86
94
|
danger: {
|
|
87
95
|
base: string;
|
|
96
|
+
description: string;
|
|
88
97
|
};
|
|
89
98
|
default: {
|
|
90
99
|
base: string;
|
|
100
|
+
description: string;
|
|
91
101
|
};
|
|
92
102
|
info: {
|
|
93
103
|
alertIcon: string;
|
|
@@ -100,9 +110,11 @@ declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
|
100
110
|
};
|
|
101
111
|
success: {
|
|
102
112
|
base: string;
|
|
113
|
+
description: string;
|
|
103
114
|
};
|
|
104
115
|
warning: {
|
|
105
116
|
base: string;
|
|
117
|
+
description: string;
|
|
106
118
|
};
|
|
107
119
|
};
|
|
108
120
|
}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.d.ts","names":[],"sources":["../../src/Alert/Alert.tsx"],"mappings":";;;;cASa,aAAA,8BAAa,YAAA
|
|
1
|
+
{"version":3,"file":"Alert.d.ts","names":[],"sources":["../../src/Alert/Alert.tsx"],"mappings":";;;;cASa,aAAA,8BAAa,YAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAgDd,YAAA,GAAe,OAAO,QAAQ,aAAA;AAAA,KACrC,SAAA,GAAY,WAAW,QAAQ,aAAA;AAAA,UAGnB,UAAA,SAAmB,IAAA,CAAK,YAAA;EAAA;EAEvC,QAAA,GAAW,SAAA;EAAA;EAEX,SAAA,GAAY,SAAA;EAAA;EAEZ,UAAA,GAAa,SAAA;EAAA;EAEb,IAAA,GAAO,SAAA;EAAA;EAEP,QAAA;EAEA;EAAA,OAAA;EAIA;EAFA,MAAA;EAIA;EAFA,KAAA,GAAQ,SAAA;EAEc;EAAtB,OAAA,GAAU,YAAA;AAAA;;;;cAMN,KAAA;EAAS,QAAA;EAAA,SAAA;EAAA,UAAA;EAAA,IAAA;EAAA,QAAA;EAAA,OAAA;EAAA,MAAA;EAAA,KAAA;EAAA;AAAA,GAUZ,UAAA,iCAAU,GAAA,CAAA,OAAA"}
|
package/dist/Alert/Alert.js
CHANGED
|
@@ -8,7 +8,7 @@ const alertVariants = tv({
|
|
|
8
8
|
base: "min-w-72",
|
|
9
9
|
title: "",
|
|
10
10
|
description: "",
|
|
11
|
-
mainWrapper: "gap-1.5",
|
|
11
|
+
mainWrapper: "items-stretch gap-1.5",
|
|
12
12
|
closeButton: "",
|
|
13
13
|
iconWrapper: "",
|
|
14
14
|
alertIcon: ""
|
|
@@ -16,19 +16,31 @@ const alertVariants = tv({
|
|
|
16
16
|
variants: {
|
|
17
17
|
hasTitleAndChildren: { true: { iconWrapper: "self-start" } },
|
|
18
18
|
variant: {
|
|
19
|
-
danger: {
|
|
20
|
-
|
|
19
|
+
danger: {
|
|
20
|
+
base: "bg-danger-50 dark:bg-danger-50",
|
|
21
|
+
description: "text-foreground"
|
|
22
|
+
},
|
|
23
|
+
default: {
|
|
24
|
+
base: "bg-default-100 dark:bg-default-50",
|
|
25
|
+
description: "text-foreground"
|
|
26
|
+
},
|
|
21
27
|
info: {
|
|
22
28
|
alertIcon: "fill-current",
|
|
23
29
|
base: "border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100 dark:bg-info-50",
|
|
24
30
|
closeButton: "text-info-500 data-[hover]:bg-info-200",
|
|
25
|
-
description: "text-
|
|
31
|
+
description: "text-foreground",
|
|
26
32
|
iconWrapper: "border-info-100 bg-info-50 dark:bg-info-100",
|
|
27
33
|
mainWrapper: "text-inherit",
|
|
28
34
|
title: "text-inherit"
|
|
29
35
|
},
|
|
30
|
-
success: {
|
|
31
|
-
|
|
36
|
+
success: {
|
|
37
|
+
base: "bg-success-50 dark:bg-success-50",
|
|
38
|
+
description: "text-foreground"
|
|
39
|
+
},
|
|
40
|
+
warning: {
|
|
41
|
+
base: "bg-warning-50 dark:bg-warning-50",
|
|
42
|
+
description: "text-foreground"
|
|
43
|
+
}
|
|
32
44
|
}
|
|
33
45
|
}
|
|
34
46
|
});
|
package/dist/Alert/Alert.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.js","names":["Alert","HeroAlert","heroAlertVariants"],"sources":["../../src/Alert/Alert.tsx"],"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: 'min-w-72',\n title: '',\n description: '',\n mainWrapper: 'gap-1.5',\n closeButton: '',\n iconWrapper: '',\n alertIcon: '',\n },\n variants: {\n // if HeroUI Alert title and description are set the icon is placed on top (looks better)\n hasTitleAndChildren: {\n true: {\n iconWrapper: 'self-start',\n },\n },\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/alert.ts\n variant: {\n danger: {\n base: 'bg-danger-50 dark:bg-danger-50',\n },\n default: {\n base: 'bg-default-100 dark:bg-default-50',\n },\n info: {\n alertIcon: 'fill-current',\n base: 'border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100 dark:bg-info-50',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n description: 'text-
|
|
1
|
+
{"version":3,"file":"Alert.js","names":["Alert","HeroAlert","heroAlertVariants"],"sources":["../../src/Alert/Alert.tsx"],"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: 'min-w-72',\n title: '',\n description: '',\n mainWrapper: 'items-stretch gap-1.5',\n closeButton: '',\n iconWrapper: '',\n alertIcon: '',\n },\n variants: {\n // if HeroUI Alert title and description are set the icon is placed on top (looks better)\n hasTitleAndChildren: {\n true: {\n iconWrapper: 'self-start',\n },\n },\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/alert.ts\n variant: {\n danger: {\n base: 'bg-danger-50 dark:bg-danger-50',\n description: 'text-foreground',\n },\n default: {\n base: 'bg-default-100 dark:bg-default-50',\n description: 'text-foreground',\n },\n info: {\n alertIcon: 'fill-current',\n base: 'border-small border-info-200 bg-info-50 text-info-600 dark:border-info-100 dark:bg-info-50',\n closeButton: 'text-info-500 data-[hover]:bg-info-200',\n description: 'text-foreground',\n iconWrapper: 'border-info-100 bg-info-50 dark:bg-info-100',\n mainWrapper: 'text-inherit',\n title: 'text-inherit',\n },\n success: {\n base: 'bg-success-50 dark:bg-success-50',\n description: 'text-foreground',\n },\n warning: {\n base: 'bg-warning-50 dark:bg-warning-50',\n description: 'text-foreground',\n },\n },\n },\n});\n\nexport type VariantProps = TVProps<typeof alertVariants>;\ntype ClassName = TVClassName<typeof alertVariants>;\n\n// hasTitleAndChildren is omitted because its used for automatic icon position\nexport interface AlertProps extends Omit<VariantProps, 'hasTitleAndChildren'> {\n /** Content displayed inside the Alert if no description is given! */\n children?: ReactNode;\n /** CSS class name */\n className?: ClassName;\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 closable?: boolean;\n /** Callback fired when the close button is clicked */\n onClose?: () => void;\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 endContent = undefined,\n icon = undefined,\n closable = false,\n onClose = undefined,\n testId = undefined,\n title = undefined,\n variant = 'info',\n}: AlertProps) => {\n const hasTitleAndChildren = !!children && !!title;\n const variants = alertVariants({\n hasTitleAndChildren,\n variant,\n });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // map variant to HeroUI color prop (only for variants that exist in HeroUI)\n const heroColor = Object.keys(heroAlertVariants.variants.color).includes(\n variant,\n )\n ? (variant as HeroAlertProps['color'])\n : undefined;\n\n return (\n <HeroAlert\n classNames={classNames}\n color={heroColor}\n data-testid={testId}\n description={title ? children : undefined}\n endContent={endContent}\n hideIcon={variant === 'default'}\n icon={icon}\n // map closable to isClosable, because of we do not want \"is\" as prefix\n isClosable={closable}\n onClose={onClose}\n title={(title ?? children) as string}\n variant=\"faded\"\n />\n );\n};\n\nexport default Alert;\n"],"mappings":";;;;;AASA,MAAa,gBAAgB,GAAG;CAC9B,OAAO;EACL,MAAM;EACN,OAAO;EACP,aAAa;EACb,aAAa;EACb,aAAa;EACb,aAAa;EACb,WAAW;CACb;CACA,UAAU;EAER,qBAAqB,EACnB,MAAM,EACJ,aAAa,aACf,EACF;EAEA,SAAS;GACP,QAAQ;IACN,MAAM;IACN,aAAa;GACf;GACA,SAAS;IACP,MAAM;IACN,aAAa;GACf;GACA,MAAM;IACJ,WAAW;IACX,MAAM;IACN,aAAa;IACb,aAAa;IACb,aAAa;IACb,aAAa;IACb,OAAO;GACT;GACA,SAAS;IACP,MAAM;IACN,aAAa;GACf;GACA,SAAS;IACP,MAAM;IACN,aAAa;GACf;EACF;CACF;AACF,CAAC;;;;AA8BD,MAAMA,WAAS,EACb,WAAW,KAAA,GACX,YAAY,KAAA,GACZ,aAAa,KAAA,GACb,OAAO,KAAA,GACP,WAAW,OACX,UAAU,KAAA,GACV,SAAS,KAAA,GACT,QAAQ,KAAA,GACR,UAAU,aACM;CAehB,OACE,oBAACC,OAAD;EACE,YAXe,qBAJF,cAAc;GAC7B,qBAF0B,CAAC,CAAC,YAAY,CAAC,CAAC;GAG1C;EACF,CAC+C,GAAG,WAAW,MAWpC;EACrB,OATc,OAAO,KAAKC,MAAkB,SAAS,KAAK,EAAE,SAC9D,OACF,IACK,UACD,KAAA;EAMA,eAAa;EACb,aAAa,QAAQ,WAAW,KAAA;EACpB;EACZ,UAAU,YAAY;EAChB;EAEN,YAAY;EACH;EACT,OAAQ,SAAS;EACjB,SAAQ;CACT,CAAA;AAEL"}
|
package/dist/Avatar/Avatar.d.cts
CHANGED
|
@@ -6,9 +6,9 @@ declare const avatarVariants: import("tailwind-variants").TVReturnType<{
|
|
|
6
6
|
[key: string]: {
|
|
7
7
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
8
8
|
base?: import("tailwind-merge").ClassNameValue;
|
|
9
|
-
img?: import("tailwind-merge").ClassNameValue;
|
|
10
|
-
name?: import("tailwind-merge").ClassNameValue;
|
|
11
9
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
10
|
+
name?: import("tailwind-merge").ClassNameValue;
|
|
11
|
+
img?: import("tailwind-merge").ClassNameValue;
|
|
12
12
|
fallback?: import("tailwind-merge").ClassNameValue;
|
|
13
13
|
};
|
|
14
14
|
};
|
|
@@ -16,9 +16,9 @@ declare const avatarVariants: import("tailwind-variants").TVReturnType<{
|
|
|
16
16
|
[x: string]: {
|
|
17
17
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
18
18
|
base?: import("tailwind-merge").ClassNameValue;
|
|
19
|
-
img?: import("tailwind-merge").ClassNameValue;
|
|
20
|
-
name?: import("tailwind-merge").ClassNameValue;
|
|
21
19
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
20
|
+
name?: import("tailwind-merge").ClassNameValue;
|
|
21
|
+
img?: import("tailwind-merge").ClassNameValue;
|
|
22
22
|
fallback?: import("tailwind-merge").ClassNameValue;
|
|
23
23
|
};
|
|
24
24
|
};
|
|
@@ -32,9 +32,9 @@ declare const avatarVariants: import("tailwind-variants").TVReturnType<{
|
|
|
32
32
|
[key: string]: {
|
|
33
33
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
34
34
|
base?: import("tailwind-merge").ClassNameValue;
|
|
35
|
-
img?: import("tailwind-merge").ClassNameValue;
|
|
36
|
-
name?: import("tailwind-merge").ClassNameValue;
|
|
37
35
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
36
|
+
name?: import("tailwind-merge").ClassNameValue;
|
|
37
|
+
img?: import("tailwind-merge").ClassNameValue;
|
|
38
38
|
fallback?: import("tailwind-merge").ClassNameValue;
|
|
39
39
|
};
|
|
40
40
|
};
|
package/dist/Avatar/Avatar.d.ts
CHANGED
|
@@ -6,9 +6,9 @@ declare const avatarVariants: import("tailwind-variants").TVReturnType<{
|
|
|
6
6
|
[key: string]: {
|
|
7
7
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
8
8
|
base?: import("tailwind-merge").ClassNameValue;
|
|
9
|
-
img?: import("tailwind-merge").ClassNameValue;
|
|
10
|
-
name?: import("tailwind-merge").ClassNameValue;
|
|
11
9
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
10
|
+
name?: import("tailwind-merge").ClassNameValue;
|
|
11
|
+
img?: import("tailwind-merge").ClassNameValue;
|
|
12
12
|
fallback?: import("tailwind-merge").ClassNameValue;
|
|
13
13
|
};
|
|
14
14
|
};
|
|
@@ -16,9 +16,9 @@ declare const avatarVariants: import("tailwind-variants").TVReturnType<{
|
|
|
16
16
|
[x: string]: {
|
|
17
17
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
18
18
|
base?: import("tailwind-merge").ClassNameValue;
|
|
19
|
-
img?: import("tailwind-merge").ClassNameValue;
|
|
20
|
-
name?: import("tailwind-merge").ClassNameValue;
|
|
21
19
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
20
|
+
name?: import("tailwind-merge").ClassNameValue;
|
|
21
|
+
img?: import("tailwind-merge").ClassNameValue;
|
|
22
22
|
fallback?: import("tailwind-merge").ClassNameValue;
|
|
23
23
|
};
|
|
24
24
|
};
|
|
@@ -32,9 +32,9 @@ declare const avatarVariants: import("tailwind-variants").TVReturnType<{
|
|
|
32
32
|
[key: string]: {
|
|
33
33
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
34
34
|
base?: import("tailwind-merge").ClassNameValue;
|
|
35
|
-
img?: import("tailwind-merge").ClassNameValue;
|
|
36
|
-
name?: import("tailwind-merge").ClassNameValue;
|
|
37
35
|
icon?: import("tailwind-merge").ClassNameValue;
|
|
36
|
+
name?: import("tailwind-merge").ClassNameValue;
|
|
37
|
+
img?: import("tailwind-merge").ClassNameValue;
|
|
38
38
|
fallback?: import("tailwind-merge").ClassNameValue;
|
|
39
39
|
};
|
|
40
40
|
};
|
|
@@ -5,10 +5,10 @@ import { ReactNode } from "react";
|
|
|
5
5
|
declare const breadcrumbVariants: import("tailwind-variants").TVReturnType<{
|
|
6
6
|
[key: string]: {
|
|
7
7
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
8
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
9
8
|
nav?: import("tailwind-merge").ClassNameValue;
|
|
10
9
|
list?: import("tailwind-merge").ClassNameValue;
|
|
11
10
|
separator?: import("tailwind-merge").ClassNameValue;
|
|
11
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
12
12
|
ellipsis?: import("tailwind-merge").ClassNameValue;
|
|
13
13
|
itemBase?: import("tailwind-merge").ClassNameValue;
|
|
14
14
|
};
|
|
@@ -16,10 +16,10 @@ declare const breadcrumbVariants: import("tailwind-variants").TVReturnType<{
|
|
|
16
16
|
} | {
|
|
17
17
|
[x: string]: {
|
|
18
18
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
19
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
20
19
|
nav?: import("tailwind-merge").ClassNameValue;
|
|
21
20
|
list?: import("tailwind-merge").ClassNameValue;
|
|
22
21
|
separator?: import("tailwind-merge").ClassNameValue;
|
|
22
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
23
23
|
ellipsis?: import("tailwind-merge").ClassNameValue;
|
|
24
24
|
itemBase?: import("tailwind-merge").ClassNameValue;
|
|
25
25
|
};
|
|
@@ -34,10 +34,10 @@ declare const breadcrumbVariants: import("tailwind-variants").TVReturnType<{
|
|
|
34
34
|
}, undefined, {
|
|
35
35
|
[key: string]: {
|
|
36
36
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
37
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
38
37
|
nav?: import("tailwind-merge").ClassNameValue;
|
|
39
38
|
list?: import("tailwind-merge").ClassNameValue;
|
|
40
39
|
separator?: import("tailwind-merge").ClassNameValue;
|
|
40
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
41
41
|
ellipsis?: import("tailwind-merge").ClassNameValue;
|
|
42
42
|
itemBase?: import("tailwind-merge").ClassNameValue;
|
|
43
43
|
};
|
|
@@ -5,10 +5,10 @@ import { ReactNode } from "react";
|
|
|
5
5
|
declare const breadcrumbVariants: import("tailwind-variants").TVReturnType<{
|
|
6
6
|
[key: string]: {
|
|
7
7
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
8
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
9
8
|
nav?: import("tailwind-merge").ClassNameValue;
|
|
10
9
|
list?: import("tailwind-merge").ClassNameValue;
|
|
11
10
|
separator?: import("tailwind-merge").ClassNameValue;
|
|
11
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
12
12
|
ellipsis?: import("tailwind-merge").ClassNameValue;
|
|
13
13
|
itemBase?: import("tailwind-merge").ClassNameValue;
|
|
14
14
|
};
|
|
@@ -16,10 +16,10 @@ declare const breadcrumbVariants: import("tailwind-variants").TVReturnType<{
|
|
|
16
16
|
} | {
|
|
17
17
|
[x: string]: {
|
|
18
18
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
19
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
20
19
|
nav?: import("tailwind-merge").ClassNameValue;
|
|
21
20
|
list?: import("tailwind-merge").ClassNameValue;
|
|
22
21
|
separator?: import("tailwind-merge").ClassNameValue;
|
|
22
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
23
23
|
ellipsis?: import("tailwind-merge").ClassNameValue;
|
|
24
24
|
itemBase?: import("tailwind-merge").ClassNameValue;
|
|
25
25
|
};
|
|
@@ -34,10 +34,10 @@ declare const breadcrumbVariants: import("tailwind-variants").TVReturnType<{
|
|
|
34
34
|
}, undefined, {
|
|
35
35
|
[key: string]: {
|
|
36
36
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
37
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
38
37
|
nav?: import("tailwind-merge").ClassNameValue;
|
|
39
38
|
list?: import("tailwind-merge").ClassNameValue;
|
|
40
39
|
separator?: import("tailwind-merge").ClassNameValue;
|
|
40
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
41
41
|
ellipsis?: import("tailwind-merge").ClassNameValue;
|
|
42
42
|
itemBase?: import("tailwind-merge").ClassNameValue;
|
|
43
43
|
};
|
package/dist/Drawer/Drawer.d.cts
CHANGED
|
@@ -7,24 +7,24 @@ declare const drawerVariants: import("tailwind-variants").TVReturnType<{
|
|
|
7
7
|
[key: string]: {
|
|
8
8
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
9
9
|
base?: import("tailwind-merge").ClassNameValue;
|
|
10
|
-
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
11
10
|
body?: import("tailwind-merge").ClassNameValue;
|
|
12
11
|
footer?: import("tailwind-merge").ClassNameValue;
|
|
13
12
|
header?: import("tailwind-merge").ClassNameValue;
|
|
14
|
-
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
15
13
|
wrapper?: import("tailwind-merge").ClassNameValue;
|
|
14
|
+
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
15
|
+
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
16
16
|
};
|
|
17
17
|
};
|
|
18
18
|
} | {
|
|
19
19
|
[x: string]: {
|
|
20
20
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
21
21
|
base?: import("tailwind-merge").ClassNameValue;
|
|
22
|
-
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
23
22
|
body?: import("tailwind-merge").ClassNameValue;
|
|
24
23
|
footer?: import("tailwind-merge").ClassNameValue;
|
|
25
24
|
header?: import("tailwind-merge").ClassNameValue;
|
|
26
|
-
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
27
25
|
wrapper?: import("tailwind-merge").ClassNameValue;
|
|
26
|
+
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
27
|
+
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
28
28
|
};
|
|
29
29
|
};
|
|
30
30
|
} | {}, {
|
|
@@ -39,12 +39,12 @@ declare const drawerVariants: import("tailwind-variants").TVReturnType<{
|
|
|
39
39
|
[key: string]: {
|
|
40
40
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
41
41
|
base?: import("tailwind-merge").ClassNameValue;
|
|
42
|
-
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
43
42
|
body?: import("tailwind-merge").ClassNameValue;
|
|
44
43
|
footer?: import("tailwind-merge").ClassNameValue;
|
|
45
44
|
header?: import("tailwind-merge").ClassNameValue;
|
|
46
|
-
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
47
45
|
wrapper?: import("tailwind-merge").ClassNameValue;
|
|
46
|
+
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
47
|
+
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
48
48
|
};
|
|
49
49
|
};
|
|
50
50
|
} | {}, {
|
package/dist/Drawer/Drawer.d.ts
CHANGED
|
@@ -7,24 +7,24 @@ declare const drawerVariants: import("tailwind-variants").TVReturnType<{
|
|
|
7
7
|
[key: string]: {
|
|
8
8
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
9
9
|
base?: import("tailwind-merge").ClassNameValue;
|
|
10
|
-
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
11
10
|
body?: import("tailwind-merge").ClassNameValue;
|
|
12
11
|
footer?: import("tailwind-merge").ClassNameValue;
|
|
13
12
|
header?: import("tailwind-merge").ClassNameValue;
|
|
14
|
-
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
15
13
|
wrapper?: import("tailwind-merge").ClassNameValue;
|
|
14
|
+
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
15
|
+
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
16
16
|
};
|
|
17
17
|
};
|
|
18
18
|
} | {
|
|
19
19
|
[x: string]: {
|
|
20
20
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
21
21
|
base?: import("tailwind-merge").ClassNameValue;
|
|
22
|
-
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
23
22
|
body?: import("tailwind-merge").ClassNameValue;
|
|
24
23
|
footer?: import("tailwind-merge").ClassNameValue;
|
|
25
24
|
header?: import("tailwind-merge").ClassNameValue;
|
|
26
|
-
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
27
25
|
wrapper?: import("tailwind-merge").ClassNameValue;
|
|
26
|
+
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
27
|
+
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
28
28
|
};
|
|
29
29
|
};
|
|
30
30
|
} | {}, {
|
|
@@ -39,12 +39,12 @@ declare const drawerVariants: import("tailwind-variants").TVReturnType<{
|
|
|
39
39
|
[key: string]: {
|
|
40
40
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
41
41
|
base?: import("tailwind-merge").ClassNameValue;
|
|
42
|
-
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
43
42
|
body?: import("tailwind-merge").ClassNameValue;
|
|
44
43
|
footer?: import("tailwind-merge").ClassNameValue;
|
|
45
44
|
header?: import("tailwind-merge").ClassNameValue;
|
|
46
|
-
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
47
45
|
wrapper?: import("tailwind-merge").ClassNameValue;
|
|
46
|
+
backdrop?: import("tailwind-merge").ClassNameValue;
|
|
47
|
+
closeButton?: import("tailwind-merge").ClassNameValue;
|
|
48
48
|
};
|
|
49
49
|
};
|
|
50
50
|
} | {}, {
|
package/dist/Menu/Menu.d.cts
CHANGED
|
@@ -39,15 +39,15 @@ interface MenuSection {
|
|
|
39
39
|
declare const menuVariants: import("tailwind-variants").TVReturnType<{
|
|
40
40
|
[key: string]: {
|
|
41
41
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
42
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
43
42
|
trigger?: import("tailwind-merge").ClassNameValue;
|
|
43
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
44
44
|
};
|
|
45
45
|
};
|
|
46
46
|
} | {
|
|
47
47
|
[x: string]: {
|
|
48
48
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
49
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
50
49
|
trigger?: import("tailwind-merge").ClassNameValue;
|
|
50
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
51
51
|
};
|
|
52
52
|
};
|
|
53
53
|
} | {}, {
|
|
@@ -56,8 +56,8 @@ declare const menuVariants: import("tailwind-variants").TVReturnType<{
|
|
|
56
56
|
}, undefined, {
|
|
57
57
|
[key: string]: {
|
|
58
58
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
59
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
60
59
|
trigger?: import("tailwind-merge").ClassNameValue;
|
|
60
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
61
61
|
};
|
|
62
62
|
};
|
|
63
63
|
} | {}, {
|
package/dist/Menu/Menu.d.ts
CHANGED
|
@@ -39,15 +39,15 @@ interface MenuSection {
|
|
|
39
39
|
declare const menuVariants: import("tailwind-variants").TVReturnType<{
|
|
40
40
|
[key: string]: {
|
|
41
41
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
42
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
43
42
|
trigger?: import("tailwind-merge").ClassNameValue;
|
|
43
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
44
44
|
};
|
|
45
45
|
};
|
|
46
46
|
} | {
|
|
47
47
|
[x: string]: {
|
|
48
48
|
[x: string]: import("tailwind-merge").ClassNameValue | {
|
|
49
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
50
49
|
trigger?: import("tailwind-merge").ClassNameValue;
|
|
50
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
51
51
|
};
|
|
52
52
|
};
|
|
53
53
|
} | {}, {
|
|
@@ -56,8 +56,8 @@ declare const menuVariants: import("tailwind-variants").TVReturnType<{
|
|
|
56
56
|
}, undefined, {
|
|
57
57
|
[key: string]: {
|
|
58
58
|
[key: string]: import("tailwind-merge").ClassNameValue | {
|
|
59
|
-
item?: import("tailwind-merge").ClassNameValue;
|
|
60
59
|
trigger?: import("tailwind-merge").ClassNameValue;
|
|
60
|
+
item?: import("tailwind-merge").ClassNameValue;
|
|
61
61
|
};
|
|
62
62
|
};
|
|
63
63
|
} | {}, {
|
package/dist/Modal/Modal.cjs
CHANGED
|
@@ -24,7 +24,7 @@ const modalVariants = (0, _fuf_stack_pixel_utils.tv)({
|
|
|
24
24
|
/**
|
|
25
25
|
* Modal component based on [HeroUI Modal](https://www.heroui.com//docs/components/modal)
|
|
26
26
|
*/
|
|
27
|
-
const Modal = ({ children = null, className = void 0, disableAnimation =
|
|
27
|
+
const Modal = ({ children = null, className = void 0, disableAnimation = (0, _fuf_stack_pixel_utils.isTestEnvironment)(), footer = void 0, header = void 0, isOpen, onClose, portalContainer = void 0, size = "md", testId = void 0 }) => {
|
|
28
28
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_heroui_modal.Modal, {
|
|
29
29
|
backdrop: "opaque",
|
|
30
30
|
classNames: (0, _fuf_stack_pixel_utils.variantsToClassNames)(modalVariants({ size }), className, "base"),
|
package/dist/Modal/Modal.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.cjs","names":["HeroModal","HeroModalContent","HeroModalHeader","HeroModalBody","HeroModalFooter"],"sources":["../../src/Modal/Modal.tsx"],"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 {
|
|
1
|
+
{"version":3,"file":"Modal.cjs","names":["HeroModal","HeroModalContent","HeroModalHeader","HeroModalBody","HeroModalFooter"],"sources":["../../src/Modal/Modal.tsx"],"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 {\n isTestEnvironment,\n tv,\n variantsToClassNames,\n} 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 border-t-divider',\n header: 'border-b border-b-divider',\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 /**\n * Disable animations completely. Defaults to `true` in test environments so\n * snapshots are deterministic (the open/close opacity tween otherwise\n * captures a random mid-animation frame).\n */\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 = isTestEnvironment(),\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 return (\n <>\n {header ? <HeroModalHeader>{header}</HeroModalHeader> : null}\n <HeroModalBody id=\"modal_body\">{children}</HeroModalBody>\n {footer ? <HeroModalFooter>{footer}</HeroModalFooter> : null}\n </>\n );\n }}\n </HeroModalContent>\n </HeroModal>\n );\n};\n\nexport default Modal;\n"],"mappings":";;;;;AAmBA,MAAa,iBAAA,GAAA,uBAAA,IAAmB;CAC9B,OAAO;EACL,UAAU;EACV,MAAM;EACN,MAAM;EACN,aAAa;EACb,QAAQ;EACR,QAAQ;EACR,SAAS;CACX;CACA,UAAU,EACR,MAAM;EACJ,IAAI,EAAE,MAAM,WAAW;EACvB,IAAI,EAAE,MAAM,WAAW;EACvB,IAAI,EAAE,MAAM,WAAW;EACvB,IAAI,EAAE,MAAM,YAAY;EACxB,MAAM,EAAE,MAAM,uBAAuB;CACvC,EACF;AACF,CAAC;;;;AAmCD,MAAM,SAAS,EACb,WAAW,MACX,YAAY,KAAA,GACZ,oBAAA,GAAA,uBAAA,mBAAqC,GACrC,SAAS,KAAA,GACT,SAAS,KAAA,GACT,QACA,SACA,kBAAkB,KAAA,GAClB,OAAO,MACP,SAAS,KAAA,QACO;CAKhB,OACE,iBAAA,GAAA,kBAAA,KAACA,cAAAA,OAAD;EACE,UAAS;EACT,aAAA,GAAA,uBAAA,sBANa,cAAc,EAAE,KAAK,CACS,GAAG,WAAW,MAKpC;EACrB,eAAa;EACK;EACV;EACC;EACT,WAAU;EACO;EACjB,gBAAe;YAEf,iBAAA,GAAA,kBAAA,KAACC,cAAAA,cAAD;GAAkB,eAAa,SAAS,SAAS,WAAW;mBACnD;IACL,OACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA;KACG,SAAS,iBAAA,GAAA,kBAAA,KAACC,cAAAA,aAAD,EAAA,UAAkB,OAAwB,CAAA,IAAI;KACxD,iBAAA,GAAA,kBAAA,KAACC,cAAAA,WAAD;MAAe,IAAG;MAAc;KAAwB,CAAA;KACvD,SAAS,iBAAA,GAAA,kBAAA,KAACC,cAAAA,aAAD,EAAA,UAAkB,OAAwB,CAAA,IAAI;IACxD,EAAA,CAAA;GAEN;EACgB,CAAA;CACT,CAAA;AAEf"}
|
package/dist/Modal/Modal.d.cts
CHANGED
|
@@ -89,7 +89,11 @@ interface ModalProps$1 extends VariantProps {
|
|
|
89
89
|
children?: ReactNode;
|
|
90
90
|
/** CSS class name */
|
|
91
91
|
className?: ClassName;
|
|
92
|
-
/**
|
|
92
|
+
/**
|
|
93
|
+
* Disable animations completely. Defaults to `true` in test environments so
|
|
94
|
+
* snapshots are deterministic (the open/close opacity tween otherwise
|
|
95
|
+
* captures a random mid-animation frame).
|
|
96
|
+
*/
|
|
93
97
|
disableAnimation?: boolean;
|
|
94
98
|
/** modal footer */
|
|
95
99
|
footer?: ReactNode;
|