@lindle/linoardo 1.0.26 → 1.0.27
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/chunk-DDQ7ICWD.js +107 -0
- package/dist/chunk-DDQ7ICWD.js.map +1 -0
- package/dist/{chunk-KI4DBZ2V.js → chunk-S7VLFCLP.js} +46 -3
- package/dist/chunk-S7VLFCLP.js.map +1 -0
- package/dist/index.cjs +98 -103
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +2 -2
- package/dist/menu.cjs +54 -102
- package/dist/menu.cjs.map +1 -1
- package/dist/menu.js +1 -1
- package/dist/notification.cjs +44 -1
- package/dist/notification.cjs.map +1 -1
- package/dist/notification.js +1 -1
- package/dist/styles.css +42 -0
- package/package.json +1 -1
- package/dist/chunk-KI4DBZ2V.js.map +0 -1
- package/dist/chunk-T37VPLS4.js +0 -155
- package/dist/chunk-T37VPLS4.js.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { Notification_default as Notification } from './chunk-
|
|
1
|
+
export { Notification_default as Notification } from './chunk-S7VLFCLP.js';
|
|
2
2
|
export { Progress_default as Progress } from './chunk-Z5A2OIDI.js';
|
|
3
3
|
export { Input_default as Input } from './chunk-AUFMBVXA.js';
|
|
4
4
|
export { TextArea_default as TextArea } from './chunk-SCJMH5VE.js';
|
|
@@ -24,6 +24,6 @@ export { Badge_default as Badge } from './chunk-HIRPMCQJ.js';
|
|
|
24
24
|
export { Alert_default as Alert } from './chunk-KQOR3C7E.js';
|
|
25
25
|
export { List_default as List } from './chunk-AK7LFJI4.js';
|
|
26
26
|
export { Item_default as ListItem } from './chunk-5WQW6YSJ.js';
|
|
27
|
-
export { Menu_default as Menu } from './chunk-
|
|
27
|
+
export { Menu_default as Menu } from './chunk-DDQ7ICWD.js';
|
|
28
28
|
//# sourceMappingURL=index.js.map
|
|
29
29
|
//# sourceMappingURL=index.js.map
|
package/dist/menu.cjs
CHANGED
|
@@ -56,39 +56,23 @@ var Menu = React__namespace.forwardRef((props, ref) => {
|
|
|
56
56
|
className,
|
|
57
57
|
...rest
|
|
58
58
|
} = props;
|
|
59
|
-
const { onMouseEnter, onMouseLeave, onFocus, onBlur, ...restProps } = rest;
|
|
60
59
|
const hasContent = children !== void 0 && children !== null;
|
|
61
|
-
const
|
|
62
|
-
const
|
|
63
|
-
const
|
|
64
|
-
const visible = isControlled ? Boolean(open) : uncontrolledOpen;
|
|
65
|
-
const shouldRenderContent = hasContent && (keepMounted || visible || !isControlled && (openOnHover || openOnFocus));
|
|
60
|
+
const isOpen = Boolean(open);
|
|
61
|
+
const shouldRenderContent = hasContent && (keepMounted || isOpen || openOnHover || openOnFocus);
|
|
62
|
+
const shouldRenderOverlay = scrim && hasContent && (isOpen || openOnHover || openOnFocus);
|
|
66
63
|
const verticalPlacement = placement.startsWith("top") ? "top" : "bottom";
|
|
67
|
-
const
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
const
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
const scheduleClose = () => {
|
|
80
|
-
clearCloseTimer();
|
|
81
|
-
if (!isControlled) {
|
|
82
|
-
closeTimer.current = window.setTimeout(() => {
|
|
83
|
-
setUncontrolledOpen(false);
|
|
84
|
-
closeTimer.current = null;
|
|
85
|
-
}, 120);
|
|
86
|
-
}
|
|
87
|
-
};
|
|
88
|
-
React__namespace.useEffect(() => {
|
|
89
|
-
return () => clearCloseTimer();
|
|
90
|
-
}, []);
|
|
91
|
-
const visibilityClasses = visible ? "pointer-events-auto opacity-100 scale-100" : "pointer-events-none opacity-0 scale-95";
|
|
64
|
+
const visibilityClasses = tailwindMerge.twMerge(
|
|
65
|
+
"pointer-events-none opacity-0 scale-95",
|
|
66
|
+
isOpen ? "pointer-events-auto opacity-100 scale-100" : void 0,
|
|
67
|
+
openOnHover ? "group-hover/menu:pointer-events-auto group-hover/menu:opacity-100 group-hover/menu:scale-100" : void 0,
|
|
68
|
+
openOnFocus ? "group-focus-within/menu:pointer-events-auto group-focus-within/menu:opacity-100 group-focus-within/menu:scale-100" : void 0
|
|
69
|
+
);
|
|
70
|
+
const overlayVisibilityClasses = tailwindMerge.twMerge(
|
|
71
|
+
"pointer-events-none opacity-0 transition-opacity duration-150",
|
|
72
|
+
openOnHover ? "group-hover/menu:opacity-100" : void 0,
|
|
73
|
+
openOnFocus ? "group-focus-within/menu:opacity-100" : void 0,
|
|
74
|
+
isOpen ? "pointer-events-auto opacity-100" : void 0
|
|
75
|
+
);
|
|
92
76
|
const {
|
|
93
77
|
className: contentExtraClassName,
|
|
94
78
|
style: contentStyle,
|
|
@@ -96,78 +80,46 @@ var Menu = React__namespace.forwardRef((props, ref) => {
|
|
|
96
80
|
tabIndex: contentTabIndex,
|
|
97
81
|
...restContentProps
|
|
98
82
|
} = contentProps ?? {};
|
|
99
|
-
const overlayNode =
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
"
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
83
|
+
const overlayNode = shouldRenderOverlay ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
84
|
+
"div",
|
|
85
|
+
{
|
|
86
|
+
className: tailwindMerge.twMerge(overlayBaseClasses, overlayVisibilityClasses, overlayClassName),
|
|
87
|
+
"aria-hidden": true
|
|
88
|
+
}
|
|
89
|
+
) : null;
|
|
90
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
91
|
+
"div",
|
|
92
|
+
{
|
|
93
|
+
...rest,
|
|
94
|
+
ref,
|
|
95
|
+
className: tailwindMerge.twMerge("relative inline-flex min-w-0 group/menu", className),
|
|
96
|
+
"data-open": isOpen || void 0,
|
|
97
|
+
children: [
|
|
98
|
+
overlayNode,
|
|
99
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex w-full min-w-0", children: activator }),
|
|
100
|
+
shouldRenderContent ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
101
|
+
"div",
|
|
102
|
+
{
|
|
103
|
+
...restContentProps,
|
|
104
|
+
className: tailwindMerge.twMerge(
|
|
105
|
+
menuBaseClasses,
|
|
106
|
+
placementClasses[placement],
|
|
107
|
+
offsetClasses[verticalPlacement],
|
|
108
|
+
matchActivatorWidth ? "min-w-full" : void 0,
|
|
109
|
+
visibilityClasses,
|
|
110
|
+
contentClassName,
|
|
111
|
+
contentExtraClassName
|
|
112
|
+
),
|
|
113
|
+
"data-state": isOpen ? "open" : "closed",
|
|
114
|
+
role: contentRole ?? "menu",
|
|
115
|
+
tabIndex: contentTabIndex ?? -1,
|
|
116
|
+
style: contentStyle,
|
|
117
|
+
children
|
|
130
118
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
shouldRenderContent ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
136
|
-
"div",
|
|
137
|
-
{
|
|
138
|
-
...restContentProps,
|
|
139
|
-
className: tailwindMerge.twMerge(
|
|
140
|
-
menuBaseClasses,
|
|
141
|
-
placementClasses[placement],
|
|
142
|
-
offsetClasses[verticalPlacement],
|
|
143
|
-
matchActivatorWidth ? "min-w-full" : void 0,
|
|
144
|
-
visibilityClasses,
|
|
145
|
-
contentClassName,
|
|
146
|
-
contentExtraClassName
|
|
147
|
-
),
|
|
148
|
-
"data-state": visible ? "open" : "closed",
|
|
149
|
-
role: contentRole ?? "menu",
|
|
150
|
-
tabIndex: contentTabIndex ?? -1,
|
|
151
|
-
style: contentStyle,
|
|
152
|
-
onMouseEnter: (event) => {
|
|
153
|
-
if (openOnHover) {
|
|
154
|
-
openMenu();
|
|
155
|
-
}
|
|
156
|
-
restContentProps?.onMouseEnter?.(event);
|
|
157
|
-
},
|
|
158
|
-
onMouseLeave: (event) => {
|
|
159
|
-
if (openOnHover) {
|
|
160
|
-
scheduleClose();
|
|
161
|
-
}
|
|
162
|
-
restContentProps?.onMouseLeave?.(event);
|
|
163
|
-
},
|
|
164
|
-
children
|
|
165
|
-
}
|
|
166
|
-
) : null
|
|
167
|
-
]
|
|
168
|
-
}
|
|
169
|
-
)
|
|
170
|
-
] });
|
|
119
|
+
) : null
|
|
120
|
+
]
|
|
121
|
+
}
|
|
122
|
+
);
|
|
171
123
|
});
|
|
172
124
|
Menu.displayName = "Menu";
|
|
173
125
|
var Menu_default = Menu;
|
package/dist/menu.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Containment/Menu/index.tsx"],"names":["React","
|
|
1
|
+
{"version":3,"sources":["../src/Containment/Menu/index.tsx"],"names":["React","twMerge","jsx","jsxs"],"mappings":"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","file":"menu.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nexport type MenuPlacement =\n | 'bottom-start'\n | 'bottom'\n | 'bottom-end'\n | 'top-start'\n | 'top'\n | 'top-end';\n\nexport interface MenuProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n activator: React.ReactNode;\n children: React.ReactNode;\n placement?: MenuPlacement;\n open?: boolean;\n openOnHover?: boolean;\n openOnFocus?: boolean;\n matchActivatorWidth?: boolean;\n keepMounted?: boolean;\n scrim?: boolean;\n contentClassName?: string;\n contentProps?: React.HTMLAttributes<HTMLDivElement>;\n overlayClassName?: string;\n}\n\nconst placementClasses: Record<MenuPlacement, string> = {\n 'bottom-start': 'left-0 top-full origin-top-left',\n bottom: 'left-1/2 top-full -translate-x-1/2 origin-top',\n 'bottom-end': 'right-0 top-full origin-top-right',\n 'top-start': 'left-0 bottom-full origin-bottom-left',\n top: 'left-1/2 bottom-full -translate-x-1/2 origin-bottom',\n 'top-end': 'right-0 bottom-full origin-bottom-right'\n};\n\nconst offsetClasses: Record<'top' | 'bottom', string> = {\n top: 'mb-2',\n bottom: 'mt-2'\n};\n\nconst menuBaseClasses =\n 'absolute z-50 min-w-[10rem] rounded-xl border border-gray-200/80 bg-white/95 p-2 text-sm text-gray-700 shadow-lg shadow-gray-900/10 ring-1 ring-black/5 backdrop-blur-md transition-all duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2';\n\nconst overlayBaseClasses = 'fixed inset-0 z-40 bg-gray-900/30 backdrop-blur-[1px]';\n\n/**\n * Contextual menu that opens relative to an activator with optional hover/focus behavior and scrim.\n */\nconst Menu = React.forwardRef<HTMLDivElement, MenuProps>((props, ref) => {\n const {\n activator,\n children,\n placement = 'bottom-start',\n open,\n openOnHover = true,\n openOnFocus = true,\n matchActivatorWidth = false,\n keepMounted = false,\n scrim = false,\n contentClassName,\n contentProps,\n overlayClassName,\n className,\n ...rest\n } = props;\n\n const hasContent = children !== undefined && children !== null;\n const isOpen = Boolean(open);\n const shouldRenderContent =\n hasContent && (keepMounted || isOpen || openOnHover || openOnFocus);\n const shouldRenderOverlay = scrim && hasContent && (isOpen || openOnHover || openOnFocus);\n const verticalPlacement = placement.startsWith('top') ? 'top' : 'bottom';\n\n const visibilityClasses = twMerge(\n 'pointer-events-none opacity-0 scale-95',\n isOpen ? 'pointer-events-auto opacity-100 scale-100' : undefined,\n openOnHover\n ? 'group-hover/menu:pointer-events-auto group-hover/menu:opacity-100 group-hover/menu:scale-100'\n : undefined,\n openOnFocus\n ? 'group-focus-within/menu:pointer-events-auto group-focus-within/menu:opacity-100 group-focus-within/menu:scale-100'\n : undefined\n );\n\n const overlayVisibilityClasses = twMerge(\n 'pointer-events-none opacity-0 transition-opacity duration-150',\n openOnHover ? 'group-hover/menu:opacity-100' : undefined,\n openOnFocus ? 'group-focus-within/menu:opacity-100' : undefined,\n isOpen ? 'pointer-events-auto opacity-100' : undefined\n );\n\n const {\n className: contentExtraClassName,\n style: contentStyle,\n role: contentRole,\n tabIndex: contentTabIndex,\n ...restContentProps\n } = contentProps ?? {};\n\n const overlayNode = shouldRenderOverlay ? (\n <div\n className={twMerge(overlayBaseClasses, overlayVisibilityClasses, overlayClassName)}\n aria-hidden\n />\n ) : null;\n\n return (\n <div\n {...rest}\n ref={ref}\n className={twMerge('relative inline-flex min-w-0 group/menu', className)}\n data-open={isOpen || undefined}\n >\n {overlayNode}\n <div className='inline-flex w-full min-w-0'>{activator}</div>\n {shouldRenderContent ? (\n <div\n {...restContentProps}\n className={twMerge(\n menuBaseClasses,\n placementClasses[placement],\n offsetClasses[verticalPlacement],\n matchActivatorWidth ? 'min-w-full' : undefined,\n visibilityClasses,\n contentClassName,\n contentExtraClassName\n )}\n data-state={isOpen ? 'open' : 'closed'}\n role={contentRole ?? 'menu'}\n tabIndex={contentTabIndex ?? -1}\n style={contentStyle}\n >\n {children}\n </div>\n ) : null}\n </div>\n );\n});\n\nMenu.displayName = 'Menu';\n\nexport default Menu;\n"]}
|
package/dist/menu.js
CHANGED
package/dist/notification.cjs
CHANGED
|
@@ -73,6 +73,37 @@ var typeTone = {
|
|
|
73
73
|
iconText: "text-red-600"
|
|
74
74
|
}
|
|
75
75
|
};
|
|
76
|
+
var isBrowser = typeof window !== "undefined";
|
|
77
|
+
var autoCloseTimers = /* @__PURE__ */ new Map();
|
|
78
|
+
var clearAutoCloseTimer = (key) => {
|
|
79
|
+
const existing = autoCloseTimers.get(key);
|
|
80
|
+
if (!existing) return;
|
|
81
|
+
clearTimeout(existing.timeoutId);
|
|
82
|
+
autoCloseTimers.delete(key);
|
|
83
|
+
};
|
|
84
|
+
var scheduleAutoClose = (key, duration, onClose) => {
|
|
85
|
+
if (!isBrowser) return;
|
|
86
|
+
if (typeof duration !== "number" || !Number.isFinite(duration) || duration < 0 || !onClose) {
|
|
87
|
+
clearAutoCloseTimer(key);
|
|
88
|
+
return;
|
|
89
|
+
}
|
|
90
|
+
const existing = autoCloseTimers.get(key);
|
|
91
|
+
if (existing && existing.duration === duration && existing.onClose === onClose) return;
|
|
92
|
+
if (existing) clearAutoCloseTimer(key);
|
|
93
|
+
const timeoutId = setTimeout(() => {
|
|
94
|
+
autoCloseTimers.delete(key);
|
|
95
|
+
onClose();
|
|
96
|
+
}, duration);
|
|
97
|
+
autoCloseTimers.set(key, { timeoutId, duration, onClose });
|
|
98
|
+
};
|
|
99
|
+
var cleanupStaleTimers = (activeKeys) => {
|
|
100
|
+
if (!isBrowser) return;
|
|
101
|
+
for (const key of Array.from(autoCloseTimers.keys())) {
|
|
102
|
+
if (!activeKeys.has(key)) {
|
|
103
|
+
clearAutoCloseTimer(key);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
};
|
|
76
107
|
var resolveVariantClass = (variant, type) => {
|
|
77
108
|
const tone = type ? typeTone[type] : void 0;
|
|
78
109
|
switch (variant) {
|
|
@@ -129,6 +160,7 @@ var NotificationCard = ({ item }) => {
|
|
|
129
160
|
icon,
|
|
130
161
|
closeIcon,
|
|
131
162
|
closable = true,
|
|
163
|
+
duration,
|
|
132
164
|
btn,
|
|
133
165
|
onClick,
|
|
134
166
|
className,
|
|
@@ -205,16 +237,27 @@ var Notification = ({
|
|
|
205
237
|
className,
|
|
206
238
|
...rest
|
|
207
239
|
}) => {
|
|
208
|
-
if (!items.length)
|
|
240
|
+
if (!items.length) {
|
|
241
|
+
if (isBrowser) {
|
|
242
|
+
for (const key of Array.from(autoCloseTimers.keys())) {
|
|
243
|
+
clearAutoCloseTimer(key);
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
return null;
|
|
247
|
+
}
|
|
209
248
|
const grouped = /* @__PURE__ */ new Map();
|
|
249
|
+
const activeKeys = /* @__PURE__ */ new Set();
|
|
210
250
|
items.forEach((item) => {
|
|
211
251
|
const resolvedKey = item.key ?? `notification-${item.message ?? Math.random()}`;
|
|
212
252
|
const resolvedPlacement = item.placement ?? placement;
|
|
213
253
|
const resolvedVariant = item.variant ?? variant;
|
|
254
|
+
activeKeys.add(resolvedKey);
|
|
255
|
+
scheduleAutoClose(resolvedKey, item.duration, item.onClose);
|
|
214
256
|
const group = grouped.get(resolvedPlacement) ?? [];
|
|
215
257
|
group.push({ ...item, key: resolvedKey, variant: resolvedVariant });
|
|
216
258
|
grouped.set(resolvedPlacement, group);
|
|
217
259
|
});
|
|
260
|
+
cleanupStaleTimers(activeKeys);
|
|
218
261
|
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from(grouped.entries()).map(([groupPlacement, groupItems]) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
219
262
|
"div",
|
|
220
263
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Feedback/Notification/index.tsx"],"names":["twMerge","normalized","React","jsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAM,gBAAA,GAA0D;AAAA,EAC9D,OAAA,EAAS,0BAAA;AAAA,EACT,QAAA,EAAU,yBAAA;AAAA,EACV,UAAA,EAAY,6BAAA;AAAA,EACZ,WAAA,EAAa;AACf,CAAA;AAEA,IAAM,WAAA,GAAgD;AAAA,EACpD,IAAA,EAAM,yBAAA;AAAA,EACN,OAAA,EAAS,0BAAA;AAAA,EACT,OAAA,EAAS,mBAAA;AAAA,EACT,KAAA,EAAO;AACT,CAAA;AAEA,IAAM,aAAA,GAAkD;AAAA,EACtD,IAAA,EAAM,wBAAA;AAAA,EACN,OAAA,EAAS,gCAAA;AAAA,EACT,OAAA,EAAS,4BAAA;AAAA,EACT,KAAA,EAAO;AACT,CAAA;AAEA,IAAM,QAAA,GAGF;AAAA,EACF,IAAA,EAAM;AAAA,IACJ,EAAA,EAAI,WAAA;AAAA,IACJ,IAAA,EAAM,cAAA;AAAA,IACN,MAAA,EAAQ,gBAAA;AAAA,IACR,MAAA,EAAQ,YAAA;AAAA,IACR,QAAA,EAAU;AAAA,GACZ;AAAA,EACA,OAAA,EAAS;AAAA,IACP,EAAA,EAAI,eAAA;AAAA,IACJ,IAAA,EAAM,kBAAA;AAAA,IACN,MAAA,EAAQ,oBAAA;AAAA,IACR,MAAA,EAAQ,gBAAA;AAAA,IACR,QAAA,EAAU;AAAA,GACZ;AAAA,EACA,OAAA,EAAS;AAAA,IACP,EAAA,EAAI,aAAA;AAAA,IACJ,IAAA,EAAM,gBAAA;AAAA,IACN,MAAA,EAAQ,kBAAA;AAAA,IACR,MAAA,EAAQ,cAAA;AAAA,IACR,QAAA,EAAU;AAAA,GACZ;AAAA,EACA,KAAA,EAAO;AAAA,IACL,EAAA,EAAI,WAAA;AAAA,IACJ,IAAA,EAAM,cAAA;AAAA,IACN,MAAA,EAAQ,gBAAA;AAAA,IACR,MAAA,EAAQ,YAAA;AAAA,IACR,QAAA,EAAU;AAAA;AAEd,CAAA;AAEA,IAAM,mBAAA,GAAsB,CAAC,OAAA,EAA8B,IAAA,KAA4B;AACrF,EAAA,MAAM,IAAA,GAAO,IAAA,GAAO,QAAA,CAAS,IAAI,CAAA,GAAI,MAAA;AACrC,EAAA,QAAQ,OAAA;AAAS,IACf,KAAK,QAAA;AACH,MAAA,OAAOA,qBAAA;AAAA,QACL,MAAM,EAAA,IAAM,eAAA;AAAA,QACZ,MAAM,IAAA,IAAQ,cAAA;AAAA,QACd;AAAA,OACF;AAAA,IACF,KAAK,SAAA;AACH,MAAA,OAAOA,qBAAA;AAAA,QACL,aAAA;AAAA,QACA,MAAM,IAAA,IAAQ,eAAA;AAAA,QACd,MAAM,MAAA,IAAU,mBAAA;AAAA,QAChB;AAAA,OACF;AAAA,IACF,KAAK,OAAA;AACH,MAAA,OAAOA,qBAAA;AAAA,QACL,sDAAA;AAAA,QACA,MAAM,IAAA,IAAQ;AAAA,OAChB;AAAA,IACF,KAAK,OAAA;AAAA,IACL;AACE,MAAA,OAAO,kDAAA;AAAA;AAEb,CAAA;AAEA,IAAM,oBAAA,GAAuB,CAAC,IAAA,KAA6B;AACzD,EAAA,IAAI,CAAC,MAAM,OAAO,MAAA;AAClB,EAAA,IAAI,OAAO,SAAS,QAAA,EAAU;AAC5B,IAAA,MAAM,OAAA,GAAU,KAAK,IAAA,EAAK;AAC1B,IAAA,IAAI,CAAC,SAAS,OAAO,MAAA;AACrB,IAAA,IAAI,OAAA,CAAQ,QAAA,CAAS,GAAG,CAAA,EAAG,OAAO,OAAA;AAClC,IAAA,MAAMC,cAAa,OAAA,CAAQ,UAAA,CAAW,MAAM,CAAA,GAAI,OAAA,GAAU,OAAO,OAAO,CAAA,CAAA;AACxE,IAAA,OAAO,OAAOA,WAAU,CAAA,CAAA;AAAA,EAC1B;AACA,EAAA,MAAM,CAAC,OAAA,EAAS,QAAQ,CAAA,GAAI,IAAA;AAC5B,EAAA,MAAM,aAAa,QAAA,EAAU,UAAA,CAAW,MAAM,CAAA,GAAI,QAAA,GAAW,OAAO,QAAQ,CAAA,CAAA;AAC5E,EAAA,OAAO,CAAA,IAAA,EAAO,OAAO,CAAA,CAAA,EAAI,UAAU,GAAG,IAAA,EAAK;AAC7C,CAAA;AAEA,IAAM,eAAA,GAAkB,CAAC,IAAA,EAAmC,iBAAA,KAA+B;AACzF,EAAA,IAAUC,gBAAA,CAAA,cAAA,CAAe,IAAI,CAAA,EAAG,OAAO,IAAA;AACvC,EAAA,MAAM,aAAA,GAAgB,oBAAA,CAAqB,IAAgB,CAAA,IAAK,iBAAA;AAChE,EAAA,IAAI,CAAC,eAAe,OAAO,IAAA;AAC3B,EAAA,MAAM,OAAA,GAAU,aAAA,CAAc,KAAA,CAAM,GAAG,CAAA,CAAE,KAAK,CAAA,KAAA,KAAS,KAAA,CAAM,IAAA,EAAK,KAAM,KAAK,CAAA;AAC7E,EAAA,MAAM,QAAA,GAAW,aAAA,CAAc,QAAA,CAAS,MAAM,CAAA;AAC9C,EAAA,MAAM,iBAAiB,OAAA,IAAW,QAAA,GAAW,gBAAgB,CAAA,IAAA,EAAO,aAAa,GAAG,IAAA,EAAK;AACzF,EAAA,uBAAOC,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAW,cAAA,EAAgB,eAAW,IAAA,EAAC,CAAA;AACnD,CAAA;AAEA,IAAM,gBAAA,GAED,CAAC,EAAE,IAAA,EAAK,KAAM;AACjB,EAAA,MAAM;AAAA,IACJ,GAAA;AAAA,IACA,OAAA;AAAA,IACA,WAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA,GAAW,IAAA;AAAA,IACX,GAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA,GAAO,QAAA;AAAA,IACP,IAAA;AAAA,IACA,OAAA,GAAU,OAAA;AAAA,IACV,GAAG;AAAA,GACL,GAAI,IAAA;AAEJ,EAAA,MAAM,UAAA,GAAa,OAAA,KAAY,MAAA,IAAa,OAAA,KAAY,IAAA;AACxD,EAAA,MAAM,cAAA,GAAiB,WAAA,KAAgB,MAAA,IAAa,WAAA,KAAgB,IAAA;AACpE,EAAA,MAAM,aAAa,UAAA,IAAc,cAAA;AACjC,EAAA,MAAM,WAAA,GAAc,IAAA,GAAO,aAAA,CAAc,IAAI,CAAA,GAAI,MAAA;AACjD,EAAA,MAAM,QAAA,GAAW,gBAAgB,IAAA,EAAM,IAAA,GAAO,OAAO,WAAA,CAAY,IAAI,CAAC,CAAA,CAAA,GAAK,MAAS,CAAA;AACpF,EAAA,MAAM,aAAA,GAAgB,eAAA,CAAgB,SAAA,EAAW,eAAe,CAAA;AAChE,EAAA,MAAM,YAAA,GAAe,mBAAA,CAAoB,OAAA,EAAgC,IAAI,CAAA;AAC7E,EAAA,MAAM,UAAA,GAAa,IAAA,GAAO,QAAA,CAAS,IAAI,GAAG,MAAA,GAAS,MAAA;AACnD,EAAA,MAAM,YAAA,GAAe,IAAA,GAAO,QAAA,CAAS,IAAI,GAAG,QAAA,GAAW,MAAA;AAEvD,EAAA,uBACEC,eAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,IAAA;AAAA,MACA,SAAA,EAAWJ,qBAAA;AAAA,QACT,qMAAA;AAAA,QACA,8EAAA;AAAA,QACA,YAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA;AAAA,MACA,OAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,QAAA,mBACCG,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAWH,qBAAA;AAAA,cACT,+EAAA;AAAA,cACA,cAAc,WAAA,IAAe,eAAA;AAAA,cAC7B,YAAA,IAAgB;AAAA,aAClB;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH,GACE,IAAA;AAAA,wBACJI,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0BAAA,EACZ,QAAA,EAAA;AAAA,UAAA,UAAA,mBACCA,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,WAAA,EACZ,QAAA,EAAA;AAAA,YAAA,UAAA,mBACCD,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,mEAAA,EACZ,mBACH,CAAA,GACE,IAAA;AAAA,YACH,iCACCA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,oDAAA,EACZ,uBACH,CAAA,GACE;AAAA,WAAA,EACN,CAAA,GACE,IAAA;AAAA,UACH,sBAAMA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,cAAA,EAAgB,eAAI,CAAA,GAAS;AAAA,SAAA,EACrD,CAAA;AAAA,QACC,QAAA,mBACCA,cAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,YAAA,EAAW,mCAAA;AAAA,YACX,SAAA,EAAU,wPAAA;AAAA,YACV,SAAS,CAAA,KAAA,KAAS;AAChB,cAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,cAAA,IAAA,CAAK,OAAA,IAAU;AAAA,YACjB,CAAA;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH,GACE;AAAA;AAAA;AAAA,GACN;AAEJ,CAAA;AAEA,IAAM,eAA4C,CAAC;AAAA,EACjD,QAAQ,EAAC;AAAA,EACT,SAAA,GAAY,UAAA;AAAA,EACZ,OAAA,GAAU,OAAA;AAAA,EACV,GAAA,GAAM,EAAA;AAAA,EACN,kBAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAM;AACJ,EAAA,IAAI,CAAC,KAAA,CAAM,MAAA,EAAQ,OAAO,IAAA;AAE1B,EAAA,MAAM,OAAA,uBAAc,GAAA,EAAsE;AAC1F,EAAA,KAAA,CAAM,QAAQ,CAAA,IAAA,KAAQ;AACpB,IAAA,MAAM,WAAA,GAAc,KAAK,GAAA,IAAO,CAAA,aAAA,EAAgB,KAAK,OAAA,IAAW,IAAA,CAAK,QAAQ,CAAA,CAAA;AAC7E,IAAA,MAAM,iBAAA,GAAoB,KAAK,SAAA,IAAa,SAAA;AAC5C,IAAA,MAAM,eAAA,GAAkB,KAAK,OAAA,IAAW,OAAA;AACxC,IAAA,MAAM,KAAA,GAAQ,OAAA,CAAQ,GAAA,CAAI,iBAAiB,KAAK,EAAC;AACjD,IAAA,KAAA,CAAM,IAAA,CAAK,EAAE,GAAG,IAAA,EAAM,KAAK,WAAA,EAAa,OAAA,EAAS,iBAAiB,CAAA;AAClE,IAAA,OAAA,CAAQ,GAAA,CAAI,mBAAmB,KAAK,CAAA;AAAA,EACtC,CAAC,CAAA;AAED,EAAA,uBACEA,cAAA,CAAAE,mBAAA,EAAA,EACG,QAAA,EAAA,KAAA,CAAM,IAAA,CAAK,OAAA,CAAQ,OAAA,EAAS,CAAA,CAAE,GAAA,CAAI,CAAC,CAAC,cAAA,EAAgB,UAAU,CAAA,qBAC7DF,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MAEC,SAAA,EAAWH,qBAAA;AAAA,QACT,mEAAA;AAAA,QACA,iBAAiB,cAAc,CAAA;AAAA,QAC/B,kBAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA,EAAO,EAAE,GAAA,EAAK,CAAA,EAAG,GAAG,CAAA,EAAA,CAAA,EAAK;AAAA,MACxB,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA,UAAA,CAAW,IAAI,CAAA,IAAA,qBACdG,cAAA,CAAC,oBAAgC,IAAA,EAAA,EAAV,IAAA,CAAK,GAAiB,CAC9C;AAAA,KAAA;AAAA,IAZI;AAAA,GAcR,CAAA,EACH,CAAA;AAEJ,CAAA;AASA,IAAO,oBAAA,GAAQ","file":"notification.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type {\n NotificationArgs,\n NotificationPlacement,\n NotificationProps,\n NotificationType,\n NotificationVariant\n} from './types.notification';\nimport type { PropIcon } from '../../global.types';\n\nconst placementClasses: Record<NotificationPlacement, string> = {\n topLeft: 'top-4 left-4 items-start',\n topRight: 'top-4 right-4 items-end',\n bottomLeft: 'bottom-4 left-4 items-start',\n bottomRight: 'bottom-4 right-4 items-end'\n};\n\nconst typeIconMap: Record<NotificationType, string> = {\n info: 'mdi-information-outline',\n success: 'mdi-check-circle-outline',\n warning: 'mdi-alert-outline',\n error: 'mdi-close-circle-outline'\n};\n\nconst typeAccentMap: Record<NotificationType, string> = {\n info: 'bg-sky-50 text-sky-600',\n success: 'bg-emerald-50 text-emerald-600',\n warning: 'bg-amber-50 text-amber-700',\n error: 'bg-red-50 text-red-600'\n};\n\nconst typeTone: Record<\n NotificationType,\n { bg: string; text: string; border: string; iconBg: string; iconText: string }\n> = {\n info: {\n bg: 'bg-sky-50',\n text: 'text-sky-900',\n border: 'border-sky-200',\n iconBg: 'bg-sky-100',\n iconText: 'text-sky-600'\n },\n success: {\n bg: 'bg-emerald-50',\n text: 'text-emerald-900',\n border: 'border-emerald-200',\n iconBg: 'bg-emerald-100',\n iconText: 'text-emerald-600'\n },\n warning: {\n bg: 'bg-amber-50',\n text: 'text-amber-900',\n border: 'border-amber-200',\n iconBg: 'bg-amber-100',\n iconText: 'text-amber-700'\n },\n error: {\n bg: 'bg-red-50',\n text: 'text-red-900',\n border: 'border-red-200',\n iconBg: 'bg-red-100',\n iconText: 'text-red-600'\n }\n};\n\nconst resolveVariantClass = (variant: NotificationVariant, type?: NotificationType) => {\n const tone = type ? typeTone[type] : undefined;\n switch (variant) {\n case 'filled':\n return twMerge(\n tone?.bg ?? 'bg-primary/10',\n tone?.text ?? 'text-primary',\n 'border border-transparent shadow-none'\n );\n case 'outline':\n return twMerge(\n 'bg-white/90',\n tone?.text ?? 'text-gray-900',\n tone?.border ?? 'border-primary/20',\n 'border-[1.5px]'\n );\n case 'ghost':\n return twMerge(\n 'bg-transparent shadow-none border border-transparent',\n tone?.text ?? 'text-gray-900'\n );\n case 'solid':\n default:\n return 'bg-white/95 text-gray-900 border border-gray-200';\n }\n};\n\nconst resolveIconClassName = (icon?: PropIcon | string) => {\n if (!icon) return undefined;\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) return undefined;\n if (trimmed.includes(' ')) return trimmed;\n const normalized = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return `mdi ${normalized}`;\n }\n const [library, iconName] = icon;\n const normalized = iconName?.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n return `mdi ${library} ${normalized}`.trim();\n};\n\nconst resolveIconNode = (icon?: React.ReactNode | PropIcon, fallbackClassName?: string) => {\n if (React.isValidElement(icon)) return icon;\n const iconClassName = resolveIconClassName(icon as PropIcon) ?? fallbackClassName;\n if (!iconClassName) return null;\n const hasBase = iconClassName.split(' ').some(token => token.trim() === 'mdi');\n const hasGlyph = iconClassName.includes('mdi-');\n const finalClassName = hasBase && hasGlyph ? iconClassName : `mdi ${iconClassName}`.trim();\n return <i className={finalClassName} aria-hidden />;\n};\n\nconst NotificationCard: React.FC<{\n item: NotificationArgs & { key: React.Key };\n}> = ({ item }) => {\n const {\n key,\n message,\n description,\n icon,\n closeIcon,\n closable = true,\n btn,\n onClick,\n className,\n style,\n role = 'status',\n type,\n variant = 'solid',\n ...rest\n } = item;\n\n const hasMessage = message !== undefined && message !== null;\n const hasDescription = description !== undefined && description !== null;\n const hasContent = hasMessage || hasDescription;\n const accentClass = type ? typeAccentMap[type] : undefined;\n const iconNode = resolveIconNode(icon, type ? `mdi ${typeIconMap[type]}` : undefined);\n const closeIconNode = resolveIconNode(closeIcon, 'mdi mdi-close');\n const variantClass = resolveVariantClass(variant as NotificationVariant, type);\n const toneIconBg = type ? typeTone[type]?.iconBg : undefined;\n const toneIconText = type ? typeTone[type]?.iconText : undefined;\n\n return (\n <article\n {...rest}\n role={role}\n className={twMerge(\n 'pointer-events-auto flex w-88 max-w-[calc(100vw-2.5rem)] gap-3 rounded-2xl p-4 shadow-xl ring-1 ring-black/5 backdrop-blur-sm transition hover:-translate-y-0.5 hover:shadow-2xl focus:outline-none',\n 'dark:border-gray-800 dark:bg-gray-900/95 dark:text-gray-50 dark:ring-white/5',\n variantClass,\n className\n )}\n style={style}\n onClick={onClick}\n >\n {iconNode ? (\n <div\n className={twMerge(\n 'mt-0.5 flex h-10 w-10 shrink-0 items-center justify-center rounded-xl text-xl',\n toneIconBg ?? accentClass ?? 'bg-primary/10',\n toneIconText ?? 'text-primary'\n )}\n >\n {iconNode}\n </div>\n ) : null}\n <div className='min-w-0 flex-1 space-y-1'>\n {hasContent ? (\n <div className='space-y-1'>\n {hasMessage ? (\n <div className='text-[15px] font-semibold leading-5 text-gray-900 dark:text-white'>\n {message}\n </div>\n ) : null}\n {hasDescription ? (\n <div className='text-sm leading-6 text-gray-600 dark:text-gray-300'>\n {description}\n </div>\n ) : null}\n </div>\n ) : null}\n {btn ? <div className='pt-1 text-sm'>{btn}</div> : null}\n </div>\n {closable ? (\n <button\n type='button'\n aria-label='Zavřít upozornění'\n className='-mr-1 -mt-1 h-8 w-8 shrink-0 rounded-full text-gray-500 transition hover:bg-gray-100 hover:text-gray-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 dark:text-gray-400 dark:hover:bg-gray-800 dark:hover:text-white'\n onClick={event => {\n event.stopPropagation();\n item.onClose?.();\n }}\n >\n {closeIconNode}\n </button>\n ) : null}\n </article>\n );\n};\n\nconst Notification: React.FC<NotificationProps> = ({\n items = [],\n placement = 'topRight',\n variant = 'solid',\n gap = 12,\n containerClassName,\n className,\n ...rest\n}) => {\n if (!items.length) return null;\n\n const grouped = new Map<NotificationPlacement, (NotificationArgs & { key: React.Key })[]>();\n items.forEach(item => {\n const resolvedKey = item.key ?? `notification-${item.message ?? Math.random()}`;\n const resolvedPlacement = item.placement ?? placement;\n const resolvedVariant = item.variant ?? variant;\n const group = grouped.get(resolvedPlacement) ?? [];\n group.push({ ...item, key: resolvedKey, variant: resolvedVariant });\n grouped.set(resolvedPlacement, group);\n });\n\n return (\n <>\n {Array.from(grouped.entries()).map(([groupPlacement, groupItems]) => (\n <div\n key={groupPlacement}\n className={twMerge(\n 'pointer-events-none fixed z-70 flex w-full max-w-[24rem] flex-col',\n placementClasses[groupPlacement],\n containerClassName,\n className\n )}\n style={{ gap: `${gap}px` }}\n {...rest}\n >\n {groupItems.map(item => (\n <NotificationCard key={item.key} item={item} />\n ))}\n </div>\n ))}\n </>\n );\n};\n\nexport type {\n NotificationArgs,\n NotificationPlacement,\n NotificationProps,\n NotificationType,\n NotificationVariant\n} from './types.notification';\nexport default Notification;\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/Feedback/Notification/index.tsx"],"names":["twMerge","normalized","React","jsx","jsxs","Fragment"],"mappings":"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","file":"notification.cjs","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type {\n NotificationArgs,\n NotificationPlacement,\n NotificationProps,\n NotificationType,\n NotificationVariant\n} from './types.notification';\nimport type { PropIcon } from '../../global.types';\n\nconst placementClasses: Record<NotificationPlacement, string> = {\n topLeft: 'top-4 left-4 items-start',\n topRight: 'top-4 right-4 items-end',\n bottomLeft: 'bottom-4 left-4 items-start',\n bottomRight: 'bottom-4 right-4 items-end'\n};\n\nconst typeIconMap: Record<NotificationType, string> = {\n info: 'mdi-information-outline',\n success: 'mdi-check-circle-outline',\n warning: 'mdi-alert-outline',\n error: 'mdi-close-circle-outline'\n};\n\nconst typeAccentMap: Record<NotificationType, string> = {\n info: 'bg-sky-50 text-sky-600',\n success: 'bg-emerald-50 text-emerald-600',\n warning: 'bg-amber-50 text-amber-700',\n error: 'bg-red-50 text-red-600'\n};\n\nconst typeTone: Record<\n NotificationType,\n { bg: string; text: string; border: string; iconBg: string; iconText: string }\n> = {\n info: {\n bg: 'bg-sky-50',\n text: 'text-sky-900',\n border: 'border-sky-200',\n iconBg: 'bg-sky-100',\n iconText: 'text-sky-600'\n },\n success: {\n bg: 'bg-emerald-50',\n text: 'text-emerald-900',\n border: 'border-emerald-200',\n iconBg: 'bg-emerald-100',\n iconText: 'text-emerald-600'\n },\n warning: {\n bg: 'bg-amber-50',\n text: 'text-amber-900',\n border: 'border-amber-200',\n iconBg: 'bg-amber-100',\n iconText: 'text-amber-700'\n },\n error: {\n bg: 'bg-red-50',\n text: 'text-red-900',\n border: 'border-red-200',\n iconBg: 'bg-red-100',\n iconText: 'text-red-600'\n }\n};\n\nconst isBrowser = typeof window !== 'undefined';\n\ntype AutoCloseEntry = {\n timeoutId: ReturnType<typeof setTimeout>;\n duration: number;\n onClose: () => void;\n};\n\nconst autoCloseTimers = new Map<React.Key, AutoCloseEntry>();\n\nconst clearAutoCloseTimer = (key: React.Key) => {\n const existing = autoCloseTimers.get(key);\n if (!existing) return;\n clearTimeout(existing.timeoutId);\n autoCloseTimers.delete(key);\n};\n\nconst scheduleAutoClose = (\n key: React.Key,\n duration: number | null | undefined,\n onClose?: () => void\n) => {\n if (!isBrowser) return;\n if (typeof duration !== 'number' || !Number.isFinite(duration) || duration < 0 || !onClose) {\n clearAutoCloseTimer(key);\n return;\n }\n\n const existing = autoCloseTimers.get(key);\n if (existing && existing.duration === duration && existing.onClose === onClose) return;\n if (existing) clearAutoCloseTimer(key);\n\n const timeoutId = setTimeout(() => {\n autoCloseTimers.delete(key);\n onClose();\n }, duration);\n\n autoCloseTimers.set(key, { timeoutId, duration, onClose });\n};\n\nconst cleanupStaleTimers = (activeKeys: Set<React.Key>) => {\n if (!isBrowser) return;\n for (const key of Array.from(autoCloseTimers.keys())) {\n if (!activeKeys.has(key)) {\n clearAutoCloseTimer(key);\n }\n }\n};\n\nconst resolveVariantClass = (variant: NotificationVariant, type?: NotificationType) => {\n const tone = type ? typeTone[type] : undefined;\n switch (variant) {\n case 'filled':\n return twMerge(\n tone?.bg ?? 'bg-primary/10',\n tone?.text ?? 'text-primary',\n 'border border-transparent shadow-none'\n );\n case 'outline':\n return twMerge(\n 'bg-white/90',\n tone?.text ?? 'text-gray-900',\n tone?.border ?? 'border-primary/20',\n 'border-[1.5px]'\n );\n case 'ghost':\n return twMerge(\n 'bg-transparent shadow-none border border-transparent',\n tone?.text ?? 'text-gray-900'\n );\n case 'solid':\n default:\n return 'bg-white/95 text-gray-900 border border-gray-200';\n }\n};\n\nconst resolveIconClassName = (icon?: PropIcon | string) => {\n if (!icon) return undefined;\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) return undefined;\n if (trimmed.includes(' ')) return trimmed;\n const normalized = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return `mdi ${normalized}`;\n }\n const [library, iconName] = icon;\n const normalized = iconName?.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n return `mdi ${library} ${normalized}`.trim();\n};\n\nconst resolveIconNode = (icon?: React.ReactNode | PropIcon, fallbackClassName?: string) => {\n if (React.isValidElement(icon)) return icon;\n const iconClassName = resolveIconClassName(icon as PropIcon) ?? fallbackClassName;\n if (!iconClassName) return null;\n const hasBase = iconClassName.split(' ').some(token => token.trim() === 'mdi');\n const hasGlyph = iconClassName.includes('mdi-');\n const finalClassName = hasBase && hasGlyph ? iconClassName : `mdi ${iconClassName}`.trim();\n return <i className={finalClassName} aria-hidden />;\n};\n\nconst NotificationCard: React.FC<{\n item: NotificationArgs & { key: React.Key };\n}> = ({ item }) => {\n const {\n key,\n message,\n description,\n icon,\n closeIcon,\n closable = true,\n duration,\n btn,\n onClick,\n className,\n style,\n role = 'status',\n type,\n variant = 'solid',\n ...rest\n } = item;\n\n const hasMessage = message !== undefined && message !== null;\n const hasDescription = description !== undefined && description !== null;\n const hasContent = hasMessage || hasDescription;\n const accentClass = type ? typeAccentMap[type] : undefined;\n const iconNode = resolveIconNode(icon, type ? `mdi ${typeIconMap[type]}` : undefined);\n const closeIconNode = resolveIconNode(closeIcon, 'mdi mdi-close');\n const variantClass = resolveVariantClass(variant as NotificationVariant, type);\n const toneIconBg = type ? typeTone[type]?.iconBg : undefined;\n const toneIconText = type ? typeTone[type]?.iconText : undefined;\n\n return (\n <article\n {...rest}\n role={role}\n className={twMerge(\n 'pointer-events-auto flex w-88 max-w-[calc(100vw-2.5rem)] gap-3 rounded-2xl p-4 shadow-xl ring-1 ring-black/5 backdrop-blur-sm transition hover:-translate-y-0.5 hover:shadow-2xl focus:outline-none',\n 'dark:border-gray-800 dark:bg-gray-900/95 dark:text-gray-50 dark:ring-white/5',\n variantClass,\n className\n )}\n style={style}\n onClick={onClick}\n >\n {iconNode ? (\n <div\n className={twMerge(\n 'mt-0.5 flex h-10 w-10 shrink-0 items-center justify-center rounded-xl text-xl',\n toneIconBg ?? accentClass ?? 'bg-primary/10',\n toneIconText ?? 'text-primary'\n )}\n >\n {iconNode}\n </div>\n ) : null}\n <div className='min-w-0 flex-1 space-y-1'>\n {hasContent ? (\n <div className='space-y-1'>\n {hasMessage ? (\n <div className='text-[15px] font-semibold leading-5 text-gray-900 dark:text-white'>\n {message}\n </div>\n ) : null}\n {hasDescription ? (\n <div className='text-sm leading-6 text-gray-600 dark:text-gray-300'>\n {description}\n </div>\n ) : null}\n </div>\n ) : null}\n {btn ? <div className='pt-1 text-sm'>{btn}</div> : null}\n </div>\n {closable ? (\n <button\n type='button'\n aria-label='Zavřít upozornění'\n className='-mr-1 -mt-1 h-8 w-8 shrink-0 rounded-full text-gray-500 transition hover:bg-gray-100 hover:text-gray-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 dark:text-gray-400 dark:hover:bg-gray-800 dark:hover:text-white'\n onClick={event => {\n event.stopPropagation();\n item.onClose?.();\n }}\n >\n {closeIconNode}\n </button>\n ) : null}\n </article>\n );\n};\n\nconst Notification: React.FC<NotificationProps> = ({\n items = [],\n placement = 'topRight',\n variant = 'solid',\n gap = 12,\n containerClassName,\n className,\n ...rest\n}) => {\n if (!items.length) {\n if (isBrowser) {\n for (const key of Array.from(autoCloseTimers.keys())) {\n clearAutoCloseTimer(key);\n }\n }\n return null;\n }\n\n const grouped = new Map<NotificationPlacement, (NotificationArgs & { key: React.Key })[]>();\n const activeKeys = new Set<React.Key>();\n items.forEach(item => {\n const resolvedKey = item.key ?? `notification-${item.message ?? Math.random()}`;\n const resolvedPlacement = item.placement ?? placement;\n const resolvedVariant = item.variant ?? variant;\n activeKeys.add(resolvedKey);\n scheduleAutoClose(resolvedKey, item.duration, item.onClose);\n const group = grouped.get(resolvedPlacement) ?? [];\n group.push({ ...item, key: resolvedKey, variant: resolvedVariant });\n grouped.set(resolvedPlacement, group);\n });\n cleanupStaleTimers(activeKeys);\n\n return (\n <>\n {Array.from(grouped.entries()).map(([groupPlacement, groupItems]) => (\n <div\n key={groupPlacement}\n className={twMerge(\n 'pointer-events-none fixed z-70 flex w-full max-w-[24rem] flex-col',\n placementClasses[groupPlacement],\n containerClassName,\n className\n )}\n style={{ gap: `${gap}px` }}\n {...rest}\n >\n {groupItems.map(item => (\n <NotificationCard key={item.key} item={item} />\n ))}\n </div>\n ))}\n </>\n );\n};\n\nexport type {\n NotificationArgs,\n NotificationPlacement,\n NotificationProps,\n NotificationType,\n NotificationVariant\n} from './types.notification';\nexport default Notification;\n"]}
|
package/dist/notification.js
CHANGED
package/dist/styles.css
CHANGED
|
@@ -2383,6 +2383,24 @@
|
|
|
2383
2383
|
-webkit-user-select: none;
|
|
2384
2384
|
user-select: none;
|
|
2385
2385
|
}
|
|
2386
|
+
.group-focus-within\/menu\:pointer-events-auto {
|
|
2387
|
+
&:is(:where(.group\/menu):focus-within *) {
|
|
2388
|
+
pointer-events: auto;
|
|
2389
|
+
}
|
|
2390
|
+
}
|
|
2391
|
+
.group-focus-within\/menu\:scale-100 {
|
|
2392
|
+
&:is(:where(.group\/menu):focus-within *) {
|
|
2393
|
+
--tw-scale-x: 100%;
|
|
2394
|
+
--tw-scale-y: 100%;
|
|
2395
|
+
--tw-scale-z: 100%;
|
|
2396
|
+
scale: var(--tw-scale-x) var(--tw-scale-y);
|
|
2397
|
+
}
|
|
2398
|
+
}
|
|
2399
|
+
.group-focus-within\/menu\:opacity-100 {
|
|
2400
|
+
&:is(:where(.group\/menu):focus-within *) {
|
|
2401
|
+
opacity: 100%;
|
|
2402
|
+
}
|
|
2403
|
+
}
|
|
2386
2404
|
.group-focus-within\/tooltip\:pointer-events-auto {
|
|
2387
2405
|
&:is(:where(.group\/tooltip):focus-within *) {
|
|
2388
2406
|
pointer-events: auto;
|
|
@@ -2401,6 +2419,30 @@
|
|
|
2401
2419
|
opacity: 100%;
|
|
2402
2420
|
}
|
|
2403
2421
|
}
|
|
2422
|
+
.group-hover\/menu\:pointer-events-auto {
|
|
2423
|
+
&:is(:where(.group\/menu):hover *) {
|
|
2424
|
+
@media (hover: hover) {
|
|
2425
|
+
pointer-events: auto;
|
|
2426
|
+
}
|
|
2427
|
+
}
|
|
2428
|
+
}
|
|
2429
|
+
.group-hover\/menu\:scale-100 {
|
|
2430
|
+
&:is(:where(.group\/menu):hover *) {
|
|
2431
|
+
@media (hover: hover) {
|
|
2432
|
+
--tw-scale-x: 100%;
|
|
2433
|
+
--tw-scale-y: 100%;
|
|
2434
|
+
--tw-scale-z: 100%;
|
|
2435
|
+
scale: var(--tw-scale-x) var(--tw-scale-y);
|
|
2436
|
+
}
|
|
2437
|
+
}
|
|
2438
|
+
}
|
|
2439
|
+
.group-hover\/menu\:opacity-100 {
|
|
2440
|
+
&:is(:where(.group\/menu):hover *) {
|
|
2441
|
+
@media (hover: hover) {
|
|
2442
|
+
opacity: 100%;
|
|
2443
|
+
}
|
|
2444
|
+
}
|
|
2445
|
+
}
|
|
2404
2446
|
.group-hover\/tooltip\:pointer-events-auto {
|
|
2405
2447
|
&:is(:where(.group\/tooltip):hover *) {
|
|
2406
2448
|
@media (hover: hover) {
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Feedback/Notification/index.tsx"],"names":["normalized"],"mappings":"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","file":"chunk-KI4DBZ2V.js","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport type {\n NotificationArgs,\n NotificationPlacement,\n NotificationProps,\n NotificationType,\n NotificationVariant\n} from './types.notification';\nimport type { PropIcon } from '../../global.types';\n\nconst placementClasses: Record<NotificationPlacement, string> = {\n topLeft: 'top-4 left-4 items-start',\n topRight: 'top-4 right-4 items-end',\n bottomLeft: 'bottom-4 left-4 items-start',\n bottomRight: 'bottom-4 right-4 items-end'\n};\n\nconst typeIconMap: Record<NotificationType, string> = {\n info: 'mdi-information-outline',\n success: 'mdi-check-circle-outline',\n warning: 'mdi-alert-outline',\n error: 'mdi-close-circle-outline'\n};\n\nconst typeAccentMap: Record<NotificationType, string> = {\n info: 'bg-sky-50 text-sky-600',\n success: 'bg-emerald-50 text-emerald-600',\n warning: 'bg-amber-50 text-amber-700',\n error: 'bg-red-50 text-red-600'\n};\n\nconst typeTone: Record<\n NotificationType,\n { bg: string; text: string; border: string; iconBg: string; iconText: string }\n> = {\n info: {\n bg: 'bg-sky-50',\n text: 'text-sky-900',\n border: 'border-sky-200',\n iconBg: 'bg-sky-100',\n iconText: 'text-sky-600'\n },\n success: {\n bg: 'bg-emerald-50',\n text: 'text-emerald-900',\n border: 'border-emerald-200',\n iconBg: 'bg-emerald-100',\n iconText: 'text-emerald-600'\n },\n warning: {\n bg: 'bg-amber-50',\n text: 'text-amber-900',\n border: 'border-amber-200',\n iconBg: 'bg-amber-100',\n iconText: 'text-amber-700'\n },\n error: {\n bg: 'bg-red-50',\n text: 'text-red-900',\n border: 'border-red-200',\n iconBg: 'bg-red-100',\n iconText: 'text-red-600'\n }\n};\n\nconst resolveVariantClass = (variant: NotificationVariant, type?: NotificationType) => {\n const tone = type ? typeTone[type] : undefined;\n switch (variant) {\n case 'filled':\n return twMerge(\n tone?.bg ?? 'bg-primary/10',\n tone?.text ?? 'text-primary',\n 'border border-transparent shadow-none'\n );\n case 'outline':\n return twMerge(\n 'bg-white/90',\n tone?.text ?? 'text-gray-900',\n tone?.border ?? 'border-primary/20',\n 'border-[1.5px]'\n );\n case 'ghost':\n return twMerge(\n 'bg-transparent shadow-none border border-transparent',\n tone?.text ?? 'text-gray-900'\n );\n case 'solid':\n default:\n return 'bg-white/95 text-gray-900 border border-gray-200';\n }\n};\n\nconst resolveIconClassName = (icon?: PropIcon | string) => {\n if (!icon) return undefined;\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) return undefined;\n if (trimmed.includes(' ')) return trimmed;\n const normalized = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return `mdi ${normalized}`;\n }\n const [library, iconName] = icon;\n const normalized = iconName?.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n return `mdi ${library} ${normalized}`.trim();\n};\n\nconst resolveIconNode = (icon?: React.ReactNode | PropIcon, fallbackClassName?: string) => {\n if (React.isValidElement(icon)) return icon;\n const iconClassName = resolveIconClassName(icon as PropIcon) ?? fallbackClassName;\n if (!iconClassName) return null;\n const hasBase = iconClassName.split(' ').some(token => token.trim() === 'mdi');\n const hasGlyph = iconClassName.includes('mdi-');\n const finalClassName = hasBase && hasGlyph ? iconClassName : `mdi ${iconClassName}`.trim();\n return <i className={finalClassName} aria-hidden />;\n};\n\nconst NotificationCard: React.FC<{\n item: NotificationArgs & { key: React.Key };\n}> = ({ item }) => {\n const {\n key,\n message,\n description,\n icon,\n closeIcon,\n closable = true,\n btn,\n onClick,\n className,\n style,\n role = 'status',\n type,\n variant = 'solid',\n ...rest\n } = item;\n\n const hasMessage = message !== undefined && message !== null;\n const hasDescription = description !== undefined && description !== null;\n const hasContent = hasMessage || hasDescription;\n const accentClass = type ? typeAccentMap[type] : undefined;\n const iconNode = resolveIconNode(icon, type ? `mdi ${typeIconMap[type]}` : undefined);\n const closeIconNode = resolveIconNode(closeIcon, 'mdi mdi-close');\n const variantClass = resolveVariantClass(variant as NotificationVariant, type);\n const toneIconBg = type ? typeTone[type]?.iconBg : undefined;\n const toneIconText = type ? typeTone[type]?.iconText : undefined;\n\n return (\n <article\n {...rest}\n role={role}\n className={twMerge(\n 'pointer-events-auto flex w-88 max-w-[calc(100vw-2.5rem)] gap-3 rounded-2xl p-4 shadow-xl ring-1 ring-black/5 backdrop-blur-sm transition hover:-translate-y-0.5 hover:shadow-2xl focus:outline-none',\n 'dark:border-gray-800 dark:bg-gray-900/95 dark:text-gray-50 dark:ring-white/5',\n variantClass,\n className\n )}\n style={style}\n onClick={onClick}\n >\n {iconNode ? (\n <div\n className={twMerge(\n 'mt-0.5 flex h-10 w-10 shrink-0 items-center justify-center rounded-xl text-xl',\n toneIconBg ?? accentClass ?? 'bg-primary/10',\n toneIconText ?? 'text-primary'\n )}\n >\n {iconNode}\n </div>\n ) : null}\n <div className='min-w-0 flex-1 space-y-1'>\n {hasContent ? (\n <div className='space-y-1'>\n {hasMessage ? (\n <div className='text-[15px] font-semibold leading-5 text-gray-900 dark:text-white'>\n {message}\n </div>\n ) : null}\n {hasDescription ? (\n <div className='text-sm leading-6 text-gray-600 dark:text-gray-300'>\n {description}\n </div>\n ) : null}\n </div>\n ) : null}\n {btn ? <div className='pt-1 text-sm'>{btn}</div> : null}\n </div>\n {closable ? (\n <button\n type='button'\n aria-label='Zavřít upozornění'\n className='-mr-1 -mt-1 h-8 w-8 shrink-0 rounded-full text-gray-500 transition hover:bg-gray-100 hover:text-gray-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 dark:text-gray-400 dark:hover:bg-gray-800 dark:hover:text-white'\n onClick={event => {\n event.stopPropagation();\n item.onClose?.();\n }}\n >\n {closeIconNode}\n </button>\n ) : null}\n </article>\n );\n};\n\nconst Notification: React.FC<NotificationProps> = ({\n items = [],\n placement = 'topRight',\n variant = 'solid',\n gap = 12,\n containerClassName,\n className,\n ...rest\n}) => {\n if (!items.length) return null;\n\n const grouped = new Map<NotificationPlacement, (NotificationArgs & { key: React.Key })[]>();\n items.forEach(item => {\n const resolvedKey = item.key ?? `notification-${item.message ?? Math.random()}`;\n const resolvedPlacement = item.placement ?? placement;\n const resolvedVariant = item.variant ?? variant;\n const group = grouped.get(resolvedPlacement) ?? [];\n group.push({ ...item, key: resolvedKey, variant: resolvedVariant });\n grouped.set(resolvedPlacement, group);\n });\n\n return (\n <>\n {Array.from(grouped.entries()).map(([groupPlacement, groupItems]) => (\n <div\n key={groupPlacement}\n className={twMerge(\n 'pointer-events-none fixed z-70 flex w-full max-w-[24rem] flex-col',\n placementClasses[groupPlacement],\n containerClassName,\n className\n )}\n style={{ gap: `${gap}px` }}\n {...rest}\n >\n {groupItems.map(item => (\n <NotificationCard key={item.key} item={item} />\n ))}\n </div>\n ))}\n </>\n );\n};\n\nexport type {\n NotificationArgs,\n NotificationPlacement,\n NotificationProps,\n NotificationType,\n NotificationVariant\n} from './types.notification';\nexport default Notification;\n"]}
|