@marigold/theme-docs 3.1.9 → 3.1.11

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.
Files changed (10) hide show
  1. package/dist/index.d.mts +4 -2
  2. package/dist/index.d.mts.map +1 -0
  3. package/dist/index.d.ts +4 -2
  4. package/dist/index.d.ts.map +1 -0
  5. package/dist/index.js +415 -518
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +399 -503
  8. package/dist/index.mjs.map +1 -1
  9. package/dist/styles.css +1 -2
  10. package/package.json +7 -7
package/dist/index.mjs CHANGED
@@ -1,550 +1,446 @@
1
+ import { cva } from "@marigold/system";
2
+
3
+ //#region rolldown:runtime
1
4
  var __defProp = Object.defineProperty;
2
- var __export = (target, all) => {
3
- for (var name in all)
4
- __defProp(target, name, { get: all[name], enumerable: true });
5
+ var __export = (all) => {
6
+ let target = {};
7
+ for (var name in all) __defProp(target, name, {
8
+ get: all[name],
9
+ enumerable: true
10
+ });
11
+ return target;
5
12
  };
6
13
 
7
- // src/components/index.ts
8
- var components_exports = {};
9
- __export(components_exports, {
10
- Badge: () => Badge,
11
- Button: () => Button,
12
- Card: () => Card,
13
- CloseButton: () => CloseButton,
14
- Dialog: () => Dialog,
15
- Field: () => Field,
16
- Headline: () => Headline,
17
- HelpText: () => HelpText,
18
- IconButton: () => IconButton,
19
- Label: () => Label,
20
- Link: () => Link,
21
- List: () => List,
22
- ListBox: () => ListBox,
23
- Menu: () => Menu,
24
- Modal: () => Modal,
25
- Popover: () => Popover,
26
- SectionMessage: () => SectionMessage,
27
- Select: () => Select,
28
- Table: () => Table,
29
- Tabs: () => Tabs,
30
- Text: () => Text,
31
- Underlay: () => Underlay,
32
- inputBackground: () => inputBackground,
33
- inputBox: () => inputBox,
34
- inputDisabled: () => inputDisabled,
35
- inputError: () => inputError,
36
- inputFocus: () => inputFocus,
37
- inputHover: () => inputHover,
38
- inputSpacing: () => inputSpacing,
39
- xSpacing: () => xSpacing,
40
- ySpacing: () => ySpacing
41
- });
14
+ //#endregion
15
+ //#region src/components/Button.styles.ts
16
+ const Button = cva("flex gap-2 rounded-xs px-3 py-2", { variants: {
17
+ variant: {
18
+ ghost: "text-secondary-700 hover:text-secondary-900 p-0",
19
+ sunken: "text-secondary-600 hover:bg-secondary-400/20 bg-secondary-400/10 h-8 justify-start rounded-lg",
20
+ inverted: "bg-secondary-100",
21
+ icon: "border-none translate-y-0.5 outline-none p-0"
22
+ },
23
+ size: { small: "px-3 py-1.5 text-sm" }
24
+ } });
42
25
 
43
- // src/components/Button.styles.ts
44
- import { cva } from "@marigold/system";
45
- var Button = cva(
46
- "flex gap-2 rounded-xs px-3 py-2",
47
- {
48
- variants: {
49
- variant: {
50
- ghost: "text-secondary-700 hover:text-secondary-900 p-0",
51
- sunken: "text-secondary-600 hover:bg-secondary-400/20 bg-secondary-400/10 h-8 justify-start rounded-lg",
52
- inverted: "bg-secondary-100",
53
- icon: "border-none translate-y-0.5 outline-none p-0"
54
- },
55
- size: {
56
- small: "px-3 py-1.5 text-sm"
57
- }
58
- }
59
- }
60
- );
61
-
62
- // src/components/Card.styles.ts
63
- import { cva as cva2 } from "@marigold/system";
64
- var Card = cva2(
65
- ["relative w-full overflow-hidden rounded-xl"],
66
- {
67
- variants: {
68
- variant: {
69
- default: "bg-bg-surface-raised p-6 shadow-xs border border-secondary-300",
70
- hovering: "bg-bg-surface-raised p-6 shadow-xs transition-shadow hover:cursor-pointer hover:shadow-md border border-secondary-300",
71
- content: "bg-bg-surface-raised my-6 shadow-xs border border-secondary-300",
72
- outline: "bg-white/40 my-6 border border-secondary-200",
73
- lowered: "bg-bg-surface-raised-lowered p-6",
74
- image: ""
75
- },
76
- size: {
77
- default: "",
78
- full: "size-full"
79
- }
80
- },
81
- defaultVariants: {
82
- variant: "default",
83
- size: "default"
84
- }
85
- }
86
- );
26
+ //#endregion
27
+ //#region src/components/Card.styles.ts
28
+ const Card = cva(["relative w-full overflow-hidden rounded-xl"], {
29
+ variants: {
30
+ variant: {
31
+ default: "bg-bg-surface-raised p-6 shadow-xs border border-secondary-300",
32
+ hovering: "bg-bg-surface-raised p-6 shadow-xs transition-shadow hover:cursor-pointer hover:shadow-md border border-secondary-300",
33
+ content: "bg-bg-surface-raised my-6 shadow-xs border border-secondary-300",
34
+ outline: "bg-white/40 my-6 border border-secondary-200",
35
+ lowered: "bg-bg-surface-raised-lowered p-6",
36
+ image: ""
37
+ },
38
+ size: {
39
+ default: "",
40
+ full: "size-full"
41
+ }
42
+ },
43
+ defaultVariants: {
44
+ variant: "default",
45
+ size: "default"
46
+ }
47
+ });
87
48
 
88
- // src/components/CloseButton.styles.ts
89
- import { cva as cva3 } from "@marigold/system";
90
- var CloseButton = cva3([
91
- "flex items-center justify-center whitespace-nowrap",
92
- "cursor-pointer",
93
- "transition-[color,box-shadow]",
94
- "mixin-ring-focus-visible",
95
- "rounded",
96
- "[&_svg]:size-4 [&_svg]:opacity-60 [&_svg]:transition-opacity hover:[&_svg]:opacity-100"
49
+ //#endregion
50
+ //#region src/components/CloseButton.styles.ts
51
+ const CloseButton = cva([
52
+ "flex items-center justify-center whitespace-nowrap",
53
+ "cursor-pointer",
54
+ "transition-[color,box-shadow]",
55
+ "mixin-ring-focus-visible",
56
+ "rounded",
57
+ "[&_svg]:size-4 [&_svg]:opacity-60 [&_svg]:transition-opacity hover:[&_svg]:opacity-100"
97
58
  ]);
98
59
 
99
- // src/components/Dialog.styles.ts
100
- import { cva as cva4 } from "@marigold/system";
101
- var Dialog = {
102
- closeButton: cva4("absolute top-4 right-4 ml-4", {
103
- variants: {
104
- variant: {
105
- fullscreen: ["size-6", "right-4 top-4"]
106
- }
107
- }
108
- }),
109
- container: cva4("bg-bg-surface", {
110
- variants: {
111
- variant: {
112
- default: "relative rounded-lg shadow-lg",
113
- codeblock: [
114
- "static px-0 py-6",
115
- "bg-code-900 max-h-[96vh] w-full overflow-y-auto rounded-lg shadow-lg",
116
- "scrollbar-thin scrollbar-thumb-code-500 scrollbar-track-transparent scrollbar-thumb-rounded-full overflow-x-auto",
117
- "*:max-h-none *:min-w-[75vw]"
118
- ],
119
- fullscreen: "h-screen w-screen px-4 pb-8 pt-10",
120
- zoom: "max-h-[96vh] overflow-y-auto"
121
- }
122
- },
123
- defaultVariants: {
124
- variant: "default"
125
- }
126
- }),
127
- header: cva4(""),
128
- title: cva4(""),
129
- content: cva4(""),
130
- actions: cva4("")
60
+ //#endregion
61
+ //#region src/components/Dialog.styles.ts
62
+ const Dialog = {
63
+ closeButton: cva("absolute top-4 right-4 ml-4", { variants: { variant: { fullscreen: ["size-6", "right-4 top-4"] } } }),
64
+ container: cva("bg-bg-surface", {
65
+ variants: { variant: {
66
+ default: "relative rounded-lg shadow-lg",
67
+ codeblock: [
68
+ "static px-0 py-6",
69
+ "bg-code-900 max-h-[96vh] w-full overflow-y-auto rounded-lg shadow-lg",
70
+ "scrollbar-thin scrollbar-thumb-code-500 scrollbar-track-transparent scrollbar-thumb-rounded-full overflow-x-auto",
71
+ "*:max-h-none *:min-w-[75vw]"
72
+ ],
73
+ fullscreen: "h-screen w-screen px-4 pb-8 pt-10",
74
+ zoom: "max-h-[96vh] overflow-y-auto"
75
+ } },
76
+ defaultVariants: { variant: "default" }
77
+ }),
78
+ header: cva(""),
79
+ title: cva(""),
80
+ content: cva(""),
81
+ actions: cva("")
131
82
  };
132
83
 
133
- // src/components/Headline.styles.ts
134
- import { cva as cva5 } from "@marigold/system";
135
- var Headline = cva5("*:no-underline", {
136
- variants: {
137
- size: {
138
- "level-1": "scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl",
139
- "level-2": "scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0",
140
- "level-3": "scroll-m-20 text-2xl font-semibold tracking-tight",
141
- "level-4": "scroll-m-20 text-xl font-semibold tracking-tight",
142
- "level-5": "mt-8 scroll-m-20 text-lg font-semibold tracking-tight",
143
- "level-6": "mt-8 scroll-m-20 text-base font-semibold tracking-tight"
144
- }
145
- }
146
- });
84
+ //#endregion
85
+ //#region src/components/Headline.styles.ts
86
+ const Headline = cva("*:no-underline", { variants: { size: {
87
+ "level-1": "scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl",
88
+ "level-2": "scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0",
89
+ "level-3": "scroll-m-20 text-2xl font-semibold tracking-tight",
90
+ "level-4": "scroll-m-20 text-xl font-semibold tracking-tight",
91
+ "level-5": "mt-8 scroll-m-20 text-lg font-semibold tracking-tight",
92
+ "level-6": "mt-8 scroll-m-20 text-base font-semibold tracking-tight"
93
+ } } });
147
94
 
148
- // src/components/Field.styles.ts
149
- import { cva as cva6 } from "@marigold/system";
150
- var Field = cva6("grid gap-y-0.5", {
151
- variants: {
152
- variant: {
153
- default: "",
154
- floating: [
155
- "grid-cols-[min-content_auto] grid-rows-[auto_auto]",
156
- "items-center"
157
- ]
158
- },
159
- size: {
160
- default: "gap-x-3",
161
- small: "gap-x-2"
162
- }
163
- },
164
- defaultVariants: {
165
- variant: "default",
166
- size: "default"
167
- }
95
+ //#endregion
96
+ //#region src/components/Field.styles.ts
97
+ const Field = cva("grid gap-y-0.5", {
98
+ variants: {
99
+ variant: {
100
+ default: "",
101
+ floating: ["grid-cols-[min-content_auto] grid-rows-[auto_auto]", "items-center"]
102
+ },
103
+ size: {
104
+ default: "gap-x-3",
105
+ small: "gap-x-2"
106
+ }
107
+ },
108
+ defaultVariants: {
109
+ variant: "default",
110
+ size: "default"
111
+ }
168
112
  });
169
113
 
170
- // src/components/HelpText.styles.ts
171
- import { cva as cva7 } from "@marigold/system";
172
- var HelpText = {
173
- container: cva7(),
174
- icon: cva7()
114
+ //#endregion
115
+ //#region src/components/HelpText.styles.ts
116
+ const HelpText = {
117
+ container: cva(),
118
+ icon: cva()
175
119
  };
176
120
 
177
- // src/components/IconButton.styles.ts
178
- import { cva as cva8 } from "@marigold/system";
179
- var IconButton = cva8();
121
+ //#endregion
122
+ //#region src/components/IconButton.styles.ts
123
+ const IconButton = cva();
180
124
 
181
- // src/components/Input.styles.ts
182
- var inputBox = "border border-border rounded-xs text-text-primary";
183
- var inputBackground = "bg-white";
184
- var xSpacing = {
185
- default: "px-3",
186
- small: "px-2.5"
125
+ //#endregion
126
+ //#region src/components/Input.styles.ts
127
+ const inputBox = "border border-border rounded-xs text-text-primary";
128
+ const inputBackground = "bg-white";
129
+ const xSpacing = {
130
+ default: "px-3",
131
+ small: "px-2.5"
187
132
  };
188
- var ySpacing = {
189
- default: "py-2",
190
- small: "py-1.5"
133
+ const ySpacing = {
134
+ default: "py-2",
135
+ small: "py-1.5"
191
136
  };
192
- var inputSpacing = {
193
- default: `${xSpacing.default} ${ySpacing.default}`,
194
- small: `${xSpacing.small} ${ySpacing.small}`
137
+ const inputSpacing = {
138
+ default: `${xSpacing.default} ${ySpacing.default}`,
139
+ small: `${xSpacing.small} ${ySpacing.small}`
195
140
  };
196
- var inputFocus = "";
197
- var inputDisabled = "disabled:cursor-not-allowed disabled:text-text-disabled disabled:bg-bg-disabled";
198
- var inputError = "";
199
- var inputHover = "";
141
+ const inputFocus = "";
142
+ const inputDisabled = "disabled:cursor-not-allowed disabled:text-text-disabled disabled:bg-bg-disabled";
143
+ const inputError = "";
144
+ const inputHover = "";
200
145
 
201
- // src/components/Label.styles.ts
202
- import { cva as cva9 } from "@marigold/system";
203
- var Label = {
204
- container: cva9("", {
205
- variants: {
206
- variant: {
207
- default: "",
208
- floating: [
209
- "z-10 col-start-1 row-start-1",
210
- "pointer-events-none",
211
- "text-secondary-400 text-nowrap",
212
- 'after:content-[":"]'
213
- ]
214
- },
215
- size: {
216
- default: "text-sm",
217
- small: "text-xs"
218
- }
219
- },
220
- defaultVariants: {
221
- variant: "default",
222
- size: "default"
223
- },
224
- compoundVariants: [
225
- {
226
- variant: "floating",
227
- size: "default",
228
- className: "pl-4"
229
- },
230
- {
231
- variant: "floating",
232
- size: "small",
233
- className: "pl-3"
234
- }
235
- ]
236
- }),
237
- indicator: cva9()
146
+ //#endregion
147
+ //#region src/components/Label.styles.ts
148
+ const Label = {
149
+ container: cva("", {
150
+ variants: {
151
+ variant: {
152
+ default: "",
153
+ floating: [
154
+ "z-10 col-start-1 row-start-1",
155
+ "pointer-events-none",
156
+ "text-secondary-400 text-nowrap",
157
+ "after:content-[\":\"]"
158
+ ]
159
+ },
160
+ size: {
161
+ default: "text-sm",
162
+ small: "text-xs"
163
+ }
164
+ },
165
+ defaultVariants: {
166
+ variant: "default",
167
+ size: "default"
168
+ },
169
+ compoundVariants: [{
170
+ variant: "floating",
171
+ size: "default",
172
+ className: "pl-4"
173
+ }, {
174
+ variant: "floating",
175
+ size: "small",
176
+ className: "pl-3"
177
+ }]
178
+ }),
179
+ indicator: cva()
238
180
  };
239
181
 
240
- // src/components/Link.styles.ts
241
- import { cva as cva10 } from "@marigold/system";
242
- var Link = cva10(["font-medium"], {
243
- variants: {
244
- variant: {
245
- default: "underline underline-offset-4 transition-all hover:text-slate-700",
246
- primary: "bg-text-primary text-white leading-none hover:bg-slate-700 transition-all",
247
- secondary: "border-text-primary border-2 leading-none hover:bg-slate-100",
248
- toc: [
249
- "text-secondary-500 hover:text-secondary-800 text-xs",
250
- "data-[active=true]:text-secondary-800 font-normal data-[active=true]:font-medium"
251
- ],
252
- cta: [
253
- "h-component rounded-2xl bg-purple-700 px-5 py-1.5",
254
- "text-sm font-semibold text-purple-100",
255
- "transition-all hover:bg-purple-600"
256
- ],
257
- ghost: "hover:underline underline-offset-4",
258
- shiny: "border border-slate-200 bg-slate-100 hover:bg-slate-200 transition-all ease-in"
259
- },
260
- size: {
261
- inline: "",
262
- xsmall: "rounded-full text-xs py-1.5 px-4",
263
- small: "px-3 py-1.5 text-sm rounded-xs",
264
- regular: "px-3 py-2 rounded-xs",
265
- large: "px-8 py-3.5 rounded-xs"
266
- }
267
- },
268
- defaultVariants: {
269
- variant: "default",
270
- size: "inline"
271
- }
182
+ //#endregion
183
+ //#region src/components/Link.styles.ts
184
+ const Link = cva(["font-medium"], {
185
+ variants: {
186
+ variant: {
187
+ default: "underline underline-offset-4 transition-all hover:text-slate-700",
188
+ primary: "bg-text-primary text-white leading-none hover:bg-slate-700 transition-all",
189
+ secondary: "border-text-primary border-2 leading-none hover:bg-slate-100",
190
+ toc: ["text-secondary-500 hover:text-secondary-800 text-xs", "data-[active=true]:text-secondary-800 font-normal data-[active=true]:font-medium"],
191
+ cta: [
192
+ "h-component rounded-2xl bg-purple-700 px-5 py-1.5",
193
+ "text-sm font-semibold text-purple-100",
194
+ "transition-all hover:bg-purple-600"
195
+ ],
196
+ ghost: "hover:underline underline-offset-4",
197
+ shiny: "border border-slate-200 bg-slate-100 hover:bg-slate-200 transition-all ease-in"
198
+ },
199
+ size: {
200
+ inline: "",
201
+ xsmall: "rounded-full text-xs py-1.5 px-4",
202
+ small: "px-3 py-1.5 text-sm rounded-xs",
203
+ regular: "px-3 py-2 rounded-xs",
204
+ large: "px-8 py-3.5 rounded-xs"
205
+ }
206
+ },
207
+ defaultVariants: {
208
+ variant: "default",
209
+ size: "inline"
210
+ }
272
211
  });
273
212
 
274
- // src/components/List.styles.ts
275
- import { cva as cva11 } from "@marigold/system";
276
- var List = {
277
- ul: cva11("list-inside list-none"),
278
- ol: cva11(""),
279
- item: cva11("list-none py-0.5")
213
+ //#endregion
214
+ //#region src/components/List.styles.ts
215
+ const List = {
216
+ ul: cva("list-inside list-none"),
217
+ ol: cva(""),
218
+ item: cva("list-none py-0.5")
280
219
  };
281
220
 
282
- // src/components/ListBox.styles.ts
283
- import { cva as cva12 } from "@marigold/system";
284
- var ListBox = {
285
- container: cva12([
286
- "bg-bg-surface-overlay border-border rounded-xs border drop-shadow-lg"
287
- ]),
288
- list: cva12([
289
- "outline-hidden",
290
- "p-1",
291
- "sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]"
292
- ]),
293
- item: cva12(
294
- [
295
- "text-text-primary",
296
- "cursor-pointer rounded-xs outline-hidden",
297
- "rac-hover:bg-bg-hover rac-focus:bg-bg-hover",
298
- "aria-selected:bg-bg-hover"
299
- ],
300
- {
301
- variants: {
302
- size: {
303
- default: "p-2",
304
- small: "px-2 py-1 text-sm"
305
- }
306
- },
307
- defaultVariants: {
308
- size: "small"
309
- }
310
- }
311
- ),
312
- section: cva12(),
313
- header: cva12()
221
+ //#endregion
222
+ //#region src/components/ListBox.styles.ts
223
+ const ListBox = {
224
+ container: cva(["bg-bg-surface-overlay border-border rounded-xs border drop-shadow-lg"]),
225
+ list: cva([
226
+ "outline-hidden",
227
+ "p-1",
228
+ "sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]"
229
+ ]),
230
+ item: cva([
231
+ "text-text-primary",
232
+ "cursor-pointer rounded-xs outline-hidden",
233
+ "rac-hover:bg-bg-hover rac-focus:bg-bg-hover",
234
+ "aria-selected:bg-bg-hover"
235
+ ], {
236
+ variants: { size: {
237
+ default: "p-2",
238
+ small: "px-2 py-1 text-sm"
239
+ } },
240
+ defaultVariants: { size: "small" }
241
+ }),
242
+ section: cva(),
243
+ header: cva()
314
244
  };
315
245
 
316
- // src/components/Menu.styles.ts
317
- import { cva as cva13 } from "@marigold/system";
318
- var Menu = {
319
- container: cva13(
320
- [
321
- "border-border bg-bg-surface overflow-hidden rounded-md border px-1 py-1.5 text-sm shadow-md",
322
- "sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]"
323
- ],
324
- {
325
- variants: {
326
- variant: {
327
- command: "[&_[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"
328
- }
329
- }
330
- }
331
- ),
332
- item: cva13("focus:bg-bg-hover cursor-pointer rounded-xs p-2 outline-hidden", {
333
- variants: {
334
- variant: {
335
- command: ["aria-selected:bg-bg-hover px-4 py-1.5"]
336
- }
337
- }
338
- }),
339
- section: cva13("", {
340
- variants: {
341
- variant: {
342
- 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"
343
- }
344
- }
345
- }),
346
- button: cva13(
347
- "text-secondary-700 hover:bg-secondary-400/20 h-8 rounded-lg px-1"
348
- )
246
+ //#endregion
247
+ //#region src/components/Menu.styles.ts
248
+ const Menu = {
249
+ container: cva(["border-border bg-bg-surface overflow-hidden rounded-md border px-1 py-1.5 text-sm shadow-md", "sm:max-h-[45vh] md:max-h-[75vh] lg:max-h-[75vh]"], { variants: { variant: { command: "[&_[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" } } }),
250
+ item: cva("focus:bg-bg-hover cursor-pointer rounded-xs p-2 outline-hidden", { variants: { variant: { command: ["aria-selected:bg-bg-hover px-4 py-1.5"] } } }),
251
+ section: cva("", { variants: { variant: { 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" } } }),
252
+ button: cva("text-secondary-700 hover:bg-secondary-400/20 h-8 rounded-lg px-1")
349
253
  };
350
254
 
351
- // src/components/Modal.styles.ts
352
- import { cva as cva14 } from "@marigold/system";
353
- var Modal = cva14();
255
+ //#endregion
256
+ //#region src/components/Modal.styles.ts
257
+ const Modal = cva();
354
258
 
355
- // src/components/SectionMessage.styles.ts
356
- import { cva as cva15 } from "@marigold/system";
357
- var SectionMessage = {
358
- container: cva15(
359
- [
360
- "not-prose items-center rounded-lg p-4",
361
- 'grid-cols-[min-content_auto] gap-1 [grid-template-areas:"icon_title_title""none_content_content"]'
362
- ],
363
- {
364
- variants: {
365
- variant: {
366
- info: "bg-bg-info text-text-info",
367
- warning: "bg-bg-warning text-text-warning"
368
- }
369
- }
370
- }
371
- ),
372
- icon: cva15("size-6"),
373
- title: cva15("mb-1 font-bold leading-none tracking-tight"),
374
- content: cva15("text-sm [&_p]:leading-relaxed [&_code]:text-xs"),
375
- close: cva15("h-5 w-5 text-center")
259
+ //#endregion
260
+ //#region src/components/SectionMessage.styles.ts
261
+ const SectionMessage = {
262
+ container: cva(["not-prose items-center rounded-lg p-4", "grid-cols-[min-content_auto] gap-1 [grid-template-areas:\"icon_title_title\"\"none_content_content\"]"], { variants: { variant: {
263
+ info: "bg-bg-info text-text-info",
264
+ warning: "bg-bg-warning text-text-warning"
265
+ } } }),
266
+ icon: cva("size-6"),
267
+ title: cva("mb-1 font-bold leading-none tracking-tight"),
268
+ content: cva("text-sm [&_p]:leading-relaxed [&_code]:text-xs"),
269
+ close: cva("h-5 w-5 text-center")
376
270
  };
377
271
 
378
- // src/components/Popover.styles.ts
379
- import { cva as cva16 } from "@marigold/system";
380
- var Popover = cva16([
381
- "animate-in",
382
- "placement-t:-translate-y-1",
383
- "placement-b:translate-y-1",
384
- "placement-r:-translate-x-1",
385
- "placement-l:translate-x-1"
272
+ //#endregion
273
+ //#region src/components/Popover.styles.ts
274
+ const Popover = cva([
275
+ "animate-in",
276
+ "placement-t:-translate-y-1",
277
+ "placement-b:translate-y-1",
278
+ "placement-r:-translate-x-1",
279
+ "placement-l:translate-x-1"
386
280
  ]);
387
281
 
388
- // src/components/Select.styles.ts
389
- import { cva as cva17 } from "@marigold/system";
390
- var Select = {
391
- icon: cva17("text-secondary-400", {
392
- variants: {
393
- variant: {
394
- default: "",
395
- floating: "justify-self-end"
396
- },
397
- size: {
398
- default: "",
399
- small: "size-3"
400
- }
401
- },
402
- defaultVariants: {
403
- variant: "default",
404
- size: "default"
405
- }
406
- }),
407
- select: cva17([inputBox, inputBackground, inputDisabled, "outline-hidden"], {
408
- variants: {
409
- variant: {
410
- default: "gap-2",
411
- floating: [
412
- "shadow-xs",
413
- "col-span-full row-start-1 grid grid-cols-subgrid grid-rows-subgrid",
414
- // selected value and caret get moved to 2nd col
415
- "*:row-star-1 *:col-start-2 *:text-left",
416
- // So the button gap is not used to separate label from selected value
417
- "gap-[inherit]"
418
- ]
419
- },
420
- size: {
421
- default: [inputSpacing.default],
422
- small: [inputSpacing.small, "text-xs"]
423
- }
424
- },
425
- defaultVariants: {
426
- variant: "default",
427
- size: "default"
428
- },
429
- compoundVariants: [
430
- {
431
- variant: "floating",
432
- size: "default",
433
- className: "px-4 py-1.5"
434
- },
435
- {
436
- variant: "floating",
437
- size: "small",
438
- className: "px-3"
439
- }
440
- ]
441
- })
282
+ //#endregion
283
+ //#region src/components/Select.styles.ts
284
+ const Select = {
285
+ icon: cva("text-secondary-400", {
286
+ variants: {
287
+ variant: {
288
+ default: "",
289
+ floating: "justify-self-end"
290
+ },
291
+ size: {
292
+ default: "",
293
+ small: "size-3"
294
+ }
295
+ },
296
+ defaultVariants: {
297
+ variant: "default",
298
+ size: "default"
299
+ }
300
+ }),
301
+ select: cva([
302
+ inputBox,
303
+ inputBackground,
304
+ inputDisabled,
305
+ "outline-hidden"
306
+ ], {
307
+ variants: {
308
+ variant: {
309
+ default: "gap-2",
310
+ floating: [
311
+ "shadow-xs",
312
+ "col-span-full row-start-1 grid grid-cols-subgrid grid-rows-subgrid",
313
+ "*:row-star-1 *:col-start-2 *:text-left",
314
+ "gap-[inherit]"
315
+ ]
316
+ },
317
+ size: {
318
+ default: [inputSpacing.default],
319
+ small: [inputSpacing.small, "text-xs"]
320
+ }
321
+ },
322
+ defaultVariants: {
323
+ variant: "default",
324
+ size: "default"
325
+ },
326
+ compoundVariants: [{
327
+ variant: "floating",
328
+ size: "default",
329
+ className: "px-4 py-1.5"
330
+ }, {
331
+ variant: "floating",
332
+ size: "small",
333
+ className: "px-3"
334
+ }]
335
+ })
442
336
  };
443
337
 
444
- // src/components/Tabs.styles.ts
445
- import { cva as cva18 } from "@marigold/system";
446
- var Tabs = {
447
- container: cva18("", {
448
- variants: {
449
- variant: {
450
- demo: "my-6"
451
- }
452
- }
453
- }),
454
- tabpanel: cva18(""),
455
- tabsList: cva18("mb-4 border-b"),
456
- tab: cva18([
457
- "text-text-primary-muted aria-selected:text-text-primary px-2 py-1 text-sm font-medium",
458
- "aria-selected:border-border-primary -m-px border-b-2 border-transparent",
459
- "focus:outline-hidden focus-visible:outline"
460
- ])
338
+ //#endregion
339
+ //#region src/components/Tabs.styles.ts
340
+ const Tabs = {
341
+ container: cva("", { variants: { variant: { demo: "my-6" } } }),
342
+ tabpanel: cva(""),
343
+ tabsList: cva("mb-4 border-b"),
344
+ tab: cva([
345
+ "text-text-primary-muted aria-selected:text-text-primary px-2 py-1 text-sm font-medium",
346
+ "aria-selected:border-border-primary -m-px border-b-2 border-transparent",
347
+ "focus:outline-hidden focus-visible:outline"
348
+ ])
461
349
  };
462
350
 
463
- // src/components/Table.styles.ts
464
- import { cva as cva19 } from "@marigold/system";
465
- var Table = {
466
- table: cva19([
467
- "w-full overflow-hidden rounded-lg bg-white/40 text-sm",
468
- "border-secondary-200 border-separate border-spacing-0 border"
469
- ]),
470
- thead: cva19(),
471
- headerRow: cva19(),
472
- header: cva19("px-3 pb-2 pt-3 text-start"),
473
- body: cva19(),
474
- row: cva19([], {
475
- variants: {
476
- variant: {
477
- hover: "hover:bg-neutral-100/80 "
478
- }
479
- }
480
- }),
481
- cell: cva19(
482
- ["text-text-primary px-3 py-3.5 text-xs", "border-secondary-200 border-t"],
483
- {
484
- variants: {
485
- variant: {
486
- colorTable: "p-4 align-middle"
487
- }
488
- }
489
- }
490
- )
351
+ //#endregion
352
+ //#region src/components/Table.styles.ts
353
+ const Table = {
354
+ table: cva(["w-full overflow-hidden rounded-lg bg-white/40 text-sm", "border-secondary-200 border-separate border-spacing-0 border"]),
355
+ thead: cva(),
356
+ headerRow: cva(),
357
+ header: cva("px-3 pb-2 pt-3 text-start"),
358
+ body: cva(),
359
+ row: cva([], { variants: { variant: { hover: "hover:bg-neutral-100/80 " } } }),
360
+ cell: cva(["text-text-primary px-3 py-3.5 text-xs", "border-secondary-200 border-t"], { variants: { variant: { colorTable: "p-4 align-middle" } } })
491
361
  };
492
362
 
493
- // src/components/Text.styles.ts
494
- import { cva as cva20 } from "@marigold/system";
495
- var Text = cva20("leading-7", {
496
- variants: {
497
- variant: {
498
- lead: "text-muted-foreground text-xl",
499
- large: "text-lg font-semibold",
500
- small: "text-sm font-medium leading-none",
501
- muted: "text-muted-foreground text-sm"
502
- }
503
- }
504
- });
363
+ //#endregion
364
+ //#region src/components/Text.styles.ts
365
+ const Text = cva("leading-7", { variants: { variant: {
366
+ lead: "text-muted-foreground text-xl",
367
+ large: "text-lg font-semibold",
368
+ small: "text-sm font-medium leading-none",
369
+ muted: "text-muted-foreground text-sm"
370
+ } } });
371
+
372
+ //#endregion
373
+ //#region src/components/Underlay.styles.ts
374
+ const Underlay = cva("bg-bg-underlay/50 backdrop-blur-xs");
505
375
 
506
- // src/components/Underlay.styles.ts
507
- import { cva as cva21 } from "@marigold/system";
508
- var Underlay = cva21(
509
- "bg-bg-underlay/50 backdrop-blur-xs"
510
- );
376
+ //#endregion
377
+ //#region src/components/Badge.styles.ts
378
+ const Badge = cva("inline-flex items-center truncate rounded-[20px] px-2 py-0.5", {
379
+ variants: {
380
+ variant: {
381
+ dark: "bg-bg-inverted text-white",
382
+ warning: "bg-bg-warning"
383
+ },
384
+ size: { default: "text-xs" }
385
+ },
386
+ defaultVariants: {
387
+ variant: "dark",
388
+ size: "default"
389
+ }
390
+ });
511
391
 
512
- // src/components/Badge.styles.ts
513
- import { cva as cva22 } from "@marigold/system";
514
- var Badge = cva22(
515
- "inline-flex items-center truncate rounded-[20px] px-2 py-0.5",
516
- {
517
- variants: {
518
- variant: {
519
- dark: "bg-bg-inverted text-white",
520
- warning: "bg-bg-warning"
521
- },
522
- size: {
523
- default: "text-xs"
524
- }
525
- },
526
- defaultVariants: {
527
- variant: "dark",
528
- size: "default"
529
- }
530
- }
531
- );
392
+ //#endregion
393
+ //#region src/components/index.ts
394
+ var components_exports = /* @__PURE__ */ __export({
395
+ Badge: () => Badge,
396
+ Button: () => Button,
397
+ Card: () => Card,
398
+ CloseButton: () => CloseButton,
399
+ Dialog: () => Dialog,
400
+ Field: () => Field,
401
+ Headline: () => Headline,
402
+ HelpText: () => HelpText,
403
+ IconButton: () => IconButton,
404
+ Label: () => Label,
405
+ Link: () => Link,
406
+ List: () => List,
407
+ ListBox: () => ListBox,
408
+ Menu: () => Menu,
409
+ Modal: () => Modal,
410
+ Popover: () => Popover,
411
+ SectionMessage: () => SectionMessage,
412
+ Select: () => Select,
413
+ Table: () => Table,
414
+ Tabs: () => Tabs,
415
+ Text: () => Text,
416
+ Underlay: () => Underlay,
417
+ inputBackground: () => inputBackground,
418
+ inputBox: () => inputBox,
419
+ inputDisabled: () => inputDisabled,
420
+ inputError: () => inputError,
421
+ inputFocus: () => inputFocus,
422
+ inputHover: () => inputHover,
423
+ inputSpacing: () => inputSpacing,
424
+ xSpacing: () => xSpacing,
425
+ ySpacing: () => ySpacing
426
+ });
532
427
 
533
- // src/root.ts
534
- import { cva as cva23 } from "@marigold/system";
535
- var root = cva23("text-text-primary bg-bg-body");
428
+ //#endregion
429
+ //#region src/root.ts
430
+ const root = cva("text-text-primary bg-bg-body");
536
431
 
537
- // src/theme.ts
538
- var theme = {
539
- name: "docs",
540
- root,
541
- components: components_exports
432
+ //#endregion
433
+ //#region src/theme.ts
434
+ const theme = {
435
+ name: "docs",
436
+ root,
437
+ components: components_exports
542
438
  };
543
439
 
544
- // src/index.ts
545
- var index_default = theme;
546
- export {
547
- index_default as default,
548
- theme
549
- };
440
+ //#endregion
441
+ //#region src/index.ts
442
+ var src_default = theme;
443
+
444
+ //#endregion
445
+ export { src_default as default, theme };
550
446
  //# sourceMappingURL=index.mjs.map