@marigold/theme-rui 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +795 -54
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +795 -54
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1628 -463
- package/dist/theme.css +91 -4
- package/package.json +8 -6
package/dist/index.mjs
CHANGED
|
@@ -7,145 +7,886 @@ var __export = (target, all) => {
|
|
|
7
7
|
// src/components/index.ts
|
|
8
8
|
var components_exports = {};
|
|
9
9
|
__export(components_exports, {
|
|
10
|
+
Accordion: () => Accordion,
|
|
11
|
+
Badge: () => Badge,
|
|
12
|
+
Body: () => Body,
|
|
10
13
|
Button: () => Button,
|
|
14
|
+
Calendar: () => Calendar,
|
|
11
15
|
Card: () => Card,
|
|
16
|
+
Checkbox: () => Checkbox,
|
|
17
|
+
ComboBox: () => ComboBox,
|
|
12
18
|
DateField: () => DateField,
|
|
19
|
+
DatePicker: () => DatePicker,
|
|
20
|
+
Dialog: () => Dialog,
|
|
21
|
+
Divider: () => Divider,
|
|
13
22
|
Field: () => Field,
|
|
23
|
+
Footer: () => Footer,
|
|
24
|
+
Header: () => Header,
|
|
25
|
+
Headline: () => Headline,
|
|
14
26
|
HelpText: () => HelpText,
|
|
27
|
+
IconButton: () => IconButton,
|
|
28
|
+
Image: () => Image,
|
|
15
29
|
Input: () => Input,
|
|
16
30
|
Label: () => Label,
|
|
31
|
+
Link: () => Link,
|
|
32
|
+
List: () => List,
|
|
33
|
+
ListBox: () => ListBox,
|
|
34
|
+
Menu: () => Menu,
|
|
17
35
|
NumberField: () => NumberField,
|
|
36
|
+
Pagination: () => Pagination,
|
|
37
|
+
Popover: () => Popover,
|
|
38
|
+
ProgressCycle: () => ProgressCycle,
|
|
39
|
+
Radio: () => Radio,
|
|
40
|
+
SectionMessage: () => SectionMessage,
|
|
41
|
+
Select: () => Select,
|
|
42
|
+
Slider: () => Slider,
|
|
43
|
+
Switch: () => Switch,
|
|
44
|
+
Table: () => Table,
|
|
45
|
+
Tabs: () => Tabs,
|
|
46
|
+
Tag: () => Tag,
|
|
47
|
+
Text: () => Text,
|
|
18
48
|
TextArea: () => TextArea,
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
inputInvalid: () => inputInvalid,
|
|
23
|
-
inputReadOnly: () => inputReadOnly
|
|
49
|
+
Tooltip: () => Tooltip,
|
|
50
|
+
Underlay: () => Underlay,
|
|
51
|
+
XLoader: () => XLoader
|
|
24
52
|
});
|
|
25
53
|
|
|
26
|
-
// src/components/
|
|
54
|
+
// src/components/Accordion.styles.ts
|
|
27
55
|
import { cva } from "@marigold/system";
|
|
28
|
-
var
|
|
56
|
+
var Accordion = {
|
|
57
|
+
container: cva("flex-col", {
|
|
58
|
+
variants: {
|
|
59
|
+
variant: {
|
|
60
|
+
default: "",
|
|
61
|
+
card: "space-y-2"
|
|
62
|
+
}
|
|
63
|
+
},
|
|
64
|
+
defaultVariants: {
|
|
65
|
+
variant: "default"
|
|
66
|
+
}
|
|
67
|
+
}),
|
|
68
|
+
item: cva("border-b last:border-b-0 border-border ", {
|
|
69
|
+
variants: {
|
|
70
|
+
variant: {
|
|
71
|
+
default: "",
|
|
72
|
+
card: "has-focus-visible:border-border has-focus-visible:ring-ring/50 rounded-md border px-4 py-1 outline-none last:border-b has-focus-visible:ring-[3px]"
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
defaultVariants: {
|
|
76
|
+
variant: "default"
|
|
77
|
+
}
|
|
78
|
+
}),
|
|
79
|
+
header: cva(
|
|
80
|
+
[
|
|
81
|
+
"focus-visible:border-border focus-visible:ring-ring/50 flex flex-1 w-full items-center justify-between gap-4 rounded-md py-2 text-left text-sm font-semibold",
|
|
82
|
+
" transition-all outline-none hover:no-underline focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:text-disabled-foreground leading-6"
|
|
83
|
+
],
|
|
84
|
+
{
|
|
85
|
+
variants: {
|
|
86
|
+
variant: {
|
|
87
|
+
default: "",
|
|
88
|
+
card: "hover:no-underline focus-visible:ring-0"
|
|
89
|
+
}
|
|
90
|
+
},
|
|
91
|
+
defaultVariants: {
|
|
92
|
+
variant: "default"
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
),
|
|
96
|
+
content: cva(
|
|
97
|
+
"overflow-hidden text-sm text-muted-foreground in-data-[expanded]:pb-2"
|
|
98
|
+
),
|
|
99
|
+
icon: cva(
|
|
100
|
+
"pointer-events-none shrink-0 opacity-60 transition-transform duration-200"
|
|
101
|
+
)
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
// src/components/Badge.styles.ts
|
|
105
|
+
import { cva as cva2 } from "@marigold/system";
|
|
106
|
+
var circle = "before:size-1.5 before:rounded-full";
|
|
107
|
+
var Badge = cva2(
|
|
108
|
+
[
|
|
109
|
+
"inline-flex items-center justify-center rounded-full border px-1.5 text-xs font-medium leading-normal transition-colors",
|
|
110
|
+
// TODO: Make focus style be a utility or something?
|
|
111
|
+
"outline-offset-2 focus-visible:outline-2 outline-ring/70"
|
|
112
|
+
],
|
|
113
|
+
{
|
|
114
|
+
variants: {
|
|
115
|
+
variant: {
|
|
116
|
+
default: "border-border bg-white",
|
|
117
|
+
primary: "bg-brand text-brand-foreground border-transparent",
|
|
118
|
+
success: [
|
|
119
|
+
"bg-success-muted text-success-muted-foreground border-success-muted-accent before:bg-success-muted-accent gap-1.5",
|
|
120
|
+
circle
|
|
121
|
+
],
|
|
122
|
+
warning: [
|
|
123
|
+
"bg-warning-muted text-warning-muted-foreground border-warning-muted-accent before:bg-warning-muted-accent gap-1.5",
|
|
124
|
+
circle
|
|
125
|
+
],
|
|
126
|
+
info: [
|
|
127
|
+
"bg-info-muted text-info-muted-foreground border-info-muted-accent before:bg-info-muted-accent gap-1.5",
|
|
128
|
+
circle
|
|
129
|
+
],
|
|
130
|
+
error: [
|
|
131
|
+
"bg-destructive-muted text-destructive-muted-foreground border-destructive-muted-accent before:bg-destructive-muted-accent gap-1.5",
|
|
132
|
+
circle
|
|
133
|
+
]
|
|
134
|
+
}
|
|
135
|
+
},
|
|
136
|
+
defaultVariants: {
|
|
137
|
+
variant: "default"
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
);
|
|
141
|
+
|
|
142
|
+
// src/components/Body.styles.ts
|
|
143
|
+
import { cva as cva3 } from "@marigold/system";
|
|
144
|
+
var Body = cva3("");
|
|
145
|
+
|
|
146
|
+
// src/components/Button.styles.ts
|
|
147
|
+
import { cva as cva4 } from "@marigold/system";
|
|
148
|
+
var Button = cva4(
|
|
29
149
|
[
|
|
30
|
-
"inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium transition-colors outline-
|
|
150
|
+
"inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium transition-colors outline-hidden",
|
|
151
|
+
"[&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
152
|
+
"focus-visible:outline-offset-2 focus-visible:outline focus-visible:outline-ring/70",
|
|
153
|
+
"h-button px-4 py-2",
|
|
154
|
+
"disabled:pointer-events-none disabled:bg-disabled disabled:text-disabled-foreground disabled:border-none disabled:cursor-not-allowed",
|
|
155
|
+
"pending:text-disabled-foreground pending:bg-disabled pending:cursor-not-allowed pending:border-none"
|
|
31
156
|
],
|
|
32
157
|
{
|
|
33
158
|
variants: {
|
|
34
159
|
variant: {
|
|
35
|
-
|
|
36
|
-
|
|
160
|
+
default: "border border-border bg-background shadow-sm shadow-black/5 hover:bg-hover hover:text-foreground",
|
|
161
|
+
primary: "bg-brand text-brand-foreground shadow-sm shadow-black/5 hover:bg-brand/90",
|
|
162
|
+
destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
|
|
163
|
+
ghost: "hover:bg-hover hover:text-foreground",
|
|
164
|
+
// only used for calendar in MonthListBox and YearListBox to have a hover over other options
|
|
165
|
+
// TODO: Remove this in future and rethink the MonthListBox and YearListBox or use another variant
|
|
166
|
+
text: "hover:bg-hover"
|
|
37
167
|
}
|
|
168
|
+
},
|
|
169
|
+
defaultVariants: {
|
|
170
|
+
variant: "default"
|
|
38
171
|
}
|
|
39
172
|
}
|
|
40
173
|
);
|
|
41
174
|
|
|
42
175
|
// src/components/Card.styles.ts
|
|
43
|
-
import { cva as
|
|
44
|
-
var Card =
|
|
176
|
+
import { cva as cva5 } from "@marigold/system";
|
|
177
|
+
var Card = cva5([
|
|
178
|
+
"border border-input rounded-lg",
|
|
179
|
+
"bg-surface-overlay ",
|
|
180
|
+
"p-4",
|
|
181
|
+
" shadow-sm shadow-black/5"
|
|
182
|
+
]);
|
|
183
|
+
|
|
184
|
+
// src/components/Checkbox.styles.ts
|
|
185
|
+
import { cva as cva6 } from "@marigold/system";
|
|
186
|
+
var Checkbox = {
|
|
187
|
+
checkbox: cva6([
|
|
188
|
+
"grid size-4 shrink-0 place-content-center rounded",
|
|
189
|
+
"border border-input shadow-sm shadow-black/5",
|
|
190
|
+
"group-disabled/checkbox:border-disabled",
|
|
191
|
+
"outline-offset-2 group-[focus-visible]/checkbox:outline-2 group-[focus-visible]/checkbox:outline-ring/70",
|
|
192
|
+
"group-selected/checkbox:border-brand group-selected/checkbox:bg-brand group-selected/checkbox:text-brand-foreground",
|
|
193
|
+
"group-[indeterminate]/checkbox:border-brand group-[indeterminate]/checkbox:bg-brand group-[indeterminate]/checkbox:text-brand-foreground"
|
|
194
|
+
]),
|
|
195
|
+
container: cva6(),
|
|
196
|
+
label: cva6(
|
|
197
|
+
'text-sm leading-4 group-[group="checkbox"]/checkboxgroup:font-normal font-medium text-foreground group-disabled/checkbox:text-disabled-foreground'
|
|
198
|
+
),
|
|
199
|
+
group: cva6()
|
|
200
|
+
};
|
|
201
|
+
|
|
202
|
+
// src/components/Calendar.styles.ts
|
|
203
|
+
import { cva as cva7 } from "@marigold/system";
|
|
204
|
+
var Calendar = {
|
|
205
|
+
calendar: cva7(
|
|
206
|
+
"rounded-lg border group-[trigger]/popover:border-0 border-border p-2"
|
|
207
|
+
),
|
|
208
|
+
calendarCell: cva7([
|
|
209
|
+
"relative flex size-9 items-center justify-center whitespace-nowrap rounded-lg",
|
|
210
|
+
"border border-transparent p-0 text-sm font-normal text-foreground",
|
|
211
|
+
"outline-offset-2 duration-150 [transition-property:color,background-color,border-radius,box-shadow]",
|
|
212
|
+
"disabled:pointer-events-none data-[unavailable]:pointer-events-none data-focus-visible:z-10 data-[hovered]:bg-hover selected:bg-brand data-[hovered]:text-foreground selected:text-brand-foreground data-[unavailable]:line-through",
|
|
213
|
+
"disabled:opacity-30 data-[unavailable]:opacity-30",
|
|
214
|
+
"focus:outline-0 focus-visible:outline-2 focus-visible:outline-ring/70"
|
|
215
|
+
]),
|
|
216
|
+
calendarControllers: cva7([
|
|
217
|
+
"size-9 rounded-lg",
|
|
218
|
+
"text-muted-foreground/80",
|
|
219
|
+
"outline-offset-2 transition-colors",
|
|
220
|
+
"focus-visible:outline-2 focus-visible:outline-ring/70"
|
|
221
|
+
]),
|
|
222
|
+
calendarHeader: cva7([
|
|
223
|
+
"size-9 rounded-lg p-0 text-xs font-medium text-muted-foreground/80"
|
|
224
|
+
]),
|
|
225
|
+
calendarGrid: cva7("[&_td]:p-2")
|
|
226
|
+
};
|
|
227
|
+
|
|
228
|
+
// src/components/ComboBox.styles.ts
|
|
229
|
+
import { cva as cva8 } from "@marigold/system";
|
|
230
|
+
var ComboBox = cva8(
|
|
231
|
+
"text-muted-foreground/80 right-2"
|
|
232
|
+
);
|
|
45
233
|
|
|
46
234
|
// src/components/DateField.styles.ts
|
|
47
|
-
import { cva as
|
|
235
|
+
import { cva as cva10 } from "@marigold/system";
|
|
48
236
|
|
|
49
237
|
// src/components/Input.styles.ts
|
|
50
|
-
import { cva as
|
|
51
|
-
var inputContainer = "flex w-full px-3 py-2 rounded-lg shadow-sm shadow-black/5 border border-input
|
|
52
|
-
var inputDisabled = "disabled:cursor-not-allowed disabled:
|
|
238
|
+
import { cva as cva9 } from "@marigold/system";
|
|
239
|
+
var inputContainer = "flex w-full px-3 py-2 rounded-lg shadow-sm shadow-black/5 border border-input bg-background text-sm text-foreground transition-shadow";
|
|
240
|
+
var inputDisabled = "disabled:cursor-not-allowed disabled:text-disabled-foreground disabled:bg-disabled";
|
|
53
241
|
var inputInvalid = "group-error/field:border-destructive group-error/field:focus:border-destructive group-error/field:focus:ring-destructive/20";
|
|
54
|
-
var inputFocus =
|
|
55
|
-
|
|
242
|
+
var inputFocus = {
|
|
243
|
+
focus: "focus:border-ring focus:outline-none focus:ring-[3px] focus:ring-ring/20",
|
|
244
|
+
"focus-within": "focus-within:border-ring focus-within:outline-none focus-within:ring-[3px] focus-within:ring-ring/20"
|
|
245
|
+
};
|
|
246
|
+
var inputReadOnly = "group-[readonly]/field:bg-muted";
|
|
56
247
|
var Input = {
|
|
57
|
-
input:
|
|
248
|
+
input: cva9([
|
|
58
249
|
inputContainer,
|
|
59
250
|
inputDisabled,
|
|
60
251
|
inputInvalid,
|
|
61
|
-
inputFocus,
|
|
252
|
+
inputFocus["focus"],
|
|
62
253
|
inputReadOnly,
|
|
63
254
|
"h-input",
|
|
64
255
|
"placeholder:text-placeholder",
|
|
65
|
-
"[&[type=file]]:border-solid [&[type=file]]:bg-background [&[type=file]]:p-0 [&[type=file]]:pr-3 [&[type=file]]:italic [&[type=file]]:text-muted-foreground/70 file:me-3 file:h-full file:border-0 file:border-r file:border-solid file:border-input
|
|
256
|
+
"[&[type=file]]:border-solid [&[type=file]]:bg-background [&[type=file]]:p-0 [&[type=file]]:pr-3 [&[type=file]]:italic [&[type=file]]:text-muted-foreground/70 file:me-3 file:h-full file:border-0 file:border-r file:border-solid file:border-input file:bg-transparent file:px-3 file:text-sm file:font-medium file:not-italic file:text-foreground",
|
|
66
257
|
"group-[icon]/input:pl-8",
|
|
67
258
|
"group-[action]/input:pr-8"
|
|
68
259
|
]),
|
|
69
|
-
icon:
|
|
260
|
+
icon: cva9([
|
|
70
261
|
"pointer-events-none left-1",
|
|
71
|
-
"text-muted-foreground disabled:
|
|
262
|
+
"text-muted-foreground disabled:text-disabled-foreground"
|
|
72
263
|
]),
|
|
73
|
-
action:
|
|
264
|
+
action: cva9(["text-muted-foreground right-1"])
|
|
74
265
|
};
|
|
75
266
|
|
|
76
267
|
// src/components/DateField.styles.ts
|
|
77
268
|
var DateField = {
|
|
78
|
-
field:
|
|
269
|
+
field: cva10([
|
|
79
270
|
"h-input",
|
|
80
271
|
inputContainer,
|
|
81
272
|
inputDisabled,
|
|
82
|
-
inputFocus,
|
|
273
|
+
inputFocus["focus-within"],
|
|
83
274
|
inputInvalid,
|
|
84
|
-
inputReadOnly
|
|
275
|
+
inputReadOnly,
|
|
276
|
+
"invalid:focus-within:border-destructive invalid:focus-within:ring-destructive/20"
|
|
277
|
+
]),
|
|
278
|
+
segment: cva10([
|
|
279
|
+
inputDisabled,
|
|
280
|
+
"inline rounded p-0.5 text-foreground caret-transparent outline-0 data-[type=literal]:px-0 data-[focused]:data-[placeholder]:text-foreground data-[focused]:text-foreground data-[type=literal]:text-placeholder ",
|
|
281
|
+
"data-[focused]:bg-focus",
|
|
282
|
+
"data-[placeholder]:disabled:text-disabled-foreground",
|
|
283
|
+
"invalid:data-[focused]:bg-destructive invalid:data-[focused]:data-[placeholder]:text-destructive-foreground invalid:data-[focused]:text-destructive-foreground invalid:placeholder:text-destructive invalid:text-destructive data-[placeholder]:text-placeholder"
|
|
85
284
|
]),
|
|
86
|
-
|
|
87
|
-
|
|
285
|
+
action: cva10(
|
|
286
|
+
"fill-muted-foreground disabled:text-disabled-foreground group-error/field:fill-destructive"
|
|
287
|
+
)
|
|
288
|
+
};
|
|
289
|
+
|
|
290
|
+
// src/components/DatePicker.styles.ts
|
|
291
|
+
import { cva as cva11 } from "@marigold/system";
|
|
292
|
+
var DatePicker = cva11([
|
|
293
|
+
"relative h-input -top-2",
|
|
294
|
+
"text-muted-foreground/80",
|
|
295
|
+
"hover:text-brand"
|
|
296
|
+
]);
|
|
297
|
+
|
|
298
|
+
// src/components/Dialog.styles.ts
|
|
299
|
+
import { cva as cva12 } from "@marigold/system";
|
|
300
|
+
var Dialog = {
|
|
301
|
+
closeButton: cva12(""),
|
|
302
|
+
container: cva12(
|
|
303
|
+
[
|
|
304
|
+
"bg-background fixed top-1/2 left-1/2 z-50 grid max-h-[calc(100%-2rem)] w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 overflow-y-auto rounded-xl",
|
|
305
|
+
" border p-6 shadow-lg duration-200 sm:max-w-100 border-border"
|
|
306
|
+
],
|
|
307
|
+
{
|
|
308
|
+
variants: {
|
|
309
|
+
size: {
|
|
310
|
+
default: "",
|
|
311
|
+
small: "w-[min(100%,640px)]",
|
|
312
|
+
medium: "w-[min(100%,768px)]",
|
|
313
|
+
large: "w-[min(100%,1024px)]"
|
|
314
|
+
}
|
|
315
|
+
},
|
|
316
|
+
defaultVariants: {
|
|
317
|
+
size: "default"
|
|
318
|
+
}
|
|
319
|
+
}
|
|
320
|
+
),
|
|
321
|
+
header: cva12("flex flex-col gap-1 text-center sm:text-left"),
|
|
322
|
+
content: cva12("text-muted-foreground text-sm"),
|
|
323
|
+
actions: cva12("flex flex-col-reverse gap-3 sm:flex-row sm:justify-end")
|
|
88
324
|
};
|
|
89
325
|
|
|
326
|
+
// src/components/Divider.styles.ts
|
|
327
|
+
import { cva as cva13 } from "@marigold/system";
|
|
328
|
+
var Divider = cva13(
|
|
329
|
+
"bg-stone-300 h-px w-full",
|
|
330
|
+
{
|
|
331
|
+
variants: {
|
|
332
|
+
variant: {
|
|
333
|
+
bold: "h-0.5",
|
|
334
|
+
section: ""
|
|
335
|
+
}
|
|
336
|
+
}
|
|
337
|
+
}
|
|
338
|
+
);
|
|
339
|
+
|
|
340
|
+
// src/components/IconButton.styles.ts
|
|
341
|
+
import { cva as cva14 } from "@marigold/system";
|
|
342
|
+
var IconButton = cva14("", {
|
|
343
|
+
variants: {
|
|
344
|
+
variant: {
|
|
345
|
+
navigation: "inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium transition-colors outline-offset-2 focus-visible:outline-2 outline-ring/30 disabled:pointer-events-none disabled:bg-disabled disabled:text-disabled-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-hover hover:text-hover-foreground h-9 py-2 gap-1 px-2.5"
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
});
|
|
349
|
+
|
|
90
350
|
// src/components/Field.styles.ts
|
|
91
|
-
import { cva as
|
|
92
|
-
var Field =
|
|
351
|
+
import { cva as cva15 } from "@marigold/system";
|
|
352
|
+
var Field = cva15("space-y-2");
|
|
353
|
+
|
|
354
|
+
// src/components/Footer.styles.ts
|
|
355
|
+
import { cva as cva16 } from "@marigold/system";
|
|
356
|
+
var Footer = cva16("");
|
|
357
|
+
|
|
358
|
+
// src/components/Header.styles.ts
|
|
359
|
+
import { cva as cva17 } from "@marigold/system";
|
|
360
|
+
var Header = cva17("");
|
|
361
|
+
|
|
362
|
+
// src/components/Headline.styles.ts
|
|
363
|
+
import { cva as cva18 } from "@marigold/system";
|
|
364
|
+
var Headline = cva18("", {
|
|
365
|
+
variants: {
|
|
366
|
+
size: {
|
|
367
|
+
"level-1": "text-5xl font-black",
|
|
368
|
+
"level-2": "text-3xl font-black",
|
|
369
|
+
"level-3": "text-2xl font-black",
|
|
370
|
+
"level-4": "text-lg font-black",
|
|
371
|
+
"level-5": "text-base font-black",
|
|
372
|
+
"level-6": "text-base font-normal"
|
|
373
|
+
}
|
|
374
|
+
}
|
|
375
|
+
});
|
|
93
376
|
|
|
94
377
|
// src/components/HelpText.styles.ts
|
|
95
|
-
import { cva as
|
|
378
|
+
import { cva as cva19 } from "@marigold/system";
|
|
96
379
|
var HelpText = {
|
|
97
|
-
container:
|
|
98
|
-
"mt-2 text-xs text-muted-foreground",
|
|
380
|
+
container: cva19([
|
|
381
|
+
"mt-2 text-xs text-muted-foreground group-disabled/field:text-disabled-foreground",
|
|
99
382
|
"group-error/field:text-destructive"
|
|
100
383
|
]),
|
|
101
|
-
icon:
|
|
384
|
+
icon: cva19("")
|
|
102
385
|
};
|
|
103
386
|
|
|
387
|
+
// src/components/Image.styles.ts
|
|
388
|
+
import { cva as cva20 } from "@marigold/system";
|
|
389
|
+
var Image = cva20();
|
|
390
|
+
|
|
104
391
|
// src/components/Label.styles.ts
|
|
105
|
-
import { cva as
|
|
392
|
+
import { cva as cva21 } from "@marigold/system";
|
|
106
393
|
var Label = {
|
|
107
|
-
container:
|
|
394
|
+
container: cva21([
|
|
108
395
|
"text-sm font-medium leading-4 text-foreground",
|
|
109
|
-
"group-disabled/field:cursor-not-allowed group-disabled/field:
|
|
396
|
+
"group-disabled/field:cursor-not-allowed group-disabled/field:text-disabled-foreground"
|
|
110
397
|
]),
|
|
111
|
-
indicator:
|
|
398
|
+
indicator: cva21(
|
|
112
399
|
"group-required/field:block group-required/field:text-destructive"
|
|
113
400
|
)
|
|
114
401
|
};
|
|
115
402
|
|
|
403
|
+
// src/components/Link.styles.ts
|
|
404
|
+
import { cva as cva22 } from "@marigold/system";
|
|
405
|
+
var Link = cva22(
|
|
406
|
+
[
|
|
407
|
+
"text-text-link hover:underline aria-[disabled]:cursor-not-allowed py-2 underline-offset-5"
|
|
408
|
+
],
|
|
409
|
+
{
|
|
410
|
+
variants: {
|
|
411
|
+
variant: {
|
|
412
|
+
menuItemLink: "",
|
|
413
|
+
secondary: ""
|
|
414
|
+
}
|
|
415
|
+
}
|
|
416
|
+
}
|
|
417
|
+
);
|
|
418
|
+
|
|
419
|
+
// src/components/List.styles.ts
|
|
420
|
+
import { cva as cva23 } from "@marigold/system";
|
|
421
|
+
var List = {
|
|
422
|
+
ul: cva23("ml-6 list-inside list-disc py-3"),
|
|
423
|
+
ol: cva23("ml-6 list-inside list-decimal py-3"),
|
|
424
|
+
item: cva23("pt-3")
|
|
425
|
+
};
|
|
426
|
+
|
|
427
|
+
// src/components/ListBox.styles.ts
|
|
428
|
+
import { cva as cva24 } from "@marigold/system";
|
|
429
|
+
var ListBox = {
|
|
430
|
+
container: cva24([
|
|
431
|
+
"overflow-hidden rounded-lg border border-input group-[trigger]/popover:border-0"
|
|
432
|
+
]),
|
|
433
|
+
list: cva24(["space-y-1 bg-background p-1 text-sm outline-0"]),
|
|
434
|
+
option: cva24([
|
|
435
|
+
"disabled:cursor-not-allowed disabled:text-disabled-foreground",
|
|
436
|
+
"relative flex flex-col rounded-md px-2 py-1.5 text-sm text-foreground",
|
|
437
|
+
"selected:bg-selected",
|
|
438
|
+
"focus:outline-2 focus:outline-ring/70"
|
|
439
|
+
]),
|
|
440
|
+
section: cva24(""),
|
|
441
|
+
header: cva24(
|
|
442
|
+
"[&_header]:px-2 [&_header]:py-1.5 [&_header]:text-xs [&_header]:font-medium [&_header]:text-muted-foreground"
|
|
443
|
+
)
|
|
444
|
+
};
|
|
445
|
+
|
|
446
|
+
// src/components/Menu.styles.ts
|
|
447
|
+
import { cva as cva25 } from "@marigold/system";
|
|
448
|
+
var Menu = {
|
|
449
|
+
container: cva25([
|
|
450
|
+
"bg-surface-overlay text-foreground z-50 min-w-40 overflow-hidden rounded-md p-1 border-border"
|
|
451
|
+
]),
|
|
452
|
+
item: cva25([
|
|
453
|
+
"focus:bg-focus focus:text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none disabled:text-disabled-foreground"
|
|
454
|
+
]),
|
|
455
|
+
section: cva25(
|
|
456
|
+
"text-muted-foreground px-2 py-1.5 text-xs font-medium border-t border-t-border in-first:border-t-0"
|
|
457
|
+
)
|
|
458
|
+
};
|
|
459
|
+
|
|
116
460
|
// src/components/NumberField.styles.ts
|
|
117
|
-
import { cva as
|
|
461
|
+
import { cva as cva26 } from "@marigold/system";
|
|
118
462
|
var NumberField = {
|
|
119
|
-
group:
|
|
120
|
-
inputFocus,
|
|
463
|
+
group: cva26([
|
|
464
|
+
inputFocus["focus-within"],
|
|
121
465
|
inputInvalid,
|
|
122
466
|
"relative inline-flex w-full -mb-0.5 items-center overflow-hidden whitespace-nowrap rounded-lg h-input grow text-center tabular-nums text-foreground",
|
|
123
|
-
"border border-input
|
|
124
|
-
"data-invalid:data-[focus-within]:border-destructive data-invalid:data-[focus-within]:ring-destructive/20"
|
|
125
|
-
"data-[focus-within]:border-input-ring data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-input-ring/20"
|
|
467
|
+
"border border-input text-sm shadow-sm shadow-black/5 transition-shadow",
|
|
468
|
+
"data-invalid:data-[focus-within]:border-destructive data-invalid:data-[focus-within]:ring-destructive/20"
|
|
126
469
|
]),
|
|
127
|
-
stepper:
|
|
470
|
+
stepper: cva26([
|
|
128
471
|
"w-7 h-full",
|
|
129
|
-
"
|
|
130
|
-
"border-input
|
|
131
|
-
"border-input
|
|
472
|
+
"disabled:text-disabled-foreground disabled:bg-disabled",
|
|
473
|
+
"border-input border-solid first-of-type:border-r",
|
|
474
|
+
"border-input border-solid last-of-type:border-l "
|
|
132
475
|
]),
|
|
133
|
-
input:
|
|
476
|
+
input: cva26(
|
|
134
477
|
"border-none shadow-none rounded-none outline-offset-0 text-center focus-visible:ring-0"
|
|
135
478
|
)
|
|
136
479
|
};
|
|
137
480
|
|
|
481
|
+
// src/components/Popover.styles.ts
|
|
482
|
+
import { cva as cva27 } from "@marigold/system";
|
|
483
|
+
var Popover = cva27([
|
|
484
|
+
"group/popover",
|
|
485
|
+
"z-50 overflow-y-auto overflow-x-hidden rounded-lg outline-0",
|
|
486
|
+
"border border-border",
|
|
487
|
+
/** animate stuff missing */
|
|
488
|
+
"bg-surface-overlay text-foreground shadow-lg shadow-black/5 ",
|
|
489
|
+
"placement-t:mb-1",
|
|
490
|
+
"placement-b:mt-1",
|
|
491
|
+
"placement-r:ml-1",
|
|
492
|
+
"placement-l:mr-1"
|
|
493
|
+
]);
|
|
494
|
+
|
|
495
|
+
// src/components/Radio.styles.ts
|
|
496
|
+
import { cva as cva28 } from "@marigold/system";
|
|
497
|
+
var Radio = {
|
|
498
|
+
container: cva28(),
|
|
499
|
+
label: cva28(
|
|
500
|
+
"group-disabled/radio:text-disabled-foreground text-sm font-normal"
|
|
501
|
+
),
|
|
502
|
+
radio: cva28([
|
|
503
|
+
"aspect-square size-4 rounded-full",
|
|
504
|
+
"border border-input shadow-sm shadow-black/5",
|
|
505
|
+
"outline-offset-2 group-[focus-visible]/radio:outline-2 group-[focus-visible]/radio:outline-ring/70",
|
|
506
|
+
"group-disabled/radio:border-disabled",
|
|
507
|
+
"group-selected/radio:border-brand group-selected/radio:bg-brand group-selected/radio:text-brand-foreground"
|
|
508
|
+
]),
|
|
509
|
+
group: cva28()
|
|
510
|
+
};
|
|
511
|
+
|
|
512
|
+
// src/components/Pagination.styles.ts
|
|
513
|
+
import { cva as cva29 } from "@marigold/system";
|
|
514
|
+
var Pagination = {
|
|
515
|
+
navigationButton: cva29(
|
|
516
|
+
"inline-flex items-center justify-center whitespace-nowrap rounded-lg text-sm font-medium transition-colors outline-offset-2 focus-visible:outline-2 outline-ring/30 disabled:pointer-events-none disabled:bg-disabled disabled:text-disabled-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-hover hover:text-hover-foreground h-9 py-2 gap-1 px-2.5"
|
|
517
|
+
),
|
|
518
|
+
pageButton: cva29([
|
|
519
|
+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lg text-sm font-medium transition-colors outline-offset-2 focus-visible:outline-2 outline-ring/30 disabled:pointer-events-none disabled:bg-disabled disabled:text-disabled-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 bg-background size-9",
|
|
520
|
+
"data-[selected=true]:border data-[selected=true]:border-input data-[selected=true]:shadow-xs",
|
|
521
|
+
"hover:bg-hover hover:text-hover-foreground"
|
|
522
|
+
]),
|
|
523
|
+
icon: cva29("h-4 w-4")
|
|
524
|
+
};
|
|
525
|
+
|
|
526
|
+
// src/components/ProgressCycle.styles.ts
|
|
527
|
+
import { cva as cva30 } from "@marigold/system";
|
|
528
|
+
var ProgressCycle = cva30([
|
|
529
|
+
"stroke-background"
|
|
530
|
+
]);
|
|
531
|
+
|
|
532
|
+
// src/components/SectionMessage.styles.ts
|
|
533
|
+
import { cva as cva31 } from "@marigold/system";
|
|
534
|
+
var SectionMessage = {
|
|
535
|
+
container: cva31(
|
|
536
|
+
[
|
|
537
|
+
'grid-cols-[min-content_auto_min-content] gap-x-4 gap-y-2 [grid-template-areas:"icon_title_close""icon_content_content"]',
|
|
538
|
+
"bg-background z-50 max-w-[601px] rounded-sm border p-4"
|
|
539
|
+
],
|
|
540
|
+
{
|
|
541
|
+
variants: {
|
|
542
|
+
variant: {
|
|
543
|
+
success: "border-success-muted-accent bg-success-muted text-success-muted-foreground",
|
|
544
|
+
warning: "border-warning-muted-accent bg-warning-muted text-warning-muted-foreground",
|
|
545
|
+
info: "border-info-muted-accent bg-info-muted text-info-muted-foreground",
|
|
546
|
+
error: "border-destructive-muted-accent bg-destructive-muted text-destructive-muted-foreground"
|
|
547
|
+
}
|
|
548
|
+
},
|
|
549
|
+
defaultVariants: {
|
|
550
|
+
variant: "info"
|
|
551
|
+
}
|
|
552
|
+
}
|
|
553
|
+
),
|
|
554
|
+
title: cva31("text-base leading-5 font-bold"),
|
|
555
|
+
content: cva31("text-muted-foreground text-sm leading-5 font-normal", {
|
|
556
|
+
variants: {
|
|
557
|
+
variant: {
|
|
558
|
+
success: "text-success-muted-foreground",
|
|
559
|
+
warning: "text-warning-muted-foreground",
|
|
560
|
+
info: "text-info-muted-foreground",
|
|
561
|
+
error: "text-destructive-muted-foreground"
|
|
562
|
+
}
|
|
563
|
+
},
|
|
564
|
+
defaultVariants: {
|
|
565
|
+
variant: "info"
|
|
566
|
+
}
|
|
567
|
+
}),
|
|
568
|
+
icon: cva31("h-4 w-4 align-baseline leading-none pt-0.5", {
|
|
569
|
+
variants: {
|
|
570
|
+
variant: {
|
|
571
|
+
success: "text-success-muted-accent",
|
|
572
|
+
warning: "text-warning-muted-accent",
|
|
573
|
+
info: "text-info-muted-accent",
|
|
574
|
+
error: "text-destructive-muted-accent"
|
|
575
|
+
}
|
|
576
|
+
},
|
|
577
|
+
defaultVariants: {
|
|
578
|
+
variant: "info"
|
|
579
|
+
}
|
|
580
|
+
}),
|
|
581
|
+
close: cva31(
|
|
582
|
+
"h-[9.98px] w-[9.98px] cursor-pointer border-none p-0 leading-normal outline-0"
|
|
583
|
+
)
|
|
584
|
+
};
|
|
585
|
+
|
|
586
|
+
// src/components/Select.styles.ts
|
|
587
|
+
import { cva as cva32 } from "@marigold/system";
|
|
588
|
+
var Select = {
|
|
589
|
+
icon: cva32("text-muted-foreground/80"),
|
|
590
|
+
select: cva32([
|
|
591
|
+
inputContainer,
|
|
592
|
+
inputInvalid,
|
|
593
|
+
inputDisabled,
|
|
594
|
+
inputFocus["focus"],
|
|
595
|
+
"h-input",
|
|
596
|
+
"cursor-pointer",
|
|
597
|
+
"*:data-placeholder:text-placeholder"
|
|
598
|
+
])
|
|
599
|
+
};
|
|
600
|
+
|
|
601
|
+
// src/components/Slider.styles.ts
|
|
602
|
+
import { cva as cva33 } from "@marigold/system";
|
|
603
|
+
var Slider = {
|
|
604
|
+
container: cva33("*:aria-hidden:hidden"),
|
|
605
|
+
track: cva33([
|
|
606
|
+
"relative bg-muted rounded-lg flex w-full touch-none select-none items-center data-[orientation=vertical]:h-full data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col data-[disabled]:opacity-50"
|
|
607
|
+
]),
|
|
608
|
+
selectedTrack: cva33([
|
|
609
|
+
"absolute bg-black data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full rounded-lg"
|
|
610
|
+
]),
|
|
611
|
+
thumb: cva33([
|
|
612
|
+
"block h-5 w-5 rounded-full border-2 border-primary bg-background transition-colors focus-visible:outline-[3px] focus-visible:outline-ring/40 data-[disabled]:cursor-not-allowed"
|
|
613
|
+
]),
|
|
614
|
+
output: cva33("text-text-base text-sm")
|
|
615
|
+
};
|
|
616
|
+
|
|
617
|
+
// src/components/Switch.styles.ts
|
|
618
|
+
import { cva as cva34 } from "@marigold/system";
|
|
619
|
+
var Switch = {
|
|
620
|
+
container: cva34(
|
|
621
|
+
"disabled:cursor-not-allowed disabled:text-disabled-foreground"
|
|
622
|
+
),
|
|
623
|
+
track: cva34([
|
|
624
|
+
"inline-flex h-6 w-10 shrink-0 cursor-pointer items-center rounded-full",
|
|
625
|
+
"border-2 border-transparent",
|
|
626
|
+
"group-disabled/switch:bg-disabled group-disabled/switch:text-disabled-foreground group-selected/switch:group-disabled/switch:bg-disabled group-selected/switch:group-disabled/switch:text-disabled-foreground",
|
|
627
|
+
"group-selected/switch:bg-brand bg-input",
|
|
628
|
+
"outline-offset-2 group-[focus-visible]/switch:outline-2 group-[focus-visible]/switch:outline-ring/70"
|
|
629
|
+
]),
|
|
630
|
+
thumb: cva34([
|
|
631
|
+
"pointer-events-none block size-5 rounded-full",
|
|
632
|
+
"bg-background shadow-sm shadow-black/5",
|
|
633
|
+
"ring-0 transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)]",
|
|
634
|
+
"group-selected/switch:translate-x-4 translate-x-0 rtl:group-selected/switch:-translate-x-4"
|
|
635
|
+
])
|
|
636
|
+
};
|
|
637
|
+
|
|
638
|
+
// src/components/Table.styles.ts
|
|
639
|
+
import { cva as cva35 } from "@marigold/system";
|
|
640
|
+
var Table = {
|
|
641
|
+
table: cva35("text-sm", {
|
|
642
|
+
variants: {
|
|
643
|
+
variant: {
|
|
644
|
+
default: "",
|
|
645
|
+
grid: ""
|
|
646
|
+
}
|
|
647
|
+
}
|
|
648
|
+
}),
|
|
649
|
+
headerRow: cva35("border-border border-b", {
|
|
650
|
+
variants: {
|
|
651
|
+
variant: {
|
|
652
|
+
default: "",
|
|
653
|
+
grid: "[&>:not(:last-child)]:border-r [&>:not(:last-child)]:border-border"
|
|
654
|
+
}
|
|
655
|
+
},
|
|
656
|
+
defaultVariants: {
|
|
657
|
+
variant: "default"
|
|
658
|
+
}
|
|
659
|
+
}),
|
|
660
|
+
header: cva35(
|
|
661
|
+
[
|
|
662
|
+
"h-12 px-3 align-middle font-medium text-muted-foreground last:text-right",
|
|
663
|
+
"focus-visible:outline-2 outline-offset-2 outline-ring/70",
|
|
664
|
+
// for sticky header
|
|
665
|
+
"bg-background/90 top-0 z-10 backdrop-blur-xs"
|
|
666
|
+
],
|
|
667
|
+
{
|
|
668
|
+
variants: {
|
|
669
|
+
variant: {
|
|
670
|
+
default: "[&:has([type=checkbox])]:pr-0",
|
|
671
|
+
grid: ""
|
|
672
|
+
}
|
|
673
|
+
},
|
|
674
|
+
defaultVariants: {
|
|
675
|
+
variant: "default"
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
),
|
|
679
|
+
body: cva35("[&_tr:last-child]:border-0"),
|
|
680
|
+
row: cva35(
|
|
681
|
+
[
|
|
682
|
+
"border-b border-border transition-colors",
|
|
683
|
+
"focus-visible:outline-2 outline-offset-2 outline-ring/70",
|
|
684
|
+
"aria-[selected=true]:bg-muted hover:bg-transparent data-disabled:cursor-not-allowed"
|
|
685
|
+
],
|
|
686
|
+
{
|
|
687
|
+
variants: {
|
|
688
|
+
variant: {
|
|
689
|
+
default: "",
|
|
690
|
+
grid: "[&>:not(:last-child)]:border-r [&>:not(:last-child)]:border-border"
|
|
691
|
+
}
|
|
692
|
+
},
|
|
693
|
+
defaultVariants: {
|
|
694
|
+
variant: "default"
|
|
695
|
+
}
|
|
696
|
+
}
|
|
697
|
+
),
|
|
698
|
+
cell: cva35(
|
|
699
|
+
[
|
|
700
|
+
"p-3 align-middle last:text-right",
|
|
701
|
+
"focus-visible:outline-2 outline-offset-2 outline-ring/70"
|
|
702
|
+
],
|
|
703
|
+
{
|
|
704
|
+
variants: {
|
|
705
|
+
variant: {
|
|
706
|
+
default: "[&:has([type=checkbox])]:pr-0",
|
|
707
|
+
grid: ""
|
|
708
|
+
}
|
|
709
|
+
},
|
|
710
|
+
defaultVariants: {
|
|
711
|
+
variant: "default"
|
|
712
|
+
}
|
|
713
|
+
}
|
|
714
|
+
)
|
|
715
|
+
};
|
|
716
|
+
|
|
717
|
+
// src/components/Tabs.styles.ts
|
|
718
|
+
import { cva as cva36 } from "@marigold/system";
|
|
719
|
+
var Tabs = {
|
|
720
|
+
container: cva36("flex flex-col gap-2 items-center"),
|
|
721
|
+
tabsList: cva36([
|
|
722
|
+
"bg-muted text-muted-foreground/70",
|
|
723
|
+
"inline-flex w-fit items-center justify-center p-0.5 h-auto gap-2 rounded-none border-b bg-transparent px-0 py-1"
|
|
724
|
+
]),
|
|
725
|
+
tabpanel: cva36("text-muted-foreground p-4 text-center text-xs"),
|
|
726
|
+
tab: cva36([
|
|
727
|
+
"data-selected:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 inline-flex items-center justify-center rounded-sm px-3 py-1.5 text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&_svg]:shrink-0",
|
|
728
|
+
"hover:bg-hover hover:text-foreground data-selected:hover:bg-hover relative data-selected:bg-transparent data-selected:shadow-none",
|
|
729
|
+
" data-[selected=true]:after:bg-foreground after:absolute after:inset-x-0 after:bottom-0 after:-mb-1 after:h-0.5"
|
|
730
|
+
])
|
|
731
|
+
};
|
|
732
|
+
|
|
733
|
+
// src/components/Tag.styles.ts
|
|
734
|
+
import { cva as cva37 } from "@marigold/system";
|
|
735
|
+
var Tag = {
|
|
736
|
+
tag: cva37([
|
|
737
|
+
"relative inline-flex items-center gap-[7px]",
|
|
738
|
+
"border border-solid border-input rounded-md",
|
|
739
|
+
"font-medium text-xs",
|
|
740
|
+
"h-7 px-2 cursor-default",
|
|
741
|
+
"bg-background",
|
|
742
|
+
"data-selected:text-white data-selected:bg-brand",
|
|
743
|
+
"data-[disabled]:cursor-not-allowed data-[disabled]:text-disabled-foreground data-[disabled]:bg-disabled",
|
|
744
|
+
"focus:outline-0 focus-visible:outline-2 focus-visible:outline-ring/70"
|
|
745
|
+
]),
|
|
746
|
+
closeButton: cva37([
|
|
747
|
+
"size-4 flex items-center justify-end whitespace-nowrap",
|
|
748
|
+
"font-medium text-muted-foreground text-sm hover:text-brand rounded-md",
|
|
749
|
+
"p-0 transition-colors outline-0 cursor-pointer",
|
|
750
|
+
"disabled:bg-disabled disabled:text-disabled-foreground disabled:cursor-not-allowed"
|
|
751
|
+
]),
|
|
752
|
+
listItems: cva37("flex flex-wrap items-center gap-1")
|
|
753
|
+
};
|
|
754
|
+
|
|
138
755
|
// src/components/TextArea.styles.ts
|
|
139
|
-
import { cva as
|
|
140
|
-
var TextArea =
|
|
756
|
+
import { cva as cva38 } from "@marigold/system";
|
|
757
|
+
var TextArea = cva38([
|
|
141
758
|
inputContainer,
|
|
142
759
|
inputInvalid,
|
|
143
|
-
inputFocus,
|
|
760
|
+
inputFocus["focus"],
|
|
144
761
|
inputDisabled,
|
|
145
762
|
inputReadOnly,
|
|
146
|
-
"
|
|
763
|
+
"invalid:text-destructive"
|
|
147
764
|
]);
|
|
148
765
|
|
|
766
|
+
// src/components/Text.styles.ts
|
|
767
|
+
import { cva as cva39 } from "@marigold/system";
|
|
768
|
+
var Text = cva39("", {
|
|
769
|
+
variants: {
|
|
770
|
+
size: {
|
|
771
|
+
// Adding a default here, which beasically acts as an inherit
|
|
772
|
+
default: "",
|
|
773
|
+
xs: "text-xs",
|
|
774
|
+
sm: "text-sm",
|
|
775
|
+
base: "text-base",
|
|
776
|
+
lg: "text-lg",
|
|
777
|
+
xl: "text-xl",
|
|
778
|
+
"2xl": "text-2xl",
|
|
779
|
+
"3xl": "text-3xl",
|
|
780
|
+
"4xl": "text-4xl",
|
|
781
|
+
"5xl": "text-5xl",
|
|
782
|
+
"6xl": "text-6xl",
|
|
783
|
+
"7xl": "text-7xl",
|
|
784
|
+
"8xl": "text-8xl",
|
|
785
|
+
"9xl": "text-9xl"
|
|
786
|
+
}
|
|
787
|
+
},
|
|
788
|
+
defaultVariants: {
|
|
789
|
+
size: "default"
|
|
790
|
+
}
|
|
791
|
+
});
|
|
792
|
+
|
|
793
|
+
// src/components/Tooltip.styles.ts
|
|
794
|
+
import { cva as cva40 } from "@marigold/system";
|
|
795
|
+
var Tooltip = {
|
|
796
|
+
container: cva40(
|
|
797
|
+
[
|
|
798
|
+
"text-brand-foreground bg-brand relative z-50 max-w-70 rounded-md border border-brand px-3 py-1.5 text-sm ",
|
|
799
|
+
"placement-t:mb-2",
|
|
800
|
+
"placement-b:mt-2",
|
|
801
|
+
"placement-r:ml-2",
|
|
802
|
+
"placement-l:mr-2"
|
|
803
|
+
],
|
|
804
|
+
{
|
|
805
|
+
variants: {
|
|
806
|
+
variant: {
|
|
807
|
+
default: "",
|
|
808
|
+
white: "text-secondary-foreground border-border bg-white"
|
|
809
|
+
}
|
|
810
|
+
},
|
|
811
|
+
defaultVariants: {
|
|
812
|
+
variant: "default"
|
|
813
|
+
}
|
|
814
|
+
}
|
|
815
|
+
),
|
|
816
|
+
arrow: cva40(
|
|
817
|
+
[
|
|
818
|
+
"fill-brand stroke-brand",
|
|
819
|
+
// right
|
|
820
|
+
"data-[placement=right]:[&_svg]:rotate-90",
|
|
821
|
+
// left
|
|
822
|
+
"data-[placement=left]:[&_svg]:-rotate-90",
|
|
823
|
+
// bottom
|
|
824
|
+
"data-[placement=bottom]:[&_svg]:rotate-180"
|
|
825
|
+
],
|
|
826
|
+
{
|
|
827
|
+
variants: {
|
|
828
|
+
variant: {
|
|
829
|
+
default: "",
|
|
830
|
+
white: "fill-white stroke-border "
|
|
831
|
+
}
|
|
832
|
+
},
|
|
833
|
+
defaultVariants: {
|
|
834
|
+
variant: "default"
|
|
835
|
+
}
|
|
836
|
+
}
|
|
837
|
+
)
|
|
838
|
+
};
|
|
839
|
+
|
|
840
|
+
// src/components/Underlay.styles.ts
|
|
841
|
+
import { cva as cva41 } from "@marigold/system";
|
|
842
|
+
var Underlay = cva41("", {
|
|
843
|
+
variants: {
|
|
844
|
+
variant: {
|
|
845
|
+
modal: " bg-black/25 backdrop-blur-sm"
|
|
846
|
+
}
|
|
847
|
+
}
|
|
848
|
+
});
|
|
849
|
+
|
|
850
|
+
// src/components/XLoader.styles.ts
|
|
851
|
+
import { cva as cva42 } from "@marigold/system";
|
|
852
|
+
var XLoader = {
|
|
853
|
+
container: cva42("grid place-items-center text-brand", {
|
|
854
|
+
variants: {
|
|
855
|
+
variant: {
|
|
856
|
+
default: "",
|
|
857
|
+
inverted: "text-secondary"
|
|
858
|
+
},
|
|
859
|
+
size: {
|
|
860
|
+
default: "size-20",
|
|
861
|
+
large: "size-36",
|
|
862
|
+
fit: "size-full"
|
|
863
|
+
}
|
|
864
|
+
},
|
|
865
|
+
defaultVariants: {
|
|
866
|
+
variant: "default",
|
|
867
|
+
size: "default"
|
|
868
|
+
}
|
|
869
|
+
}),
|
|
870
|
+
loader: cva42("size-full", {
|
|
871
|
+
variants: {
|
|
872
|
+
variant: {
|
|
873
|
+
default: "",
|
|
874
|
+
inverted: ""
|
|
875
|
+
},
|
|
876
|
+
size: {
|
|
877
|
+
default: "",
|
|
878
|
+
large: "",
|
|
879
|
+
fit: ""
|
|
880
|
+
}
|
|
881
|
+
},
|
|
882
|
+
defaultVariants: {
|
|
883
|
+
variant: "default",
|
|
884
|
+
size: "default"
|
|
885
|
+
}
|
|
886
|
+
}),
|
|
887
|
+
label: cva42("text-current text-sm")
|
|
888
|
+
};
|
|
889
|
+
|
|
149
890
|
// src/theme.ts
|
|
150
891
|
var theme = {
|
|
151
892
|
name: "rui",
|