@mastra/playground-ui 65.0.0-alpha.5 → 65.0.0-alpha.6
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/components/BillingIllustration.cjs.js +223 -0
- package/dist/components/BillingIllustration.cjs.js.map +1 -0
- package/dist/components/BillingIllustration.d.ts +2 -0
- package/dist/components/BillingIllustration.es.js +218 -0
- package/dist/components/BillingIllustration.es.js.map +1 -0
- package/dist/domains/chat/tools/badges/workflow-badge.cjs.js +1 -1
- package/dist/domains/chat/tools/badges/workflow-badge.es.js +1 -1
- package/dist/domains/traces/components/thread-view-by-trace.cjs.js +0 -1
- package/dist/domains/traces/components/thread-view-by-trace.cjs.js.map +1 -1
- package/dist/domains/traces/components/thread-view-by-trace.es.js +0 -1
- package/dist/domains/traces/components/thread-view-by-trace.es.js.map +1 -1
- package/dist/domains/traces/components/trace-data-panel.cjs.js +0 -1
- package/dist/domains/traces/components/trace-data-panel.cjs.js.map +1 -1
- package/dist/domains/traces/components/trace-data-panel.es.js +0 -1
- package/dist/domains/traces/components/trace-data-panel.es.js.map +1 -1
- package/dist/domains/workflows/workflow/workflow-input-data.cjs.js +1 -0
- package/dist/domains/workflows/workflow/workflow-input-data.cjs.js.map +1 -1
- package/dist/domains/workflows/workflow/workflow-input-data.es.js +1 -0
- package/dist/domains/workflows/workflow/workflow-input-data.es.js.map +1 -1
- package/dist/src/ds/components/BillingIllustration/art/billing-art.d.ts +9 -0
- package/dist/src/ds/components/BillingIllustration/art/project-size-art.d.ts +5 -0
- package/dist/src/ds/components/BillingIllustration/billing-illustration.d.ts +9 -0
- package/dist/src/ds/components/BillingIllustration/index.d.ts +2 -0
- package/dist/style.css +106 -1
- package/package.json +8 -8
|
@@ -0,0 +1,223 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
const React = require('react');
|
|
7
|
+
const utils_cn = require('../cn-DlOJCxrS.cjs');
|
|
8
|
+
|
|
9
|
+
const oneUnit = {
|
|
10
|
+
paths: [
|
|
11
|
+
[
|
|
12
|
+
"solid",
|
|
13
|
+
"m33.12 65.12.41-1.04 1.17-.87 20.05-10.02 1.75-.59 2.07-.21 2.06.21 1.76.59L85.3 64.64l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.58-2.07.21-2.06-.21-1.76-.58L34.7 70.53l-1.17-.87-.41-1.04Z"
|
|
14
|
+
],
|
|
15
|
+
["edge", "m85.12 66.55-.27.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.19-.4-22.91-11.45-.79-.6-.27-.69"]
|
|
16
|
+
],
|
|
17
|
+
lifts: [
|
|
18
|
+
[
|
|
19
|
+
[
|
|
20
|
+
"solid",
|
|
21
|
+
"m40.2 46.41.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
22
|
+
],
|
|
23
|
+
["edge", "m78.05 47.84-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44"],
|
|
24
|
+
[
|
|
25
|
+
"light",
|
|
26
|
+
"m55.99 64.5-.01-.25-.05-.25-.07-.26-.11-.25-.12-.25-.15-.23-.17-.2-.18-.19-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.16-.07.18-.05.21-.01.23.01.24.05.26.07.26.11.25.12.24.15.23.17.21.18.18.19.15.19.12.19.08.19.04.18-.01.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z"
|
|
27
|
+
]
|
|
28
|
+
]
|
|
29
|
+
]
|
|
30
|
+
};
|
|
31
|
+
const serverlessArt = { viewBox: [32, 32, 56, 56], ...oneUnit, dashed: true };
|
|
32
|
+
const smallArt = { viewBox: [32, 32, 56, 56], ...oneUnit };
|
|
33
|
+
const mediumArt = {
|
|
34
|
+
viewBox: [20, 20, 80, 80],
|
|
35
|
+
paths: [
|
|
36
|
+
[
|
|
37
|
+
"solid",
|
|
38
|
+
"m21.19 59.15.41-1.04 1.17-.87 20.05-10.03 1.75-.58 2.07-.21 2.06.21 1.75.58L97.23 70.6l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.59-2.07.2-2.06-.2-1.75-.59-46.78-23.39-1.17-.87-.41-1.04Z"
|
|
39
|
+
],
|
|
40
|
+
["edge", "m97.06 72.51-.28.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.18-.4-46.78-23.39-.79-.59-.28-.69"]
|
|
41
|
+
],
|
|
42
|
+
lifts: [
|
|
43
|
+
[
|
|
44
|
+
[
|
|
45
|
+
"solid",
|
|
46
|
+
"m28.27 40.44.31-.77.87-.66 14.32-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.31-.44-17.19-8.59-.87-.66-.31-.77Z"
|
|
47
|
+
],
|
|
48
|
+
["edge", "m66.11 41.87-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.19-8.59-.49-.37-.18-.44"],
|
|
49
|
+
[
|
|
50
|
+
"idle",
|
|
51
|
+
"m44.06 58.53-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.14-.23-.17-.21-.18-.18-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.1.26.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.03h.18l.17-.04.14-.08.13-.12.1-.15.08-.18.04-.21z"
|
|
52
|
+
]
|
|
53
|
+
],
|
|
54
|
+
[
|
|
55
|
+
[
|
|
56
|
+
"solid",
|
|
57
|
+
"m52.13 52.37.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.31.44 17.19 8.59.87.66.31.77v18.71l-.31.78-.87.65-14.32 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
58
|
+
],
|
|
59
|
+
["edge", "m89.98 53.8-.18.44-.49.38-14.32 7.16-.75.24-.88.09-.87-.09-.75-.24-17.18-8.6-.5-.37-.17-.44"],
|
|
60
|
+
[
|
|
61
|
+
"light",
|
|
62
|
+
"m67.92 70.46-.01-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.18-.19-.15-.2-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.12.25.15.22.17.21.18.18.19.15.19.12.2.08.19.04h.18l.16-.05.15-.08.13-.12.1-.15.07-.18.05-.21z"
|
|
63
|
+
]
|
|
64
|
+
]
|
|
65
|
+
]
|
|
66
|
+
};
|
|
67
|
+
const largeArt = {
|
|
68
|
+
viewBox: [9, 9, 102, 102],
|
|
69
|
+
paths: [
|
|
70
|
+
[
|
|
71
|
+
"solid",
|
|
72
|
+
"m10.21 64.64.41-1.04 1.17-.87L53.8 41.72l1.75-.58 2.06-.21 2.07.21 1.75.58 46.78 23.39 1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-42.01 21-1.75.58-2.06.21-2.07-.21-1.75-.58-46.78-23.39-1.17-.87-.41-1.04Z"
|
|
73
|
+
],
|
|
74
|
+
["edge", "m108.03 67.02-.27.7-.79.59-42.01 21-1.18.4-1.39.14-1.4-.14-1.18-.4-46.78-23.39-.79-.59-.27-.69"]
|
|
75
|
+
],
|
|
76
|
+
lifts: [
|
|
77
|
+
[
|
|
78
|
+
[
|
|
79
|
+
"solid",
|
|
80
|
+
"m39.24 34.95.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
81
|
+
],
|
|
82
|
+
["edge", "m77.09 36.38-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44"],
|
|
83
|
+
[
|
|
84
|
+
"idle",
|
|
85
|
+
"m55.04 53.04-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.08-.18.04-.21z"
|
|
86
|
+
]
|
|
87
|
+
],
|
|
88
|
+
[
|
|
89
|
+
[
|
|
90
|
+
"solid",
|
|
91
|
+
"m17.29 45.93.31-.78.88-.65 14.31-7.16 1.32-.44 1.55-.16 1.55.16 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
92
|
+
],
|
|
93
|
+
["edge", "m55.14 47.36-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44"],
|
|
94
|
+
[
|
|
95
|
+
"idle",
|
|
96
|
+
"m33.08 64.02-.01-.25-.05-.25-.07-.26-.11-.26-.12-.24-.15-.23-.17-.21-.18-.18-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.11.26.12.24.15.23.17.21.18.18.19.15.19.12.19.07.19.04h.18l.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z"
|
|
97
|
+
]
|
|
98
|
+
],
|
|
99
|
+
[
|
|
100
|
+
[
|
|
101
|
+
"solid",
|
|
102
|
+
"m63.11 46.88.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.78v18.7l-.31.78-.88.65-14.31 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
103
|
+
],
|
|
104
|
+
["edge", "m100.96 48.32-.18.43-.5.38-14.32 7.16-.74.25-.88.08-.88-.08-.74-.25-17.18-8.59-.5-.38-.18-.44"],
|
|
105
|
+
[
|
|
106
|
+
"idle",
|
|
107
|
+
"m78.9 64.97-.01-.24-.05-.26-.07-.26-.11-.25-.12-.25-.15-.22-.17-.21-.18-.18-.19-.15-.19-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.12-.11.15-.07.18-.05.21-.01.23.01.25.05.25.07.26.11.25.12.25.15.23.17.2.18.18.19.15.19.12.19.08.19.04h.18l.17-.04.15-.09.12-.11.11-.16.07-.18.05-.21z"
|
|
108
|
+
]
|
|
109
|
+
],
|
|
110
|
+
[
|
|
111
|
+
[
|
|
112
|
+
"solid",
|
|
113
|
+
"m41.15 57.86.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77V78l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44L42.34 78l-.88-.66-.31-.77Z"
|
|
114
|
+
],
|
|
115
|
+
["edge", "m79 59.29-.17.44-.5.37-14.32 7.16-.75.25-.87.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44"],
|
|
116
|
+
[
|
|
117
|
+
"light",
|
|
118
|
+
"m56.95 75.95-.02-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.2-.11-.19-.08-.19-.04h-.18l-.17.04-.14.09-.13.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.14.23.17.21.18.18.19.15.19.12.2.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.07-.18.05-.21z"
|
|
119
|
+
]
|
|
120
|
+
]
|
|
121
|
+
]
|
|
122
|
+
};
|
|
123
|
+
|
|
124
|
+
const billingIllustrationHoverGroup = "group/billing-illustration";
|
|
125
|
+
const artByName = {
|
|
126
|
+
serverless: serverlessArt,
|
|
127
|
+
small: smallArt,
|
|
128
|
+
medium: mediumArt,
|
|
129
|
+
large: largeArt
|
|
130
|
+
};
|
|
131
|
+
const inkByTone = {
|
|
132
|
+
ink: "fill-foreground",
|
|
133
|
+
muted: "fill-muted-foreground",
|
|
134
|
+
faded: "fill-fill-strong"
|
|
135
|
+
};
|
|
136
|
+
const maskPaintByStroke = {
|
|
137
|
+
solid: { fill: "black", stroke: "white", strokeOpacity: 0.7 },
|
|
138
|
+
edge: { stroke: "white", strokeOpacity: 0.35 },
|
|
139
|
+
line: { stroke: "white" },
|
|
140
|
+
light: { fill: "white", stroke: "white" },
|
|
141
|
+
idle: { fill: "white", stroke: "white" }
|
|
142
|
+
};
|
|
143
|
+
const hoverTransition = "motion-safe:duration-slow motion-safe:ease-out-custom";
|
|
144
|
+
const staggerMs = 50;
|
|
145
|
+
const classByStroke = {
|
|
146
|
+
idle: utils_cn.cn(
|
|
147
|
+
"[fill-opacity:0] [stroke-opacity:0.35]",
|
|
148
|
+
"group-hover/billing-illustration:[fill-opacity:1] group-hover/billing-illustration:[stroke-opacity:1]",
|
|
149
|
+
"group-focus-within/billing-illustration:[fill-opacity:1] group-focus-within/billing-illustration:[stroke-opacity:1]",
|
|
150
|
+
"motion-safe:transition-[fill-opacity,stroke-opacity]",
|
|
151
|
+
hoverTransition
|
|
152
|
+
)
|
|
153
|
+
};
|
|
154
|
+
const dashedClass = utils_cn.cn(
|
|
155
|
+
"[stroke-dasharray:1.5_1.25]",
|
|
156
|
+
"group-focus-within/billing-illustration:[stroke-dasharray:1.5_0] group-hover/billing-illustration:[stroke-dasharray:1.5_0]",
|
|
157
|
+
"motion-safe:transition-[stroke-dasharray]",
|
|
158
|
+
hoverTransition
|
|
159
|
+
);
|
|
160
|
+
const liftClass = utils_cn.cn(
|
|
161
|
+
"motion-safe:transition-[translate]",
|
|
162
|
+
"motion-safe:group-focus-within/billing-illustration:[translate:0_-3px] motion-safe:group-hover/billing-illustration:[translate:0_-3px]",
|
|
163
|
+
hoverTransition
|
|
164
|
+
);
|
|
165
|
+
const enterClass = utils_cn.cn(
|
|
166
|
+
"opacity-0 group-focus-within/billing-illustration:opacity-100 group-hover/billing-illustration:opacity-100",
|
|
167
|
+
"motion-safe:[translate:0_-8px] motion-safe:group-focus-within/billing-illustration:[translate:0_0] motion-safe:group-hover/billing-illustration:[translate:0_0]",
|
|
168
|
+
"motion-safe:transition-[opacity,translate]",
|
|
169
|
+
hoverTransition
|
|
170
|
+
);
|
|
171
|
+
const countIdle = (paths) => paths.filter(([stroke]) => stroke === "idle").length;
|
|
172
|
+
function ArtPaths({ paths, dashed, firstIdle }) {
|
|
173
|
+
let idle = firstIdle;
|
|
174
|
+
return paths.map(([stroke, d], index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
175
|
+
"path",
|
|
176
|
+
{
|
|
177
|
+
d,
|
|
178
|
+
...maskPaintByStroke[stroke],
|
|
179
|
+
className: utils_cn.cn(classByStroke[stroke], dashed && stroke !== "light" && dashedClass),
|
|
180
|
+
style: stroke === "idle" ? { transitionDelay: `${idle++ * staggerMs}ms` } : void 0,
|
|
181
|
+
vectorEffect: "non-scaling-stroke"
|
|
182
|
+
},
|
|
183
|
+
index
|
|
184
|
+
));
|
|
185
|
+
}
|
|
186
|
+
function BillingIllustration({ name, tone = "ink", className, ...props }) {
|
|
187
|
+
const maskId = `billing-illustration-${React.useId().replace(/[^\w-]/g, "")}`;
|
|
188
|
+
const { viewBox, paths, lifts = [], enters = [], dashed } = artByName[name];
|
|
189
|
+
const parts = [
|
|
190
|
+
...lifts.map((part, index) => ({ part, className: liftClass, delay: index * staggerMs })),
|
|
191
|
+
...enters.map((part) => ({ part, className: enterClass, delay: 0 }))
|
|
192
|
+
];
|
|
193
|
+
const [x, y, width, height] = viewBox;
|
|
194
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
195
|
+
"svg",
|
|
196
|
+
{
|
|
197
|
+
viewBox: viewBox.join(" "),
|
|
198
|
+
fill: "none",
|
|
199
|
+
"aria-hidden": "true",
|
|
200
|
+
"data-illustration": name,
|
|
201
|
+
className: utils_cn.cn(billingIllustrationHoverGroup, "block size-30 shrink-0", className),
|
|
202
|
+
...props,
|
|
203
|
+
children: [
|
|
204
|
+
/* @__PURE__ */ jsxRuntime.jsx("mask", { id: maskId, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { strokeWidth: 1, strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
205
|
+
/* @__PURE__ */ jsxRuntime.jsx(ArtPaths, { paths, dashed, firstIdle: 0 }),
|
|
206
|
+
parts.map(({ part, className: className2, delay }, index) => /* @__PURE__ */ jsxRuntime.jsx("g", { className: className2, style: { transitionDelay: `${delay}ms` }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
207
|
+
ArtPaths,
|
|
208
|
+
{
|
|
209
|
+
paths: part,
|
|
210
|
+
dashed,
|
|
211
|
+
firstIdle: countIdle(paths) + parts.slice(0, index).reduce((sum, earlier) => sum + countIdle(earlier.part), 0)
|
|
212
|
+
}
|
|
213
|
+
) }, index))
|
|
214
|
+
] }) }),
|
|
215
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x, y, width, height, mask: `url(#${maskId})`, className: inkByTone[tone] })
|
|
216
|
+
]
|
|
217
|
+
}
|
|
218
|
+
);
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
exports.BillingIllustration = BillingIllustration;
|
|
222
|
+
exports.billingIllustrationHoverGroup = billingIllustrationHoverGroup;
|
|
223
|
+
//# sourceMappingURL=BillingIllustration.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BillingIllustration.cjs.js","sources":["../../src/ds/components/BillingIllustration/art/project-size-art.ts","../../src/ds/components/BillingIllustration/billing-illustration.tsx"],"sourcesContent":["import type { BillingArt } from './billing-art';\n\nconst oneUnit = {\n paths: [\n [\n 'solid',\n 'm33.12 65.12.41-1.04 1.17-.87 20.05-10.02 1.75-.59 2.07-.21 2.06.21 1.76.59L85.3 64.64l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.58-2.07.21-2.06-.21-1.76-.58L34.7 70.53l-1.17-.87-.41-1.04Z',\n ],\n ['edge', 'm85.12 66.55-.27.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.19-.4-22.91-11.45-.79-.6-.27-.69'],\n ],\n lifts: [\n [\n [\n 'solid',\n 'm40.2 46.41.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm78.05 47.84-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44'],\n [\n 'light',\n 'm55.99 64.5-.01-.25-.05-.25-.07-.26-.11-.25-.12-.25-.15-.23-.17-.2-.18-.19-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.16-.07.18-.05.21-.01.23.01.24.05.26.07.26.11.25.12.24.15.23.17.21.18.18.19.15.19.12.19.08.19.04.18-.01.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z',\n ],\n ],\n ],\n} satisfies Pick<BillingArt, 'paths' | 'lifts'>;\n\nexport const serverlessArt: BillingArt = { viewBox: [32, 32, 56, 56], ...oneUnit, dashed: true };\n\nexport const smallArt: BillingArt = { viewBox: [32, 32, 56, 56], ...oneUnit };\n\nexport const mediumArt: BillingArt = {\n viewBox: [20, 20, 80, 80],\n paths: [\n [\n 'solid',\n 'm21.19 59.15.41-1.04 1.17-.87 20.05-10.03 1.75-.58 2.07-.21 2.06.21 1.75.58L97.23 70.6l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.59-2.07.2-2.06-.2-1.75-.59-46.78-23.39-1.17-.87-.41-1.04Z',\n ],\n ['edge', 'm97.06 72.51-.28.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.18-.4-46.78-23.39-.79-.59-.28-.69'],\n ],\n lifts: [\n [\n [\n 'solid',\n 'm28.27 40.44.31-.77.87-.66 14.32-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.31-.44-17.19-8.59-.87-.66-.31-.77Z',\n ],\n ['edge', 'm66.11 41.87-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.19-8.59-.49-.37-.18-.44'],\n [\n 'idle',\n 'm44.06 58.53-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.14-.23-.17-.21-.18-.18-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.1.26.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.03h.18l.17-.04.14-.08.13-.12.1-.15.08-.18.04-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm52.13 52.37.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.31.44 17.19 8.59.87.66.31.77v18.71l-.31.78-.87.65-14.32 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm89.98 53.8-.18.44-.49.38-14.32 7.16-.75.24-.88.09-.87-.09-.75-.24-17.18-8.6-.5-.37-.17-.44'],\n [\n 'light',\n 'm67.92 70.46-.01-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.18-.19-.15-.2-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.12.25.15.22.17.21.18.18.19.15.19.12.2.08.19.04h.18l.16-.05.15-.08.13-.12.1-.15.07-.18.05-.21z',\n ],\n ],\n ],\n};\n\nexport const largeArt: BillingArt = {\n viewBox: [9, 9, 102, 102],\n paths: [\n [\n 'solid',\n 'm10.21 64.64.41-1.04 1.17-.87L53.8 41.72l1.75-.58 2.06-.21 2.07.21 1.75.58 46.78 23.39 1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-42.01 21-1.75.58-2.06.21-2.07-.21-1.75-.58-46.78-23.39-1.17-.87-.41-1.04Z',\n ],\n ['edge', 'm108.03 67.02-.27.7-.79.59-42.01 21-1.18.4-1.39.14-1.4-.14-1.18-.4-46.78-23.39-.79-.59-.27-.69'],\n ],\n lifts: [\n [\n [\n 'solid',\n 'm39.24 34.95.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm77.09 36.38-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44'],\n [\n 'idle',\n 'm55.04 53.04-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.08-.18.04-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm17.29 45.93.31-.78.88-.65 14.31-7.16 1.32-.44 1.55-.16 1.55.16 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm55.14 47.36-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44'],\n [\n 'idle',\n 'm33.08 64.02-.01-.25-.05-.25-.07-.26-.11-.26-.12-.24-.15-.23-.17-.21-.18-.18-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.11.26.12.24.15.23.17.21.18.18.19.15.19.12.19.07.19.04h.18l.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm63.11 46.88.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.78v18.7l-.31.78-.88.65-14.31 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm100.96 48.32-.18.43-.5.38-14.32 7.16-.74.25-.88.08-.88-.08-.74-.25-17.18-8.59-.5-.38-.18-.44'],\n [\n 'idle',\n 'm78.9 64.97-.01-.24-.05-.26-.07-.26-.11-.25-.12-.25-.15-.22-.17-.21-.18-.18-.19-.15-.19-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.12-.11.15-.07.18-.05.21-.01.23.01.25.05.25.07.26.11.25.12.25.15.23.17.2.18.18.19.15.19.12.19.08.19.04h.18l.17-.04.15-.09.12-.11.11-.16.07-.18.05-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm41.15 57.86.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77V78l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44L42.34 78l-.88-.66-.31-.77Z',\n ],\n ['edge', 'm79 59.29-.17.44-.5.37-14.32 7.16-.75.25-.87.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44'],\n [\n 'light',\n 'm56.95 75.95-.02-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.2-.11-.19-.08-.19-.04h-.18l-.17.04-.14.09-.13.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.14.23.17.21.18.18.19.15.19.12.2.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.07-.18.05-.21z',\n ],\n ],\n ],\n};\n","import { useId } from 'react';\nimport type { ComponentProps, SVGProps } from 'react';\nimport type { BillingArt, BillingArtPaths, BillingArtStroke } from './art/billing-art';\nimport { largeArt, mediumArt, serverlessArt, smallArt } from './art/project-size-art';\nimport { cn } from '@/lib/utils';\n\nexport type BillingIllustrationName = 'serverless' | 'small' | 'medium' | 'large';\n\nexport type BillingIllustrationTone = 'ink' | 'muted' | 'faded';\n\nexport type BillingIllustrationProps = Omit<ComponentProps<'svg'>, 'children' | 'viewBox'> & {\n name: BillingIllustrationName;\n tone?: BillingIllustrationTone;\n};\n\nexport const billingIllustrationHoverGroup = 'group/billing-illustration';\n\nconst artByName = {\n serverless: serverlessArt,\n small: smallArt,\n medium: mediumArt,\n large: largeArt,\n} satisfies Record<BillingIllustrationName, BillingArt>;\n\nconst inkByTone = {\n ink: 'fill-foreground',\n muted: 'fill-muted-foreground',\n faded: 'fill-fill-strong',\n} satisfies Record<BillingIllustrationTone, string>;\n\nconst maskPaintByStroke = {\n solid: { fill: 'black', stroke: 'white', strokeOpacity: 0.7 },\n edge: { stroke: 'white', strokeOpacity: 0.35 },\n line: { stroke: 'white' },\n light: { fill: 'white', stroke: 'white' },\n idle: { fill: 'white', stroke: 'white' },\n} satisfies Record<BillingArtStroke, SVGProps<SVGPathElement>>;\n\nconst hoverTransition = 'motion-safe:duration-slow motion-safe:ease-out-custom';\n\nconst staggerMs = 50;\n\nconst classByStroke: Partial<Record<BillingArtStroke, string>> = {\n idle: cn(\n '[fill-opacity:0] [stroke-opacity:0.35]',\n 'group-hover/billing-illustration:[fill-opacity:1] group-hover/billing-illustration:[stroke-opacity:1]',\n 'group-focus-within/billing-illustration:[fill-opacity:1] group-focus-within/billing-illustration:[stroke-opacity:1]',\n 'motion-safe:transition-[fill-opacity,stroke-opacity]',\n hoverTransition,\n ),\n};\n\nconst dashedClass = cn(\n '[stroke-dasharray:1.5_1.25]',\n 'group-focus-within/billing-illustration:[stroke-dasharray:1.5_0] group-hover/billing-illustration:[stroke-dasharray:1.5_0]',\n 'motion-safe:transition-[stroke-dasharray]',\n hoverTransition,\n);\n\nconst liftClass = cn(\n 'motion-safe:transition-[translate]',\n 'motion-safe:group-focus-within/billing-illustration:[translate:0_-3px] motion-safe:group-hover/billing-illustration:[translate:0_-3px]',\n hoverTransition,\n);\n\nconst enterClass = cn(\n 'opacity-0 group-focus-within/billing-illustration:opacity-100 group-hover/billing-illustration:opacity-100',\n 'motion-safe:[translate:0_-8px] motion-safe:group-focus-within/billing-illustration:[translate:0_0] motion-safe:group-hover/billing-illustration:[translate:0_0]',\n 'motion-safe:transition-[opacity,translate]',\n hoverTransition,\n);\n\nconst countIdle = (paths: BillingArtPaths) => paths.filter(([stroke]) => stroke === 'idle').length;\n\nfunction ArtPaths({ paths, dashed, firstIdle }: { paths: BillingArtPaths; dashed?: boolean; firstIdle: number }) {\n let idle = firstIdle;\n return paths.map(([stroke, d], index) => (\n <path\n key={index}\n d={d}\n {...maskPaintByStroke[stroke]}\n className={cn(classByStroke[stroke], dashed && stroke !== 'light' && dashedClass)}\n style={stroke === 'idle' ? { transitionDelay: `${idle++ * staggerMs}ms` } : undefined}\n vectorEffect=\"non-scaling-stroke\"\n />\n ));\n}\n\nexport function BillingIllustration({ name, tone = 'ink', className, ...props }: BillingIllustrationProps) {\n const maskId = `billing-illustration-${useId().replace(/[^\\w-]/g, '')}`;\n const { viewBox, paths, lifts = [], enters = [], dashed } = artByName[name];\n const parts = [\n ...lifts.map((part, index) => ({ part, className: liftClass, delay: index * staggerMs })),\n ...enters.map(part => ({ part, className: enterClass, delay: 0 })),\n ];\n const [x, y, width, height] = viewBox;\n\n return (\n <svg\n viewBox={viewBox.join(' ')}\n fill=\"none\"\n aria-hidden=\"true\"\n data-illustration={name}\n className={cn(billingIllustrationHoverGroup, 'block size-30 shrink-0', className)}\n {...props}\n >\n <mask id={maskId}>\n <g strokeWidth={1} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n <ArtPaths paths={paths} dashed={dashed} firstIdle={0} />\n {parts.map(({ part, className, delay }, index) => (\n <g key={index} className={className} style={{ transitionDelay: `${delay}ms` }}>\n <ArtPaths\n paths={part}\n dashed={dashed}\n firstIdle={\n countIdle(paths) + parts.slice(0, index).reduce((sum, earlier) => sum + countIdle(earlier.part), 0)\n }\n />\n </g>\n ))}\n </g>\n </mask>\n <rect x={x} y={y} width={width} height={height} mask={`url(#${maskId})`} className={inkByTone[tone]} />\n </svg>\n );\n}\n"],"names":["cn","jsx","useId","jsxs","className"],"mappings":"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"}
|
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useId } from 'react';
|
|
3
|
+
import { c as cn } from '../cn-CQUhN5Jx.js';
|
|
4
|
+
|
|
5
|
+
const oneUnit = {
|
|
6
|
+
paths: [
|
|
7
|
+
[
|
|
8
|
+
"solid",
|
|
9
|
+
"m33.12 65.12.41-1.04 1.17-.87 20.05-10.02 1.75-.59 2.07-.21 2.06.21 1.76.59L85.3 64.64l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.58-2.07.21-2.06-.21-1.76-.58L34.7 70.53l-1.17-.87-.41-1.04Z"
|
|
10
|
+
],
|
|
11
|
+
["edge", "m85.12 66.55-.27.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.19-.4-22.91-11.45-.79-.6-.27-.69"]
|
|
12
|
+
],
|
|
13
|
+
lifts: [
|
|
14
|
+
[
|
|
15
|
+
[
|
|
16
|
+
"solid",
|
|
17
|
+
"m40.2 46.41.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
18
|
+
],
|
|
19
|
+
["edge", "m78.05 47.84-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44"],
|
|
20
|
+
[
|
|
21
|
+
"light",
|
|
22
|
+
"m55.99 64.5-.01-.25-.05-.25-.07-.26-.11-.25-.12-.25-.15-.23-.17-.2-.18-.19-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.16-.07.18-.05.21-.01.23.01.24.05.26.07.26.11.25.12.24.15.23.17.21.18.18.19.15.19.12.19.08.19.04.18-.01.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z"
|
|
23
|
+
]
|
|
24
|
+
]
|
|
25
|
+
]
|
|
26
|
+
};
|
|
27
|
+
const serverlessArt = { viewBox: [32, 32, 56, 56], ...oneUnit, dashed: true };
|
|
28
|
+
const smallArt = { viewBox: [32, 32, 56, 56], ...oneUnit };
|
|
29
|
+
const mediumArt = {
|
|
30
|
+
viewBox: [20, 20, 80, 80],
|
|
31
|
+
paths: [
|
|
32
|
+
[
|
|
33
|
+
"solid",
|
|
34
|
+
"m21.19 59.15.41-1.04 1.17-.87 20.05-10.03 1.75-.58 2.07-.21 2.06.21 1.75.58L97.23 70.6l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.59-2.07.2-2.06-.2-1.75-.59-46.78-23.39-1.17-.87-.41-1.04Z"
|
|
35
|
+
],
|
|
36
|
+
["edge", "m97.06 72.51-.28.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.18-.4-46.78-23.39-.79-.59-.28-.69"]
|
|
37
|
+
],
|
|
38
|
+
lifts: [
|
|
39
|
+
[
|
|
40
|
+
[
|
|
41
|
+
"solid",
|
|
42
|
+
"m28.27 40.44.31-.77.87-.66 14.32-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.31-.44-17.19-8.59-.87-.66-.31-.77Z"
|
|
43
|
+
],
|
|
44
|
+
["edge", "m66.11 41.87-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.19-8.59-.49-.37-.18-.44"],
|
|
45
|
+
[
|
|
46
|
+
"idle",
|
|
47
|
+
"m44.06 58.53-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.14-.23-.17-.21-.18-.18-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.1.26.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.03h.18l.17-.04.14-.08.13-.12.1-.15.08-.18.04-.21z"
|
|
48
|
+
]
|
|
49
|
+
],
|
|
50
|
+
[
|
|
51
|
+
[
|
|
52
|
+
"solid",
|
|
53
|
+
"m52.13 52.37.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.31.44 17.19 8.59.87.66.31.77v18.71l-.31.78-.87.65-14.32 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
54
|
+
],
|
|
55
|
+
["edge", "m89.98 53.8-.18.44-.49.38-14.32 7.16-.75.24-.88.09-.87-.09-.75-.24-17.18-8.6-.5-.37-.17-.44"],
|
|
56
|
+
[
|
|
57
|
+
"light",
|
|
58
|
+
"m67.92 70.46-.01-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.18-.19-.15-.2-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.12.25.15.22.17.21.18.18.19.15.19.12.2.08.19.04h.18l.16-.05.15-.08.13-.12.1-.15.07-.18.05-.21z"
|
|
59
|
+
]
|
|
60
|
+
]
|
|
61
|
+
]
|
|
62
|
+
};
|
|
63
|
+
const largeArt = {
|
|
64
|
+
viewBox: [9, 9, 102, 102],
|
|
65
|
+
paths: [
|
|
66
|
+
[
|
|
67
|
+
"solid",
|
|
68
|
+
"m10.21 64.64.41-1.04 1.17-.87L53.8 41.72l1.75-.58 2.06-.21 2.07.21 1.75.58 46.78 23.39 1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-42.01 21-1.75.58-2.06.21-2.07-.21-1.75-.58-46.78-23.39-1.17-.87-.41-1.04Z"
|
|
69
|
+
],
|
|
70
|
+
["edge", "m108.03 67.02-.27.7-.79.59-42.01 21-1.18.4-1.39.14-1.4-.14-1.18-.4-46.78-23.39-.79-.59-.27-.69"]
|
|
71
|
+
],
|
|
72
|
+
lifts: [
|
|
73
|
+
[
|
|
74
|
+
[
|
|
75
|
+
"solid",
|
|
76
|
+
"m39.24 34.95.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
77
|
+
],
|
|
78
|
+
["edge", "m77.09 36.38-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44"],
|
|
79
|
+
[
|
|
80
|
+
"idle",
|
|
81
|
+
"m55.04 53.04-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.08-.18.04-.21z"
|
|
82
|
+
]
|
|
83
|
+
],
|
|
84
|
+
[
|
|
85
|
+
[
|
|
86
|
+
"solid",
|
|
87
|
+
"m17.29 45.93.31-.78.88-.65 14.31-7.16 1.32-.44 1.55-.16 1.55.16 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
88
|
+
],
|
|
89
|
+
["edge", "m55.14 47.36-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44"],
|
|
90
|
+
[
|
|
91
|
+
"idle",
|
|
92
|
+
"m33.08 64.02-.01-.25-.05-.25-.07-.26-.11-.26-.12-.24-.15-.23-.17-.21-.18-.18-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.11.26.12.24.15.23.17.21.18.18.19.15.19.12.19.07.19.04h.18l.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z"
|
|
93
|
+
]
|
|
94
|
+
],
|
|
95
|
+
[
|
|
96
|
+
[
|
|
97
|
+
"solid",
|
|
98
|
+
"m63.11 46.88.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.78v18.7l-.31.78-.88.65-14.31 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z"
|
|
99
|
+
],
|
|
100
|
+
["edge", "m100.96 48.32-.18.43-.5.38-14.32 7.16-.74.25-.88.08-.88-.08-.74-.25-17.18-8.59-.5-.38-.18-.44"],
|
|
101
|
+
[
|
|
102
|
+
"idle",
|
|
103
|
+
"m78.9 64.97-.01-.24-.05-.26-.07-.26-.11-.25-.12-.25-.15-.22-.17-.21-.18-.18-.19-.15-.19-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.12-.11.15-.07.18-.05.21-.01.23.01.25.05.25.07.26.11.25.12.25.15.23.17.2.18.18.19.15.19.12.19.08.19.04h.18l.17-.04.15-.09.12-.11.11-.16.07-.18.05-.21z"
|
|
104
|
+
]
|
|
105
|
+
],
|
|
106
|
+
[
|
|
107
|
+
[
|
|
108
|
+
"solid",
|
|
109
|
+
"m41.15 57.86.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77V78l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44L42.34 78l-.88-.66-.31-.77Z"
|
|
110
|
+
],
|
|
111
|
+
["edge", "m79 59.29-.17.44-.5.37-14.32 7.16-.75.25-.87.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44"],
|
|
112
|
+
[
|
|
113
|
+
"light",
|
|
114
|
+
"m56.95 75.95-.02-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.2-.11-.19-.08-.19-.04h-.18l-.17.04-.14.09-.13.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.14.23.17.21.18.18.19.15.19.12.2.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.07-.18.05-.21z"
|
|
115
|
+
]
|
|
116
|
+
]
|
|
117
|
+
]
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
const billingIllustrationHoverGroup = "group/billing-illustration";
|
|
121
|
+
const artByName = {
|
|
122
|
+
serverless: serverlessArt,
|
|
123
|
+
small: smallArt,
|
|
124
|
+
medium: mediumArt,
|
|
125
|
+
large: largeArt
|
|
126
|
+
};
|
|
127
|
+
const inkByTone = {
|
|
128
|
+
ink: "fill-foreground",
|
|
129
|
+
muted: "fill-muted-foreground",
|
|
130
|
+
faded: "fill-fill-strong"
|
|
131
|
+
};
|
|
132
|
+
const maskPaintByStroke = {
|
|
133
|
+
solid: { fill: "black", stroke: "white", strokeOpacity: 0.7 },
|
|
134
|
+
edge: { stroke: "white", strokeOpacity: 0.35 },
|
|
135
|
+
line: { stroke: "white" },
|
|
136
|
+
light: { fill: "white", stroke: "white" },
|
|
137
|
+
idle: { fill: "white", stroke: "white" }
|
|
138
|
+
};
|
|
139
|
+
const hoverTransition = "motion-safe:duration-slow motion-safe:ease-out-custom";
|
|
140
|
+
const staggerMs = 50;
|
|
141
|
+
const classByStroke = {
|
|
142
|
+
idle: cn(
|
|
143
|
+
"[fill-opacity:0] [stroke-opacity:0.35]",
|
|
144
|
+
"group-hover/billing-illustration:[fill-opacity:1] group-hover/billing-illustration:[stroke-opacity:1]",
|
|
145
|
+
"group-focus-within/billing-illustration:[fill-opacity:1] group-focus-within/billing-illustration:[stroke-opacity:1]",
|
|
146
|
+
"motion-safe:transition-[fill-opacity,stroke-opacity]",
|
|
147
|
+
hoverTransition
|
|
148
|
+
)
|
|
149
|
+
};
|
|
150
|
+
const dashedClass = cn(
|
|
151
|
+
"[stroke-dasharray:1.5_1.25]",
|
|
152
|
+
"group-focus-within/billing-illustration:[stroke-dasharray:1.5_0] group-hover/billing-illustration:[stroke-dasharray:1.5_0]",
|
|
153
|
+
"motion-safe:transition-[stroke-dasharray]",
|
|
154
|
+
hoverTransition
|
|
155
|
+
);
|
|
156
|
+
const liftClass = cn(
|
|
157
|
+
"motion-safe:transition-[translate]",
|
|
158
|
+
"motion-safe:group-focus-within/billing-illustration:[translate:0_-3px] motion-safe:group-hover/billing-illustration:[translate:0_-3px]",
|
|
159
|
+
hoverTransition
|
|
160
|
+
);
|
|
161
|
+
const enterClass = cn(
|
|
162
|
+
"opacity-0 group-focus-within/billing-illustration:opacity-100 group-hover/billing-illustration:opacity-100",
|
|
163
|
+
"motion-safe:[translate:0_-8px] motion-safe:group-focus-within/billing-illustration:[translate:0_0] motion-safe:group-hover/billing-illustration:[translate:0_0]",
|
|
164
|
+
"motion-safe:transition-[opacity,translate]",
|
|
165
|
+
hoverTransition
|
|
166
|
+
);
|
|
167
|
+
const countIdle = (paths) => paths.filter(([stroke]) => stroke === "idle").length;
|
|
168
|
+
function ArtPaths({ paths, dashed, firstIdle }) {
|
|
169
|
+
let idle = firstIdle;
|
|
170
|
+
return paths.map(([stroke, d], index) => /* @__PURE__ */ jsx(
|
|
171
|
+
"path",
|
|
172
|
+
{
|
|
173
|
+
d,
|
|
174
|
+
...maskPaintByStroke[stroke],
|
|
175
|
+
className: cn(classByStroke[stroke], dashed && stroke !== "light" && dashedClass),
|
|
176
|
+
style: stroke === "idle" ? { transitionDelay: `${idle++ * staggerMs}ms` } : void 0,
|
|
177
|
+
vectorEffect: "non-scaling-stroke"
|
|
178
|
+
},
|
|
179
|
+
index
|
|
180
|
+
));
|
|
181
|
+
}
|
|
182
|
+
function BillingIllustration({ name, tone = "ink", className, ...props }) {
|
|
183
|
+
const maskId = `billing-illustration-${useId().replace(/[^\w-]/g, "")}`;
|
|
184
|
+
const { viewBox, paths, lifts = [], enters = [], dashed } = artByName[name];
|
|
185
|
+
const parts = [
|
|
186
|
+
...lifts.map((part, index) => ({ part, className: liftClass, delay: index * staggerMs })),
|
|
187
|
+
...enters.map((part) => ({ part, className: enterClass, delay: 0 }))
|
|
188
|
+
];
|
|
189
|
+
const [x, y, width, height] = viewBox;
|
|
190
|
+
return /* @__PURE__ */ jsxs(
|
|
191
|
+
"svg",
|
|
192
|
+
{
|
|
193
|
+
viewBox: viewBox.join(" "),
|
|
194
|
+
fill: "none",
|
|
195
|
+
"aria-hidden": "true",
|
|
196
|
+
"data-illustration": name,
|
|
197
|
+
className: cn(billingIllustrationHoverGroup, "block size-30 shrink-0", className),
|
|
198
|
+
...props,
|
|
199
|
+
children: [
|
|
200
|
+
/* @__PURE__ */ jsx("mask", { id: maskId, children: /* @__PURE__ */ jsxs("g", { strokeWidth: 1, strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
201
|
+
/* @__PURE__ */ jsx(ArtPaths, { paths, dashed, firstIdle: 0 }),
|
|
202
|
+
parts.map(({ part, className: className2, delay }, index) => /* @__PURE__ */ jsx("g", { className: className2, style: { transitionDelay: `${delay}ms` }, children: /* @__PURE__ */ jsx(
|
|
203
|
+
ArtPaths,
|
|
204
|
+
{
|
|
205
|
+
paths: part,
|
|
206
|
+
dashed,
|
|
207
|
+
firstIdle: countIdle(paths) + parts.slice(0, index).reduce((sum, earlier) => sum + countIdle(earlier.part), 0)
|
|
208
|
+
}
|
|
209
|
+
) }, index))
|
|
210
|
+
] }) }),
|
|
211
|
+
/* @__PURE__ */ jsx("rect", { x, y, width, height, mask: `url(#${maskId})`, className: inkByTone[tone] })
|
|
212
|
+
]
|
|
213
|
+
}
|
|
214
|
+
);
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
export { BillingIllustration, billingIllustrationHoverGroup };
|
|
218
|
+
//# sourceMappingURL=BillingIllustration.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BillingIllustration.es.js","sources":["../../src/ds/components/BillingIllustration/art/project-size-art.ts","../../src/ds/components/BillingIllustration/billing-illustration.tsx"],"sourcesContent":["import type { BillingArt } from './billing-art';\n\nconst oneUnit = {\n paths: [\n [\n 'solid',\n 'm33.12 65.12.41-1.04 1.17-.87 20.05-10.02 1.75-.59 2.07-.21 2.06.21 1.76.59L85.3 64.64l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.58-2.07.21-2.06-.21-1.76-.58L34.7 70.53l-1.17-.87-.41-1.04Z',\n ],\n ['edge', 'm85.12 66.55-.27.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.19-.4-22.91-11.45-.79-.6-.27-.69'],\n ],\n lifts: [\n [\n [\n 'solid',\n 'm40.2 46.41.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm78.05 47.84-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44'],\n [\n 'light',\n 'm55.99 64.5-.01-.25-.05-.25-.07-.26-.11-.25-.12-.25-.15-.23-.17-.2-.18-.19-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.16-.07.18-.05.21-.01.23.01.24.05.26.07.26.11.25.12.24.15.23.17.21.18.18.19.15.19.12.19.08.19.04.18-.01.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z',\n ],\n ],\n ],\n} satisfies Pick<BillingArt, 'paths' | 'lifts'>;\n\nexport const serverlessArt: BillingArt = { viewBox: [32, 32, 56, 56], ...oneUnit, dashed: true };\n\nexport const smallArt: BillingArt = { viewBox: [32, 32, 56, 56], ...oneUnit };\n\nexport const mediumArt: BillingArt = {\n viewBox: [20, 20, 80, 80],\n paths: [\n [\n 'solid',\n 'm21.19 59.15.41-1.04 1.17-.87 20.05-10.03 1.75-.58 2.07-.21 2.06.21 1.75.58L97.23 70.6l1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-20.05 10.02-1.75.59-2.07.2-2.06-.2-1.75-.59-46.78-23.39-1.17-.87-.41-1.04Z',\n ],\n ['edge', 'm97.06 72.51-.28.7-.79.59-20.05 10.02-1.18.4-1.4.14-1.39-.14-1.18-.4-46.78-23.39-.79-.59-.28-.69'],\n ],\n lifts: [\n [\n [\n 'solid',\n 'm28.27 40.44.31-.77.87-.66 14.32-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.31-.44-17.19-8.59-.87-.66-.31-.77Z',\n ],\n ['edge', 'm66.11 41.87-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.19-8.59-.49-.37-.18-.44'],\n [\n 'idle',\n 'm44.06 58.53-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.14-.23-.17-.21-.18-.18-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.1.26.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.03h.18l.17-.04.14-.08.13-.12.1-.15.08-.18.04-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm52.13 52.37.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.31.44 17.19 8.59.87.66.31.77v18.71l-.31.78-.87.65-14.32 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm89.98 53.8-.18.44-.49.38-14.32 7.16-.75.24-.88.09-.87-.09-.75-.24-17.18-8.6-.5-.37-.17-.44'],\n [\n 'light',\n 'm67.92 70.46-.01-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.18-.19-.15-.2-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.12.25.15.22.17.21.18.18.19.15.19.12.2.08.19.04h.18l.16-.05.15-.08.13-.12.1-.15.07-.18.05-.21z',\n ],\n ],\n ],\n};\n\nexport const largeArt: BillingArt = {\n viewBox: [9, 9, 102, 102],\n paths: [\n [\n 'solid',\n 'm10.21 64.64.41-1.04 1.17-.87L53.8 41.72l1.75-.58 2.06-.21 2.07.21 1.75.58 46.78 23.39 1.17.88.41 1.03v3.51l-.41 1.03-1.17.88-42.01 21-1.75.58-2.06.21-2.07-.21-1.75-.58-46.78-23.39-1.17-.87-.41-1.04Z',\n ],\n ['edge', 'm108.03 67.02-.27.7-.79.59-42.01 21-1.18.4-1.39.14-1.4-.14-1.18-.4-46.78-23.39-.79-.59-.27-.69'],\n ],\n lifts: [\n [\n [\n 'solid',\n 'm39.24 34.95.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm77.09 36.38-.17.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44'],\n [\n 'idle',\n 'm55.04 53.04-.02-.25-.04-.25-.08-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.19-.11-.2-.08-.19-.04h-.18l-.16.04-.15.08-.13.12-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.15.23.16.21.18.18.19.15.2.12.19.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.08-.18.04-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm17.29 45.93.31-.78.88-.65 14.31-7.16 1.32-.44 1.55-.16 1.55.16 1.31.44 17.18 8.59.88.66.31.77v18.71l-.31.77-.88.66-14.31 7.16-1.32.44-1.55.15-1.55-.15-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm55.14 47.36-.18.44-.5.37-14.32 7.16-.74.25-.88.09-.88-.09-.74-.25-17.18-8.59-.5-.37-.18-.44'],\n [\n 'idle',\n 'm33.08 64.02-.01-.25-.05-.25-.07-.26-.11-.26-.12-.24-.15-.23-.17-.21-.18-.18-.19-.15-.19-.11-.19-.08-.19-.04h-.18l-.17.04-.15.08-.12.12-.11.15-.07.19-.05.21-.01.23.01.24.05.26.07.25.11.26.12.24.15.23.17.21.18.18.19.15.19.12.19.07.19.04h.18l.17-.04.15-.08.12-.12.11-.15.07-.18.05-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm63.11 46.88.31-.77.88-.66 14.31-7.16 1.32-.44 1.55-.15 1.55.15 1.31.44 17.18 8.59.88.66.31.78v18.7l-.31.78-.88.65-14.31 7.16-1.32.44-1.55.16-1.55-.16-1.31-.44-17.18-8.59-.88-.66-.31-.77Z',\n ],\n ['edge', 'm100.96 48.32-.18.43-.5.38-14.32 7.16-.74.25-.88.08-.88-.08-.74-.25-17.18-8.59-.5-.38-.18-.44'],\n [\n 'idle',\n 'm78.9 64.97-.01-.24-.05-.26-.07-.26-.11-.25-.12-.25-.15-.22-.17-.21-.18-.18-.19-.15-.19-.12-.19-.08-.19-.04h-.18l-.17.05-.15.08-.12.12-.11.15-.07.18-.05.21-.01.23.01.25.05.25.07.26.11.25.12.25.15.23.17.2.18.18.19.15.19.12.19.08.19.04h.18l.17-.04.15-.09.12-.11.11-.16.07-.18.05-.21z',\n ],\n ],\n [\n [\n 'solid',\n 'm41.15 57.86.31-.77.88-.66 14.32-7.16 1.31-.44 1.55-.15 1.55.15 1.32.44 17.18 8.59.88.66.31.77V78l-.31.77-.88.66-14.32 7.16-1.31.44-1.55.15-1.55-.15-1.32-.44L42.34 78l-.88-.66-.31-.77Z',\n ],\n ['edge', 'm79 59.29-.17.44-.5.37-14.32 7.16-.75.25-.87.09-.88-.09-.75-.25-17.18-8.59-.5-.37-.17-.44'],\n [\n 'light',\n 'm56.95 75.95-.02-.25-.05-.25-.07-.26-.1-.25-.13-.25-.15-.23-.16-.2-.18-.19-.19-.15-.2-.11-.19-.08-.19-.04h-.18l-.17.04-.14.09-.13.11-.1.16-.08.18-.04.21-.02.23.02.24.04.26.08.26.1.25.13.24.14.23.17.21.18.18.19.15.19.12.2.08.19.04.18-.01.16-.04.15-.08.13-.12.1-.15.07-.18.05-.21z',\n ],\n ],\n ],\n};\n","import { useId } from 'react';\nimport type { ComponentProps, SVGProps } from 'react';\nimport type { BillingArt, BillingArtPaths, BillingArtStroke } from './art/billing-art';\nimport { largeArt, mediumArt, serverlessArt, smallArt } from './art/project-size-art';\nimport { cn } from '@/lib/utils';\n\nexport type BillingIllustrationName = 'serverless' | 'small' | 'medium' | 'large';\n\nexport type BillingIllustrationTone = 'ink' | 'muted' | 'faded';\n\nexport type BillingIllustrationProps = Omit<ComponentProps<'svg'>, 'children' | 'viewBox'> & {\n name: BillingIllustrationName;\n tone?: BillingIllustrationTone;\n};\n\nexport const billingIllustrationHoverGroup = 'group/billing-illustration';\n\nconst artByName = {\n serverless: serverlessArt,\n small: smallArt,\n medium: mediumArt,\n large: largeArt,\n} satisfies Record<BillingIllustrationName, BillingArt>;\n\nconst inkByTone = {\n ink: 'fill-foreground',\n muted: 'fill-muted-foreground',\n faded: 'fill-fill-strong',\n} satisfies Record<BillingIllustrationTone, string>;\n\nconst maskPaintByStroke = {\n solid: { fill: 'black', stroke: 'white', strokeOpacity: 0.7 },\n edge: { stroke: 'white', strokeOpacity: 0.35 },\n line: { stroke: 'white' },\n light: { fill: 'white', stroke: 'white' },\n idle: { fill: 'white', stroke: 'white' },\n} satisfies Record<BillingArtStroke, SVGProps<SVGPathElement>>;\n\nconst hoverTransition = 'motion-safe:duration-slow motion-safe:ease-out-custom';\n\nconst staggerMs = 50;\n\nconst classByStroke: Partial<Record<BillingArtStroke, string>> = {\n idle: cn(\n '[fill-opacity:0] [stroke-opacity:0.35]',\n 'group-hover/billing-illustration:[fill-opacity:1] group-hover/billing-illustration:[stroke-opacity:1]',\n 'group-focus-within/billing-illustration:[fill-opacity:1] group-focus-within/billing-illustration:[stroke-opacity:1]',\n 'motion-safe:transition-[fill-opacity,stroke-opacity]',\n hoverTransition,\n ),\n};\n\nconst dashedClass = cn(\n '[stroke-dasharray:1.5_1.25]',\n 'group-focus-within/billing-illustration:[stroke-dasharray:1.5_0] group-hover/billing-illustration:[stroke-dasharray:1.5_0]',\n 'motion-safe:transition-[stroke-dasharray]',\n hoverTransition,\n);\n\nconst liftClass = cn(\n 'motion-safe:transition-[translate]',\n 'motion-safe:group-focus-within/billing-illustration:[translate:0_-3px] motion-safe:group-hover/billing-illustration:[translate:0_-3px]',\n hoverTransition,\n);\n\nconst enterClass = cn(\n 'opacity-0 group-focus-within/billing-illustration:opacity-100 group-hover/billing-illustration:opacity-100',\n 'motion-safe:[translate:0_-8px] motion-safe:group-focus-within/billing-illustration:[translate:0_0] motion-safe:group-hover/billing-illustration:[translate:0_0]',\n 'motion-safe:transition-[opacity,translate]',\n hoverTransition,\n);\n\nconst countIdle = (paths: BillingArtPaths) => paths.filter(([stroke]) => stroke === 'idle').length;\n\nfunction ArtPaths({ paths, dashed, firstIdle }: { paths: BillingArtPaths; dashed?: boolean; firstIdle: number }) {\n let idle = firstIdle;\n return paths.map(([stroke, d], index) => (\n <path\n key={index}\n d={d}\n {...maskPaintByStroke[stroke]}\n className={cn(classByStroke[stroke], dashed && stroke !== 'light' && dashedClass)}\n style={stroke === 'idle' ? { transitionDelay: `${idle++ * staggerMs}ms` } : undefined}\n vectorEffect=\"non-scaling-stroke\"\n />\n ));\n}\n\nexport function BillingIllustration({ name, tone = 'ink', className, ...props }: BillingIllustrationProps) {\n const maskId = `billing-illustration-${useId().replace(/[^\\w-]/g, '')}`;\n const { viewBox, paths, lifts = [], enters = [], dashed } = artByName[name];\n const parts = [\n ...lifts.map((part, index) => ({ part, className: liftClass, delay: index * staggerMs })),\n ...enters.map(part => ({ part, className: enterClass, delay: 0 })),\n ];\n const [x, y, width, height] = viewBox;\n\n return (\n <svg\n viewBox={viewBox.join(' ')}\n fill=\"none\"\n aria-hidden=\"true\"\n data-illustration={name}\n className={cn(billingIllustrationHoverGroup, 'block size-30 shrink-0', className)}\n {...props}\n >\n <mask id={maskId}>\n <g strokeWidth={1} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n <ArtPaths paths={paths} dashed={dashed} firstIdle={0} />\n {parts.map(({ part, className, delay }, index) => (\n <g key={index} className={className} style={{ transitionDelay: `${delay}ms` }}>\n <ArtPaths\n paths={part}\n dashed={dashed}\n firstIdle={\n countIdle(paths) + parts.slice(0, index).reduce((sum, earlier) => sum + countIdle(earlier.part), 0)\n }\n />\n </g>\n ))}\n </g>\n </mask>\n <rect x={x} y={y} width={width} height={height} mask={`url(#${maskId})`} className={inkByTone[tone]} />\n </svg>\n );\n}\n"],"names":["className"],"mappings":"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"}
|
|
@@ -15,7 +15,6 @@ const domains_chat_tools_badges_toolApprovalBadge = require('./tool-approval-bad
|
|
|
15
15
|
const domains_requestContext_hooks_useEntityRequestContext = require('../../../request-context/hooks/use-entity-request-context.cjs.js');
|
|
16
16
|
const domains_workflows_context_workflowRunContext = require('../../../workflows/context/workflow-run-context.cjs.js');
|
|
17
17
|
require('@tanstack/react-query');
|
|
18
|
-
require('../../../../toast-DxKdVSyw.cjs');
|
|
19
18
|
const domains_workflows_context_workflowStepDetailContext = require('../../../workflows/context/workflow-step-detail-context.cjs.js');
|
|
20
19
|
const domains_workflows_context_workflowStepDetailProvider = require('../../../workflows/context/workflow-step-detail-provider.cjs.js');
|
|
21
20
|
const domains_workflows_context_workflowSelectedStepContext = require('../../../workflows/context/workflow-selected-step-context.cjs.js');
|
|
@@ -34,6 +33,7 @@ require('react-hook-form');
|
|
|
34
33
|
require('../../../../lib/form/field-context.cjs.js');
|
|
35
34
|
require('../../../../lib/form/utils.cjs.js');
|
|
36
35
|
require('date-fns');
|
|
36
|
+
require('../../../../popover-AfnrAYck.cjs');
|
|
37
37
|
require('@autoform/core');
|
|
38
38
|
require('@autoform/react');
|
|
39
39
|
require('@lukeed/uuid');
|
|
@@ -11,7 +11,6 @@ import { ToolApprovalBadge } from './tool-approval-badge.es.js';
|
|
|
11
11
|
import { useEntityRequestContext } from '../../../request-context/hooks/use-entity-request-context.es.js';
|
|
12
12
|
import { WorkflowRunContext } from '../../../workflows/context/workflow-run-context.es.js';
|
|
13
13
|
import '@tanstack/react-query';
|
|
14
|
-
import '../../../../toast-5aQbZBbY.js';
|
|
15
14
|
import { useWorkflowStepDetail } from '../../../workflows/context/workflow-step-detail-context.es.js';
|
|
16
15
|
import { WorkflowStepDetailProvider } from '../../../workflows/context/workflow-step-detail-provider.es.js';
|
|
17
16
|
import { WorkflowSelectedStepProvider } from '../../../workflows/context/workflow-selected-step-context.es.js';
|
|
@@ -30,6 +29,7 @@ import 'react-hook-form';
|
|
|
30
29
|
import '../../../../lib/form/field-context.es.js';
|
|
31
30
|
import '../../../../lib/form/utils.es.js';
|
|
32
31
|
import 'date-fns';
|
|
32
|
+
import '../../../../popover-BqRniR9J.js';
|
|
33
33
|
import '@autoform/core';
|
|
34
34
|
import '@autoform/react';
|
|
35
35
|
import '@lukeed/uuid';
|
|
@@ -10,7 +10,6 @@ const lucideReact = require('lucide-react');
|
|
|
10
10
|
const React = require('react');
|
|
11
11
|
require('@mastra/react/hooks/scores');
|
|
12
12
|
require('@base-ui/react/combobox');
|
|
13
|
-
require('../../../toast-DxKdVSyw.cjs');
|
|
14
13
|
const domains_scores_components_traceScoresTab = require('../../scores/components/trace-scores-tab.cjs.js');
|
|
15
14
|
require('@mastra/core/utils/safe-stringify');
|
|
16
15
|
require('@mastra/react/hooks/datasets');
|