@datum-cloud/datum-ui 0.2.0-alpha.3 → 0.2.0-alpha.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/README.md +66 -32
- package/dist/alert/index.mjs +3 -0
- package/dist/alert-BC2Mccfo.mjs +95 -0
- package/dist/autocomplete/index.mjs +7 -0
- package/dist/autocomplete-DZtI97HP.mjs +295 -0
- package/dist/avatar-stack/index.mjs +5 -0
- package/dist/avatar-stack-JCfBlPB9.mjs +80 -0
- package/dist/badge/index.mjs +3 -0
- package/dist/badge-bFgeYceE.mjs +185 -0
- package/dist/breadcrumb/index.mjs +4 -0
- package/dist/breadcrumb-BGYJgom_.mjs +71 -0
- package/dist/button/index.mjs +4 -0
- package/dist/button-AzpnV-WB.mjs +49 -0
- package/dist/button-C1wRfGtT.mjs +230 -0
- package/dist/button-group/index.mjs +5 -0
- package/dist/button-group-C1IB2K5s.mjs +40 -0
- package/dist/calendar/index.mjs +5 -0
- package/dist/calendar-DlIHeWb0.mjs +113 -0
- package/dist/card/index.mjs +4 -0
- package/dist/card-3Kd0VdNf.mjs +63 -0
- package/dist/chart/index.mjs +4 -0
- package/dist/chart-BZqUKpkh.mjs +143 -0
- package/dist/checkbox/index.mjs +4 -0
- package/dist/checkbox-LG1OKTpG.mjs +34 -0
- package/dist/col-lrLMZaTJ.mjs +184 -0
- package/dist/collapsible/index.mjs +3 -0
- package/dist/collapsible-Bt9UYfv3.mjs +9 -0
- package/dist/command/index.mjs +5 -0
- package/dist/command-s0Yv3abE.mjs +86 -0
- package/dist/components/features/date-picker/index.d.ts +3 -0
- package/dist/components/features/date-picker/index.d.ts.map +1 -0
- package/dist/components/features/dropzone/index.d.ts +1 -0
- package/dist/components/features/dropzone/index.d.ts.map +1 -1
- package/dist/components/themes/index.d.ts +1 -1
- package/dist/components/themes/index.d.ts.map +1 -1
- package/dist/components/themes/types.d.ts +0 -2
- package/dist/components/themes/types.d.ts.map +1 -1
- package/dist/date-picker/index.mjs +9 -0
- package/dist/dialog/index.mjs +5 -0
- package/dist/dialog-DXBaT9gA.mjs +86 -0
- package/dist/dialog-bnMMf9GD.mjs +73 -0
- package/dist/dropdown/index.mjs +3 -0
- package/dist/dropdown-DtSa_lqc.mjs +112 -0
- package/dist/dropzone/index.mjs +5 -0
- package/dist/dropzone-BkOnwrS4.mjs +221 -0
- package/dist/empty-content/index.mjs +3 -0
- package/dist/empty-content-BM9rzI13.mjs +196 -0
- package/dist/exports/map.d.ts +3 -0
- package/dist/exports/map.d.ts.map +1 -0
- package/dist/fonts/AllianceNo1-Medium.ttf +0 -0
- package/dist/fonts/AllianceNo1-Regular.ttf +0 -0
- package/dist/fonts/AllianceNo1-SemiBold.ttf +0 -0
- package/dist/form/index.mjs +146 -0
- package/dist/grid/index.mjs +3 -0
- package/dist/hooks/index.mjs +2 -3
- package/dist/hover-card/index.mjs +4 -0
- package/dist/hover-card-CUPfFUqE.mjs +33 -0
- package/dist/icon-wrapper-9ticVbRL.mjs +14 -0
- package/dist/icons/index.mjs +3 -3
- package/dist/index.d.ts +0 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +65 -9
- package/dist/input/index.mjs +5 -0
- package/dist/input-DuyjEKEW.mjs +17 -0
- package/dist/input-fzXBheCN.mjs +17 -0
- package/dist/input-group/index.mjs +7 -0
- package/dist/input-group-CPaFSTEV.mjs +80 -0
- package/dist/input-number/index.mjs +6 -0
- package/dist/input-number-9o62JHRl.mjs +106 -0
- package/dist/input-with-addons/index.mjs +3 -0
- package/dist/input-with-addons-BQn7KCTU.mjs +30 -0
- package/dist/label/index.mjs +4 -0
- package/dist/label-_ste_Re3.mjs +44 -0
- package/dist/link-button-TIF2Zdrk.mjs +36 -0
- package/dist/loader-overlay/index.mjs +3 -0
- package/dist/loader-overlay-DUaQSZQP.mjs +17 -0
- package/dist/map/index.mjs +13 -0
- package/dist/map-WL6jhkSM.mjs +1094 -0
- package/dist/more-actions/index.mjs +5 -0
- package/dist/more-actions-Ch1f6Mh3.mjs +54 -0
- package/dist/nprogress/index.mjs +32 -0
- package/dist/page-title/index.mjs +3 -0
- package/dist/page-title-BJuo81rT.mjs +26 -0
- package/dist/popover/index.mjs +4 -0
- package/dist/popover-SQlKSz6L.mjs +36 -0
- package/dist/radio-group/index.mjs +4 -0
- package/dist/radio-group-Oshv0b-U.mjs +49 -0
- package/dist/select/index.mjs +4 -0
- package/dist/select-DVlEzD2W.mjs +166 -0
- package/dist/separator/index.mjs +4 -0
- package/dist/separator-T2ppyD-8.mjs +18 -0
- package/dist/sheet/index.mjs +5 -0
- package/dist/sheet-BKiCwtNO.mjs +45 -0
- package/dist/sheet-CtnP6gTD.mjs +77 -0
- package/dist/sidebar/index.mjs +11 -0
- package/dist/sidebar-DfqezV8t.mjs +945 -0
- package/dist/skeleton/index.mjs +4 -0
- package/dist/skeleton-vzbxA-DQ.mjs +13 -0
- package/dist/spinner/index.mjs +4 -0
- package/dist/spinner-BE7k2bAD.mjs +16 -0
- package/dist/{icon-wrapper-BgPkifId.mjs → spinner.icon-Bg8zgGh0.mjs} +1 -12
- package/dist/stepper/index.mjs +5 -0
- package/dist/stepper-SWB-u_nM.mjs +323 -0
- package/dist/{style.css → styles.css} +317 -575
- package/dist/styles.mjs +1 -0
- package/dist/switch/index.mjs +4 -0
- package/dist/switch-Calk7Gyw.mjs +32 -0
- package/dist/table/index.mjs +4 -0
- package/dist/table-CsXBcQLI.mjs +68 -0
- package/dist/tabs/index.mjs +3 -0
- package/dist/tabs-D8n-dqnw.mjs +52 -0
- package/dist/tag-input/index.mjs +5 -0
- package/dist/tag-input-Di7SDNbK.mjs +284 -0
- package/dist/task-queue/index.mjs +7 -0
- package/dist/task-queue-dropdown-DW72ikDH.mjs +1356 -0
- package/dist/textarea/index.mjs +5 -0
- package/dist/textarea-CxE3YbC7.mjs +17 -0
- package/dist/textarea-QYRcDEpK.mjs +15 -0
- package/dist/theme/index.mjs +3 -0
- package/dist/{theme.provider-DpFLwtHe.mjs → theme.provider-CzCxEFFh.mjs} +63 -1
- package/dist/to-api-format-C2xjQUcI.mjs +1506 -0
- package/dist/toast/index.mjs +3 -0
- package/dist/tooltip/index.mjs +4 -0
- package/dist/tooltip-Dd3ActSS.mjs +74 -0
- package/dist/typography/index.mjs +3 -0
- package/dist/typography-UA7ZZvgJ.mjs +200 -0
- package/dist/use-copy-to-clipboard-ki-WoTml.mjs +31 -0
- package/dist/use-stepper-BaToCYMs.mjs +2017 -0
- package/dist/{use-copy-to-clipboard-BfrpD6G8.mjs → use-toast-mdn_CqRY.mjs} +34 -27
- package/dist/utils/index.mjs +0 -1
- package/dist/utils-Bfgoe-Gm.mjs +20 -0
- package/dist/visually-hidden/index.mjs +3 -0
- package/dist/visuallyhidden-aaTUk4Yo.mjs +7 -0
- package/package.json +223 -24
- package/dist/components/index.mjs +0 -8
- package/dist/datum.provider-D6VMjSV0.mjs +0 -37
- package/dist/providers/datum.provider.d.ts +0 -20
- package/dist/providers/datum.provider.d.ts.map +0 -1
- package/dist/providers/index.d.ts +0 -3
- package/dist/providers/index.d.ts.map +0 -1
- package/dist/providers/index.mjs +0 -4
- package/dist/theme-script-DHyLk25i.mjs +0 -11128
- /package/dist/{close.icon-chkXPAUC.mjs → close.icon-CMNMoXM_.mjs} +0 -0
- /package/dist/{map-leaflet-imports-OKaoesjZ.mjs → map-leaflet-imports-C4JYls8q.mjs} +0 -0
- /package/dist/{use-debounce-BYB-jPeX.mjs → use-debounce-B6wPrZV8.mjs} +0 -0
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
import { t as cn } from "./cn-DWCc1QRE.mjs";
|
|
2
|
+
import { cva } from "class-variance-authority";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
|
|
6
|
+
//#region src/components/base/badge/badge.tsx
|
|
7
|
+
/**
|
|
8
|
+
* Datum Badge Component
|
|
9
|
+
* Similar to Button component but with badge-specific styling
|
|
10
|
+
* Supports types: primary, secondary, tertiary, quaternary, warning, danger, success
|
|
11
|
+
* Supports themes: solid, outline, light
|
|
12
|
+
*/
|
|
13
|
+
const badgeVariants = cva("inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-all focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2", {
|
|
14
|
+
variants: {
|
|
15
|
+
type: {
|
|
16
|
+
primary: "",
|
|
17
|
+
secondary: "",
|
|
18
|
+
tertiary: "",
|
|
19
|
+
quaternary: "",
|
|
20
|
+
info: "",
|
|
21
|
+
warning: "",
|
|
22
|
+
danger: "",
|
|
23
|
+
success: "",
|
|
24
|
+
muted: ""
|
|
25
|
+
},
|
|
26
|
+
theme: {
|
|
27
|
+
solid: "",
|
|
28
|
+
outline: "border",
|
|
29
|
+
light: "border"
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
compoundVariants: [
|
|
33
|
+
{
|
|
34
|
+
type: "primary",
|
|
35
|
+
theme: "solid",
|
|
36
|
+
className: "border-transparent bg-[var(--color-badge-primary)] text-[var(--color-badge-primary-foreground)]"
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
type: "primary",
|
|
40
|
+
theme: "outline",
|
|
41
|
+
className: "border-[var(--color-badge-primary)] text-[var(--color-badge-primary)] dark:border-[var(--color-badge-primary)] dark:text-[var(--color-badge-primary)]"
|
|
42
|
+
},
|
|
43
|
+
{
|
|
44
|
+
type: "primary",
|
|
45
|
+
theme: "light",
|
|
46
|
+
className: "border-[var(--color-badge-primary)]/30 text-[var(--color-badge-primary)] bg-[var(--color-badge-primary)]/10 dark:border-[var(--color-badge-primary)] dark:text-[var(--color-badge-primary)] dark:bg-[var(--color-badge-primary)]/20"
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
type: "secondary",
|
|
50
|
+
theme: "solid",
|
|
51
|
+
className: "border-transparent bg-[var(--color-badge-secondary)] text-[var(--color-badge-secondary-foreground)]"
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
type: "secondary",
|
|
55
|
+
theme: "outline",
|
|
56
|
+
className: "border-[var(--color-badge-secondary)] text-[var(--color-badge-secondary)] dark:border-[var(--color-badge-secondary)] dark:text-[var(--color-badge-secondary)]"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
type: "secondary",
|
|
60
|
+
theme: "light",
|
|
61
|
+
className: "border-[var(--color-badge-secondary)] text-[var(--color-badge-secondary)] bg-[var(--color-badge-secondary)]/20 dark:border-[var(--color-badge-secondary)] dark:text-[var(--color-badge-secondary)] dark:bg-[var(--color-badge-secondary)]/20"
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
type: "tertiary",
|
|
65
|
+
theme: "solid",
|
|
66
|
+
className: "border-transparent bg-[var(--color-badge-tertiary)] text-[var(--color-badge-tertiary-foreground)]"
|
|
67
|
+
},
|
|
68
|
+
{
|
|
69
|
+
type: "tertiary",
|
|
70
|
+
theme: "outline",
|
|
71
|
+
className: "border-[var(--color-badge-tertiary)] text-[var(--color-badge-tertiary)] dark:border-[var(--color-badge-tertiary)] dark:text-[var(--color-badge-tertiary)]"
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
type: "tertiary",
|
|
75
|
+
theme: "light",
|
|
76
|
+
className: "border-[var(--color-badge-tertiary)] text-[var(--color-badge-tertiary)] bg-[var(--color-badge-tertiary)]/20 dark:border-[var(--color-badge-tertiary)] dark:text-[var(--color-badge-tertiary)] dark:bg-[var(--color-badge-tertiary)]/20"
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
type: "quaternary",
|
|
80
|
+
theme: "solid",
|
|
81
|
+
className: "border-transparent bg-[var(--color-badge-quaternary)] text-[var(--color-badge-quaternary-foreground)]"
|
|
82
|
+
},
|
|
83
|
+
{
|
|
84
|
+
type: "quaternary",
|
|
85
|
+
theme: "outline",
|
|
86
|
+
className: "border-[var(--color-badge-quaternary)] text-[var(--color-badge-quaternary-foreground)] dark:border-[var(--color-badge-quaternary)] dark:text-[var(--color-badge-quaternary-foreground)]"
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
type: "quaternary",
|
|
90
|
+
theme: "light",
|
|
91
|
+
className: "border-[var(--color-badge-quaternary)] text-[var(--color-badge-quaternary-foreground)] bg-[var(--color-badge-quaternary)]/20 dark:border-[var(--color-badge-quaternary)] dark:text-[var(--color-badge-quaternary-foreground)] dark:bg-[var(--color-badge-quaternary)]/20"
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
type: "info",
|
|
95
|
+
theme: "solid",
|
|
96
|
+
className: "border-transparent bg-[var(--color-badge-info)] text-[var(--color-badge-info-foreground)]"
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
type: "info",
|
|
100
|
+
theme: "outline",
|
|
101
|
+
className: "border-[var(--color-badge-info)] text-[var(--color-badge-info)] dark:border-[var(--color-badge-info)] dark:text-[var(--color-badge-info)]"
|
|
102
|
+
},
|
|
103
|
+
{
|
|
104
|
+
type: "info",
|
|
105
|
+
theme: "light",
|
|
106
|
+
className: "border-[var(--color-badge-info)] text-[var(--color-badge-info)] bg-[var(--color-badge-info)]/20 dark:border-[var(--color-badge-info)] dark:text-[var(--color-badge-info)] dark:bg-[var(--color-badge-info)]/20"
|
|
107
|
+
},
|
|
108
|
+
{
|
|
109
|
+
type: "warning",
|
|
110
|
+
theme: "solid",
|
|
111
|
+
className: "border-transparent bg-[var(--color-badge-warning)] text-[var(--color-badge-warning-foreground)]"
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
type: "warning",
|
|
115
|
+
theme: "outline",
|
|
116
|
+
className: "border-[var(--color-badge-warning)] text-[var(--color-badge-warning)] dark:border-[var(--color-badge-warning)] dark:text-[var(--color-badge-warning)]"
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
type: "warning",
|
|
120
|
+
theme: "light",
|
|
121
|
+
className: "border-[var(--color-badge-warning)] text-[var(--color-badge-warning)] bg-[var(--color-badge-warning)]/20 dark:border-[var(--color-badge-warning)] dark:text-[var(--color-badge-warning)] dark:bg-[var(--color-badge-warning)]/20"
|
|
122
|
+
},
|
|
123
|
+
{
|
|
124
|
+
type: "danger",
|
|
125
|
+
theme: "solid",
|
|
126
|
+
className: "border-transparent bg-[var(--color-badge-danger)] text-[var(--color-badge-danger-foreground)]"
|
|
127
|
+
},
|
|
128
|
+
{
|
|
129
|
+
type: "danger",
|
|
130
|
+
theme: "outline",
|
|
131
|
+
className: "border-[var(--color-badge-danger)] text-[var(--color-badge-danger)] dark:border-[var(--color-badge-danger)] dark:text-[var(--color-badge-danger)]"
|
|
132
|
+
},
|
|
133
|
+
{
|
|
134
|
+
type: "danger",
|
|
135
|
+
theme: "light",
|
|
136
|
+
className: "border-[var(--color-badge-danger)] text-[var(--color-badge-danger)] bg-[var(--color-badge-danger)]/20 dark:border-[var(--color-badge-danger)] dark:text-[var(--color-badge-danger)] dark:bg-[var(--color-badge-danger)]/20"
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
type: "success",
|
|
140
|
+
theme: "solid",
|
|
141
|
+
className: "border-transparent bg-[var(--color-badge-success)] text-[var(--color-badge-success-foreground)]"
|
|
142
|
+
},
|
|
143
|
+
{
|
|
144
|
+
type: "success",
|
|
145
|
+
theme: "outline",
|
|
146
|
+
className: "border-[var(--color-badge-success)] text-[var(--color-badge-success)] dark:border-[var(--color-badge-success)] dark:text-[var(--color-badge-success)]"
|
|
147
|
+
},
|
|
148
|
+
{
|
|
149
|
+
type: "success",
|
|
150
|
+
theme: "light",
|
|
151
|
+
className: "border-[var(--color-badge-success)] text-[var(--color-badge-success)] bg-[var(--color-badge-success)]/20 dark:border-[var(--color-badge-success)] dark:text-[var(--color-badge-success)] dark:bg-[var(--color-badge-success)]/20"
|
|
152
|
+
},
|
|
153
|
+
{
|
|
154
|
+
type: "muted",
|
|
155
|
+
theme: "solid",
|
|
156
|
+
className: "border-transparent text-[var(--color-badge-muted-foreground)] bg-[var(--color-badge-muted)] dark:border-[var(--color-badge-muted)]/20 dark:text-[var(--color-badge-muted)] dark:bg-[var(--color-badge-muted)]/20"
|
|
157
|
+
},
|
|
158
|
+
{
|
|
159
|
+
type: "muted",
|
|
160
|
+
theme: "outline",
|
|
161
|
+
className: "border-[var(--color-badge-muted)] text-[var(--color-badge-muted)] dark:border-[var(--color-badge-muted)] dark:text-[var(--color-badge-muted)]"
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
type: "muted",
|
|
165
|
+
theme: "light",
|
|
166
|
+
className: "border-[var(--color-badge-muted)] text-[var(--color-badge-muted)] bg-[var(--color-badge-muted)]/20 dark:border-[var(--color-badge-muted)] dark:text-[var(--color-badge-muted)] dark:bg-[var(--color-badge-muted)]/20"
|
|
167
|
+
}
|
|
168
|
+
],
|
|
169
|
+
defaultVariants: {
|
|
170
|
+
type: "muted",
|
|
171
|
+
theme: "solid"
|
|
172
|
+
}
|
|
173
|
+
});
|
|
174
|
+
function Badge({ className, type, theme, ...props }) {
|
|
175
|
+
return /* @__PURE__ */ jsx("div", {
|
|
176
|
+
className: cn(badgeVariants({
|
|
177
|
+
type,
|
|
178
|
+
theme
|
|
179
|
+
}), className),
|
|
180
|
+
...props
|
|
181
|
+
});
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
//#endregion
|
|
185
|
+
export { badgeVariants as n, Badge as t };
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import "../utils-Bfgoe-Gm.mjs";
|
|
2
|
+
import { a as BreadcrumbList, i as BreadcrumbLink, n as BreadcrumbEllipsis, o as BreadcrumbPage, r as BreadcrumbItem, s as BreadcrumbSeparator, t as Breadcrumb } from "../breadcrumb-BGYJgom_.mjs";
|
|
3
|
+
|
|
4
|
+
export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { t as cn } from "./utils-Bfgoe-Gm.mjs";
|
|
2
|
+
import { ChevronRight, MoreHorizontal } from "lucide-react";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
6
|
+
|
|
7
|
+
//#region ../shadcn/ui/breadcrumb.tsx
|
|
8
|
+
const Breadcrumb = ({ ...props }) => {
|
|
9
|
+
return /* @__PURE__ */ jsx("nav", {
|
|
10
|
+
"aria-label": "breadcrumb",
|
|
11
|
+
"data-slot": "breadcrumb",
|
|
12
|
+
...props
|
|
13
|
+
});
|
|
14
|
+
};
|
|
15
|
+
const BreadcrumbList = ({ className, ...props }) => {
|
|
16
|
+
return /* @__PURE__ */ jsx("ol", {
|
|
17
|
+
"data-slot": "breadcrumb-list",
|
|
18
|
+
className: cn("text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5", className),
|
|
19
|
+
...props
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
const BreadcrumbItem = ({ className, ...props }) => {
|
|
23
|
+
return /* @__PURE__ */ jsx("li", {
|
|
24
|
+
"data-slot": "breadcrumb-item",
|
|
25
|
+
className: cn("inline-flex items-center gap-1.5", className),
|
|
26
|
+
...props
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
const BreadcrumbLink = ({ asChild, className, ...props }) => {
|
|
30
|
+
return /* @__PURE__ */ jsx(asChild ? Slot : "a", {
|
|
31
|
+
"data-slot": "breadcrumb-link",
|
|
32
|
+
className: cn("hover:text-foreground transition-colors", className),
|
|
33
|
+
...props
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
const BreadcrumbPage = ({ className, ...props }) => {
|
|
37
|
+
return /* @__PURE__ */ jsx("span", {
|
|
38
|
+
"data-slot": "breadcrumb-page",
|
|
39
|
+
role: "link",
|
|
40
|
+
"aria-disabled": "true",
|
|
41
|
+
"aria-current": "page",
|
|
42
|
+
className: cn("text-foreground font-normal", className),
|
|
43
|
+
...props
|
|
44
|
+
});
|
|
45
|
+
};
|
|
46
|
+
const BreadcrumbSeparator = ({ children, className, ...props }) => {
|
|
47
|
+
return /* @__PURE__ */ jsx("li", {
|
|
48
|
+
"data-slot": "breadcrumb-separator",
|
|
49
|
+
role: "presentation",
|
|
50
|
+
"aria-hidden": "true",
|
|
51
|
+
className: cn("[&>svg]:size-3.5", className),
|
|
52
|
+
...props,
|
|
53
|
+
children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
const BreadcrumbEllipsis = ({ className, ...props }) => {
|
|
57
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
58
|
+
"data-slot": "breadcrumb-ellipsis",
|
|
59
|
+
role: "presentation",
|
|
60
|
+
"aria-hidden": "true",
|
|
61
|
+
className: cn("flex size-9 items-center justify-center", className),
|
|
62
|
+
...props,
|
|
63
|
+
children: [/* @__PURE__ */ jsx(MoreHorizontal, { className: "size-4" }), /* @__PURE__ */ jsx("span", {
|
|
64
|
+
className: "sr-only",
|
|
65
|
+
children: "More"
|
|
66
|
+
})]
|
|
67
|
+
});
|
|
68
|
+
};
|
|
69
|
+
|
|
70
|
+
//#endregion
|
|
71
|
+
export { BreadcrumbList as a, BreadcrumbLink as i, BreadcrumbEllipsis as n, BreadcrumbPage as o, BreadcrumbItem as r, BreadcrumbSeparator as s, Breadcrumb as t };
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { t as cn } from "./utils-Bfgoe-Gm.mjs";
|
|
2
|
+
import { cva } from "class-variance-authority";
|
|
3
|
+
import * as React$1 from "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
6
|
+
|
|
7
|
+
//#region ../shadcn/ui/button.tsx
|
|
8
|
+
/**
|
|
9
|
+
* Vanilla shadcn/ui Button Component
|
|
10
|
+
* Pure shadcn button without Datum customizations
|
|
11
|
+
* For Datum-specific features (dashed variant, isLoading), import from @/modules/datum-ui
|
|
12
|
+
*/
|
|
13
|
+
const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", {
|
|
14
|
+
variants: {
|
|
15
|
+
variant: {
|
|
16
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
17
|
+
destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
|
|
18
|
+
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
|
|
19
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
20
|
+
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
21
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
22
|
+
},
|
|
23
|
+
size: {
|
|
24
|
+
default: "h-10 px-4 py-2",
|
|
25
|
+
sm: "h-9 rounded-md px-3",
|
|
26
|
+
lg: "h-11 rounded-md px-8",
|
|
27
|
+
icon: "h-10 w-10"
|
|
28
|
+
}
|
|
29
|
+
},
|
|
30
|
+
defaultVariants: {
|
|
31
|
+
variant: "default",
|
|
32
|
+
size: "default"
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
const Button = React$1.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
36
|
+
return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
|
|
37
|
+
className: cn(buttonVariants({
|
|
38
|
+
variant,
|
|
39
|
+
size,
|
|
40
|
+
className
|
|
41
|
+
})),
|
|
42
|
+
ref,
|
|
43
|
+
...props
|
|
44
|
+
});
|
|
45
|
+
});
|
|
46
|
+
Button.displayName = "Button";
|
|
47
|
+
|
|
48
|
+
//#endregion
|
|
49
|
+
export { buttonVariants as n, Button as t };
|
|
@@ -0,0 +1,230 @@
|
|
|
1
|
+
import { t as cn } from "./cn-DWCc1QRE.mjs";
|
|
2
|
+
import { t as SpinnerIcon } from "./spinner.icon-Bg8zgGh0.mjs";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
import "react";
|
|
5
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
|
|
7
|
+
//#region src/components/base/button/button.tsx
|
|
8
|
+
const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lg text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50", {
|
|
9
|
+
variants: {
|
|
10
|
+
type: {
|
|
11
|
+
primary: "",
|
|
12
|
+
secondary: "",
|
|
13
|
+
tertiary: "",
|
|
14
|
+
quaternary: "",
|
|
15
|
+
warning: "",
|
|
16
|
+
danger: "",
|
|
17
|
+
success: ""
|
|
18
|
+
},
|
|
19
|
+
theme: {
|
|
20
|
+
solid: "",
|
|
21
|
+
light: "",
|
|
22
|
+
outline: "border",
|
|
23
|
+
borderless: "border-0 bg-transparent",
|
|
24
|
+
link: "text-primary underline-offset-2 underline hover:opacity-80"
|
|
25
|
+
},
|
|
26
|
+
size: {
|
|
27
|
+
xs: "h-7 px-2.5 text-xs",
|
|
28
|
+
small: "h-9 px-3 text-xs",
|
|
29
|
+
default: "h-9 px-4 py-2",
|
|
30
|
+
large: "h-11 px-8 text-base",
|
|
31
|
+
icon: "h-9 w-9",
|
|
32
|
+
link: "px-0 py-0"
|
|
33
|
+
},
|
|
34
|
+
block: {
|
|
35
|
+
true: "w-full",
|
|
36
|
+
false: ""
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
compoundVariants: [
|
|
40
|
+
{
|
|
41
|
+
type: "primary",
|
|
42
|
+
theme: "solid",
|
|
43
|
+
className: "bg-btn-primary border border-btn-primary-border text-btn-primary-foreground hover:bg-btn-primary-hover active:bg-btn-primary-active disabled:bg-btn-primary/60"
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
type: "primary",
|
|
47
|
+
theme: "light",
|
|
48
|
+
className: cn("bg-btn-neutral-bg text-primary hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-primary", "dark:text-foreground")
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
type: "primary",
|
|
52
|
+
theme: "outline",
|
|
53
|
+
className: cn("border border-btn-primary-border/60 text-primary hover:border-btn-primary-border active:border-btn-primary-border disabled:bg-transparent disabled:text-primary disabled:border-btn-primary-border/60", "dark:text-foreground dark:border-foreground/60 dark:hover:border-foreground dark:active:border-foreground/80")
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
type: "primary",
|
|
57
|
+
theme: "borderless",
|
|
58
|
+
className: cn("text-primary hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-primary", "dark:text-foreground")
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
type: "secondary",
|
|
62
|
+
theme: "solid",
|
|
63
|
+
className: "bg-btn-secondary border border-btn-secondary-border text-btn-secondary-foreground hover:bg-btn-secondary-hover active:bg-btn-secondary-active disabled:bg-btn-secondary/60"
|
|
64
|
+
},
|
|
65
|
+
{
|
|
66
|
+
type: "secondary",
|
|
67
|
+
theme: "light",
|
|
68
|
+
className: cn("bg-btn-neutral-bg text-secondary hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-secondary", "dark:text-foreground")
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
type: "secondary",
|
|
72
|
+
theme: "outline",
|
|
73
|
+
className: cn("border border-btn-secondary-border/60 text-secondary hover:border-btn-secondary-border active:border-btn-secondary-border disabled:bg-transparent disabled:text-secondary disabled:border-btn-secondary-border/60", "dark:text-foreground dark:border-foreground/60 dark:hover:border-foreground dark:active:border-foreground/80")
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
type: "secondary",
|
|
77
|
+
theme: "borderless",
|
|
78
|
+
className: cn("text-secondary hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-secondary", "dark:text-foreground")
|
|
79
|
+
},
|
|
80
|
+
{
|
|
81
|
+
type: "tertiary",
|
|
82
|
+
theme: "solid",
|
|
83
|
+
className: "bg-btn-tertiary border border-btn-tertiary-border text-btn-tertiary-foreground hover:bg-btn-tertiary-hover active:bg-btn-tertiary-active disabled:bg-btn-tertiary/60"
|
|
84
|
+
},
|
|
85
|
+
{
|
|
86
|
+
type: "tertiary",
|
|
87
|
+
theme: "light",
|
|
88
|
+
className: cn("bg-btn-neutral-bg text-tertiary hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-tertiary", "dark:text-foreground")
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
type: "tertiary",
|
|
92
|
+
theme: "outline",
|
|
93
|
+
className: cn("border border-btn-tertiary-border/60 text-tertiary hover:border-btn-tertiary-border active:border-btn-tertiary-border disabled:bg-transparent disabled:text-tertiary disabled:border-btn-tertiary-border/60", "dark:text-foreground dark:border-foreground/60 dark:hover:border-foreground dark:active:border-foreground/80")
|
|
94
|
+
},
|
|
95
|
+
{
|
|
96
|
+
type: "tertiary",
|
|
97
|
+
theme: "borderless",
|
|
98
|
+
className: cn("text-tertiary hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-tertiary", "dark:text-foreground")
|
|
99
|
+
},
|
|
100
|
+
{
|
|
101
|
+
type: "quaternary",
|
|
102
|
+
theme: "solid",
|
|
103
|
+
className: "bg-btn-quaternary border border-btn-quaternary text-btn-quaternary-foreground hover:bg-btn-quaternary-hover active:bg-btn-quaternary-active disabled:bg-btn-quaternary/60"
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
type: "quaternary",
|
|
107
|
+
theme: "light",
|
|
108
|
+
className: cn("bg-btn-neutral-bg text-btn-quaternary-foreground hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-btn-quaternary-foreground", "dark:text-foreground")
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
type: "quaternary",
|
|
112
|
+
theme: "outline",
|
|
113
|
+
className: cn("border border-btn-quaternary-border/60 text-btn-quaternary-foreground hover:border-btn-quaternary-border active:border-btn-quaternary-border disabled:bg-transparent disabled:text-btn-quaternary-foreground disabled:border-btn-quaternary-border/60", "dark:text-foreground dark:border-foreground/60 dark:hover:border-foreground dark:active:border-foreground/80")
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
type: "quaternary",
|
|
117
|
+
theme: "borderless",
|
|
118
|
+
className: cn("text-btn-quaternary-foreground hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-btn-quaternary-foreground", "dark:text-foreground")
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
type: "warning",
|
|
122
|
+
theme: "solid",
|
|
123
|
+
className: "bg-btn-warning text-btn-warning-foreground border border-btn-warning-border hover:bg-btn-warning-hover active:bg-btn-warning-active disabled:bg-btn-warning/60"
|
|
124
|
+
},
|
|
125
|
+
{
|
|
126
|
+
type: "warning",
|
|
127
|
+
theme: "light",
|
|
128
|
+
className: "bg-btn-neutral-bg text-btn-warning hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-btn-warning"
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
type: "warning",
|
|
132
|
+
theme: "outline",
|
|
133
|
+
className: "border-yellow-600 text-yellow-600 hover:bg-yellow-600 hover:text-white active:bg-yellow-700 active:text-white dark:border-yellow-500 dark:text-yellow-500 dark:hover:bg-yellow-500 dark:hover:text-white dark:active:bg-yellow-600 dark:active:text-white disabled:bg-transparent disabled:text-yellow-600 disabled:border-yellow-600 disabled:hover:bg-transparent disabled:hover:text-yellow-600"
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
type: "warning",
|
|
137
|
+
theme: "borderless",
|
|
138
|
+
className: "text-btn-warning hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-btn-warning"
|
|
139
|
+
},
|
|
140
|
+
{
|
|
141
|
+
type: "danger",
|
|
142
|
+
theme: "solid",
|
|
143
|
+
className: "bg-btn-danger text-btn-danger-foreground border border-btn-danger-border hover:bg-btn-danger-hover active:bg-btn-danger-active disabled:bg-btn-danger/60"
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
type: "danger",
|
|
147
|
+
theme: "light",
|
|
148
|
+
className: "bg-btn-neutral-bg text-btn-danger hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-btn-danger"
|
|
149
|
+
},
|
|
150
|
+
{
|
|
151
|
+
type: "danger",
|
|
152
|
+
theme: "outline",
|
|
153
|
+
className: "border-destructive text-destructive hover:bg-destructive hover:text-destructive-foreground active:bg-destructive/90 active:text-destructive-foreground disabled:bg-transparent disabled:text-destructive disabled:border-destructive disabled:hover:bg-transparent disabled:hover:text-destructive"
|
|
154
|
+
},
|
|
155
|
+
{
|
|
156
|
+
type: "danger",
|
|
157
|
+
theme: "borderless",
|
|
158
|
+
className: "text-btn-danger hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-btn-danger"
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
type: "success",
|
|
162
|
+
theme: "solid",
|
|
163
|
+
className: "bg-btn-success text-btn-success-foreground border border-btn-success-border hover:bg-btn-success-hover active:bg-btn-success-active disabled:bg-btn-success/60"
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
type: "success",
|
|
167
|
+
theme: "light",
|
|
168
|
+
className: "bg-btn-neutral-bg text-btn-success hover:bg-btn-neutral-bg-hover active:bg-btn-neutral-bg-active disabled:bg-btn-neutral-bg disabled:text-btn-success"
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
type: "success",
|
|
172
|
+
theme: "outline",
|
|
173
|
+
className: "border-green-600 text-green-600 hover:bg-green-600 hover:text-white active:bg-green-700 active:text-white dark:border-green-500 dark:text-green-500 dark:hover:bg-green-500 dark:hover:text-white dark:active:bg-green-600 dark:active:text-white disabled:bg-transparent disabled:text-green-600 disabled:border-green-600 disabled:hover:bg-transparent disabled:hover:text-green-600"
|
|
174
|
+
},
|
|
175
|
+
{
|
|
176
|
+
type: "success",
|
|
177
|
+
theme: "borderless",
|
|
178
|
+
className: "text-btn-success hover:bg-btn-neutral-bg active:bg-btn-neutral-bg-active disabled:bg-transparent disabled:text-btn-success"
|
|
179
|
+
}
|
|
180
|
+
],
|
|
181
|
+
defaultVariants: {
|
|
182
|
+
type: "primary",
|
|
183
|
+
theme: "solid",
|
|
184
|
+
size: "default",
|
|
185
|
+
block: false
|
|
186
|
+
}
|
|
187
|
+
});
|
|
188
|
+
function Button({ ref, className, type, theme, size, block, loading = false, disabled, icon, iconPosition = "left", loadingIcon, htmlType = "button", children, ...props }) {
|
|
189
|
+
const isDisabled = disabled || loading;
|
|
190
|
+
const isIconOnly = (icon || loading) && !children;
|
|
191
|
+
const showIcon = !loading && icon;
|
|
192
|
+
const getLoadingIcon = () => {
|
|
193
|
+
return loadingIcon || /* @__PURE__ */ jsx(SpinnerIcon, {
|
|
194
|
+
size: size === "small" ? "xs" : size === "large" ? "sm" : "md",
|
|
195
|
+
"aria-hidden": "true"
|
|
196
|
+
});
|
|
197
|
+
};
|
|
198
|
+
const showLoadingIcon = loading && (isIconOnly ? getLoadingIcon() : /* @__PURE__ */ jsx(SpinnerIcon, {
|
|
199
|
+
size: "sm",
|
|
200
|
+
"aria-hidden": "true"
|
|
201
|
+
}));
|
|
202
|
+
const getIconOnlyClass = () => {
|
|
203
|
+
if (!isIconOnly || size === "icon") return "";
|
|
204
|
+
if (size === "small") return "w-8 px-0";
|
|
205
|
+
if (size === "large") return "w-11 px-0";
|
|
206
|
+
return "w-9 px-0";
|
|
207
|
+
};
|
|
208
|
+
return /* @__PURE__ */ jsx("button", {
|
|
209
|
+
className: cn(buttonVariants({
|
|
210
|
+
type,
|
|
211
|
+
theme,
|
|
212
|
+
size,
|
|
213
|
+
block
|
|
214
|
+
}), getIconOnlyClass(), className),
|
|
215
|
+
ref,
|
|
216
|
+
disabled: isDisabled,
|
|
217
|
+
type: htmlType,
|
|
218
|
+
...props,
|
|
219
|
+
children: isIconOnly ? loading ? showLoadingIcon : showIcon && icon : /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
220
|
+
showLoadingIcon && showLoadingIcon,
|
|
221
|
+
showIcon && iconPosition === "left" && icon,
|
|
222
|
+
children,
|
|
223
|
+
showIcon && iconPosition === "right" && icon
|
|
224
|
+
] })
|
|
225
|
+
});
|
|
226
|
+
}
|
|
227
|
+
Button.displayName = "Button";
|
|
228
|
+
|
|
229
|
+
//#endregion
|
|
230
|
+
export { buttonVariants as n, Button as t };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import "../utils-Bfgoe-Gm.mjs";
|
|
2
|
+
import "../separator-T2ppyD-8.mjs";
|
|
3
|
+
import { i as buttonGroupVariants, n as ButtonGroupSeparator, r as ButtonGroupText, t as ButtonGroup } from "../button-group-C1IB2K5s.mjs";
|
|
4
|
+
|
|
5
|
+
export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { t as cn } from "./utils-Bfgoe-Gm.mjs";
|
|
2
|
+
import { t as Separator } from "./separator-T2ppyD-8.mjs";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
6
|
+
|
|
7
|
+
//#region ../shadcn/ui/button-group.tsx
|
|
8
|
+
const buttonGroupVariants = cva("flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2 [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
|
|
9
|
+
variants: { orientation: {
|
|
10
|
+
horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
|
|
11
|
+
vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
|
|
12
|
+
} },
|
|
13
|
+
defaultVariants: { orientation: "horizontal" }
|
|
14
|
+
});
|
|
15
|
+
function ButtonGroup({ className, orientation, ...props }) {
|
|
16
|
+
return /* @__PURE__ */ jsx("div", {
|
|
17
|
+
role: "group",
|
|
18
|
+
"data-slot": "button-group",
|
|
19
|
+
"data-orientation": orientation,
|
|
20
|
+
className: cn(buttonGroupVariants({ orientation }), className),
|
|
21
|
+
...props
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
function ButtonGroupText({ className, asChild = false, ...props }) {
|
|
25
|
+
return /* @__PURE__ */ jsx(asChild ? Slot : "div", {
|
|
26
|
+
className: cn("bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
|
|
27
|
+
...props
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
function ButtonGroupSeparator({ className, orientation = "vertical", ...props }) {
|
|
31
|
+
return /* @__PURE__ */ jsx(Separator, {
|
|
32
|
+
"data-slot": "button-group-separator",
|
|
33
|
+
orientation,
|
|
34
|
+
className: cn("bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto", className),
|
|
35
|
+
...props
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
//#endregion
|
|
40
|
+
export { buttonGroupVariants as i, ButtonGroupSeparator as n, ButtonGroupText as r, ButtonGroup as t };
|