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