@lindle/linoardo 1.0.21 → 1.0.22
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/button.cjs +2 -1
- package/dist/button.cjs.map +1 -1
- package/dist/button.js +1 -1
- package/dist/chunk-67USTSXI.js +214 -0
- package/dist/chunk-67USTSXI.js.map +1 -0
- package/dist/{chunk-RFPNVLAD.js → chunk-F2G2JRKA.js} +4 -3
- package/dist/chunk-F2G2JRKA.js.map +1 -0
- package/dist/{chunk-QRBJFDV5.js → chunk-NEYVJE67.js} +3 -3
- package/dist/{chunk-QRBJFDV5.js.map → chunk-NEYVJE67.js.map} +1 -1
- package/dist/chunk-Z5A2OIDI.js +312 -0
- package/dist/chunk-Z5A2OIDI.js.map +1 -0
- package/dist/index.cjs +653 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +27 -1
- package/dist/index.d.ts +27 -1
- package/dist/index.js +147 -2
- package/dist/index.js.map +1 -1
- package/dist/notification.cjs +236 -0
- package/dist/notification.cjs.map +1 -0
- package/dist/notification.d.cts +34 -0
- package/dist/notification.d.ts +34 -0
- package/dist/notification.js +3 -0
- package/dist/notification.js.map +1 -0
- package/dist/profileCard.cjs +2 -1
- package/dist/profileCard.cjs.map +1 -1
- package/dist/profileCard.js +2 -2
- package/dist/progress.cjs +314 -0
- package/dist/progress.cjs.map +1 -0
- package/dist/progress.d.cts +30 -0
- package/dist/progress.d.ts +30 -0
- package/dist/progress.js +3 -0
- package/dist/progress.js.map +1 -0
- package/dist/styles.css +276 -0
- package/package.json +11 -1
- package/dist/chunk-RFPNVLAD.js.map +0 -1
package/dist/index.d.cts
CHANGED
|
@@ -7,6 +7,7 @@ export { default as Dialog, DialogProps } from './dialog.cjs';
|
|
|
7
7
|
export { default as ToolTip, ToolTipPlacement, ToolTipProps } from './tooltip.cjs';
|
|
8
8
|
export { default as Card, CardMediaProps, CardProps, CardSectionProps, CardTextProps } from './card.cjs';
|
|
9
9
|
export { default as Masonry, MasonryProps, MasonryRenderItem } from './masonry.cjs';
|
|
10
|
+
import * as react from 'react';
|
|
10
11
|
export { default as Hero, HeroProps } from './hero.cjs';
|
|
11
12
|
export { Avatar, Badge, default as ProfileCard, ProfileCardLayout, ProfileCardProps, SocialLink } from './profileCard.cjs';
|
|
12
13
|
export { default as Input } from './input.cjs';
|
|
@@ -14,8 +15,33 @@ export { default as Select, SelectOption, SelectOptionObject, SelectProps } from
|
|
|
14
15
|
export { default as Slider } from './slider.cjs';
|
|
15
16
|
export { default as Switch } from './switch.cjs';
|
|
16
17
|
export { default as Icon } from './icon.cjs';
|
|
18
|
+
export { default as Notification, NotificationArgs, NotificationPlacement, NotificationProps, NotificationType, NotificationVariant } from './notification.cjs';
|
|
19
|
+
export { default as Progress, ProgressProps, ProgressStatus, ProgressType } from './progress.cjs';
|
|
17
20
|
export { e as ExpansionPanelDensity, E as ExpansionPanelItem, a as ExpansionPanelItemProps, b as ExpansionPanelProps, f as ExpansionPanelRounded, c as ExpansionPanelValue, d as ExpansionPanelVariant } from './ExpansionPanelItem-Bd6ZWGkR.cjs';
|
|
18
21
|
export { c as ListDensity, L as ListItem, a as ListItemProps, d as ListLines, e as ListRounded, b as ListVariant } from './index-B5n8tN2G.cjs';
|
|
19
|
-
import 'react';
|
|
20
22
|
import './global.types-E2uVLemv.cjs';
|
|
21
23
|
import './types-BCqIOkp1.cjs';
|
|
24
|
+
|
|
25
|
+
type AppBarNavItem = {
|
|
26
|
+
label: react.ReactNode;
|
|
27
|
+
href?: string;
|
|
28
|
+
active?: boolean;
|
|
29
|
+
onClick?: react.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement>;
|
|
30
|
+
};
|
|
31
|
+
type AppBarProps = react.HTMLAttributes<HTMLElement> & {
|
|
32
|
+
title?: react.ReactNode;
|
|
33
|
+
logo?: string;
|
|
34
|
+
logoAlt?: string;
|
|
35
|
+
brandHref?: string;
|
|
36
|
+
navigation?: AppBarNavItem[];
|
|
37
|
+
actions?: react.ReactNode;
|
|
38
|
+
position?: 'fixed' | 'absolute' | 'sticky' | 'static' | 'relative';
|
|
39
|
+
color?: 'primary' | 'surface' | 'muted' | 'dark' | 'transparent';
|
|
40
|
+
dense?: boolean;
|
|
41
|
+
elevated?: boolean;
|
|
42
|
+
contained?: boolean;
|
|
43
|
+
titlePosition?: 'start' | 'center' | 'end';
|
|
44
|
+
};
|
|
45
|
+
declare const AppBar: react.FC<AppBarProps>;
|
|
46
|
+
|
|
47
|
+
export { AppBar, type AppBarNavItem, type AppBarProps };
|
package/dist/index.d.ts
CHANGED
|
@@ -7,6 +7,7 @@ export { default as Dialog, DialogProps } from './dialog.js';
|
|
|
7
7
|
export { default as ToolTip, ToolTipPlacement, ToolTipProps } from './tooltip.js';
|
|
8
8
|
export { default as Card, CardMediaProps, CardProps, CardSectionProps, CardTextProps } from './card.js';
|
|
9
9
|
export { default as Masonry, MasonryProps, MasonryRenderItem } from './masonry.js';
|
|
10
|
+
import * as react from 'react';
|
|
10
11
|
export { default as Hero, HeroProps } from './hero.js';
|
|
11
12
|
export { Avatar, Badge, default as ProfileCard, ProfileCardLayout, ProfileCardProps, SocialLink } from './profileCard.js';
|
|
12
13
|
export { default as Input } from './input.js';
|
|
@@ -14,8 +15,33 @@ export { default as Select, SelectOption, SelectOptionObject, SelectProps } from
|
|
|
14
15
|
export { default as Slider } from './slider.js';
|
|
15
16
|
export { default as Switch } from './switch.js';
|
|
16
17
|
export { default as Icon } from './icon.js';
|
|
18
|
+
export { default as Notification, NotificationArgs, NotificationPlacement, NotificationProps, NotificationType, NotificationVariant } from './notification.js';
|
|
19
|
+
export { default as Progress, ProgressProps, ProgressStatus, ProgressType } from './progress.js';
|
|
17
20
|
export { e as ExpansionPanelDensity, E as ExpansionPanelItem, a as ExpansionPanelItemProps, b as ExpansionPanelProps, f as ExpansionPanelRounded, c as ExpansionPanelValue, d as ExpansionPanelVariant } from './ExpansionPanelItem-DOjgDeB6.js';
|
|
18
21
|
export { c as ListDensity, L as ListItem, a as ListItemProps, d as ListLines, e as ListRounded, b as ListVariant } from './index-D4-O-oJt.js';
|
|
19
|
-
import 'react';
|
|
20
22
|
import './global.types-E2uVLemv.js';
|
|
21
23
|
import './types-ChXN4u7x.js';
|
|
24
|
+
|
|
25
|
+
type AppBarNavItem = {
|
|
26
|
+
label: react.ReactNode;
|
|
27
|
+
href?: string;
|
|
28
|
+
active?: boolean;
|
|
29
|
+
onClick?: react.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement>;
|
|
30
|
+
};
|
|
31
|
+
type AppBarProps = react.HTMLAttributes<HTMLElement> & {
|
|
32
|
+
title?: react.ReactNode;
|
|
33
|
+
logo?: string;
|
|
34
|
+
logoAlt?: string;
|
|
35
|
+
brandHref?: string;
|
|
36
|
+
navigation?: AppBarNavItem[];
|
|
37
|
+
actions?: react.ReactNode;
|
|
38
|
+
position?: 'fixed' | 'absolute' | 'sticky' | 'static' | 'relative';
|
|
39
|
+
color?: 'primary' | 'surface' | 'muted' | 'dark' | 'transparent';
|
|
40
|
+
dense?: boolean;
|
|
41
|
+
elevated?: boolean;
|
|
42
|
+
contained?: boolean;
|
|
43
|
+
titlePosition?: 'start' | 'center' | 'end';
|
|
44
|
+
};
|
|
45
|
+
declare const AppBar: react.FC<AppBarProps>;
|
|
46
|
+
|
|
47
|
+
export { AppBar, type AppBarNavItem, type AppBarProps };
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export { Icon_default as Icon } from './chunk-HEXJCQRO.js';
|
|
2
2
|
export { Hero_default as Hero } from './chunk-VPF7M2PB.js';
|
|
3
|
-
export { ProfileCard_default as ProfileCard } from './chunk-
|
|
3
|
+
export { ProfileCard_default as ProfileCard } from './chunk-NEYVJE67.js';
|
|
4
|
+
export { Notification_default as Notification } from './chunk-67USTSXI.js';
|
|
5
|
+
export { Progress_default as Progress } from './chunk-Z5A2OIDI.js';
|
|
4
6
|
export { Dialog_default as Dialog } from './chunk-LIEBZOLG.js';
|
|
5
7
|
export { ToolTip_default as ToolTip } from './chunk-U2AL7XFY.js';
|
|
6
8
|
export { Card_default as Card } from './chunk-2UL3S6KC.js';
|
|
@@ -9,7 +11,7 @@ export { Input_default as Input } from './chunk-JGEXEDKS.js';
|
|
|
9
11
|
export { Slider_default as Slider } from './chunk-GMDNSU26.js';
|
|
10
12
|
export { Switch_default as Switch } from './chunk-5LWU5T2C.js';
|
|
11
13
|
export { Select_default as Select } from './chunk-SAGQYMS3.js';
|
|
12
|
-
export { Button_default as Button } from './chunk-
|
|
14
|
+
export { Button_default as Button } from './chunk-F2G2JRKA.js';
|
|
13
15
|
export { Chip_default as Chip } from './chunk-DSZ3EOQB.js';
|
|
14
16
|
import './chunk-IEILIKS2.js';
|
|
15
17
|
export { List_default as List } from './chunk-AK7LFJI4.js';
|
|
@@ -17,5 +19,148 @@ export { Item_default as ListItem } from './chunk-5WQW6YSJ.js';
|
|
|
17
19
|
export { Menu_default as Menu } from './chunk-T37VPLS4.js';
|
|
18
20
|
export { ExpansionPanel_default as ExpansionPanel } from './chunk-LYP7V32H.js';
|
|
19
21
|
export { ExpansionPanelItem_default as ExpansionPanelItem } from './chunk-KRYWWWXR.js';
|
|
22
|
+
import * as React from 'react';
|
|
23
|
+
import { twMerge } from 'tailwind-merge';
|
|
24
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
25
|
+
|
|
26
|
+
var positionClasses = {
|
|
27
|
+
fixed: "fixed inset-x-0 top-0",
|
|
28
|
+
absolute: "absolute inset-x-0 top-0",
|
|
29
|
+
sticky: "sticky inset-x-0 top-0",
|
|
30
|
+
static: "static",
|
|
31
|
+
relative: "relative"
|
|
32
|
+
};
|
|
33
|
+
var colorClasses = {
|
|
34
|
+
primary: "bg-primary text-white",
|
|
35
|
+
surface: "bg-white text-gray-900 border-b border-gray-200",
|
|
36
|
+
muted: "bg-gray-50 text-gray-900 border-b border-gray-200",
|
|
37
|
+
dark: "bg-gray-900 text-white",
|
|
38
|
+
transparent: "bg-transparent text-inherit"
|
|
39
|
+
};
|
|
40
|
+
var AppBar = ({
|
|
41
|
+
title,
|
|
42
|
+
logo,
|
|
43
|
+
logoAlt = "Logo",
|
|
44
|
+
brandHref,
|
|
45
|
+
navigation = [],
|
|
46
|
+
actions,
|
|
47
|
+
position = "static",
|
|
48
|
+
color = "surface",
|
|
49
|
+
dense = false,
|
|
50
|
+
elevated = true,
|
|
51
|
+
contained = true,
|
|
52
|
+
titlePosition = "start",
|
|
53
|
+
className,
|
|
54
|
+
children,
|
|
55
|
+
...rest
|
|
56
|
+
}) => {
|
|
57
|
+
const [mobileOpen, setMobileOpen] = React.useState(false);
|
|
58
|
+
const isDark = color === "primary" || color === "dark";
|
|
59
|
+
const isTransparent = color === "transparent";
|
|
60
|
+
const barClass = twMerge(
|
|
61
|
+
"app-bar z-40 w-full backdrop-blur-md",
|
|
62
|
+
positionClasses[position] ?? positionClasses.static,
|
|
63
|
+
colorClasses[color] ?? colorClasses.surface,
|
|
64
|
+
elevated && !isTransparent ? "shadow-sm shadow-black/10" : void 0,
|
|
65
|
+
"relative",
|
|
66
|
+
className
|
|
67
|
+
);
|
|
68
|
+
const innerClass = twMerge(
|
|
69
|
+
"mx-auto flex w-full items-center gap-4",
|
|
70
|
+
contained ? "max-w-6xl px-4 sm:px-6 lg:px-8" : "px-4",
|
|
71
|
+
dense ? "py-2.5" : "py-4"
|
|
72
|
+
);
|
|
73
|
+
const brandTextClass = isDark ? "text-white" : "text-gray-900";
|
|
74
|
+
const navBaseClass = twMerge(
|
|
75
|
+
"inline-flex items-center gap-2 rounded-xl px-3 py-2 text-sm font-medium transition focus-visible:outline-none",
|
|
76
|
+
isDark ? "hover:bg-white/10 focus-visible:ring-2 focus-visible:ring-white/70" : "hover:bg-gray-100 focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-transparent"
|
|
77
|
+
);
|
|
78
|
+
const navActiveClass = isDark ? "bg-white/15 text-white" : "bg-primary/10 text-primary";
|
|
79
|
+
const renderNavItem = (item, index) => {
|
|
80
|
+
const { href, label, active, onClick } = item;
|
|
81
|
+
const Component = href ? "a" : "button";
|
|
82
|
+
const resolvedHref = href && href.trim().length > 0 ? href : void 0;
|
|
83
|
+
return /* @__PURE__ */ jsx(
|
|
84
|
+
Component,
|
|
85
|
+
{
|
|
86
|
+
href: resolvedHref,
|
|
87
|
+
onClick,
|
|
88
|
+
className: twMerge(navBaseClass, active ? navActiveClass : void 0),
|
|
89
|
+
"aria-current": active ? "page" : void 0,
|
|
90
|
+
children: label
|
|
91
|
+
},
|
|
92
|
+
`${resolvedHref ?? "item"}-${index}`
|
|
93
|
+
);
|
|
94
|
+
};
|
|
95
|
+
const brandAlignClass = titlePosition === "center" ? "justify-self-center text-center" : titlePosition === "end" ? "justify-self-end text-right" : "justify-self-start";
|
|
96
|
+
const brandNode = title || logo ? /* @__PURE__ */ jsxs("div", { className: twMerge("flex min-w-0 items-center gap-3", brandAlignClass), children: [
|
|
97
|
+
logo ? /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-xl bg-white/10 ring-1 ring-black/5", children: /* @__PURE__ */ jsx(
|
|
98
|
+
"img",
|
|
99
|
+
{
|
|
100
|
+
src: logo,
|
|
101
|
+
alt: logoAlt,
|
|
102
|
+
className: "h-full w-full object-cover",
|
|
103
|
+
loading: "lazy",
|
|
104
|
+
decoding: "async"
|
|
105
|
+
}
|
|
106
|
+
) }) : null,
|
|
107
|
+
/* @__PURE__ */ jsx("div", { className: "min-w-0", children: title ? /* @__PURE__ */ jsx("div", { className: twMerge("text-base font-semibold leading-tight", brandTextClass), children: brandHref ? /* @__PURE__ */ jsx("a", { href: brandHref, className: "hover:underline focus-visible:outline-none", children: title }) : title }) : null })
|
|
108
|
+
] }) : null;
|
|
109
|
+
return /* @__PURE__ */ jsxs("header", { ...rest, className: barClass, children: [
|
|
110
|
+
/* @__PURE__ */ jsx("div", { className: innerClass, children: /* @__PURE__ */ jsxs("div", { className: "grid w-full grid-cols-[auto_1fr_auto] items-center gap-3", children: [
|
|
111
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
112
|
+
navigation.length > 0 ? /* @__PURE__ */ jsx(
|
|
113
|
+
"button",
|
|
114
|
+
{
|
|
115
|
+
type: "button",
|
|
116
|
+
"aria-label": "Otev\u0159\xEDt navigaci",
|
|
117
|
+
className: twMerge(
|
|
118
|
+
"inline-flex h-10 w-10 items-center justify-center rounded-xl text-xl sm:hidden",
|
|
119
|
+
isDark ? "text-white hover:bg-white/10 focus-visible:ring-2 focus-visible:ring-white/60" : "text-gray-700 hover:bg-gray-100 focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-transparent"
|
|
120
|
+
),
|
|
121
|
+
"aria-expanded": mobileOpen,
|
|
122
|
+
onClick: () => setMobileOpen((open) => !open),
|
|
123
|
+
children: /* @__PURE__ */ jsx("i", { className: mobileOpen ? "mdi mdi-close" : "mdi mdi-menu", "aria-hidden": true })
|
|
124
|
+
}
|
|
125
|
+
) : null,
|
|
126
|
+
navigation.length > 0 ? /* @__PURE__ */ jsx("nav", { className: "hidden items-center gap-1 sm:flex", "aria-label": "Hlavni navigace", children: navigation.map(renderNavItem) }) : null
|
|
127
|
+
] }),
|
|
128
|
+
brandNode,
|
|
129
|
+
/* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center justify-end gap-2", children: [
|
|
130
|
+
children,
|
|
131
|
+
actions
|
|
132
|
+
] })
|
|
133
|
+
] }) }),
|
|
134
|
+
navigation.length > 0 && mobileOpen ? /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsx("nav", { className: "absolute inset-x-0 top-full border-t border-gray-200/70 bg-white/95 p-3 shadow-lg shadow-gray-900/5 backdrop-blur-md", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", "aria-label": "Mobilni navigace", children: navigation.map((item, index) => {
|
|
135
|
+
const { href, label, active, onClick } = item;
|
|
136
|
+
const Component = href ? "a" : "button";
|
|
137
|
+
const resolvedHref = href && href.trim().length > 0 ? href : void 0;
|
|
138
|
+
return /* @__PURE__ */ jsxs(
|
|
139
|
+
Component,
|
|
140
|
+
{
|
|
141
|
+
href: resolvedHref,
|
|
142
|
+
onClick: (event) => {
|
|
143
|
+
onClick?.(event);
|
|
144
|
+
setMobileOpen(false);
|
|
145
|
+
},
|
|
146
|
+
className: twMerge(
|
|
147
|
+
"flex items-center justify-between rounded-xl px-3 py-2 text-sm font-medium transition",
|
|
148
|
+
active ? "bg-primary/10 text-primary" : "text-gray-800 hover:bg-gray-100"
|
|
149
|
+
),
|
|
150
|
+
"aria-current": active ? "page" : void 0,
|
|
151
|
+
children: [
|
|
152
|
+
label,
|
|
153
|
+
active ? /* @__PURE__ */ jsx("i", { className: "mdi mdi-circle-small text-primary", "aria-hidden": true }) : null
|
|
154
|
+
]
|
|
155
|
+
},
|
|
156
|
+
`${resolvedHref ?? "mobile-item"}-${index}`
|
|
157
|
+
);
|
|
158
|
+
}) }) }) }) : null
|
|
159
|
+
] });
|
|
160
|
+
};
|
|
161
|
+
AppBar.displayName = "AppBar";
|
|
162
|
+
var AppBar_default = AppBar;
|
|
163
|
+
|
|
164
|
+
export { AppBar_default as AppBar };
|
|
20
165
|
//# sourceMappingURL=index.js.map
|
|
21
166
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../src/Blocks/AppBar/index.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import * as React from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nexport type AppBarNavItem = {\n label: React.ReactNode;\n href?: string;\n active?: boolean;\n onClick?: React.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement>;\n};\n\nexport type AppBarProps = React.HTMLAttributes<HTMLElement> & {\n title?: React.ReactNode;\n logo?: string;\n logoAlt?: string;\n brandHref?: string;\n navigation?: AppBarNavItem[];\n actions?: React.ReactNode;\n position?: 'fixed' | 'absolute' | 'sticky' | 'static' | 'relative';\n color?: 'primary' | 'surface' | 'muted' | 'dark' | 'transparent';\n dense?: boolean;\n elevated?: boolean;\n contained?: boolean;\n titlePosition?: 'start' | 'center' | 'end';\n};\n\nconst positionClasses: Record<NonNullable<AppBarProps['position']>, string> = {\n fixed: 'fixed inset-x-0 top-0',\n absolute: 'absolute inset-x-0 top-0',\n sticky: 'sticky inset-x-0 top-0',\n static: 'static',\n relative: 'relative'\n};\n\nconst colorClasses: Record<NonNullable<AppBarProps['color']>, string> = {\n primary: 'bg-primary text-white',\n surface: 'bg-white text-gray-900 border-b border-gray-200',\n muted: 'bg-gray-50 text-gray-900 border-b border-gray-200',\n dark: 'bg-gray-900 text-white',\n transparent: 'bg-transparent text-inherit'\n};\n\nconst AppBar: React.FC<AppBarProps> = ({\n title,\n logo,\n logoAlt = 'Logo',\n brandHref,\n navigation = [],\n actions,\n position = 'static',\n color = 'surface',\n dense = false,\n elevated = true,\n contained = true,\n titlePosition = 'start',\n className,\n children,\n ...rest\n}) => {\n const [mobileOpen, setMobileOpen] = React.useState(false);\n\n const isDark = color === 'primary' || color === 'dark';\n const isTransparent = color === 'transparent';\n\n const barClass = twMerge(\n 'app-bar z-40 w-full backdrop-blur-md',\n positionClasses[position] ?? positionClasses.static,\n colorClasses[color] ?? colorClasses.surface,\n elevated && !isTransparent ? 'shadow-sm shadow-black/10' : undefined,\n 'relative',\n className\n );\n\n const innerClass = twMerge(\n 'mx-auto flex w-full items-center gap-4',\n contained ? 'max-w-6xl px-4 sm:px-6 lg:px-8' : 'px-4',\n dense ? 'py-2.5' : 'py-4'\n );\n\n const brandTextClass = isDark ? 'text-white' : 'text-gray-900';\n const navBaseClass = twMerge(\n 'inline-flex items-center gap-2 rounded-xl px-3 py-2 text-sm font-medium transition focus-visible:outline-none',\n isDark\n ? 'hover:bg-white/10 focus-visible:ring-2 focus-visible:ring-white/70'\n : 'hover:bg-gray-100 focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-transparent'\n );\n const navActiveClass = isDark ? 'bg-white/15 text-white' : 'bg-primary/10 text-primary';\n\n const renderNavItem = (item: AppBarNavItem, index: number) => {\n const { href, label, active, onClick } = item;\n const Component = href ? 'a' : 'button';\n const resolvedHref = href && href.trim().length > 0 ? href : undefined;\n return (\n <Component\n key={`${resolvedHref ?? 'item'}-${index}`}\n href={resolvedHref}\n onClick={onClick as never}\n className={twMerge(navBaseClass, active ? navActiveClass : undefined)}\n aria-current={active ? 'page' : undefined}\n >\n {label}\n </Component>\n );\n };\n\n const brandAlignClass =\n titlePosition === 'center'\n ? 'justify-self-center text-center'\n : titlePosition === 'end'\n ? 'justify-self-end text-right'\n : 'justify-self-start';\n\n const brandNode =\n title || logo ? (\n <div className={twMerge('flex min-w-0 items-center gap-3', brandAlignClass)}>\n {logo ? (\n <div className='flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-xl bg-white/10 ring-1 ring-black/5'>\n <img\n src={logo}\n alt={logoAlt}\n className='h-full w-full object-cover'\n loading='lazy'\n decoding='async'\n />\n </div>\n ) : null}\n <div className='min-w-0'>\n {title ? (\n <div className={twMerge('text-base font-semibold leading-tight', brandTextClass)}>\n {brandHref ? (\n <a href={brandHref} className='hover:underline focus-visible:outline-none'>\n {title}\n </a>\n ) : (\n title\n )}\n </div>\n ) : null}\n </div>\n </div>\n ) : null;\n\n return (\n <header {...rest} className={barClass}>\n <div className={innerClass}>\n <div className='grid w-full grid-cols-[auto_1fr_auto] items-center gap-3'>\n <div className='flex items-center gap-2'>\n {navigation.length > 0 ? (\n <button\n type='button'\n aria-label='Otevřít navigaci'\n className={twMerge(\n 'inline-flex h-10 w-10 items-center justify-center rounded-xl text-xl sm:hidden',\n isDark\n ? 'text-white hover:bg-white/10 focus-visible:ring-2 focus-visible:ring-white/60'\n : 'text-gray-700 hover:bg-gray-100 focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2 focus-visible:ring-offset-transparent'\n )}\n aria-expanded={mobileOpen}\n onClick={() => setMobileOpen(open => !open)}\n >\n <i className={mobileOpen ? 'mdi mdi-close' : 'mdi mdi-menu'} aria-hidden />\n </button>\n ) : null}\n {navigation.length > 0 ? (\n <nav className='hidden items-center gap-1 sm:flex' aria-label='Hlavni navigace'>\n {navigation.map(renderNavItem)}\n </nav>\n ) : null}\n </div>\n {brandNode}\n <div className='ml-auto flex items-center justify-end gap-2'>\n {children}\n {actions}\n </div>\n </div>\n </div>\n {navigation.length > 0 && mobileOpen ? (\n <div className='sm:hidden'>\n <nav className='absolute inset-x-0 top-full border-t border-gray-200/70 bg-white/95 p-3 shadow-lg shadow-gray-900/5 backdrop-blur-md'>\n <div className='flex flex-col gap-2' aria-label='Mobilni navigace'>\n {navigation.map((item, index) => {\n const { href, label, active, onClick } = item;\n const Component = href ? 'a' : 'button';\n const resolvedHref = href && href.trim().length > 0 ? href : undefined;\n return (\n <Component\n key={`${resolvedHref ?? 'mobile-item'}-${index}`}\n href={resolvedHref}\n onClick={event => {\n onClick?.(event as never);\n setMobileOpen(false);\n }}\n className={twMerge(\n 'flex items-center justify-between rounded-xl px-3 py-2 text-sm font-medium transition',\n active ? 'bg-primary/10 text-primary' : 'text-gray-800 hover:bg-gray-100'\n )}\n aria-current={active ? 'page' : undefined}\n >\n {label}\n {active ? (\n <i className='mdi mdi-circle-small text-primary' aria-hidden />\n ) : null}\n </Component>\n );\n })}\n </div>\n </nav>\n </div>\n ) : null}\n </header>\n );\n};\n\nAppBar.displayName = 'AppBar';\n\nexport default AppBar;\n"]}
|
|
@@ -0,0 +1,236 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var tailwindMerge = require('tailwind-merge');
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
|
|
7
|
+
function _interopNamespace(e) {
|
|
8
|
+
if (e && e.__esModule) return e;
|
|
9
|
+
var n = Object.create(null);
|
|
10
|
+
if (e) {
|
|
11
|
+
Object.keys(e).forEach(function (k) {
|
|
12
|
+
if (k !== 'default') {
|
|
13
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
14
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function () { return e[k]; }
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
n.default = e;
|
|
22
|
+
return Object.freeze(n);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
26
|
+
|
|
27
|
+
// src/Feedback/Notification/index.tsx
|
|
28
|
+
var placementClasses = {
|
|
29
|
+
topLeft: "top-4 left-4 items-start",
|
|
30
|
+
topRight: "top-4 right-4 items-end",
|
|
31
|
+
bottomLeft: "bottom-4 left-4 items-start",
|
|
32
|
+
bottomRight: "bottom-4 right-4 items-end"
|
|
33
|
+
};
|
|
34
|
+
var typeIconMap = {
|
|
35
|
+
info: "mdi-information-outline",
|
|
36
|
+
success: "mdi-check-circle-outline",
|
|
37
|
+
warning: "mdi-alert-outline",
|
|
38
|
+
error: "mdi-close-circle-outline"
|
|
39
|
+
};
|
|
40
|
+
var typeAccentMap = {
|
|
41
|
+
info: "bg-sky-50 text-sky-600",
|
|
42
|
+
success: "bg-emerald-50 text-emerald-600",
|
|
43
|
+
warning: "bg-amber-50 text-amber-700",
|
|
44
|
+
error: "bg-red-50 text-red-600"
|
|
45
|
+
};
|
|
46
|
+
var typeTone = {
|
|
47
|
+
info: {
|
|
48
|
+
bg: "bg-sky-50",
|
|
49
|
+
text: "text-sky-900",
|
|
50
|
+
border: "border-sky-200",
|
|
51
|
+
iconBg: "bg-sky-100",
|
|
52
|
+
iconText: "text-sky-600"
|
|
53
|
+
},
|
|
54
|
+
success: {
|
|
55
|
+
bg: "bg-emerald-50",
|
|
56
|
+
text: "text-emerald-900",
|
|
57
|
+
border: "border-emerald-200",
|
|
58
|
+
iconBg: "bg-emerald-100",
|
|
59
|
+
iconText: "text-emerald-600"
|
|
60
|
+
},
|
|
61
|
+
warning: {
|
|
62
|
+
bg: "bg-amber-50",
|
|
63
|
+
text: "text-amber-900",
|
|
64
|
+
border: "border-amber-200",
|
|
65
|
+
iconBg: "bg-amber-100",
|
|
66
|
+
iconText: "text-amber-700"
|
|
67
|
+
},
|
|
68
|
+
error: {
|
|
69
|
+
bg: "bg-red-50",
|
|
70
|
+
text: "text-red-900",
|
|
71
|
+
border: "border-red-200",
|
|
72
|
+
iconBg: "bg-red-100",
|
|
73
|
+
iconText: "text-red-600"
|
|
74
|
+
}
|
|
75
|
+
};
|
|
76
|
+
var resolveVariantClass = (variant, type) => {
|
|
77
|
+
const tone = type ? typeTone[type] : void 0;
|
|
78
|
+
switch (variant) {
|
|
79
|
+
case "filled":
|
|
80
|
+
return tailwindMerge.twMerge(
|
|
81
|
+
tone?.bg ?? "bg-primary/10",
|
|
82
|
+
tone?.text ?? "text-primary",
|
|
83
|
+
"border border-transparent shadow-none"
|
|
84
|
+
);
|
|
85
|
+
case "outline":
|
|
86
|
+
return tailwindMerge.twMerge(
|
|
87
|
+
"bg-white/90",
|
|
88
|
+
tone?.text ?? "text-gray-900",
|
|
89
|
+
tone?.border ?? "border-primary/20",
|
|
90
|
+
"border-[1.5px]"
|
|
91
|
+
);
|
|
92
|
+
case "ghost":
|
|
93
|
+
return tailwindMerge.twMerge(
|
|
94
|
+
"bg-transparent shadow-none border border-transparent",
|
|
95
|
+
tone?.text ?? "text-gray-900"
|
|
96
|
+
);
|
|
97
|
+
case "solid":
|
|
98
|
+
default:
|
|
99
|
+
return "bg-white/95 text-gray-900 border border-gray-200";
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
var resolveIconClassName = (icon) => {
|
|
103
|
+
if (!icon) return void 0;
|
|
104
|
+
if (typeof icon === "string") {
|
|
105
|
+
const trimmed = icon.trim();
|
|
106
|
+
if (!trimmed) return void 0;
|
|
107
|
+
if (trimmed.includes(" ")) return trimmed;
|
|
108
|
+
const normalized2 = trimmed.startsWith("mdi-") ? trimmed : `mdi-${trimmed}`;
|
|
109
|
+
return `mdi ${normalized2}`;
|
|
110
|
+
}
|
|
111
|
+
const [library, iconName] = icon;
|
|
112
|
+
const normalized = iconName?.startsWith("mdi-") ? iconName : `mdi-${iconName}`;
|
|
113
|
+
return `mdi ${library} ${normalized}`.trim();
|
|
114
|
+
};
|
|
115
|
+
var resolveIconNode = (icon, fallbackClassName) => {
|
|
116
|
+
if (React__namespace.isValidElement(icon)) return icon;
|
|
117
|
+
const iconClassName = resolveIconClassName(icon) ?? fallbackClassName;
|
|
118
|
+
if (!iconClassName) return null;
|
|
119
|
+
const hasBase = iconClassName.split(" ").some((token) => token.trim() === "mdi");
|
|
120
|
+
const hasGlyph = iconClassName.includes("mdi-");
|
|
121
|
+
const finalClassName = hasBase && hasGlyph ? iconClassName : `mdi ${iconClassName}`.trim();
|
|
122
|
+
return /* @__PURE__ */ jsxRuntime.jsx("i", { className: finalClassName, "aria-hidden": true });
|
|
123
|
+
};
|
|
124
|
+
var NotificationCard = ({ item }) => {
|
|
125
|
+
const {
|
|
126
|
+
key,
|
|
127
|
+
message,
|
|
128
|
+
description,
|
|
129
|
+
icon,
|
|
130
|
+
closeIcon,
|
|
131
|
+
closable = true,
|
|
132
|
+
btn,
|
|
133
|
+
onClick,
|
|
134
|
+
className,
|
|
135
|
+
style,
|
|
136
|
+
role = "status",
|
|
137
|
+
type,
|
|
138
|
+
variant = "solid",
|
|
139
|
+
...rest
|
|
140
|
+
} = item;
|
|
141
|
+
const hasMessage = message !== void 0 && message !== null;
|
|
142
|
+
const hasDescription = description !== void 0 && description !== null;
|
|
143
|
+
const hasContent = hasMessage || hasDescription;
|
|
144
|
+
const accentClass = type ? typeAccentMap[type] : void 0;
|
|
145
|
+
const iconNode = resolveIconNode(icon, type ? `mdi ${typeIconMap[type]}` : void 0);
|
|
146
|
+
const closeIconNode = resolveIconNode(closeIcon, "mdi mdi-close");
|
|
147
|
+
const variantClass = resolveVariantClass(variant, type);
|
|
148
|
+
const toneIconBg = type ? typeTone[type]?.iconBg : void 0;
|
|
149
|
+
const toneIconText = type ? typeTone[type]?.iconText : void 0;
|
|
150
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
151
|
+
"article",
|
|
152
|
+
{
|
|
153
|
+
...rest,
|
|
154
|
+
role,
|
|
155
|
+
className: tailwindMerge.twMerge(
|
|
156
|
+
"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",
|
|
157
|
+
"dark:border-gray-800 dark:bg-gray-900/95 dark:text-gray-50 dark:ring-white/5",
|
|
158
|
+
variantClass,
|
|
159
|
+
className
|
|
160
|
+
),
|
|
161
|
+
style,
|
|
162
|
+
onClick,
|
|
163
|
+
children: [
|
|
164
|
+
iconNode ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
165
|
+
"div",
|
|
166
|
+
{
|
|
167
|
+
className: tailwindMerge.twMerge(
|
|
168
|
+
"mt-0.5 flex h-10 w-10 shrink-0 items-center justify-center rounded-xl text-xl",
|
|
169
|
+
toneIconBg ?? accentClass ?? "bg-primary/10",
|
|
170
|
+
toneIconText ?? "text-primary"
|
|
171
|
+
),
|
|
172
|
+
children: iconNode
|
|
173
|
+
}
|
|
174
|
+
) : null,
|
|
175
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
|
|
176
|
+
hasContent ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
|
|
177
|
+
hasMessage ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[15px] font-semibold leading-5 text-gray-900 dark:text-white", children: message }) : null,
|
|
178
|
+
hasDescription ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm leading-6 text-gray-600 dark:text-gray-300", children: description }) : null
|
|
179
|
+
] }) : null,
|
|
180
|
+
btn ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-1 text-sm", children: btn }) : null
|
|
181
|
+
] }),
|
|
182
|
+
closable ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
183
|
+
"button",
|
|
184
|
+
{
|
|
185
|
+
type: "button",
|
|
186
|
+
"aria-label": "Zav\u0159\xEDt upozorn\u011Bn\xED",
|
|
187
|
+
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",
|
|
188
|
+
onClick: (event) => {
|
|
189
|
+
event.stopPropagation();
|
|
190
|
+
item.onClose?.();
|
|
191
|
+
},
|
|
192
|
+
children: closeIconNode
|
|
193
|
+
}
|
|
194
|
+
) : null
|
|
195
|
+
]
|
|
196
|
+
}
|
|
197
|
+
);
|
|
198
|
+
};
|
|
199
|
+
var Notification = ({
|
|
200
|
+
items = [],
|
|
201
|
+
placement = "topRight",
|
|
202
|
+
gap = 12,
|
|
203
|
+
containerClassName,
|
|
204
|
+
className,
|
|
205
|
+
...rest
|
|
206
|
+
}) => {
|
|
207
|
+
if (!items.length) return null;
|
|
208
|
+
const grouped = /* @__PURE__ */ new Map();
|
|
209
|
+
items.forEach((item) => {
|
|
210
|
+
const resolvedKey = item.key ?? `notification-${item.message ?? Math.random()}`;
|
|
211
|
+
const resolvedPlacement = item.placement ?? placement;
|
|
212
|
+
const group = grouped.get(resolvedPlacement) ?? [];
|
|
213
|
+
group.push({ ...item, key: resolvedKey });
|
|
214
|
+
grouped.set(resolvedPlacement, group);
|
|
215
|
+
});
|
|
216
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from(grouped.entries()).map(([groupPlacement, groupItems]) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
217
|
+
"div",
|
|
218
|
+
{
|
|
219
|
+
className: tailwindMerge.twMerge(
|
|
220
|
+
"pointer-events-none fixed z-70 flex w-full max-w-[24rem] flex-col",
|
|
221
|
+
placementClasses[groupPlacement],
|
|
222
|
+
containerClassName,
|
|
223
|
+
className
|
|
224
|
+
),
|
|
225
|
+
style: { gap: `${gap}px` },
|
|
226
|
+
...rest,
|
|
227
|
+
children: groupItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NotificationCard, { item }, item.key))
|
|
228
|
+
},
|
|
229
|
+
groupPlacement
|
|
230
|
+
)) });
|
|
231
|
+
};
|
|
232
|
+
var Notification_default = Notification;
|
|
233
|
+
|
|
234
|
+
module.exports = Notification_default;
|
|
235
|
+
//# sourceMappingURL=notification.cjs.map
|
|
236
|
+
//# sourceMappingURL=notification.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
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 { GlobalVariant, 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 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 group = grouped.get(resolvedPlacement) ?? [];\n group.push({ ...item, key: resolvedKey });\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"]}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { b as PropIcon, G as GlobalVariant } from './global.types-E2uVLemv.cjs';
|
|
3
|
+
|
|
4
|
+
type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
|
|
5
|
+
type NotificationType = 'info' | 'success' | 'warning' | 'error';
|
|
6
|
+
type NotificationVariant = Extract<GlobalVariant, 'solid' | 'outline' | 'filled' | 'ghost'>;
|
|
7
|
+
interface NotificationArgs extends react.HTMLAttributes<HTMLDivElement> {
|
|
8
|
+
key?: react.Key;
|
|
9
|
+
message?: react.ReactNode;
|
|
10
|
+
description?: react.ReactNode;
|
|
11
|
+
duration?: number | null;
|
|
12
|
+
placement?: NotificationPlacement;
|
|
13
|
+
icon?: react.ReactNode | PropIcon;
|
|
14
|
+
closeIcon?: react.ReactNode | PropIcon;
|
|
15
|
+
btn?: react.ReactNode;
|
|
16
|
+
onClose?: () => void;
|
|
17
|
+
onClick?: () => void;
|
|
18
|
+
type?: NotificationType;
|
|
19
|
+
closable?: boolean;
|
|
20
|
+
className?: string;
|
|
21
|
+
style?: react.CSSProperties;
|
|
22
|
+
role?: string;
|
|
23
|
+
variant?: NotificationVariant;
|
|
24
|
+
}
|
|
25
|
+
interface NotificationProps extends react.HTMLAttributes<HTMLDivElement> {
|
|
26
|
+
items?: NotificationArgs[];
|
|
27
|
+
placement?: NotificationPlacement;
|
|
28
|
+
gap?: number;
|
|
29
|
+
containerClassName?: string;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
declare const Notification: react.FC<NotificationProps>;
|
|
33
|
+
|
|
34
|
+
export { type NotificationArgs, type NotificationPlacement, type NotificationProps, type NotificationType, type NotificationVariant, Notification as default };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { b as PropIcon, G as GlobalVariant } from './global.types-E2uVLemv.js';
|
|
3
|
+
|
|
4
|
+
type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
|
|
5
|
+
type NotificationType = 'info' | 'success' | 'warning' | 'error';
|
|
6
|
+
type NotificationVariant = Extract<GlobalVariant, 'solid' | 'outline' | 'filled' | 'ghost'>;
|
|
7
|
+
interface NotificationArgs extends react.HTMLAttributes<HTMLDivElement> {
|
|
8
|
+
key?: react.Key;
|
|
9
|
+
message?: react.ReactNode;
|
|
10
|
+
description?: react.ReactNode;
|
|
11
|
+
duration?: number | null;
|
|
12
|
+
placement?: NotificationPlacement;
|
|
13
|
+
icon?: react.ReactNode | PropIcon;
|
|
14
|
+
closeIcon?: react.ReactNode | PropIcon;
|
|
15
|
+
btn?: react.ReactNode;
|
|
16
|
+
onClose?: () => void;
|
|
17
|
+
onClick?: () => void;
|
|
18
|
+
type?: NotificationType;
|
|
19
|
+
closable?: boolean;
|
|
20
|
+
className?: string;
|
|
21
|
+
style?: react.CSSProperties;
|
|
22
|
+
role?: string;
|
|
23
|
+
variant?: NotificationVariant;
|
|
24
|
+
}
|
|
25
|
+
interface NotificationProps extends react.HTMLAttributes<HTMLDivElement> {
|
|
26
|
+
items?: NotificationArgs[];
|
|
27
|
+
placement?: NotificationPlacement;
|
|
28
|
+
gap?: number;
|
|
29
|
+
containerClassName?: string;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
declare const Notification: react.FC<NotificationProps>;
|
|
33
|
+
|
|
34
|
+
export { type NotificationArgs, type NotificationPlacement, type NotificationProps, type NotificationType, type NotificationVariant, Notification as default };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"notification.js"}
|
package/dist/profileCard.cjs
CHANGED
|
@@ -182,6 +182,7 @@ var Button = React__namespace.forwardRef(
|
|
|
182
182
|
children,
|
|
183
183
|
disabled,
|
|
184
184
|
onClick,
|
|
185
|
+
type,
|
|
185
186
|
as,
|
|
186
187
|
...rest
|
|
187
188
|
}, ref) => {
|
|
@@ -192,7 +193,7 @@ var Button = React__namespace.forwardRef(
|
|
|
192
193
|
const blockClass = block ? "w-full" : null;
|
|
193
194
|
const isNativeButton = Component === "button";
|
|
194
195
|
const isDisabled = disabled || loading;
|
|
195
|
-
const cursor = onClick && !isDisabled ? "cursor-pointer" : "cursor-default";
|
|
196
|
+
const cursor = (onClick || type === "submit") && !isDisabled ? "cursor-pointer" : "cursor-default";
|
|
196
197
|
const resolvedIconClass = resolveIconClassName(icon);
|
|
197
198
|
const shouldRenderIcon = Boolean(resolvedIconClass && !loading);
|
|
198
199
|
const isLoadingTextProvided = loadingText !== void 0 && loadingText !== null;
|