@marigold/theme-docs 2.0.4 → 2.0.5
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/{chunk-Y2U3HXIY.mjs → chunk-KMOXDTTY.mjs} +34 -3
- package/dist/chunk-KMOXDTTY.mjs.map +1 -0
- package/dist/index.js +277 -48
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +245 -47
- package/dist/index.mjs.map +1 -1
- package/dist/preset.js +33 -2
- package/dist/preset.js.map +1 -1
- package/dist/preset.mjs +1 -1
- package/dist/styles.css +136 -5
- package/package.json +4 -4
- package/dist/chunk-Y2U3HXIY.mjs.map +0 -1
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
2
|
__export,
|
|
3
3
|
colors
|
|
4
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-KMOXDTTY.mjs";
|
|
5
5
|
|
|
6
6
|
// src/components/index.ts
|
|
7
7
|
var components_exports = {};
|
|
@@ -10,17 +10,31 @@ __export(components_exports, {
|
|
|
10
10
|
Button: () => Button,
|
|
11
11
|
Card: () => Card,
|
|
12
12
|
Dialog: () => Dialog,
|
|
13
|
+
Field: () => Field,
|
|
13
14
|
Header: () => Header,
|
|
14
15
|
Headline: () => Headline,
|
|
16
|
+
HelpText: () => HelpText,
|
|
17
|
+
Label: () => Label,
|
|
15
18
|
Link: () => Link,
|
|
16
19
|
List: () => List,
|
|
20
|
+
ListBox: () => ListBox,
|
|
17
21
|
Menu: () => Menu,
|
|
18
22
|
Popover: () => Popover,
|
|
19
23
|
SectionMessage: () => SectionMessage,
|
|
24
|
+
Select: () => Select,
|
|
20
25
|
Table: () => Table,
|
|
21
26
|
Tabs: () => Tabs,
|
|
22
27
|
Text: () => Text,
|
|
23
|
-
Underlay: () => Underlay
|
|
28
|
+
Underlay: () => Underlay,
|
|
29
|
+
inputBackground: () => inputBackground,
|
|
30
|
+
inputBox: () => inputBox,
|
|
31
|
+
inputDisabled: () => inputDisabled,
|
|
32
|
+
inputError: () => inputError,
|
|
33
|
+
inputFocus: () => inputFocus,
|
|
34
|
+
inputHover: () => inputHover,
|
|
35
|
+
inputSpacing: () => inputSpacing,
|
|
36
|
+
xSpacing: () => xSpacing,
|
|
37
|
+
ySpacing: () => ySpacing
|
|
24
38
|
});
|
|
25
39
|
|
|
26
40
|
// src/components/Button.styles.ts
|
|
@@ -46,12 +60,15 @@ var Button = cva("flex gap-2 rounded-sm", {
|
|
|
46
60
|
// src/components/Card.styles.ts
|
|
47
61
|
import { cva as cva2 } from "@marigold/system";
|
|
48
62
|
var Card = cva2(
|
|
49
|
-
[
|
|
63
|
+
[
|
|
64
|
+
"bg-bg-surface border-secondary-300 relative overflow-hidden rounded-xl border shadow"
|
|
65
|
+
],
|
|
50
66
|
{
|
|
51
67
|
variants: {
|
|
52
68
|
variant: {
|
|
53
69
|
default: "p-6",
|
|
54
|
-
hovering: "p-6 transition-shadow hover:cursor-pointer hover:shadow-md"
|
|
70
|
+
hovering: "p-6 transition-shadow hover:cursor-pointer hover:shadow-md",
|
|
71
|
+
content: "my-6"
|
|
55
72
|
}
|
|
56
73
|
},
|
|
57
74
|
defaultVariants: {
|
|
@@ -109,9 +126,97 @@ var Headline = cva5("[&>*]:no-underline", {
|
|
|
109
126
|
}
|
|
110
127
|
});
|
|
111
128
|
|
|
112
|
-
// src/components/
|
|
129
|
+
// src/components/Field.styles.ts
|
|
113
130
|
import { cva as cva6 } from "@marigold/system";
|
|
114
|
-
var
|
|
131
|
+
var Field = cva6("grid gap-y-0.5", {
|
|
132
|
+
variants: {
|
|
133
|
+
variant: {
|
|
134
|
+
default: "",
|
|
135
|
+
floating: [
|
|
136
|
+
"grid-cols-[min-content_auto] grid-rows-[auto_auto]",
|
|
137
|
+
"items-center"
|
|
138
|
+
]
|
|
139
|
+
},
|
|
140
|
+
size: {
|
|
141
|
+
default: "gap-x-3",
|
|
142
|
+
small: "gap-x-2"
|
|
143
|
+
}
|
|
144
|
+
},
|
|
145
|
+
defaultVariants: {
|
|
146
|
+
variant: "default",
|
|
147
|
+
size: "default"
|
|
148
|
+
}
|
|
149
|
+
});
|
|
150
|
+
|
|
151
|
+
// src/components/HelpText.styles.ts
|
|
152
|
+
import { cva as cva7 } from "@marigold/system";
|
|
153
|
+
var HelpText = {
|
|
154
|
+
container: cva7(),
|
|
155
|
+
icon: cva7()
|
|
156
|
+
};
|
|
157
|
+
|
|
158
|
+
// src/components/Input.styles.ts
|
|
159
|
+
var inputBox = "border border-border rounded text-text-primary";
|
|
160
|
+
var inputBackground = "bg-white";
|
|
161
|
+
var xSpacing = {
|
|
162
|
+
default: "px-3",
|
|
163
|
+
small: "px-2.5"
|
|
164
|
+
};
|
|
165
|
+
var ySpacing = {
|
|
166
|
+
default: "py-2",
|
|
167
|
+
small: "py-1.5"
|
|
168
|
+
};
|
|
169
|
+
var inputSpacing = {
|
|
170
|
+
default: `${xSpacing.default} ${ySpacing.default}`,
|
|
171
|
+
small: `${xSpacing.small} ${ySpacing.small}`
|
|
172
|
+
};
|
|
173
|
+
var inputFocus = "";
|
|
174
|
+
var inputDisabled = "";
|
|
175
|
+
var inputError = "";
|
|
176
|
+
var inputHover = "";
|
|
177
|
+
|
|
178
|
+
// src/components/Label.styles.ts
|
|
179
|
+
import { cva as cva8 } from "@marigold/system";
|
|
180
|
+
var Label = {
|
|
181
|
+
container: cva8("", {
|
|
182
|
+
variants: {
|
|
183
|
+
variant: {
|
|
184
|
+
default: "",
|
|
185
|
+
floating: [
|
|
186
|
+
"z-10 col-start-1 row-start-1",
|
|
187
|
+
"pointer-events-none",
|
|
188
|
+
"text-secondary-400 text-nowrap",
|
|
189
|
+
'after:content-[":"]'
|
|
190
|
+
]
|
|
191
|
+
},
|
|
192
|
+
size: {
|
|
193
|
+
default: "text-sm",
|
|
194
|
+
small: "text-xs"
|
|
195
|
+
}
|
|
196
|
+
},
|
|
197
|
+
defaultVariants: {
|
|
198
|
+
variant: "default",
|
|
199
|
+
size: "default"
|
|
200
|
+
},
|
|
201
|
+
compoundVariants: [
|
|
202
|
+
{
|
|
203
|
+
variant: "floating",
|
|
204
|
+
size: "default",
|
|
205
|
+
className: "pl-4"
|
|
206
|
+
},
|
|
207
|
+
{
|
|
208
|
+
variant: "floating",
|
|
209
|
+
size: "small",
|
|
210
|
+
className: "pl-3"
|
|
211
|
+
}
|
|
212
|
+
]
|
|
213
|
+
}),
|
|
214
|
+
indicator: cva8()
|
|
215
|
+
};
|
|
216
|
+
|
|
217
|
+
// src/components/Link.styles.ts
|
|
218
|
+
import { cva as cva9 } from "@marigold/system";
|
|
219
|
+
var Link = cva9(
|
|
115
220
|
["font-medium underline underline-offset-4"],
|
|
116
221
|
{
|
|
117
222
|
variants: {
|
|
@@ -126,17 +231,51 @@ var Link = cva6(
|
|
|
126
231
|
);
|
|
127
232
|
|
|
128
233
|
// src/components/List.styles.ts
|
|
129
|
-
import { cva as
|
|
234
|
+
import { cva as cva10 } from "@marigold/system";
|
|
130
235
|
var List = {
|
|
131
|
-
ul:
|
|
132
|
-
ol:
|
|
133
|
-
item:
|
|
236
|
+
ul: cva10("list-inside list-none"),
|
|
237
|
+
ol: cva10(""),
|
|
238
|
+
item: cva10("list-none py-0.5")
|
|
239
|
+
};
|
|
240
|
+
|
|
241
|
+
// src/components/ListBox.styles.ts
|
|
242
|
+
import { cva as cva11 } from "@marigold/system";
|
|
243
|
+
var ListBox = {
|
|
244
|
+
container: cva11([
|
|
245
|
+
"bg-bg-surface-overlay border-border rounded border drop-shadow-lg"
|
|
246
|
+
]),
|
|
247
|
+
list: cva11([
|
|
248
|
+
"outline-none",
|
|
249
|
+
"p-1",
|
|
250
|
+
"sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]"
|
|
251
|
+
]),
|
|
252
|
+
option: cva11(
|
|
253
|
+
[
|
|
254
|
+
"text-text-primary",
|
|
255
|
+
"cursor-pointer rounded outline-none",
|
|
256
|
+
"rac-hover:bg-bg-hover rac-focus:bg-bg-hover",
|
|
257
|
+
"aria-selected:bg-bg-hover"
|
|
258
|
+
],
|
|
259
|
+
{
|
|
260
|
+
variants: {
|
|
261
|
+
size: {
|
|
262
|
+
default: "p-2",
|
|
263
|
+
small: "px-2 py-1 text-sm"
|
|
264
|
+
}
|
|
265
|
+
},
|
|
266
|
+
defaultVariants: {
|
|
267
|
+
size: "small"
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
),
|
|
271
|
+
section: cva11(),
|
|
272
|
+
sectionTitle: cva11()
|
|
134
273
|
};
|
|
135
274
|
|
|
136
275
|
// src/components/Menu.styles.ts
|
|
137
|
-
import { cva as
|
|
276
|
+
import { cva as cva12 } from "@marigold/system";
|
|
138
277
|
var Menu = {
|
|
139
|
-
container:
|
|
278
|
+
container: cva12(
|
|
140
279
|
[
|
|
141
280
|
"border-border bg-bg-surface overflow-hidden rounded-md border px-1 py-1.5 text-sm shadow-md",
|
|
142
281
|
"sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]"
|
|
@@ -149,14 +288,14 @@ var Menu = {
|
|
|
149
288
|
}
|
|
150
289
|
}
|
|
151
290
|
),
|
|
152
|
-
item:
|
|
291
|
+
item: cva12("focus:bg-bg-hover cursor-pointer rounded p-2 outline-none", {
|
|
153
292
|
variants: {
|
|
154
293
|
variant: {
|
|
155
294
|
command: ["aria-selected:bg-bg-hover px-4 py-1.5"]
|
|
156
295
|
}
|
|
157
296
|
}
|
|
158
297
|
}),
|
|
159
|
-
section:
|
|
298
|
+
section: cva12("", {
|
|
160
299
|
variants: {
|
|
161
300
|
variant: {
|
|
162
301
|
command: "[&_[cmdk-group-heading]]:text-text-primary-muted [&_[cmdk-group-heading]]:p-4 [&_[cmdk-group-heading]]:py-2 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium"
|
|
@@ -166,9 +305,9 @@ var Menu = {
|
|
|
166
305
|
};
|
|
167
306
|
|
|
168
307
|
// src/components/Message.styles.ts
|
|
169
|
-
import { cva as
|
|
308
|
+
import { cva as cva13 } from "@marigold/system";
|
|
170
309
|
var SectionMessage = {
|
|
171
|
-
container:
|
|
310
|
+
container: cva13(
|
|
172
311
|
[
|
|
173
312
|
"not-prose items-center rounded-lg p-4",
|
|
174
313
|
'grid-cols-[min-content,auto] gap-1 [grid-template-areas:"icon_title_title""none_content_content"]'
|
|
@@ -182,31 +321,90 @@ var SectionMessage = {
|
|
|
182
321
|
}
|
|
183
322
|
}
|
|
184
323
|
),
|
|
185
|
-
icon:
|
|
186
|
-
title:
|
|
187
|
-
content:
|
|
324
|
+
icon: cva13("size-6"),
|
|
325
|
+
title: cva13("mb-1 font-bold leading-none tracking-tight"),
|
|
326
|
+
content: cva13("text-sm [&_p]:leading-relaxed")
|
|
188
327
|
};
|
|
189
328
|
|
|
190
329
|
// src/components/Popover.styles.ts
|
|
191
|
-
import { cva as
|
|
192
|
-
var Popover =
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
330
|
+
import { cva as cva14 } from "@marigold/system";
|
|
331
|
+
var Popover = cva14([
|
|
332
|
+
"animate-in",
|
|
333
|
+
"placement-t:-translate-y-1",
|
|
334
|
+
"placement-b:translate-y-1",
|
|
335
|
+
"placement-r:-translate-x-1",
|
|
336
|
+
"placement-l:translate-x-1"
|
|
337
|
+
]);
|
|
338
|
+
|
|
339
|
+
// src/components/Select.styles.ts
|
|
340
|
+
import { cva as cva15 } from "@marigold/system";
|
|
341
|
+
var Select = {
|
|
342
|
+
icon: cva15("text-secondary-400", {
|
|
343
|
+
variants: {
|
|
344
|
+
variant: {
|
|
345
|
+
default: "",
|
|
346
|
+
floating: "justify-self-end"
|
|
347
|
+
},
|
|
348
|
+
size: {
|
|
349
|
+
default: "",
|
|
350
|
+
small: "size-3"
|
|
351
|
+
}
|
|
352
|
+
},
|
|
353
|
+
defaultVariants: {
|
|
354
|
+
variant: "default",
|
|
355
|
+
size: "default"
|
|
199
356
|
}
|
|
200
|
-
}
|
|
201
|
-
|
|
357
|
+
}),
|
|
358
|
+
select: cva15([inputBox, inputBackground, "outline-none"], {
|
|
359
|
+
variants: {
|
|
360
|
+
variant: {
|
|
361
|
+
default: "gap-2",
|
|
362
|
+
floating: [
|
|
363
|
+
"shadow",
|
|
364
|
+
"col-span-full row-start-1 grid grid-cols-subgrid grid-rows-subgrid",
|
|
365
|
+
// selected value and caret get moved to 2nd col
|
|
366
|
+
"*:row-star-1 *:col-start-2 *:text-left",
|
|
367
|
+
// So the button gap is not used to separate label from selected value
|
|
368
|
+
"gap-[inherit]"
|
|
369
|
+
]
|
|
370
|
+
},
|
|
371
|
+
size: {
|
|
372
|
+
default: [inputSpacing.default],
|
|
373
|
+
small: [inputSpacing.small, "text-xs"]
|
|
374
|
+
}
|
|
375
|
+
},
|
|
376
|
+
defaultVariants: {
|
|
377
|
+
variant: "default",
|
|
378
|
+
size: "default"
|
|
379
|
+
},
|
|
380
|
+
compoundVariants: [
|
|
381
|
+
{
|
|
382
|
+
variant: "floating",
|
|
383
|
+
size: "default",
|
|
384
|
+
className: "px-4 py-1.5"
|
|
385
|
+
},
|
|
386
|
+
{
|
|
387
|
+
variant: "floating",
|
|
388
|
+
size: "small",
|
|
389
|
+
className: "px-3"
|
|
390
|
+
}
|
|
391
|
+
]
|
|
392
|
+
})
|
|
393
|
+
};
|
|
202
394
|
|
|
203
395
|
// src/components/Tabs.styles.ts
|
|
204
|
-
import { cva as
|
|
396
|
+
import { cva as cva16 } from "@marigold/system";
|
|
205
397
|
var Tabs = {
|
|
206
|
-
container:
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
398
|
+
container: cva16("", {
|
|
399
|
+
variants: {
|
|
400
|
+
variant: {
|
|
401
|
+
demo: "my-6"
|
|
402
|
+
}
|
|
403
|
+
}
|
|
404
|
+
}),
|
|
405
|
+
tabpanel: cva16(""),
|
|
406
|
+
tabsList: cva16("mb-4 border-b"),
|
|
407
|
+
tab: cva16([
|
|
210
408
|
"text-text-primary-muted aria-selected:text-text-primary px-2 py-1 text-sm font-medium",
|
|
211
409
|
"aria-selected:border-border-primary -m-px border-b-2 border-transparent",
|
|
212
410
|
"focus:outline-none focus-visible:outline"
|
|
@@ -214,18 +412,18 @@ var Tabs = {
|
|
|
214
412
|
};
|
|
215
413
|
|
|
216
414
|
// src/components/Table.styles.ts
|
|
217
|
-
import { cva as
|
|
415
|
+
import { cva as cva17 } from "@marigold/system";
|
|
218
416
|
var Table = {
|
|
219
|
-
table:
|
|
220
|
-
cell:
|
|
417
|
+
table: cva17("my-0 text-sm"),
|
|
418
|
+
cell: cva17("p-3 text-xs", {
|
|
221
419
|
variants: {
|
|
222
420
|
variant: {
|
|
223
421
|
colorTable: "p-4 align-middle"
|
|
224
422
|
}
|
|
225
423
|
}
|
|
226
424
|
}),
|
|
227
|
-
header:
|
|
228
|
-
row:
|
|
425
|
+
header: cva17("border-b bg-white px-3 py-2 text-start"),
|
|
426
|
+
row: cva17("divide-y", {
|
|
229
427
|
variants: {
|
|
230
428
|
variant: {
|
|
231
429
|
hover: "hover:bg-neutral-100/50 "
|
|
@@ -235,8 +433,8 @@ var Table = {
|
|
|
235
433
|
};
|
|
236
434
|
|
|
237
435
|
// src/components/Text.styles.ts
|
|
238
|
-
import { cva as
|
|
239
|
-
var Text =
|
|
436
|
+
import { cva as cva18 } from "@marigold/system";
|
|
437
|
+
var Text = cva18(
|
|
240
438
|
"leading-7 [&:not(:first-child)]:mt-6",
|
|
241
439
|
{
|
|
242
440
|
variants: {
|
|
@@ -251,8 +449,8 @@ var Text = cva13(
|
|
|
251
449
|
);
|
|
252
450
|
|
|
253
451
|
// src/components/Underlay.styles.ts
|
|
254
|
-
import { cva as
|
|
255
|
-
var Underlay =
|
|
452
|
+
import { cva as cva19 } from "@marigold/system";
|
|
453
|
+
var Underlay = cva19("", {
|
|
256
454
|
variants: {
|
|
257
455
|
variant: {
|
|
258
456
|
modal: "bg-bg-underlay/50 backdrop-blur-sm"
|
|
@@ -261,8 +459,8 @@ var Underlay = cva14("", {
|
|
|
261
459
|
});
|
|
262
460
|
|
|
263
461
|
// src/components/Badge.styles.ts
|
|
264
|
-
import { cva as
|
|
265
|
-
var Badge =
|
|
462
|
+
import { cva as cva20 } from "@marigold/system";
|
|
463
|
+
var Badge = cva20(
|
|
266
464
|
"inline-flex items-center truncate rounded-[20px] px-2 py-0.5",
|
|
267
465
|
{
|
|
268
466
|
variants: {
|
|
@@ -281,8 +479,8 @@ var Badge = cva15(
|
|
|
281
479
|
);
|
|
282
480
|
|
|
283
481
|
// src/root.ts
|
|
284
|
-
import { cva as
|
|
285
|
-
var root =
|
|
482
|
+
import { cva as cva21 } from "@marigold/system";
|
|
483
|
+
var root = cva21("text-text-primary bg-bg-body");
|
|
286
484
|
|
|
287
485
|
// src/index.ts
|
|
288
486
|
var theme = {
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/index.ts","../src/components/Button.styles.ts","../src/components/Card.styles.ts","../src/components/Dialog.styles.ts","../src/components/Header.styles.ts","../src/components/Headline.styles.ts","../src/components/Link.styles.ts","../src/components/List.styles.ts","../src/components/Menu.styles.ts","../src/components/Message.styles.ts","../src/components/Popover.styles.ts","../src/components/Tabs.styles.ts","../src/components/Table.styles.ts","../src/components/Text.styles.ts","../src/components/Underlay.styles.ts","../src/components/Badge.styles.ts","../src/root.ts","../src/index.ts"],"sourcesContent":["export * from './Button.styles';\nexport * from './Card.styles';\nexport * from './Dialog.styles';\nexport * from './Header.styles';\nexport * from './Headline.styles';\nexport * from './Link.styles';\nexport * from './List.styles';\nexport * from './Menu.styles';\nexport * from './Message.styles';\nexport * from './Popover.styles';\nexport * from './Tabs.styles';\nexport * from './Table.styles';\nexport * from './Text.styles';\nexport * from './Underlay.styles';\nexport * from './Badge.styles';\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Button: ThemeComponent<'Button'> = cva('flex gap-2 rounded-sm', {\n variants: {\n variant: {\n ghost: 'text-secondary-700 hover:text-secondary-900 p-0',\n menu: 'text-secondary-700 hover:bg-secondary-400/20 h-8 rounded-lg px-1',\n sunken:\n 'text-secondary-600 hover:bg-secondary-400/20 bg-secondary-400/10 h-8 justify-start rounded-lg',\n inverted: 'bg-secondary-100',\n },\n size: {\n small: 'px-3 py-1.5 text-sm',\n default: 'px-3 py-2',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Card: ThemeComponent<'Card'> = cva(\n ['bg-bg-surface rounded-xl border shadow'],\n {\n variants: {\n variant: {\n default: 'p-6',\n hovering: 'p-6 transition-shadow hover:cursor-pointer hover:shadow-md',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n }\n);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Dialog: ThemeComponent<'Dialog'> = {\n closeButton: cva('absolute right-2 top-2', {\n variants: {\n variant: {\n fullscreen: ['size-6', 'right-4 top-4'],\n },\n },\n }),\n container: cva('bg-bg-surface', {\n variants: {\n variant: {\n default: 'relative rounded-lg shadow-lg',\n codeblock: [\n 'static px-0 py-6',\n 'bg-code-900 max-h-[96vh] w-full overflow-y-auto rounded-lg shadow-lg',\n 'scrollbar-thin scrollbar-thumb-code-500 scrollbar-track-transparent scrollbar-thumb-rounded-full overflow-x-auto',\n '*:max-h-none *:min-w-[75vw]',\n ],\n fullscreen: 'h-screen w-screen px-4 pb-8 pt-10',\n zoom: 'max-h-[96vh] overflow-y-auto *:max-h-none *:min-w-[55vw]',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Header: ThemeComponent<'Header'> = cva();\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Headline: ThemeComponent<'Headline'> = cva('[&>*]:no-underline', {\n variants: {\n size: {\n 'level-1':\n 'scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl',\n 'level-2':\n 'scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0',\n 'level-3': 'scroll-m-20 text-2xl font-semibold tracking-tight',\n 'level-4': 'scroll-m-20 text-xl font-semibold tracking-tight',\n 'level-5': 'mt-8 scroll-m-20 text-lg font-semibold tracking-tight',\n 'level-6': 'mt-8 scroll-m-20 text-base font-semibold tracking-tight',\n },\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Link: ThemeComponent<'Link'> = cva(\n ['font-medium underline underline-offset-4'],\n {\n variants: {\n variant: {\n toc: [\n 'text-secondary-500 hover:text-secondary-800 text-xs no-underline',\n 'data-[active=true]:text-secondary-800 font-normal data-[active=true]:font-medium',\n ],\n },\n },\n }\n);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const List: ThemeComponent<'List'> = {\n ul: cva('list-inside list-none'),\n ol: cva(''),\n item: cva('list-none py-0.5'),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Menu: ThemeComponent<'Menu'> = {\n container: cva(\n [\n 'border-border bg-bg-surface overflow-hidden rounded-md border px-1 py-1.5 text-sm shadow-md',\n 'sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]',\n ],\n {\n variants: {\n variant: {\n command:\n '[&_[cmdk-list-sizer]]:divide-secondary-100 size-full p-0 sm:w-[500px] [&_[cmdk-input-wrapper]_svg]:size-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:py-2 [&_[cmdk-item]_svg]:size-5 [&_[cmdk-list-sizer]]:divide-y',\n },\n },\n }\n ),\n item: cva('focus:bg-bg-hover cursor-pointer rounded p-2 outline-none', {\n variants: {\n variant: {\n command: ['aria-selected:bg-bg-hover px-4 py-1.5'],\n },\n },\n }),\n section: cva('', {\n variants: {\n variant: {\n command:\n '[&_[cmdk-group-heading]]:text-text-primary-muted [&_[cmdk-group-heading]]:p-4 [&_[cmdk-group-heading]]:py-2 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',\n },\n },\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const SectionMessage: ThemeComponent<'SectionMessage'> = {\n container: cva(\n [\n 'not-prose items-center rounded-lg p-4',\n 'grid-cols-[min-content,auto] gap-1 [grid-template-areas:\"icon_title_title\"\"none_content_content\"]',\n ],\n {\n variants: {\n variant: {\n info: 'bg-bg-info text-text-info',\n warning: 'bg-bg-warning text-text-warning',\n },\n },\n }\n ),\n icon: cva('size-6'),\n title: cva('mb-1 font-bold leading-none tracking-tight'),\n content: cva('text-sm [&_p]:leading-relaxed'),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Popover: ThemeComponent<'Popover'> = cva([''], {\n variants: {\n variant: {\n top: ['mb-1'],\n bottom: ['mt-1'],\n right: [''],\n left: [''],\n },\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Tabs: ThemeComponent<'Tabs'> = {\n container: cva(''),\n tabpanel: cva(''),\n tabsList: cva('mb-4 border-b'),\n tab: cva([\n 'text-text-primary-muted aria-selected:text-text-primary px-2 py-1 text-sm font-medium',\n 'aria-selected:border-border-primary -m-px border-b-2 border-transparent',\n 'focus:outline-none focus-visible:outline',\n ]),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Table: ThemeComponent<'Table'> = {\n table: cva('my-0 text-sm'),\n cell: cva('p-3 text-xs', {\n variants: {\n variant: {\n colorTable: 'p-4 align-middle',\n },\n },\n }),\n header: cva('border-b bg-white px-3 py-2 text-start'),\n row: cva('divide-y', {\n variants: {\n variant: {\n hover: 'hover:bg-neutral-100/50 ',\n },\n },\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Text: ThemeComponent<'Text'> = cva(\n 'leading-7 [&:not(:first-child)]:mt-6',\n {\n variants: {\n variant: {\n lead: 'text-muted-foreground text-xl',\n large: 'text-lg font-semibold',\n small: 'text-sm font-medium leading-none',\n muted: 'text-muted-foreground text-sm',\n },\n },\n }\n);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Underlay: ThemeComponent<'Underlay'> = cva('', {\n variants: {\n variant: {\n modal: 'bg-bg-underlay/50 backdrop-blur-sm',\n },\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Badge: ThemeComponent<'Badge'> = cva(\n 'inline-flex items-center truncate rounded-[20px] px-2 py-0.5',\n {\n variants: {\n variant: {\n dark: 'bg-bg-surface-lowered text-white',\n },\n size: {\n default: 'text-xs',\n },\n },\n defaultVariants: {\n variant: 'dark',\n size: 'default',\n },\n }\n);\n","import { Theme, cva } from '@marigold/system';\n\nexport const root: Theme['root'] = cva('text-text-primary bg-bg-body');\n","import type { Theme } from '@marigold/system';\n\nimport * as components from './components';\nimport { root } from './root';\nimport { colors } from './tokens';\n\nexport const theme: Theme = {\n name: 'docs',\n screens: {\n sm: '640px',\n md: '768px',\n lg: '1024px',\n xl: '1280px',\n '2xl': '1536px',\n },\n root,\n colors,\n components,\n};\nexport default theme;\n"],"mappings":"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","names":["cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/index.ts","../src/components/Button.styles.ts","../src/components/Card.styles.ts","../src/components/Dialog.styles.ts","../src/components/Header.styles.ts","../src/components/Headline.styles.ts","../src/components/Field.styles.ts","../src/components/HelpText.styles.ts","../src/components/Input.styles.ts","../src/components/Label.styles.ts","../src/components/Link.styles.ts","../src/components/List.styles.ts","../src/components/ListBox.styles.ts","../src/components/Menu.styles.ts","../src/components/Message.styles.ts","../src/components/Popover.styles.ts","../src/components/Select.styles.ts","../src/components/Tabs.styles.ts","../src/components/Table.styles.ts","../src/components/Text.styles.ts","../src/components/Underlay.styles.ts","../src/components/Badge.styles.ts","../src/root.ts","../src/index.ts"],"sourcesContent":["export * from './Button.styles';\nexport * from './Card.styles';\nexport * from './Dialog.styles';\nexport * from './Header.styles';\nexport * from './Headline.styles';\nexport * from './Field.styles';\nexport * from './HelpText.styles';\nexport * from './Input.styles';\nexport * from './Label.styles';\nexport * from './Link.styles';\nexport * from './List.styles';\nexport * from './ListBox.styles';\nexport * from './Menu.styles';\nexport * from './Message.styles';\nexport * from './Popover.styles';\nexport * from './Select.styles';\nexport * from './Tabs.styles';\nexport * from './Table.styles';\nexport * from './Text.styles';\nexport * from './Underlay.styles';\nexport * from './Badge.styles';\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Button: ThemeComponent<'Button'> = cva('flex gap-2 rounded-sm', {\n variants: {\n variant: {\n ghost: 'text-secondary-700 hover:text-secondary-900 p-0',\n menu: 'text-secondary-700 hover:bg-secondary-400/20 h-8 rounded-lg px-1',\n sunken:\n 'text-secondary-600 hover:bg-secondary-400/20 bg-secondary-400/10 h-8 justify-start rounded-lg',\n inverted: 'bg-secondary-100',\n },\n size: {\n small: 'px-3 py-1.5 text-sm',\n default: 'px-3 py-2',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Card: ThemeComponent<'Card'> = cva(\n [\n 'bg-bg-surface border-secondary-300 relative overflow-hidden rounded-xl border shadow',\n ],\n {\n variants: {\n variant: {\n default: 'p-6',\n hovering: 'p-6 transition-shadow hover:cursor-pointer hover:shadow-md',\n content: 'my-6',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n }\n);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Dialog: ThemeComponent<'Dialog'> = {\n closeButton: cva('absolute right-2 top-2', {\n variants: {\n variant: {\n fullscreen: ['size-6', 'right-4 top-4'],\n },\n },\n }),\n container: cva('bg-bg-surface', {\n variants: {\n variant: {\n default: 'relative rounded-lg shadow-lg',\n codeblock: [\n 'static px-0 py-6',\n 'bg-code-900 max-h-[96vh] w-full overflow-y-auto rounded-lg shadow-lg',\n 'scrollbar-thin scrollbar-thumb-code-500 scrollbar-track-transparent scrollbar-thumb-rounded-full overflow-x-auto',\n '*:max-h-none *:min-w-[75vw]',\n ],\n fullscreen: 'h-screen w-screen px-4 pb-8 pt-10',\n zoom: 'max-h-[96vh] overflow-y-auto *:max-h-none *:min-w-[55vw]',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Header: ThemeComponent<'Header'> = cva();\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Headline: ThemeComponent<'Headline'> = cva('[&>*]:no-underline', {\n variants: {\n size: {\n 'level-1':\n 'scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl',\n 'level-2':\n 'scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0',\n 'level-3': 'scroll-m-20 text-2xl font-semibold tracking-tight',\n 'level-4': 'scroll-m-20 text-xl font-semibold tracking-tight',\n 'level-5': 'mt-8 scroll-m-20 text-lg font-semibold tracking-tight',\n 'level-6': 'mt-8 scroll-m-20 text-base font-semibold tracking-tight',\n },\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Field: ThemeComponent<'Field'> = cva('grid gap-y-0.5', {\n variants: {\n variant: {\n default: '',\n floating: [\n 'grid-cols-[min-content_auto] grid-rows-[auto_auto]',\n 'items-center',\n ],\n },\n size: {\n default: 'gap-x-3',\n small: 'gap-x-2',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const HelpText: ThemeComponent<'HelpText'> = {\n container: cva(),\n icon: cva(),\n};\n","// Box\n// ---------------\nexport const inputBox = 'border border-border rounded text-text-primary';\nexport const inputBackground = 'bg-white';\n\n// Spacing\n// ---------------\nexport const xSpacing = {\n default: 'px-3',\n small: 'px-2.5',\n};\n\nexport const ySpacing = {\n default: 'py-2',\n small: 'py-1.5',\n};\n\nexport const inputSpacing = {\n default: `${xSpacing.default} ${ySpacing.default}`,\n small: `${xSpacing.small} ${ySpacing.small}`,\n};\n\n// States\n// ---------------\nexport const inputFocus = '';\nexport const inputDisabled = '';\nexport const inputError = '';\nexport const inputHover = '';\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Label: ThemeComponent<'Label'> = {\n container: cva('', {\n variants: {\n variant: {\n default: '',\n floating: [\n 'z-10 col-start-1 row-start-1',\n 'pointer-events-none',\n 'text-secondary-400 text-nowrap',\n 'after:content-[\":\"]',\n ],\n },\n size: {\n default: 'text-sm',\n small: 'text-xs',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n compoundVariants: [\n {\n variant: 'floating',\n size: 'default',\n className: 'pl-4',\n },\n {\n variant: 'floating',\n size: 'small',\n className: 'pl-3',\n },\n ],\n }),\n indicator: cva(),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Link: ThemeComponent<'Link'> = cva(\n ['font-medium underline underline-offset-4'],\n {\n variants: {\n variant: {\n toc: [\n 'text-secondary-500 hover:text-secondary-800 text-xs no-underline',\n 'data-[active=true]:text-secondary-800 font-normal data-[active=true]:font-medium',\n ],\n },\n },\n }\n);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const List: ThemeComponent<'List'> = {\n ul: cva('list-inside list-none'),\n ol: cva(''),\n item: cva('list-none py-0.5'),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const ListBox: ThemeComponent<'ListBox'> = {\n container: cva([\n 'bg-bg-surface-overlay border-border rounded border drop-shadow-lg',\n ]),\n list: cva([\n 'outline-none',\n 'p-1',\n 'sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]',\n ]),\n option: cva(\n [\n 'text-text-primary',\n 'cursor-pointer rounded outline-none',\n 'rac-hover:bg-bg-hover rac-focus:bg-bg-hover',\n 'aria-selected:bg-bg-hover',\n ],\n {\n variants: {\n size: {\n default: 'p-2',\n small: 'px-2 py-1 text-sm',\n },\n },\n defaultVariants: {\n size: 'small',\n },\n }\n ),\n section: cva(),\n sectionTitle: cva(),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Menu: ThemeComponent<'Menu'> = {\n container: cva(\n [\n 'border-border bg-bg-surface overflow-hidden rounded-md border px-1 py-1.5 text-sm shadow-md',\n 'sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]',\n ],\n {\n variants: {\n variant: {\n command:\n '[&_[cmdk-list-sizer]]:divide-secondary-100 size-full p-0 sm:w-[500px] [&_[cmdk-input-wrapper]_svg]:size-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:py-2 [&_[cmdk-item]_svg]:size-5 [&_[cmdk-list-sizer]]:divide-y',\n },\n },\n }\n ),\n item: cva('focus:bg-bg-hover cursor-pointer rounded p-2 outline-none', {\n variants: {\n variant: {\n command: ['aria-selected:bg-bg-hover px-4 py-1.5'],\n },\n },\n }),\n section: cva('', {\n variants: {\n variant: {\n command:\n '[&_[cmdk-group-heading]]:text-text-primary-muted [&_[cmdk-group-heading]]:p-4 [&_[cmdk-group-heading]]:py-2 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',\n },\n },\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const SectionMessage: ThemeComponent<'SectionMessage'> = {\n container: cva(\n [\n 'not-prose items-center rounded-lg p-4',\n 'grid-cols-[min-content,auto] gap-1 [grid-template-areas:\"icon_title_title\"\"none_content_content\"]',\n ],\n {\n variants: {\n variant: {\n info: 'bg-bg-info text-text-info',\n warning: 'bg-bg-warning text-text-warning',\n },\n },\n }\n ),\n icon: cva('size-6'),\n title: cva('mb-1 font-bold leading-none tracking-tight'),\n content: cva('text-sm [&_p]:leading-relaxed'),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Popover: ThemeComponent<'Popover'> = cva([\n 'animate-in',\n 'placement-t:-translate-y-1',\n 'placement-b:translate-y-1',\n 'placement-r:-translate-x-1',\n 'placement-l:translate-x-1',\n]);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nimport { inputBackground, inputBox, inputSpacing } from './Input.styles';\n\nexport const Select: ThemeComponent<'Select'> = {\n icon: cva('text-secondary-400', {\n variants: {\n variant: {\n default: '',\n floating: 'justify-self-end',\n },\n size: {\n default: '',\n small: 'size-3',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n }),\n select: cva([inputBox, inputBackground, 'outline-none'], {\n variants: {\n variant: {\n default: 'gap-2',\n floating: [\n 'shadow',\n 'col-span-full row-start-1 grid grid-cols-subgrid grid-rows-subgrid',\n // selected value and caret get moved to 2nd col\n '*:row-star-1 *:col-start-2 *:text-left',\n // So the button gap is not used to separate label from selected value\n 'gap-[inherit]',\n ],\n },\n size: {\n default: [inputSpacing.default],\n small: [inputSpacing.small, 'text-xs'],\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n compoundVariants: [\n {\n variant: 'floating',\n size: 'default',\n className: 'px-4 py-1.5',\n },\n {\n variant: 'floating',\n size: 'small',\n className: 'px-3',\n },\n ],\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Tabs: ThemeComponent<'Tabs'> = {\n container: cva('', {\n variants: {\n variant: {\n demo: 'my-6',\n },\n },\n }),\n tabpanel: cva(''),\n tabsList: cva('mb-4 border-b'),\n tab: cva([\n 'text-text-primary-muted aria-selected:text-text-primary px-2 py-1 text-sm font-medium',\n 'aria-selected:border-border-primary -m-px border-b-2 border-transparent',\n 'focus:outline-none focus-visible:outline',\n ]),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Table: ThemeComponent<'Table'> = {\n table: cva('my-0 text-sm'),\n cell: cva('p-3 text-xs', {\n variants: {\n variant: {\n colorTable: 'p-4 align-middle',\n },\n },\n }),\n header: cva('border-b bg-white px-3 py-2 text-start'),\n row: cva('divide-y', {\n variants: {\n variant: {\n hover: 'hover:bg-neutral-100/50 ',\n },\n },\n }),\n};\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Text: ThemeComponent<'Text'> = cva(\n 'leading-7 [&:not(:first-child)]:mt-6',\n {\n variants: {\n variant: {\n lead: 'text-muted-foreground text-xl',\n large: 'text-lg font-semibold',\n small: 'text-sm font-medium leading-none',\n muted: 'text-muted-foreground text-sm',\n },\n },\n }\n);\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Underlay: ThemeComponent<'Underlay'> = cva('', {\n variants: {\n variant: {\n modal: 'bg-bg-underlay/50 backdrop-blur-sm',\n },\n },\n});\n","import { ThemeComponent, cva } from '@marigold/system';\n\nexport const Badge: ThemeComponent<'Badge'> = cva(\n 'inline-flex items-center truncate rounded-[20px] px-2 py-0.5',\n {\n variants: {\n variant: {\n dark: 'bg-bg-surface-lowered text-white',\n },\n size: {\n default: 'text-xs',\n },\n },\n defaultVariants: {\n variant: 'dark',\n size: 'default',\n },\n }\n);\n","import { Theme, cva } from '@marigold/system';\n\nexport const root: Theme['root'] = cva('text-text-primary bg-bg-body');\n","import type { Theme } from '@marigold/system';\n\nimport * as components from './components';\nimport { root } from './root';\nimport { colors } from './tokens';\n\nexport const theme: Theme = {\n name: 'docs',\n screens: {\n sm: '640px',\n md: '768px',\n lg: '1024px',\n xl: '1280px',\n '2xl': '1536px',\n },\n root,\n colors,\n components,\n};\nexport default theme;\n"],"mappings":"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","names":["cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva","cva"]}
|
package/dist/preset.js
CHANGED
|
@@ -1197,6 +1197,19 @@ var blue = {
|
|
|
1197
1197
|
900: "#1e3a8a",
|
|
1198
1198
|
950: "#172554"
|
|
1199
1199
|
};
|
|
1200
|
+
var green = {
|
|
1201
|
+
50: "#f0fdf4",
|
|
1202
|
+
100: "#ecfccb",
|
|
1203
|
+
200: "#d9f99d",
|
|
1204
|
+
300: "#bef264",
|
|
1205
|
+
400: "#a3e635",
|
|
1206
|
+
500: "#84cc16",
|
|
1207
|
+
600: "#65a30d",
|
|
1208
|
+
700: "#4d7c0f",
|
|
1209
|
+
800: "#3f6212",
|
|
1210
|
+
900: "#365314",
|
|
1211
|
+
950: "#1a2e05"
|
|
1212
|
+
};
|
|
1200
1213
|
var neutral = {
|
|
1201
1214
|
50: "#fafafa",
|
|
1202
1215
|
100: "#f5f5f5",
|
|
@@ -1210,6 +1223,19 @@ var neutral = {
|
|
|
1210
1223
|
900: "#171717",
|
|
1211
1224
|
950: "#0a0a0a"
|
|
1212
1225
|
};
|
|
1226
|
+
var red = {
|
|
1227
|
+
50: "#fef2f2",
|
|
1228
|
+
100: "#fee2e2",
|
|
1229
|
+
200: "#fecaca",
|
|
1230
|
+
300: "#fca5a5",
|
|
1231
|
+
400: "#f87171",
|
|
1232
|
+
500: "#ef4444",
|
|
1233
|
+
600: "#dc2626",
|
|
1234
|
+
700: "#b91c1c",
|
|
1235
|
+
800: "#991b1b",
|
|
1236
|
+
900: "#7f1d1d",
|
|
1237
|
+
950: "#450a0a"
|
|
1238
|
+
};
|
|
1213
1239
|
var slate = {
|
|
1214
1240
|
50: "#f8fafc",
|
|
1215
1241
|
100: "#f1f5f9",
|
|
@@ -1282,14 +1308,19 @@ var colors = {
|
|
|
1282
1308
|
overlay: white
|
|
1283
1309
|
},
|
|
1284
1310
|
// Status
|
|
1285
|
-
|
|
1311
|
+
success: green[100],
|
|
1312
|
+
error: red[50],
|
|
1313
|
+
info: blue[50],
|
|
1286
1314
|
warning: amber[50]
|
|
1287
1315
|
},
|
|
1288
1316
|
// Border
|
|
1289
1317
|
// ---------------
|
|
1290
1318
|
border: {
|
|
1291
1319
|
DEFAULT: slate[300],
|
|
1292
|
-
primary: slate[950]
|
|
1320
|
+
primary: slate[950],
|
|
1321
|
+
// status
|
|
1322
|
+
success: green[600],
|
|
1323
|
+
error: red[600]
|
|
1293
1324
|
}
|
|
1294
1325
|
};
|
|
1295
1326
|
|