@manafishrov/ui 1.3.12 → 1.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,126 +1,101 @@
|
|
|
1
|
-
import { createComponent as t, Portal as l, insert as
|
|
2
|
-
import { Toaster as c, createToaster as
|
|
3
|
-
import { Show as
|
|
1
|
+
import { createComponent as t, Portal as l, insert as s, memo as r, template as d } from "solid-js/web";
|
|
2
|
+
import { Toaster as c, createToaster as m, toast_exports as a } from "../../node_modules/.bun/@ark-ui_solid@5.34.1_2e1854f049906f04/node_modules/@ark-ui/solid/dist/chunk/4OJLSY6B.js";
|
|
3
|
+
import { Show as i } from "solid-js";
|
|
4
4
|
import { cn as n } from "../../node_modules/.bun/tailwind-variants@3.2.2_7ac958b541464b98/node_modules/tailwind-variants/dist/index.js";
|
|
5
|
-
import
|
|
6
|
-
import g from "../../_virtual/
|
|
7
|
-
import m from "../../_virtual/error.js";
|
|
5
|
+
import u from "../../_virtual/check-circle.js";
|
|
6
|
+
import g from "../../_virtual/error.js";
|
|
8
7
|
import h from "../../_virtual/info.js";
|
|
9
|
-
import
|
|
10
|
-
import {
|
|
11
|
-
|
|
12
|
-
|
|
8
|
+
import f from "../../_virtual/warning.js";
|
|
9
|
+
import { buttonVariants as p } from "../Button.js";
|
|
10
|
+
import { Spinner as x } from "../Spinner.js";
|
|
11
|
+
var b = /* @__PURE__ */ d('<div class="min-w-0 gap-1 grid flex-1">');
|
|
12
|
+
const v = m({
|
|
13
13
|
placement: "bottom-end",
|
|
14
14
|
overlap: !0,
|
|
15
15
|
gap: 16
|
|
16
|
-
}),
|
|
16
|
+
}), w = (e) => [r(() => r(() => e.type === "success")() && t(u, {
|
|
17
17
|
get class() {
|
|
18
|
-
return n("
|
|
18
|
+
return n("size-4 shrink-0");
|
|
19
|
+
},
|
|
20
|
+
"aria-hidden": "true"
|
|
21
|
+
})), r(() => r(() => e.type === "info")() && t(h, {
|
|
22
|
+
get class() {
|
|
23
|
+
return n("size-4 shrink-0");
|
|
24
|
+
},
|
|
25
|
+
"aria-hidden": "true"
|
|
26
|
+
})), r(() => r(() => e.type === "warning")() && t(f, {
|
|
27
|
+
get class() {
|
|
28
|
+
return n("size-4 shrink-0");
|
|
29
|
+
},
|
|
30
|
+
"aria-hidden": "true"
|
|
31
|
+
})), r(() => r(() => e.type === "error")() && t(g, {
|
|
32
|
+
get class() {
|
|
33
|
+
return n("size-4 shrink-0");
|
|
34
|
+
},
|
|
35
|
+
"aria-hidden": "true"
|
|
36
|
+
})), r(() => r(() => e.type === "loading")() && t(x, {
|
|
37
|
+
get class() {
|
|
38
|
+
return n("size-4 text-muted-foreground");
|
|
39
|
+
}
|
|
40
|
+
}))], y = (e) => t(a.Root, {
|
|
41
|
+
get class() {
|
|
42
|
+
return n("group gap-2 px-4 py-3.5 shadow-lg min-w-80 pointer-events-auto relative flex w-full items-center rounded-xl border bg-popover", "data-[state=open]:sm:slide-in-from-bottom-full data-[state=open]:animate-in data-[state=open]:slide-in-from-top-full", "data-[state=closed]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full", "border-border text-popover-foreground");
|
|
19
43
|
},
|
|
20
44
|
get children() {
|
|
21
|
-
return [t(
|
|
22
|
-
get
|
|
23
|
-
return e.toast().type
|
|
24
|
-
},
|
|
25
|
-
get children() {
|
|
26
|
-
return t(d, {
|
|
27
|
-
get class() {
|
|
28
|
-
return n("size-5 text-green-500 shrink-0");
|
|
29
|
-
},
|
|
30
|
-
"aria-hidden": "true"
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
}), t(r, {
|
|
34
|
-
get when() {
|
|
35
|
-
return e.toast().type === "info";
|
|
36
|
-
},
|
|
37
|
-
get children() {
|
|
38
|
-
return t(h, {
|
|
39
|
-
get class() {
|
|
40
|
-
return n("size-5 text-blue-500 shrink-0");
|
|
41
|
-
},
|
|
42
|
-
"aria-hidden": "true"
|
|
43
|
-
});
|
|
44
|
-
}
|
|
45
|
-
}), t(r, {
|
|
46
|
-
get when() {
|
|
47
|
-
return e.toast().type === "warning";
|
|
48
|
-
},
|
|
49
|
-
get children() {
|
|
50
|
-
return t(p, {
|
|
51
|
-
get class() {
|
|
52
|
-
return n("size-5 text-amber-500 shrink-0");
|
|
53
|
-
},
|
|
54
|
-
"aria-hidden": "true"
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
}), t(r, {
|
|
58
|
-
get when() {
|
|
59
|
-
return e.toast().type === "error";
|
|
60
|
-
},
|
|
61
|
-
get children() {
|
|
62
|
-
return t(m, {
|
|
63
|
-
get class() {
|
|
64
|
-
return n("size-5 text-red-500 shrink-0");
|
|
65
|
-
},
|
|
66
|
-
"aria-hidden": "true"
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
}), t(r, {
|
|
70
|
-
get when() {
|
|
71
|
-
return e.toast().type === "loading";
|
|
72
|
-
},
|
|
73
|
-
get children() {
|
|
74
|
-
return t(f, {
|
|
75
|
-
get class() {
|
|
76
|
-
return n("size-5 text-muted-foreground");
|
|
77
|
-
}
|
|
78
|
-
});
|
|
45
|
+
return [t(w, {
|
|
46
|
+
get type() {
|
|
47
|
+
return e.toast().type;
|
|
79
48
|
}
|
|
80
49
|
}), (() => {
|
|
81
|
-
var
|
|
82
|
-
return
|
|
50
|
+
var o = b();
|
|
51
|
+
return s(o, t(i, {
|
|
83
52
|
get when() {
|
|
84
53
|
return e.toast().title;
|
|
85
54
|
},
|
|
86
55
|
get children() {
|
|
87
|
-
return t(
|
|
56
|
+
return t(a.Title, {
|
|
88
57
|
class: "text-sm font-semibold tracking-tight leading-none",
|
|
89
58
|
get children() {
|
|
90
59
|
return e.toast().title;
|
|
91
60
|
}
|
|
92
61
|
});
|
|
93
62
|
}
|
|
94
|
-
}), null),
|
|
63
|
+
}), null), s(o, t(i, {
|
|
95
64
|
get when() {
|
|
96
65
|
return e.toast().description;
|
|
97
66
|
},
|
|
98
|
-
get fallback() {
|
|
99
|
-
return w();
|
|
100
|
-
},
|
|
101
67
|
get children() {
|
|
102
|
-
return t(
|
|
103
|
-
class: "text-sm
|
|
68
|
+
return t(a.Description, {
|
|
69
|
+
class: "text-sm text-muted-foreground",
|
|
104
70
|
get children() {
|
|
105
71
|
return e.toast().description;
|
|
106
72
|
}
|
|
107
73
|
});
|
|
108
74
|
}
|
|
109
|
-
}), null),
|
|
110
|
-
})(), t(
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
75
|
+
}), null), o;
|
|
76
|
+
})(), t(i, {
|
|
77
|
+
get when() {
|
|
78
|
+
return e.toast().action;
|
|
79
|
+
},
|
|
80
|
+
children: (o) => t(a.ActionTrigger, {
|
|
81
|
+
get class() {
|
|
82
|
+
return p({
|
|
83
|
+
class: "shrink-0",
|
|
84
|
+
size: "sm",
|
|
85
|
+
variant: "secondary"
|
|
86
|
+
});
|
|
87
|
+
},
|
|
88
|
+
get children() {
|
|
89
|
+
return o().label;
|
|
90
|
+
}
|
|
91
|
+
})
|
|
117
92
|
})];
|
|
118
93
|
}
|
|
119
94
|
}), E = () => t(l, {
|
|
120
95
|
get children() {
|
|
121
96
|
return t(c, {
|
|
122
|
-
toaster:
|
|
123
|
-
children: (e) => t(
|
|
97
|
+
toaster: v,
|
|
98
|
+
children: (e) => t(y, {
|
|
124
99
|
toast: e
|
|
125
100
|
})
|
|
126
101
|
});
|
|
@@ -128,6 +103,6 @@ const b = u({
|
|
|
128
103
|
});
|
|
129
104
|
export {
|
|
130
105
|
E as Toaster,
|
|
131
|
-
|
|
106
|
+
v as toast
|
|
132
107
|
};
|
|
133
108
|
//# sourceMappingURL=Toaster.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toaster.js","sources":["../../../src/components/toaster/Toaster.tsx"],"sourcesContent":["import {\n Toast,\n Toaster as ToasterPrimitive,\n createToaster,\n type ToastOptions,\n} from '@ark-ui/solid/toast';\nimport { type Component, type Accessor, Show } from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { cn } from 'tailwind-variants';\nimport CheckCircleIcon from '~icons/material-symbols/check-circle';\nimport
|
|
1
|
+
{"version":3,"file":"Toaster.js","sources":["../../../src/components/toaster/Toaster.tsx"],"sourcesContent":["import {\n Toast,\n Toaster as ToasterPrimitive,\n createToaster,\n type ToastOptions,\n} from '@ark-ui/solid/toast';\nimport { type Component, type Accessor, Show } from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { cn } from 'tailwind-variants';\nimport CheckCircleIcon from '~icons/material-symbols/check-circle';\nimport ErrorIcon from '~icons/material-symbols/error';\nimport InfoIcon from '~icons/material-symbols/info';\nimport WarningIcon from '~icons/material-symbols/warning';\n\nimport { buttonVariants } from '@/components/Button';\nimport { Spinner } from '@/components/Spinner';\n\nexport const toast = createToaster({\n placement: 'bottom-end',\n overlap: true,\n gap: 16,\n});\n\nconst ToastIcon: Component<{ type: ToastOptions['type'] }> = (props) => (\n <>\n {props.type === 'success' && (\n <CheckCircleIcon class={cn('size-4 shrink-0')} aria-hidden='true' />\n )}\n {props.type === 'info' && <InfoIcon class={cn('size-4 shrink-0')} aria-hidden='true' />}\n {props.type === 'warning' && <WarningIcon class={cn('size-4 shrink-0')} aria-hidden='true' />}\n {props.type === 'error' && <ErrorIcon class={cn('size-4 shrink-0')} aria-hidden='true' />}\n {props.type === 'loading' && <Spinner class={cn('size-4 text-muted-foreground')} />}\n </>\n);\n\nconst ToastItem: Component<{ toast: Accessor<ToastOptions> }> = (props) => (\n <Toast.Root\n class={cn(\n 'group gap-2 px-4 py-3.5 shadow-lg min-w-80 pointer-events-auto relative flex w-full items-center rounded-xl border bg-popover',\n 'data-[state=open]:sm:slide-in-from-bottom-full data-[state=open]:animate-in data-[state=open]:slide-in-from-top-full',\n 'data-[state=closed]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full',\n 'border-border text-popover-foreground',\n )}\n >\n <ToastIcon type={props.toast().type} />\n <div class='min-w-0 gap-1 grid flex-1'>\n <Show when={props.toast().title}>\n <Toast.Title class='text-sm font-semibold tracking-tight leading-none'>\n {props.toast().title}\n </Toast.Title>\n </Show>\n <Show when={props.toast().description}>\n <Toast.Description class='text-sm text-muted-foreground'>\n {props.toast().description}\n </Toast.Description>\n </Show>\n </div>\n <Show when={props.toast().action}>\n {(action) => (\n <Toast.ActionTrigger\n class={buttonVariants({\n class: 'shrink-0',\n size: 'sm',\n variant: 'secondary',\n })}\n >\n {action().label}\n </Toast.ActionTrigger>\n )}\n </Show>\n </Toast.Root>\n);\n\nexport const Toaster: Component = () => (\n <Portal>\n <ToasterPrimitive toaster={toast}>{(item) => <ToastItem toast={item} />}</ToasterPrimitive>\n </Portal>\n);\n"],"names":["toast","createToaster","placement","overlap","gap","ToastIcon","props","_$memo","type","_$createComponent","CheckCircleIcon","cn","InfoIcon","WarningIcon","ErrorIcon","Spinner","ToastItem","Toast","Root","children","_el$","_tmpl$","_$insert","Show","when","title","Title","description","Description","action","ActionTrigger","buttonVariants","class","size","variant","label","Toaster","Portal","ToasterPrimitive","toaster","item"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -8,11 +8,11 @@ import { type Component, type Accessor, Show } from 'solid-js';
|
|
|
8
8
|
import { Portal } from 'solid-js/web';
|
|
9
9
|
import { cn } from 'tailwind-variants';
|
|
10
10
|
import CheckCircleIcon from '~icons/material-symbols/check-circle';
|
|
11
|
-
import CloseIcon from '~icons/material-symbols/close';
|
|
12
11
|
import ErrorIcon from '~icons/material-symbols/error';
|
|
13
12
|
import InfoIcon from '~icons/material-symbols/info';
|
|
14
13
|
import WarningIcon from '~icons/material-symbols/warning';
|
|
15
14
|
|
|
15
|
+
import { buttonVariants } from '@/components/Button';
|
|
16
16
|
import { Spinner } from '@/components/Spinner';
|
|
17
17
|
|
|
18
18
|
export const toast = createToaster({
|
|
@@ -21,44 +21,53 @@ export const toast = createToaster({
|
|
|
21
21
|
gap: 16,
|
|
22
22
|
});
|
|
23
23
|
|
|
24
|
+
const ToastIcon: Component<{ type: ToastOptions['type'] }> = (props) => (
|
|
25
|
+
<>
|
|
26
|
+
{props.type === 'success' && (
|
|
27
|
+
<CheckCircleIcon class={cn('size-4 shrink-0')} aria-hidden='true' />
|
|
28
|
+
)}
|
|
29
|
+
{props.type === 'info' && <InfoIcon class={cn('size-4 shrink-0')} aria-hidden='true' />}
|
|
30
|
+
{props.type === 'warning' && <WarningIcon class={cn('size-4 shrink-0')} aria-hidden='true' />}
|
|
31
|
+
{props.type === 'error' && <ErrorIcon class={cn('size-4 shrink-0')} aria-hidden='true' />}
|
|
32
|
+
{props.type === 'loading' && <Spinner class={cn('size-4 text-muted-foreground')} />}
|
|
33
|
+
</>
|
|
34
|
+
);
|
|
35
|
+
|
|
24
36
|
const ToastItem: Component<{ toast: Accessor<ToastOptions> }> = (props) => (
|
|
25
37
|
<Toast.Root
|
|
26
38
|
class={cn(
|
|
27
|
-
'group gap-
|
|
39
|
+
'group gap-2 px-4 py-3.5 shadow-lg min-w-80 pointer-events-auto relative flex w-full items-center rounded-xl border bg-popover',
|
|
28
40
|
'data-[state=open]:sm:slide-in-from-bottom-full data-[state=open]:animate-in data-[state=open]:slide-in-from-top-full',
|
|
41
|
+
'data-[state=closed]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full',
|
|
29
42
|
'border-border text-popover-foreground',
|
|
30
43
|
)}
|
|
31
44
|
>
|
|
32
|
-
<
|
|
33
|
-
|
|
34
|
-
</Show>
|
|
35
|
-
<Show when={props.toast().type === 'info'}>
|
|
36
|
-
<InfoIcon class={cn('size-5 text-blue-500 shrink-0')} aria-hidden='true' />
|
|
37
|
-
</Show>
|
|
38
|
-
<Show when={props.toast().type === 'warning'}>
|
|
39
|
-
<WarningIcon class={cn('size-5 text-amber-500 shrink-0')} aria-hidden='true' />
|
|
40
|
-
</Show>
|
|
41
|
-
<Show when={props.toast().type === 'error'}>
|
|
42
|
-
<ErrorIcon class={cn('size-5 text-red-500 shrink-0')} aria-hidden='true' />
|
|
43
|
-
</Show>
|
|
44
|
-
<Show when={props.toast().type === 'loading'}>
|
|
45
|
-
<Spinner class={cn('size-5 text-muted-foreground')} />
|
|
46
|
-
</Show>
|
|
47
|
-
<div class='gap-1 grid'>
|
|
45
|
+
<ToastIcon type={props.toast().type} />
|
|
46
|
+
<div class='min-w-0 gap-1 grid flex-1'>
|
|
48
47
|
<Show when={props.toast().title}>
|
|
49
48
|
<Toast.Title class='text-sm font-semibold tracking-tight leading-none'>
|
|
50
49
|
{props.toast().title}
|
|
51
50
|
</Toast.Title>
|
|
52
51
|
</Show>
|
|
53
|
-
<Show when={props.toast().description}
|
|
54
|
-
<Toast.Description class='text-sm
|
|
52
|
+
<Show when={props.toast().description}>
|
|
53
|
+
<Toast.Description class='text-sm text-muted-foreground'>
|
|
55
54
|
{props.toast().description}
|
|
56
55
|
</Toast.Description>
|
|
57
56
|
</Show>
|
|
58
57
|
</div>
|
|
59
|
-
<
|
|
60
|
-
|
|
61
|
-
|
|
58
|
+
<Show when={props.toast().action}>
|
|
59
|
+
{(action) => (
|
|
60
|
+
<Toast.ActionTrigger
|
|
61
|
+
class={buttonVariants({
|
|
62
|
+
class: 'shrink-0',
|
|
63
|
+
size: 'sm',
|
|
64
|
+
variant: 'secondary',
|
|
65
|
+
})}
|
|
66
|
+
>
|
|
67
|
+
{action().label}
|
|
68
|
+
</Toast.ActionTrigger>
|
|
69
|
+
)}
|
|
70
|
+
</Show>
|
|
62
71
|
</Toast.Root>
|
|
63
72
|
);
|
|
64
73
|
|