@boostdev/design-system-components 1.2.1 → 1.2.3
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/AGENTS.md +26 -0
- package/README.md +36 -19
- package/dist/client.cjs +141 -120
- package/dist/client.css +506 -503
- package/dist/client.d.cts +71 -96
- package/dist/client.d.ts +71 -96
- package/dist/client.js +141 -120
- package/dist/index.cjs +141 -120
- package/dist/index.css +506 -503
- package/dist/index.d.cts +71 -96
- package/dist/index.d.ts +71 -96
- package/dist/index.js +141 -120
- package/package.json +3 -3
- package/src/components/interaction/Button/Button.module.css +1 -4
- package/src/components/interaction/Command/Command.tsx +4 -3
- package/src/components/interaction/Dialog/Dialog.module.css +1 -1
- package/src/components/interaction/Dialog/Dialog.tsx +4 -5
- package/src/components/interaction/Drawer/Drawer.module.css +1 -1
- package/src/components/interaction/Drawer/Drawer.spec.tsx +3 -3
- package/src/components/interaction/Drawer/Drawer.tsx +4 -7
- package/src/components/interaction/DropdownMenu/DropdownMenu.module.css +4 -0
- package/src/components/interaction/DropdownMenu/DropdownMenu.stories.tsx +4 -4
- package/src/components/interaction/DropdownMenu/DropdownMenu.tsx +4 -2
- package/src/components/interaction/Popover/Popover.tsx +4 -3
- package/src/components/interaction/Rating/Rating.tsx +4 -2
- package/src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx +4 -6
- package/src/components/interaction/form/Combobox/Combobox.module.css +1 -1
- package/src/components/interaction/form/Combobox/Combobox.tsx +4 -2
- package/src/components/interaction/form/FileInput/FileInput.tsx +4 -3
- package/src/components/interaction/form/FormInput/FormInput.module.css +1 -1
- package/src/components/interaction/form/NumberInput/NumberInput.module.css +1 -1
- package/src/components/interaction/form/NumberInput/NumberInput.tsx +4 -3
- package/src/components/interaction/form/RadioGroup/RadioGroup.tsx +4 -6
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.module.css +5 -5
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.tsx +4 -6
- package/src/components/interaction/form/Select/Select.module.css +1 -1
- package/src/components/interaction/form/Slider/Slider.module.css +4 -4
- package/src/components/interaction/form/Switch/Switch.module.css +3 -3
- package/src/components/interaction/form/atoms/InputContainer.tsx +2 -2
- package/src/components/layout/ButtonGroup/ButtonGroup.tsx +4 -6
- package/src/components/layout/Card/Card.tsx +4 -10
- package/src/components/layout/IconWrapper/IconWrapper.module.css +1 -1
- package/src/components/layout/IconWrapper/IconWrapper.tsx +4 -5
- package/src/components/layout/SectionHeader/SectionHeader.tsx +5 -4
- package/src/components/ui/Accordion/Accordion.tsx +4 -3
- package/src/components/ui/Alert/Alert.module.css +1 -1
- package/src/components/ui/Alert/Alert.tsx +4 -3
- package/src/components/ui/Avatar/Avatar.module.css +1 -1
- package/src/components/ui/Avatar/Avatar.tsx +5 -3
- package/src/components/ui/Badge/Badge.module.css +1 -1
- package/src/components/ui/Badge/Badge.tsx +4 -5
- package/src/components/ui/Breadcrumb/Breadcrumb.tsx +4 -3
- package/src/components/ui/Calendar/Calendar.module.css +2 -2
- package/src/components/ui/Calendar/Calendar.tsx +4 -4
- package/src/components/ui/Carousel/Carousel.module.css +1 -1
- package/src/components/ui/Carousel/Carousel.tsx +4 -4
- package/src/components/ui/DescriptionList/DescriptionList.tsx +4 -4
- package/src/components/ui/Loading/Loading.module.css +1 -1
- package/src/components/ui/Loading/Loading.tsx +4 -3
- package/src/components/ui/NotificationBanner/NotificationBanner.module.css +1 -1
- package/src/components/ui/NotificationBanner/NotificationBanner.tsx +4 -2
- package/src/components/ui/Pagination/Pagination.module.css +5 -1
- package/src/components/ui/Pagination/Pagination.tsx +4 -2
- package/src/components/ui/Progress/Progress.module.css +2 -2
- package/src/components/ui/Progress/Progress.tsx +4 -2
- package/src/components/ui/ProgressCircle/ProgressCircle.tsx +4 -1
- package/src/components/ui/Separator/Separator.tsx +5 -3
- package/src/components/ui/Skeleton/Skeleton.tsx +4 -3
- package/src/components/ui/SkipLink/SkipLink.tsx +4 -5
- package/src/components/ui/Tabs/Tabs.tsx +4 -4
- package/src/components/ui/Tooltip/Tooltip.module.css +1 -1
- package/src/components/ui/Tooltip/Tooltip.tsx +4 -2
- package/src/components/ui/Typography/Typography.tsx +4 -5
- package/src/stories/DesignSystem/Grid.mdx +2 -0
package/dist/client.cjs
CHANGED
|
@@ -87,7 +87,7 @@ module.exports = __toCommonJS(client_exports);
|
|
|
87
87
|
var import_react = require("react");
|
|
88
88
|
|
|
89
89
|
// src/components/ui/Accordion/Accordion.module.css
|
|
90
|
-
var Accordion_default = {"accordion":"
|
|
90
|
+
var Accordion_default = {"accordion":"bds123Accordion-accordion","item":"bds123Accordion-item","heading":"bds123Accordion-heading","trigger":"bds123Accordion-trigger","triggerLabel":"bds123Accordion-triggerLabel","chevron":"bds123Accordion-chevron","--open":"bds123Accordion---open","panel":"bds123Accordion-panel","panelContent":"bds123Accordion-panelContent"};
|
|
91
91
|
|
|
92
92
|
// src/components/ui/Accordion/Accordion.tsx
|
|
93
93
|
var import_design_system_foundation = require("@boostdev/design-system-foundation");
|
|
@@ -96,7 +96,8 @@ function Accordion({
|
|
|
96
96
|
items,
|
|
97
97
|
allowMultiple = false,
|
|
98
98
|
defaultOpen = [],
|
|
99
|
-
className
|
|
99
|
+
className,
|
|
100
|
+
...rest
|
|
100
101
|
}) {
|
|
101
102
|
const baseId = (0, import_react.useId)();
|
|
102
103
|
const [openIds, setOpenIds] = (0, import_react.useState)(defaultOpen);
|
|
@@ -107,7 +108,7 @@ function Accordion({
|
|
|
107
108
|
return allowMultiple ? [...prev, id] : [id];
|
|
108
109
|
});
|
|
109
110
|
};
|
|
110
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_design_system_foundation.cn)(Accordion_default.accordion, className), children: items.map((item) => {
|
|
111
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...rest, className: (0, import_design_system_foundation.cn)(Accordion_default.accordion, className), children: items.map((item) => {
|
|
111
112
|
const isOpen = openIds.includes(item.id);
|
|
112
113
|
const triggerId = `${baseId}-trigger-${item.id}`;
|
|
113
114
|
const panelId = `${baseId}-panel-${item.id}`;
|
|
@@ -155,7 +156,7 @@ function Accordion({
|
|
|
155
156
|
}
|
|
156
157
|
|
|
157
158
|
// src/components/ui/Alert/Alert.module.css
|
|
158
|
-
var Alert_default = {"alert":"
|
|
159
|
+
var Alert_default = {"alert":"bds123Alert-alert","--variant_info":"bds123Alert---variant_info","--variant_success":"bds123Alert---variant_success","--variant_warning":"bds123Alert---variant_warning","--variant_error":"bds123Alert---variant_error","icon":"bds123Alert-icon","content":"bds123Alert-content","title":"bds123Alert-title","dismiss":"bds123Alert-dismiss"};
|
|
159
160
|
|
|
160
161
|
// src/components/ui/Alert/Alert.tsx
|
|
161
162
|
var import_design_system_foundation2 = require("@boostdev/design-system-foundation");
|
|
@@ -166,12 +167,14 @@ function Alert({
|
|
|
166
167
|
title,
|
|
167
168
|
children,
|
|
168
169
|
onDismiss,
|
|
169
|
-
className
|
|
170
|
+
className,
|
|
171
|
+
...rest
|
|
170
172
|
}) {
|
|
171
173
|
const isUrgent = variant === "error" || variant === "warning";
|
|
172
174
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
173
175
|
"div",
|
|
174
176
|
{
|
|
177
|
+
...rest,
|
|
175
178
|
role: isUrgent ? "alert" : "status",
|
|
176
179
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
177
180
|
"aria-atomic": "true",
|
|
@@ -198,7 +201,7 @@ function Alert({
|
|
|
198
201
|
}
|
|
199
202
|
|
|
200
203
|
// src/components/ui/Avatar/Avatar.module.css
|
|
201
|
-
var Avatar_default = {"avatar":"
|
|
204
|
+
var Avatar_default = {"avatar":"bds123Avatar-avatar","--fallback":"bds123Avatar---fallback","--size_small":"bds123Avatar---size_small","--size_medium":"bds123Avatar---size_medium","--size_large":"bds123Avatar---size_large","image":"bds123Avatar-image","initials":"bds123Avatar-initials"};
|
|
202
205
|
|
|
203
206
|
// src/components/ui/Avatar/Avatar.tsx
|
|
204
207
|
var import_design_system_foundation3 = require("@boostdev/design-system-foundation");
|
|
@@ -206,15 +209,16 @@ var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
|
206
209
|
function getInitials(name) {
|
|
207
210
|
return name.split(" ").filter(Boolean).slice(0, 2).map((word) => word[0].toUpperCase()).join("");
|
|
208
211
|
}
|
|
209
|
-
function Avatar({ src, alt, name, size = "medium", className }) {
|
|
212
|
+
function Avatar({ src, alt, name, size = "medium", className, ...rest }) {
|
|
210
213
|
const sizeClass = Avatar_default[`--size_${size}`];
|
|
211
214
|
if (src) {
|
|
212
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: (0, import_design_system_foundation3.cn)(Avatar_default.avatar, sizeClass, className), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("img", { src, alt: alt ?? name ?? "User avatar", className: Avatar_default.image }) });
|
|
215
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { ...rest, className: (0, import_design_system_foundation3.cn)(Avatar_default.avatar, sizeClass, className), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("img", { src, alt: alt ?? name ?? "User avatar", className: Avatar_default.image }) });
|
|
213
216
|
}
|
|
214
217
|
const initials = name ? getInitials(name) : "";
|
|
215
218
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
216
219
|
"span",
|
|
217
220
|
{
|
|
221
|
+
...rest,
|
|
218
222
|
role: "img",
|
|
219
223
|
"aria-label": name ?? "User avatar",
|
|
220
224
|
className: (0, import_design_system_foundation3.cn)(Avatar_default.avatar, Avatar_default["--fallback"], sizeClass, className),
|
|
@@ -224,23 +228,23 @@ function Avatar({ src, alt, name, size = "medium", className }) {
|
|
|
224
228
|
}
|
|
225
229
|
|
|
226
230
|
// src/components/ui/Badge/Badge.module.css
|
|
227
|
-
var Badge_default = {"badge":"
|
|
231
|
+
var Badge_default = {"badge":"bds123Badge-badge","--variant_primary":"bds123Badge---variant_primary","--variant_secondary":"bds123Badge---variant_secondary","--variant_success":"bds123Badge---variant_success","--variant_error":"bds123Badge---variant_error","--variant_warning":"bds123Badge---variant_warning"};
|
|
228
232
|
|
|
229
233
|
// src/components/ui/Badge/Badge.tsx
|
|
230
234
|
var import_design_system_foundation4 = require("@boostdev/design-system-foundation");
|
|
231
235
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
232
|
-
function Badge({ children, variant = "primary", className }) {
|
|
233
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: (0, import_design_system_foundation4.cn)(Badge_default.badge, Badge_default[`--variant_${variant}`], className), children });
|
|
236
|
+
function Badge({ children, variant = "primary", className, ...rest }) {
|
|
237
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { ...rest, className: (0, import_design_system_foundation4.cn)(Badge_default.badge, Badge_default[`--variant_${variant}`], className), children });
|
|
234
238
|
}
|
|
235
239
|
|
|
236
240
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
237
|
-
var Breadcrumb_default = {"breadcrumb":"
|
|
241
|
+
var Breadcrumb_default = {"breadcrumb":"bds123Breadcrumb-breadcrumb","list":"bds123Breadcrumb-list","item":"bds123Breadcrumb-item","link":"bds123Breadcrumb-link","separator":"bds123Breadcrumb-separator","current":"bds123Breadcrumb-current"};
|
|
238
242
|
|
|
239
243
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
240
244
|
var import_design_system_foundation5 = require("@boostdev/design-system-foundation");
|
|
241
245
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
242
|
-
function Breadcrumb({ items, className }) {
|
|
243
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("nav", { "aria-label": "Breadcrumb", className: (0, import_design_system_foundation5.cn)(Breadcrumb_default.breadcrumb, className), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("ol", { className: Breadcrumb_default.list, children: items.map((item, index) => {
|
|
246
|
+
function Breadcrumb({ items, className, ...rest }) {
|
|
247
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("nav", { ...rest, "aria-label": "Breadcrumb", className: (0, import_design_system_foundation5.cn)(Breadcrumb_default.breadcrumb, className), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("ol", { className: Breadcrumb_default.list, children: items.map((item, index) => {
|
|
244
248
|
const isLast = index === items.length - 1;
|
|
245
249
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("li", { className: Breadcrumb_default.item, children: isLast ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { "aria-current": "page", className: Breadcrumb_default.current, children: item.label }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
|
|
246
250
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("a", { href: item.href, className: Breadcrumb_default.link, children: item.label }),
|
|
@@ -250,7 +254,7 @@ function Breadcrumb({ items, className }) {
|
|
|
250
254
|
}
|
|
251
255
|
|
|
252
256
|
// src/components/ui/Collapsible/Collapsible.module.css
|
|
253
|
-
var Collapsible_default = {"collapsible":"
|
|
257
|
+
var Collapsible_default = {"collapsible":"bds123Collapsible-collapsible","summary":"bds123Collapsible-summary","summaryContent":"bds123Collapsible-summaryContent","icon":"bds123Collapsible-icon","content":"bds123Collapsible-content"};
|
|
254
258
|
|
|
255
259
|
// src/components/ui/Collapsible/Collapsible.tsx
|
|
256
260
|
var import_design_system_foundation6 = require("@boostdev/design-system-foundation");
|
|
@@ -291,7 +295,7 @@ function Collapsible({
|
|
|
291
295
|
var import_react2 = require("react");
|
|
292
296
|
|
|
293
297
|
// src/components/ui/Calendar/Calendar.module.css
|
|
294
|
-
var Calendar_default = {"calendar":"
|
|
298
|
+
var Calendar_default = {"calendar":"bds123Calendar-calendar","header":"bds123Calendar-header","monthYear":"bds123Calendar-monthYear","navBtn":"bds123Calendar-navBtn","grid":"bds123Calendar-grid","weekday":"bds123Calendar-weekday","empty":"bds123Calendar-empty","day":"bds123Calendar-day","disabled":"bds123Calendar-disabled","selected":"bds123Calendar-selected","today":"bds123Calendar-today"};
|
|
295
299
|
|
|
296
300
|
// src/components/ui/Calendar/Calendar.tsx
|
|
297
301
|
var import_design_system_foundation7 = require("@boostdev/design-system-foundation");
|
|
@@ -337,7 +341,7 @@ function getDaysInMonth(year, month) {
|
|
|
337
341
|
function getFirstDayOfMonth(year, month) {
|
|
338
342
|
return new Date(year, month, 1).getDay();
|
|
339
343
|
}
|
|
340
|
-
function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
344
|
+
function Calendar({ value, defaultValue, min, max, onChange, className, ...rest }) {
|
|
341
345
|
const today = /* @__PURE__ */ new Date();
|
|
342
346
|
const controlled = value !== void 0;
|
|
343
347
|
const [internal, setInternal] = (0, import_react2.useState)(defaultValue);
|
|
@@ -391,7 +395,7 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
391
395
|
...Array.from({ length: daysInMonth }, (_, i) => ({ day: i + 1 }))
|
|
392
396
|
];
|
|
393
397
|
while (cells.length % 7 !== 0) cells.push(null);
|
|
394
|
-
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: (0, import_design_system_foundation7.cn)(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
398
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { ...rest, className: (0, import_design_system_foundation7.cn)(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
395
399
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: Calendar_default.header, children: [
|
|
396
400
|
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
397
401
|
"button",
|
|
@@ -466,12 +470,12 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
466
470
|
var import_react3 = require("react");
|
|
467
471
|
|
|
468
472
|
// src/components/ui/Carousel/Carousel.module.css
|
|
469
|
-
var Carousel_default = {"carousel":"
|
|
473
|
+
var Carousel_default = {"carousel":"bds123Carousel-carousel","track":"bds123Carousel-track","slide":"bds123Carousel-slide","navBtn":"bds123Carousel-navBtn"};
|
|
470
474
|
|
|
471
475
|
// src/components/ui/Carousel/Carousel.tsx
|
|
472
476
|
var import_design_system_foundation8 = require("@boostdev/design-system-foundation");
|
|
473
477
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
474
|
-
function Carousel({ items, label, className }) {
|
|
478
|
+
function Carousel({ items, label, className, ...rest }) {
|
|
475
479
|
const trackRef = (0, import_react3.useRef)(null);
|
|
476
480
|
const listId = (0, import_react3.useId)();
|
|
477
481
|
const scroll = (direction) => {
|
|
@@ -482,7 +486,7 @@ function Carousel({ items, label, className }) {
|
|
|
482
486
|
behavior: "smooth"
|
|
483
487
|
});
|
|
484
488
|
};
|
|
485
|
-
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("section", { "aria-label": label, className: (0, import_design_system_foundation8.cn)(Carousel_default.carousel, className), children: [
|
|
489
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("section", { ...rest, "aria-label": label, className: (0, import_design_system_foundation8.cn)(Carousel_default.carousel, className), children: [
|
|
486
490
|
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
487
491
|
"button",
|
|
488
492
|
{
|
|
@@ -519,20 +523,20 @@ function Carousel({ items, label, className }) {
|
|
|
519
523
|
}
|
|
520
524
|
|
|
521
525
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
522
|
-
var DescriptionList_default = {"list":"
|
|
526
|
+
var DescriptionList_default = {"list":"bds123DescriptionList-list","group":"bds123DescriptionList-group","term":"bds123DescriptionList-term","details":"bds123DescriptionList-details","--layout_inline":"bds123DescriptionList---layout_inline"};
|
|
523
527
|
|
|
524
528
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
525
529
|
var import_design_system_foundation9 = require("@boostdev/design-system-foundation");
|
|
526
530
|
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
527
|
-
function DescriptionList({ items, layout = "stacked", className }) {
|
|
528
|
-
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("dl", { className: (0, import_design_system_foundation9.cn)(DescriptionList_default.list, DescriptionList_default[`--layout_${layout}`], className), children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: DescriptionList_default.group, children: [
|
|
531
|
+
function DescriptionList({ items, layout = "stacked", className, ...rest }) {
|
|
532
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("dl", { ...rest, className: (0, import_design_system_foundation9.cn)(DescriptionList_default.list, DescriptionList_default[`--layout_${layout}`], className), children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: DescriptionList_default.group, children: [
|
|
529
533
|
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("dt", { className: DescriptionList_default.term, children: item.term }),
|
|
530
534
|
Array.isArray(item.details) ? item.details.map((d, j) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("dd", { className: DescriptionList_default.details, children: d }, j)) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("dd", { className: DescriptionList_default.details, children: item.details })
|
|
531
535
|
] }, i)) });
|
|
532
536
|
}
|
|
533
537
|
|
|
534
538
|
// src/components/ui/Link/Link.module.css
|
|
535
|
-
var Link_default = {"link":"
|
|
539
|
+
var Link_default = {"link":"bds123Link-link","--variant_default":"bds123Link---variant_default","--variant_subtle":"bds123Link---variant_subtle","--variant_standalone":"bds123Link---variant_standalone","externalLabel":"bds123Link-externalLabel"};
|
|
536
540
|
|
|
537
541
|
// src/components/ui/Link/Link.tsx
|
|
538
542
|
var import_design_system_foundation10 = require("@boostdev/design-system-foundation");
|
|
@@ -563,17 +567,17 @@ function Link({
|
|
|
563
567
|
}
|
|
564
568
|
|
|
565
569
|
// src/components/ui/Loading/Loading.module.css
|
|
566
|
-
var Loading_default = {"loading":"
|
|
570
|
+
var Loading_default = {"loading":"bds123Loading-loading","spinner":"bds123Loading-spinner","--size_small":"bds123Loading---size_small","--size_large":"bds123Loading---size_large"};
|
|
567
571
|
|
|
568
572
|
// src/components/ui/Loading/Loading.tsx
|
|
569
573
|
var import_design_system_foundation11 = require("@boostdev/design-system-foundation");
|
|
570
574
|
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
571
|
-
function Loading({ size = "medium", className }) {
|
|
572
|
-
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: (0, import_design_system_foundation11.cn)(Loading_default.loading, Loading_default[`--size_${size}`], className), children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: Loading_default.spinner, role: "status", "aria-label": "Loading" }) });
|
|
575
|
+
function Loading({ size = "medium", className, ...rest }) {
|
|
576
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { ...rest, className: (0, import_design_system_foundation11.cn)(Loading_default.loading, Loading_default[`--size_${size}`], className), children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: Loading_default.spinner, role: "status", "aria-label": "Loading" }) });
|
|
573
577
|
}
|
|
574
578
|
|
|
575
579
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
576
|
-
var NotificationBanner_default = {"banner":"
|
|
580
|
+
var NotificationBanner_default = {"banner":"bds123NotificationBanner-banner","--variant_info":"bds123NotificationBanner---variant_info","--variant_success":"bds123NotificationBanner---variant_success","--variant_warning":"bds123NotificationBanner---variant_warning","--variant_error":"bds123NotificationBanner---variant_error","content":"bds123NotificationBanner-content","action":"bds123NotificationBanner-action","dismiss":"bds123NotificationBanner-dismiss"};
|
|
577
581
|
|
|
578
582
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
579
583
|
var import_design_system_foundation12 = require("@boostdev/design-system-foundation");
|
|
@@ -583,12 +587,14 @@ function NotificationBanner({
|
|
|
583
587
|
children,
|
|
584
588
|
action,
|
|
585
589
|
onDismiss,
|
|
586
|
-
className
|
|
590
|
+
className,
|
|
591
|
+
...rest
|
|
587
592
|
}) {
|
|
588
593
|
const isUrgent = variant === "error" || variant === "warning";
|
|
589
594
|
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
590
595
|
"div",
|
|
591
596
|
{
|
|
597
|
+
...rest,
|
|
592
598
|
role: isUrgent ? "alert" : "status",
|
|
593
599
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
594
600
|
"aria-atomic": "true",
|
|
@@ -612,7 +618,7 @@ function NotificationBanner({
|
|
|
612
618
|
}
|
|
613
619
|
|
|
614
620
|
// src/components/ui/Pagination/Pagination.module.css
|
|
615
|
-
var Pagination_default = {"pagination":"
|
|
621
|
+
var Pagination_default = {"pagination":"bds123Pagination-pagination","list":"bds123Pagination-list","button":"bds123Pagination-button","--active":"bds123Pagination---active","--nav":"bds123Pagination---nav","ellipsis":"bds123Pagination-ellipsis"};
|
|
616
622
|
|
|
617
623
|
// src/components/ui/Pagination/Pagination.tsx
|
|
618
624
|
var import_design_system_foundation13 = require("@boostdev/design-system-foundation");
|
|
@@ -633,10 +639,11 @@ function Pagination({
|
|
|
633
639
|
currentPage,
|
|
634
640
|
totalPages,
|
|
635
641
|
onPageChange,
|
|
636
|
-
className
|
|
642
|
+
className,
|
|
643
|
+
...rest
|
|
637
644
|
}) {
|
|
638
645
|
const pages = getPageRange(currentPage, totalPages);
|
|
639
|
-
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("nav", { "aria-label": "Pagination", className: (0, import_design_system_foundation13.cn)(Pagination_default.pagination, className), children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("ul", { className: Pagination_default.list, children: [
|
|
646
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("nav", { ...rest, "aria-label": "Pagination", className: (0, import_design_system_foundation13.cn)(Pagination_default.pagination, className), children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("ul", { className: Pagination_default.list, children: [
|
|
640
647
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
641
648
|
"button",
|
|
642
649
|
{
|
|
@@ -676,7 +683,7 @@ function Pagination({
|
|
|
676
683
|
}
|
|
677
684
|
|
|
678
685
|
// src/components/ui/Progress/Progress.module.css
|
|
679
|
-
var Progress_default = {"container":"
|
|
686
|
+
var Progress_default = {"container":"bds123Progress-container","labelRow":"bds123Progress-labelRow","value":"bds123Progress-value","track":"bds123Progress-track","--size_small":"bds123Progress---size_small","--size_medium":"bds123Progress---size_medium","--size_large":"bds123Progress---size_large","fill":"bds123Progress-fill"};
|
|
680
687
|
|
|
681
688
|
// src/components/ui/Progress/Progress.tsx
|
|
682
689
|
var import_design_system_foundation14 = require("@boostdev/design-system-foundation");
|
|
@@ -687,10 +694,11 @@ function Progress({
|
|
|
687
694
|
label,
|
|
688
695
|
showLabel = false,
|
|
689
696
|
size = "medium",
|
|
690
|
-
className
|
|
697
|
+
className,
|
|
698
|
+
...rest
|
|
691
699
|
}) {
|
|
692
700
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
693
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: (0, import_design_system_foundation14.cn)(Progress_default.container, className), children: [
|
|
701
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { ...rest, className: (0, import_design_system_foundation14.cn)(Progress_default.container, className), children: [
|
|
694
702
|
showLabel && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: Progress_default.labelRow, children: [
|
|
695
703
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: Progress_default.label, children: label }),
|
|
696
704
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { className: Progress_default.value, children: [
|
|
@@ -714,7 +722,7 @@ function Progress({
|
|
|
714
722
|
}
|
|
715
723
|
|
|
716
724
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
717
|
-
var ProgressCircle_default = {"wrapper":"
|
|
725
|
+
var ProgressCircle_default = {"wrapper":"bds123ProgressCircle-wrapper","svg":"bds123ProgressCircle-svg","track":"bds123ProgressCircle-track","fill":"bds123ProgressCircle-fill","value":"bds123ProgressCircle-value","--size_small":"bds123ProgressCircle---size_small","--size_medium":"bds123ProgressCircle---size_medium","--size_large":"bds123ProgressCircle---size_large"};
|
|
718
726
|
|
|
719
727
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
720
728
|
var import_design_system_foundation15 = require("@boostdev/design-system-foundation");
|
|
@@ -727,7 +735,8 @@ function ProgressCircle({
|
|
|
727
735
|
label,
|
|
728
736
|
showValue = false,
|
|
729
737
|
size = "medium",
|
|
730
|
-
className
|
|
738
|
+
className,
|
|
739
|
+
...rest
|
|
731
740
|
}) {
|
|
732
741
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
733
742
|
const px = SIZE_PX[size];
|
|
@@ -738,6 +747,7 @@ function ProgressCircle({
|
|
|
738
747
|
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
739
748
|
"div",
|
|
740
749
|
{
|
|
750
|
+
...rest,
|
|
741
751
|
role: "progressbar",
|
|
742
752
|
"aria-label": label,
|
|
743
753
|
"aria-valuenow": value,
|
|
@@ -793,49 +803,50 @@ function ProgressCircle({
|
|
|
793
803
|
}
|
|
794
804
|
|
|
795
805
|
// src/components/ui/Separator/Separator.module.css
|
|
796
|
-
var Separator_default = {"separator":"
|
|
806
|
+
var Separator_default = {"separator":"bds123Separator-separator","--horizontal":"bds123Separator---horizontal","--vertical":"bds123Separator---vertical"};
|
|
797
807
|
|
|
798
808
|
// src/components/ui/Separator/Separator.tsx
|
|
799
809
|
var import_design_system_foundation16 = require("@boostdev/design-system-foundation");
|
|
800
810
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
801
|
-
function Separator({ orientation = "horizontal", className }) {
|
|
811
|
+
function Separator({ orientation = "horizontal", className, ...rest }) {
|
|
802
812
|
if (orientation === "vertical") {
|
|
803
813
|
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
804
814
|
"div",
|
|
805
815
|
{
|
|
816
|
+
...rest,
|
|
806
817
|
role: "separator",
|
|
807
818
|
"aria-orientation": "vertical",
|
|
808
819
|
className: (0, import_design_system_foundation16.cn)(Separator_default.separator, Separator_default["--vertical"], className)
|
|
809
820
|
}
|
|
810
821
|
);
|
|
811
822
|
}
|
|
812
|
-
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("hr", { "aria-orientation": "horizontal", className: (0, import_design_system_foundation16.cn)(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
823
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("hr", { ...rest, "aria-orientation": "horizontal", className: (0, import_design_system_foundation16.cn)(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
813
824
|
}
|
|
814
825
|
|
|
815
826
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
816
827
|
var import_design_system_foundation17 = require("@boostdev/design-system-foundation");
|
|
817
828
|
|
|
818
829
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
819
|
-
var Skeleton_default = {"skeleton":"
|
|
830
|
+
var Skeleton_default = {"skeleton":"bds123Skeleton-skeleton"};
|
|
820
831
|
|
|
821
832
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
822
833
|
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
823
|
-
function Skeleton({ className }) {
|
|
824
|
-
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { "aria-hidden": "true", className: (0, import_design_system_foundation17.cn)(Skeleton_default.skeleton, className) });
|
|
834
|
+
function Skeleton({ className, ...rest }) {
|
|
835
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { ...rest, "aria-hidden": "true", className: (0, import_design_system_foundation17.cn)(Skeleton_default.skeleton, className) });
|
|
825
836
|
}
|
|
826
837
|
|
|
827
838
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
828
|
-
var SkipLink_default = {"skipLink":"
|
|
839
|
+
var SkipLink_default = {"skipLink":"bds123SkipLink-skipLink"};
|
|
829
840
|
|
|
830
841
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
831
842
|
var import_design_system_foundation18 = require("@boostdev/design-system-foundation");
|
|
832
843
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
833
|
-
function SkipLink({ href = "#main", children = "Skip to main content", className }) {
|
|
834
|
-
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("a", { href, className: (0, import_design_system_foundation18.cn)(SkipLink_default.skipLink, className), children });
|
|
844
|
+
function SkipLink({ href = "#main", children = "Skip to main content", className, ...rest }) {
|
|
845
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("a", { ...rest, href, className: (0, import_design_system_foundation18.cn)(SkipLink_default.skipLink, className), children });
|
|
835
846
|
}
|
|
836
847
|
|
|
837
848
|
// src/components/ui/Table/Table.module.css
|
|
838
|
-
var Table_default = {"wrapper":"
|
|
849
|
+
var Table_default = {"wrapper":"bds123Table-wrapper","table":"bds123Table-table","caption":"bds123Table-caption","thead":"bds123Table-thead","th":"bds123Table-th","--sortable":"bds123Table---sortable","sortButton":"bds123Table-sortButton","sortIcon":"bds123Table-sortIcon","--sort-active":"bds123Table---sort-active","--sort-desc":"bds123Table---sort-desc","tbody":"bds123Table-tbody","tr":"bds123Table-tr","td":"bds123Table-td"};
|
|
839
850
|
|
|
840
851
|
// src/components/ui/Table/Table.tsx
|
|
841
852
|
var import_design_system_foundation19 = require("@boostdev/design-system-foundation");
|
|
@@ -905,12 +916,12 @@ function Table({
|
|
|
905
916
|
var import_react4 = require("react");
|
|
906
917
|
|
|
907
918
|
// src/components/ui/Tabs/Tabs.module.css
|
|
908
|
-
var Tabs_default = {"tabs":"
|
|
919
|
+
var Tabs_default = {"tabs":"bds123Tabs-tabs","tabList":"bds123Tabs-tabList","tab":"bds123Tabs-tab","--active":"bds123Tabs---active","panel":"bds123Tabs-panel"};
|
|
909
920
|
|
|
910
921
|
// src/components/ui/Tabs/Tabs.tsx
|
|
911
922
|
var import_design_system_foundation20 = require("@boostdev/design-system-foundation");
|
|
912
923
|
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
913
|
-
function Tabs({ tabs, defaultTab, className }) {
|
|
924
|
+
function Tabs({ tabs, defaultTab, className, ...rest }) {
|
|
914
925
|
const baseId = (0, import_react4.useId)();
|
|
915
926
|
const [activeTab, setActiveTab] = (0, import_react4.useState)(defaultTab ?? tabs[0]?.id);
|
|
916
927
|
const tabRefs = (0, import_react4.useRef)([]);
|
|
@@ -935,7 +946,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
935
946
|
focusAt(enabledIndexes[enabledIndexes.length - 1]);
|
|
936
947
|
}
|
|
937
948
|
};
|
|
938
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: (0, import_design_system_foundation20.cn)(Tabs_default.tabs, className), children: [
|
|
949
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { ...rest, className: (0, import_design_system_foundation20.cn)(Tabs_default.tabs, className), children: [
|
|
939
950
|
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { role: "tablist", className: Tabs_default.tabList, children: tabs.map((tab, i) => {
|
|
940
951
|
const tabId = `${baseId}-tab-${tab.id}`;
|
|
941
952
|
const panelId = `${baseId}-panel-${tab.id}`;
|
|
@@ -985,7 +996,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
985
996
|
var import_react5 = require("react");
|
|
986
997
|
|
|
987
998
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
988
|
-
var Tooltip_default = {"wrapper":"
|
|
999
|
+
var Tooltip_default = {"wrapper":"bds123Tooltip-wrapper","tooltip":"bds123Tooltip-tooltip","--placement_top":"bds123Tooltip---placement_top","--placement_bottom":"bds123Tooltip---placement_bottom","--placement_left":"bds123Tooltip---placement_left","--placement_right":"bds123Tooltip---placement_right"};
|
|
989
1000
|
|
|
990
1001
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
991
1002
|
var import_design_system_foundation21 = require("@boostdev/design-system-foundation");
|
|
@@ -994,7 +1005,8 @@ function Tooltip({
|
|
|
994
1005
|
content,
|
|
995
1006
|
placement = "top",
|
|
996
1007
|
children,
|
|
997
|
-
className
|
|
1008
|
+
className,
|
|
1009
|
+
...rest
|
|
998
1010
|
}) {
|
|
999
1011
|
const tooltipId = (0, import_react5.useId)();
|
|
1000
1012
|
const [isVisible, setIsVisible] = (0, import_react5.useState)(false);
|
|
@@ -1004,6 +1016,7 @@ function Tooltip({
|
|
|
1004
1016
|
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
1005
1017
|
"span",
|
|
1006
1018
|
{
|
|
1019
|
+
...rest,
|
|
1007
1020
|
className: (0, import_design_system_foundation21.cn)(Tooltip_default.wrapper, className),
|
|
1008
1021
|
onMouseEnter: () => setIsVisible(true),
|
|
1009
1022
|
onMouseLeave: () => setIsVisible(false),
|
|
@@ -1027,7 +1040,7 @@ function Tooltip({
|
|
|
1027
1040
|
}
|
|
1028
1041
|
|
|
1029
1042
|
// src/components/ui/Typography/Typography.module.css
|
|
1030
|
-
var Typography_default = {"typography":"
|
|
1043
|
+
var Typography_default = {"typography":"bds123Typography-typography","--h1":"bds123Typography---h1","--h2":"bds123Typography---h2","--h3":"bds123Typography---h3","--body":"bds123Typography---body","--body_s":"bds123Typography---body_s"};
|
|
1031
1044
|
|
|
1032
1045
|
// src/components/ui/Typography/Typography.tsx
|
|
1033
1046
|
var import_design_system_foundation22 = require("@boostdev/design-system-foundation");
|
|
@@ -1039,13 +1052,13 @@ var variantToElement = {
|
|
|
1039
1052
|
body: "p",
|
|
1040
1053
|
body_s: "p"
|
|
1041
1054
|
};
|
|
1042
|
-
function Typography({ variant = "body", component, children, className }) {
|
|
1055
|
+
function Typography({ variant = "body", component, children, className, ...rest }) {
|
|
1043
1056
|
const Component = component || variantToElement[variant];
|
|
1044
|
-
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Component, { className: (0, import_design_system_foundation22.cn)(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
1057
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Component, { ...rest, className: (0, import_design_system_foundation22.cn)(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
1045
1058
|
}
|
|
1046
1059
|
|
|
1047
1060
|
// src/components/interaction/Button/Button.module.css
|
|
1048
|
-
var Button_default = {"button":"
|
|
1061
|
+
var Button_default = {"button":"bds123Button-button","--default":"bds123Button---default","--outline":"bds123Button---outline","--ghost":"bds123Button---ghost","--size_small":"bds123Button---size_small","--size_medium":"bds123Button---size_medium","--size_large":"bds123Button---size_large","--hasPulse":"bds123Button---hasPulse","iconStart":"bds123Button-iconStart","iconEnd":"bds123Button-iconEnd"};
|
|
1049
1062
|
|
|
1050
1063
|
// src/components/interaction/Button/Button.tsx
|
|
1051
1064
|
var import_design_system_foundation23 = require("@boostdev/design-system-foundation");
|
|
@@ -1160,7 +1173,7 @@ function installInvokerCommandsPolyfill() {
|
|
|
1160
1173
|
}
|
|
1161
1174
|
|
|
1162
1175
|
// src/components/interaction/Command/Command.module.css
|
|
1163
|
-
var Command_default = {"dialog":"
|
|
1176
|
+
var Command_default = {"dialog":"bds123Command-dialog","palette":"bds123Command-palette","searchRow":"bds123Command-searchRow","searchIcon":"bds123Command-searchIcon","search":"bds123Command-search","escHint":"bds123Command-escHint","list":"bds123Command-list","groupList":"bds123Command-groupList","group":"bds123Command-group","item":"bds123Command-item","itemActive":"bds123Command-itemActive","itemLabel":"bds123Command-itemLabel","itemDesc":"bds123Command-itemDesc","shortcut":"bds123Command-shortcut","empty":"bds123Command-empty"};
|
|
1164
1177
|
|
|
1165
1178
|
// src/components/interaction/Command/Command.tsx
|
|
1166
1179
|
var import_design_system_foundation24 = require("@boostdev/design-system-foundation");
|
|
@@ -1173,7 +1186,8 @@ function Command({
|
|
|
1173
1186
|
onClose,
|
|
1174
1187
|
items,
|
|
1175
1188
|
placeholder = "Search commands\u2026",
|
|
1176
|
-
className
|
|
1189
|
+
className,
|
|
1190
|
+
...rest
|
|
1177
1191
|
}) {
|
|
1178
1192
|
const [query, setQuery] = (0, import_react6.useState)("");
|
|
1179
1193
|
const [activeIndex, setActiveIndex] = (0, import_react6.useState)(0);
|
|
@@ -1268,6 +1282,7 @@ function Command({
|
|
|
1268
1282
|
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1269
1283
|
"dialog",
|
|
1270
1284
|
{
|
|
1285
|
+
...rest,
|
|
1271
1286
|
ref: dialogRef,
|
|
1272
1287
|
id: dialogId,
|
|
1273
1288
|
className: (0, import_design_system_foundation24.cn)(Command_default.dialog, className),
|
|
@@ -1335,14 +1350,14 @@ function Command({
|
|
|
1335
1350
|
var import_react7 = require("react");
|
|
1336
1351
|
|
|
1337
1352
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1338
|
-
var Dialog_default = {"dialog":"
|
|
1353
|
+
var Dialog_default = {"dialog":"bds123Dialog-dialog","dialogContent":"bds123Dialog-dialogContent","closeButton":"bds123Dialog-closeButton"};
|
|
1339
1354
|
|
|
1340
1355
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1341
1356
|
var import_design_system_foundation25 = require("@boostdev/design-system-foundation");
|
|
1342
1357
|
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1343
1358
|
installInvokerCommandsPolyfill();
|
|
1344
1359
|
var FOCUSABLE_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
|
|
1345
|
-
function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClose }) {
|
|
1360
|
+
function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClose, ...rest }) {
|
|
1346
1361
|
const generatedId = (0, import_react7.useId)();
|
|
1347
1362
|
const id = idProp ?? generatedId;
|
|
1348
1363
|
const dialogRef = (0, import_react7.useRef)(null);
|
|
@@ -1411,6 +1426,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1411
1426
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
1412
1427
|
"dialog",
|
|
1413
1428
|
{
|
|
1429
|
+
...rest,
|
|
1414
1430
|
ref: dialogRef,
|
|
1415
1431
|
id,
|
|
1416
1432
|
className: (0, import_design_system_foundation25.cn)(className, Dialog_default.dialog),
|
|
@@ -1440,7 +1456,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1440
1456
|
var import_react8 = require("react");
|
|
1441
1457
|
|
|
1442
1458
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1443
|
-
var Drawer_default = {"drawer":"
|
|
1459
|
+
var Drawer_default = {"drawer":"bds123Drawer-drawer","--side_left":"bds123Drawer---side_left","header":"bds123Drawer-header","closeButton":"bds123Drawer-closeButton","body":"bds123Drawer-body"};
|
|
1444
1460
|
|
|
1445
1461
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1446
1462
|
var import_design_system_foundation26 = require("@boostdev/design-system-foundation");
|
|
@@ -1454,8 +1470,8 @@ function Drawer({
|
|
|
1454
1470
|
title,
|
|
1455
1471
|
children,
|
|
1456
1472
|
side = "right",
|
|
1457
|
-
|
|
1458
|
-
|
|
1473
|
+
className,
|
|
1474
|
+
...rest
|
|
1459
1475
|
}) {
|
|
1460
1476
|
const generatedId = (0, import_react8.useId)();
|
|
1461
1477
|
const id = idProp ?? generatedId;
|
|
@@ -1509,10 +1525,10 @@ function Drawer({
|
|
|
1509
1525
|
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1510
1526
|
"dialog",
|
|
1511
1527
|
{
|
|
1528
|
+
...rest,
|
|
1512
1529
|
ref: dialogRef,
|
|
1513
1530
|
id,
|
|
1514
1531
|
className: (0, import_design_system_foundation26.cn)(Drawer_default.drawer, Drawer_default[`--side_${side}`], className),
|
|
1515
|
-
"aria-label": ariaLabel,
|
|
1516
1532
|
"aria-modal": "true",
|
|
1517
1533
|
onClick: handleClick,
|
|
1518
1534
|
onCancel: handleCancel,
|
|
@@ -1541,7 +1557,7 @@ function Drawer({
|
|
|
1541
1557
|
var import_react9 = require("react");
|
|
1542
1558
|
|
|
1543
1559
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1544
|
-
var DropdownMenu_default = {"wrapper":"
|
|
1560
|
+
var DropdownMenu_default = {"wrapper":"bds123DropdownMenu-wrapper","menu":"bds123DropdownMenu-menu","--placement_bottom-start":"bds123DropdownMenu---placement_bottom-start","--placement_bottom-end":"bds123DropdownMenu---placement_bottom-end","separator":"bds123DropdownMenu-separator","item":"bds123DropdownMenu-item","icon":"bds123DropdownMenu-icon"};
|
|
1545
1561
|
|
|
1546
1562
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1547
1563
|
var import_design_system_foundation27 = require("@boostdev/design-system-foundation");
|
|
@@ -1550,7 +1566,8 @@ function DropdownMenu({
|
|
|
1550
1566
|
trigger,
|
|
1551
1567
|
items,
|
|
1552
1568
|
placement = "bottom-start",
|
|
1553
|
-
className
|
|
1569
|
+
className,
|
|
1570
|
+
...rest
|
|
1554
1571
|
}) {
|
|
1555
1572
|
const [isOpen, setIsOpen] = (0, import_react9.useState)(false);
|
|
1556
1573
|
const containerRef = (0, import_react9.useRef)(null);
|
|
@@ -1613,7 +1630,7 @@ function DropdownMenu({
|
|
|
1613
1630
|
if (typeof existingOnClick === "function") existingOnClick(e);
|
|
1614
1631
|
}
|
|
1615
1632
|
}) : trigger;
|
|
1616
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { ref: containerRef, className: (0, import_design_system_foundation27.cn)(DropdownMenu_default.wrapper, className), children: [
|
|
1633
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { ...rest, ref: containerRef, className: (0, import_design_system_foundation27.cn)(DropdownMenu_default.wrapper, className), children: [
|
|
1617
1634
|
triggerEl,
|
|
1618
1635
|
isOpen && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1619
1636
|
"ul",
|
|
@@ -1654,7 +1671,7 @@ function DropdownMenu({
|
|
|
1654
1671
|
var import_react10 = require("react");
|
|
1655
1672
|
|
|
1656
1673
|
// src/components/interaction/Popover/Popover.module.css
|
|
1657
|
-
var Popover_default = {"wrapper":"
|
|
1674
|
+
var Popover_default = {"wrapper":"bds123Popover-wrapper","panel":"bds123Popover-panel","g":"bds123Popover-g"};
|
|
1658
1675
|
|
|
1659
1676
|
// src/components/interaction/Popover/Popover.tsx
|
|
1660
1677
|
var import_design_system_foundation28 = require("@boostdev/design-system-foundation");
|
|
@@ -1669,7 +1686,8 @@ function Popover({
|
|
|
1669
1686
|
content,
|
|
1670
1687
|
placement = "bottom",
|
|
1671
1688
|
className,
|
|
1672
|
-
"aria-label": ariaLabel
|
|
1689
|
+
"aria-label": ariaLabel,
|
|
1690
|
+
...rest
|
|
1673
1691
|
}) {
|
|
1674
1692
|
const [isOpen, setIsOpen] = (0, import_react10.useState)(false);
|
|
1675
1693
|
const containerRef = (0, import_react10.useRef)(null);
|
|
@@ -1718,7 +1736,7 @@ function Popover({
|
|
|
1718
1736
|
// avoid a double-toggle when both onClick and invoker fire.
|
|
1719
1737
|
onClick: children.props.onClick
|
|
1720
1738
|
}) : children;
|
|
1721
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { ref: containerRef, className: (0, import_design_system_foundation28.cn)(Popover_default.wrapper, className), children: [
|
|
1739
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { ...rest, ref: containerRef, className: (0, import_design_system_foundation28.cn)(Popover_default.wrapper, className), children: [
|
|
1722
1740
|
trigger,
|
|
1723
1741
|
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1724
1742
|
"div",
|
|
@@ -1738,15 +1756,16 @@ function Popover({
|
|
|
1738
1756
|
}
|
|
1739
1757
|
|
|
1740
1758
|
// src/components/interaction/Rating/Rating.module.css
|
|
1741
|
-
var Rating_default = {"rating":"
|
|
1759
|
+
var Rating_default = {"rating":"bds123Rating-rating","star":"bds123Rating-star","--filled":"bds123Rating---filled"};
|
|
1742
1760
|
|
|
1743
1761
|
// src/components/interaction/Rating/Rating.tsx
|
|
1744
1762
|
var import_design_system_foundation29 = require("@boostdev/design-system-foundation");
|
|
1745
1763
|
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1746
|
-
function Rating({ value, max = 5, className }) {
|
|
1764
|
+
function Rating({ value, max = 5, className, ...rest }) {
|
|
1747
1765
|
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1748
1766
|
"div",
|
|
1749
1767
|
{
|
|
1768
|
+
...rest,
|
|
1750
1769
|
className: (0, import_design_system_foundation29.cn)(Rating_default.rating, className),
|
|
1751
1770
|
role: "img",
|
|
1752
1771
|
"aria-label": `${value} out of ${max} stars`,
|
|
@@ -1769,7 +1788,7 @@ function Rating({ value, max = 5, className }) {
|
|
|
1769
1788
|
var import_react11 = require("react");
|
|
1770
1789
|
|
|
1771
1790
|
// src/components/interaction/Toast/Toast.module.css
|
|
1772
|
-
var Toast_default = {"toastContainer":"
|
|
1791
|
+
var Toast_default = {"toastContainer":"bds123Toast-toastContainer","toast":"bds123Toast-toast","--variant_success":"bds123Toast---variant_success","--variant_warning":"bds123Toast---variant_warning","--variant_info":"bds123Toast---variant_info","--variant_error":"bds123Toast---variant_error","message":"bds123Toast-message","closeButton":"bds123Toast-closeButton"};
|
|
1773
1792
|
|
|
1774
1793
|
// src/components/interaction/Toast/Toast.tsx
|
|
1775
1794
|
var import_design_system_foundation30 = require("@boostdev/design-system-foundation");
|
|
@@ -1842,10 +1861,10 @@ function useToast() {
|
|
|
1842
1861
|
var import_react12 = require("react");
|
|
1843
1862
|
|
|
1844
1863
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1845
|
-
var Checkbox_default = {"checkboxGroup":"
|
|
1864
|
+
var Checkbox_default = {"checkboxGroup":"bds123Checkbox-checkboxGroup","inputWrapper":"bds123Checkbox-inputWrapper","checkbox":"bds123Checkbox-checkbox","checkboxError":"bds123Checkbox-checkboxError"};
|
|
1846
1865
|
|
|
1847
1866
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1848
|
-
var Message_default = {"error":"
|
|
1867
|
+
var Message_default = {"error":"bds123Message-error","hint":"bds123Message-hint"};
|
|
1849
1868
|
|
|
1850
1869
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1851
1870
|
var import_design_system_foundation31 = require("@boostdev/design-system-foundation");
|
|
@@ -1856,7 +1875,7 @@ var Message = ({ message, type, inputId, className }) => {
|
|
|
1856
1875
|
};
|
|
1857
1876
|
|
|
1858
1877
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1859
|
-
var Label_default = {"label":"
|
|
1878
|
+
var Label_default = {"label":"bds123Label-label"};
|
|
1860
1879
|
|
|
1861
1880
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1862
1881
|
var import_design_system_foundation32 = require("@boostdev/design-system-foundation");
|
|
@@ -1869,13 +1888,13 @@ var Label = ({ label, id, className }) => {
|
|
|
1869
1888
|
var import_design_system_foundation34 = require("@boostdev/design-system-foundation");
|
|
1870
1889
|
|
|
1871
1890
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1872
|
-
var InputContainer_default = {"container":"
|
|
1891
|
+
var InputContainer_default = {"container":"bds123InputContainer-container"};
|
|
1873
1892
|
|
|
1874
1893
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1875
1894
|
var import_design_system_foundation33 = require("@boostdev/design-system-foundation");
|
|
1876
1895
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1877
|
-
var InputContainer = ({ children, className }) => {
|
|
1878
|
-
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: (0, import_design_system_foundation33.cn)(InputContainer_default.container, className), children });
|
|
1896
|
+
var InputContainer = ({ children, className, ...rest }) => {
|
|
1897
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { ...rest, className: (0, import_design_system_foundation33.cn)(InputContainer_default.container, className), children });
|
|
1879
1898
|
};
|
|
1880
1899
|
|
|
1881
1900
|
// src/components/interaction/form/Checkbox/Checkbox.tsx
|
|
@@ -1910,7 +1929,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1910
1929
|
var import_react13 = require("react");
|
|
1911
1930
|
|
|
1912
1931
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.module.css
|
|
1913
|
-
var CheckboxGroup_default = {"group":"
|
|
1932
|
+
var CheckboxGroup_default = {"group":"bds123CheckboxGroup-group","legend":"bds123CheckboxGroup-legend","required":"bds123CheckboxGroup-required","items":"bds123CheckboxGroup-items"};
|
|
1914
1933
|
|
|
1915
1934
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
|
|
1916
1935
|
var import_design_system_foundation35 = require("@boostdev/design-system-foundation");
|
|
@@ -1921,8 +1940,8 @@ function CheckboxGroup({
|
|
|
1921
1940
|
error,
|
|
1922
1941
|
hint,
|
|
1923
1942
|
required,
|
|
1924
|
-
|
|
1925
|
-
|
|
1943
|
+
className,
|
|
1944
|
+
...rest
|
|
1926
1945
|
}) {
|
|
1927
1946
|
const id = (0, import_react13.useId)();
|
|
1928
1947
|
const hintId = id + "hint";
|
|
@@ -1931,8 +1950,8 @@ function CheckboxGroup({
|
|
|
1931
1950
|
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
1932
1951
|
"fieldset",
|
|
1933
1952
|
{
|
|
1953
|
+
...rest,
|
|
1934
1954
|
className: (0, import_design_system_foundation35.cn)(CheckboxGroup_default.group, className),
|
|
1935
|
-
disabled,
|
|
1936
1955
|
"aria-required": required || void 0,
|
|
1937
1956
|
"aria-describedby": describedBy,
|
|
1938
1957
|
children: [
|
|
@@ -1952,7 +1971,7 @@ function CheckboxGroup({
|
|
|
1952
1971
|
var import_react14 = require("react");
|
|
1953
1972
|
|
|
1954
1973
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1955
|
-
var Combobox_default = {"formGroup":"
|
|
1974
|
+
var Combobox_default = {"formGroup":"bds123Combobox-formGroup","inputWrapper":"bds123Combobox-inputWrapper","input":"bds123Combobox-input","inputError":"bds123Combobox-inputError","chevron":"bds123Combobox-chevron","listbox":"bds123Combobox-listbox","option":"bds123Combobox-option","--highlighted":"bds123Combobox---highlighted","--selected":"bds123Combobox---selected","--disabled":"bds123Combobox---disabled"};
|
|
1956
1975
|
|
|
1957
1976
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1958
1977
|
var import_design_system_foundation36 = require("@boostdev/design-system-foundation");
|
|
@@ -1967,7 +1986,8 @@ function Combobox({
|
|
|
1967
1986
|
disabled = false,
|
|
1968
1987
|
error,
|
|
1969
1988
|
hint,
|
|
1970
|
-
className
|
|
1989
|
+
className,
|
|
1990
|
+
...rest
|
|
1971
1991
|
}) {
|
|
1972
1992
|
const id = name + (0, import_react14.useId)();
|
|
1973
1993
|
const listboxId = id + "listbox";
|
|
@@ -2034,7 +2054,7 @@ function Combobox({
|
|
|
2034
2054
|
setIsOpen(false);
|
|
2035
2055
|
}
|
|
2036
2056
|
};
|
|
2037
|
-
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(InputContainer, { className: (0, import_design_system_foundation36.cn)(Combobox_default.formGroup, className), children: [
|
|
2057
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(InputContainer, { ...rest, className: (0, import_design_system_foundation36.cn)(Combobox_default.formGroup, className), children: [
|
|
2038
2058
|
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Label, { id, label }),
|
|
2039
2059
|
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { ref: containerRef, className: Combobox_default.inputWrapper, children: [
|
|
2040
2060
|
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
@@ -2102,7 +2122,7 @@ function Combobox({
|
|
|
2102
2122
|
var import_react15 = require("react");
|
|
2103
2123
|
|
|
2104
2124
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
2105
|
-
var FileInput_default = {"formGroup":"
|
|
2125
|
+
var FileInput_default = {"formGroup":"bds123FileInput-formGroup","fieldLabel":"bds123FileInput-fieldLabel","dropZone":"bds123FileInput-dropZone","isDragging":"bds123FileInput-isDragging","hasError":"bds123FileInput-hasError","isDisabled":"bds123FileInput-isDisabled","icon":"bds123FileInput-icon","prompt":"bds123FileInput-prompt","acceptHint":"bds123FileInput-acceptHint","hiddenInput":"bds123FileInput-hiddenInput"};
|
|
2106
2126
|
|
|
2107
2127
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2108
2128
|
var import_design_system_foundation37 = require("@boostdev/design-system-foundation");
|
|
@@ -2117,7 +2137,8 @@ function FileInput({
|
|
|
2117
2137
|
error,
|
|
2118
2138
|
hint,
|
|
2119
2139
|
onChange,
|
|
2120
|
-
className
|
|
2140
|
+
className,
|
|
2141
|
+
...rest
|
|
2121
2142
|
}) {
|
|
2122
2143
|
const uid = name + (0, import_react15.useId)();
|
|
2123
2144
|
const hintId = uid + "hint";
|
|
@@ -2155,7 +2176,7 @@ function FileInput({
|
|
|
2155
2176
|
if (!disabled) setIsDragging(true);
|
|
2156
2177
|
};
|
|
2157
2178
|
const handleDragLeave = () => setIsDragging(false);
|
|
2158
|
-
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(InputContainer, { className: (0, import_design_system_foundation37.cn)(FileInput_default.formGroup, className), children: [
|
|
2179
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(InputContainer, { ...rest, className: (0, import_design_system_foundation37.cn)(FileInput_default.formGroup, className), children: [
|
|
2159
2180
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
2160
2181
|
"label",
|
|
2161
2182
|
{
|
|
@@ -2202,7 +2223,7 @@ function FileInput({
|
|
|
2202
2223
|
var import_react16 = require("react");
|
|
2203
2224
|
|
|
2204
2225
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
2205
|
-
var FormInput_default = {"formGroup":"
|
|
2226
|
+
var FormInput_default = {"formGroup":"bds123FormInput-formGroup","input":"bds123FormInput-input","inputError":"bds123FormInput-inputError"};
|
|
2206
2227
|
|
|
2207
2228
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2208
2229
|
var import_design_system_foundation38 = require("@boostdev/design-system-foundation");
|
|
@@ -2246,7 +2267,7 @@ function FormInput({
|
|
|
2246
2267
|
var import_react17 = require("react");
|
|
2247
2268
|
|
|
2248
2269
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
2249
|
-
var NumberInput_default = {"formGroup":"
|
|
2270
|
+
var NumberInput_default = {"formGroup":"bds123NumberInput-formGroup","inputRow":"bds123NumberInput-inputRow","input":"bds123NumberInput-input","inputError":"bds123NumberInput-inputError","stepper":"bds123NumberInput-stepper"};
|
|
2250
2271
|
|
|
2251
2272
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2252
2273
|
var import_design_system_foundation39 = require("@boostdev/design-system-foundation");
|
|
@@ -2263,7 +2284,8 @@ function NumberInput({
|
|
|
2263
2284
|
error,
|
|
2264
2285
|
hint,
|
|
2265
2286
|
onChange,
|
|
2266
|
-
className
|
|
2287
|
+
className,
|
|
2288
|
+
...rest
|
|
2267
2289
|
}) {
|
|
2268
2290
|
const uid = name + (0, import_react17.useId)();
|
|
2269
2291
|
const hintId = uid + "hint";
|
|
@@ -2288,7 +2310,7 @@ function NumberInput({
|
|
|
2288
2310
|
}
|
|
2289
2311
|
onChange?.(next);
|
|
2290
2312
|
};
|
|
2291
|
-
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(InputContainer, { className: (0, import_design_system_foundation39.cn)(NumberInput_default.formGroup, className), children: [
|
|
2313
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(InputContainer, { ...rest, className: (0, import_design_system_foundation39.cn)(NumberInput_default.formGroup, className), children: [
|
|
2292
2314
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Label, { id: uid, label }),
|
|
2293
2315
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: NumberInput_default.inputRow, children: [
|
|
2294
2316
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
@@ -2350,7 +2372,7 @@ function NumberInput({
|
|
|
2350
2372
|
var import_react18 = require("react");
|
|
2351
2373
|
|
|
2352
2374
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
2353
|
-
var Radio_default = {"radioGroup":"
|
|
2375
|
+
var Radio_default = {"radioGroup":"bds123Radio-radioGroup","inputWrapper":"bds123Radio-inputWrapper","textWrapper":"bds123Radio-textWrapper","description":"bds123Radio-description","radio":"bds123Radio-radio","radioError":"bds123Radio-radioError"};
|
|
2354
2376
|
|
|
2355
2377
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2356
2378
|
var import_design_system_foundation40 = require("@boostdev/design-system-foundation");
|
|
@@ -2388,7 +2410,7 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
2388
2410
|
var import_react19 = require("react");
|
|
2389
2411
|
|
|
2390
2412
|
// src/components/interaction/form/RadioGroup/RadioGroup.module.css
|
|
2391
|
-
var RadioGroup_default = {"group":"
|
|
2413
|
+
var RadioGroup_default = {"group":"bds123RadioGroup-group","legend":"bds123RadioGroup-legend","required":"bds123RadioGroup-required","items":"bds123RadioGroup-items"};
|
|
2392
2414
|
|
|
2393
2415
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2394
2416
|
var import_design_system_foundation41 = require("@boostdev/design-system-foundation");
|
|
@@ -2399,8 +2421,8 @@ function RadioGroup({
|
|
|
2399
2421
|
error,
|
|
2400
2422
|
hint,
|
|
2401
2423
|
required,
|
|
2402
|
-
|
|
2403
|
-
|
|
2424
|
+
className,
|
|
2425
|
+
...rest
|
|
2404
2426
|
}) {
|
|
2405
2427
|
const id = (0, import_react19.useId)();
|
|
2406
2428
|
const hintId = id + "hint";
|
|
@@ -2409,8 +2431,8 @@ function RadioGroup({
|
|
|
2409
2431
|
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
2410
2432
|
"fieldset",
|
|
2411
2433
|
{
|
|
2434
|
+
...rest,
|
|
2412
2435
|
className: (0, import_design_system_foundation41.cn)(RadioGroup_default.group, className),
|
|
2413
|
-
disabled,
|
|
2414
2436
|
"aria-required": required || void 0,
|
|
2415
2437
|
"aria-describedby": describedBy,
|
|
2416
2438
|
children: [
|
|
@@ -2430,7 +2452,7 @@ function RadioGroup({
|
|
|
2430
2452
|
var import_react20 = require("react");
|
|
2431
2453
|
|
|
2432
2454
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.module.css
|
|
2433
|
-
var SegmentedControl_default = {"control":"
|
|
2455
|
+
var SegmentedControl_default = {"control":"bds123SegmentedControl-control","thumb":"bds123SegmentedControl-thumb","indicator":"bds123SegmentedControl-indicator","item":"bds123SegmentedControl-item","--active":"bds123SegmentedControl---active","--disabled":"bds123SegmentedControl---disabled","--size_small":"bds123SegmentedControl---size_small","--size_large":"bds123SegmentedControl---size_large","--variant_outline":"bds123SegmentedControl---variant_outline"};
|
|
2434
2456
|
|
|
2435
2457
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2436
2458
|
var import_design_system_foundation42 = require("@boostdev/design-system-foundation");
|
|
@@ -2442,7 +2464,7 @@ function SegmentedControl({
|
|
|
2442
2464
|
size = "medium",
|
|
2443
2465
|
variant = "outline",
|
|
2444
2466
|
className,
|
|
2445
|
-
|
|
2467
|
+
...rest
|
|
2446
2468
|
}) {
|
|
2447
2469
|
const validChildren = import_react20.Children.toArray(children).filter(import_react20.isValidElement);
|
|
2448
2470
|
const autoIndex = selectedIndexProp === void 0 ? validChildren.findIndex((child) => {
|
|
@@ -2453,8 +2475,8 @@ function SegmentedControl({
|
|
|
2453
2475
|
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
2454
2476
|
"div",
|
|
2455
2477
|
{
|
|
2478
|
+
...rest,
|
|
2456
2479
|
role: "group",
|
|
2457
|
-
"aria-label": ariaLabel,
|
|
2458
2480
|
className: (0, import_design_system_foundation42.cn)(SegmentedControl_default.control, SegmentedControl_default[`--size_${size}`], SegmentedControl_default[`--variant_${variant}`], className),
|
|
2459
2481
|
style: {
|
|
2460
2482
|
"--control_count": validChildren.length,
|
|
@@ -2486,7 +2508,7 @@ function SegmentedControl({
|
|
|
2486
2508
|
var import_react21 = require("react");
|
|
2487
2509
|
|
|
2488
2510
|
// src/components/interaction/form/Select/Select.module.css
|
|
2489
|
-
var Select_default = {"formGroup":"
|
|
2511
|
+
var Select_default = {"formGroup":"bds123Select-formGroup","selectWrapper":"bds123Select-selectWrapper","select":"bds123Select-select","selectError":"bds123Select-selectError","chevron":"bds123Select-chevron"};
|
|
2490
2512
|
|
|
2491
2513
|
// src/components/interaction/form/Select/Select.tsx
|
|
2492
2514
|
var import_design_system_foundation43 = require("@boostdev/design-system-foundation");
|
|
@@ -2537,7 +2559,7 @@ function Select({
|
|
|
2537
2559
|
var import_react22 = require("react");
|
|
2538
2560
|
|
|
2539
2561
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2540
|
-
var Slider_default = {"formGroup":"
|
|
2562
|
+
var Slider_default = {"formGroup":"bds123Slider-formGroup","labelRow":"bds123Slider-labelRow","value":"bds123Slider-value","slider":"bds123Slider-slider","sliderError":"bds123Slider-sliderError"};
|
|
2541
2563
|
|
|
2542
2564
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2543
2565
|
var import_design_system_foundation44 = require("@boostdev/design-system-foundation");
|
|
@@ -2599,7 +2621,7 @@ function Slider({
|
|
|
2599
2621
|
var import_react23 = require("react");
|
|
2600
2622
|
|
|
2601
2623
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2602
|
-
var Switch_default = {"switchGroup":"
|
|
2624
|
+
var Switch_default = {"switchGroup":"bds123Switch-switchGroup","--size_small":"bds123Switch---size_small","--size_medium":"bds123Switch---size_medium","--size_large":"bds123Switch---size_large","inputWrapper":"bds123Switch-inputWrapper","trackWrapper":"bds123Switch-trackWrapper","switch":"bds123Switch-switch","track":"bds123Switch-track","thumb":"bds123Switch-thumb","switchError":"bds123Switch-switchError"};
|
|
2603
2625
|
|
|
2604
2626
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2605
2627
|
var import_design_system_foundation45 = require("@boostdev/design-system-foundation");
|
|
@@ -2647,7 +2669,7 @@ function Switch({
|
|
|
2647
2669
|
var import_react24 = require("react");
|
|
2648
2670
|
|
|
2649
2671
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2650
|
-
var Textarea_default = {"formGroup":"
|
|
2672
|
+
var Textarea_default = {"formGroup":"bds123Textarea-formGroup","textarea":"bds123Textarea-textarea","textareaError":"bds123Textarea-textareaError"};
|
|
2651
2673
|
|
|
2652
2674
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2653
2675
|
var import_design_system_foundation46 = require("@boostdev/design-system-foundation");
|
|
@@ -2686,17 +2708,17 @@ function Textarea({
|
|
|
2686
2708
|
}
|
|
2687
2709
|
|
|
2688
2710
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2689
|
-
var ButtonGroup_default = {"buttonGroup":"
|
|
2711
|
+
var ButtonGroup_default = {"buttonGroup":"bds123ButtonGroup-buttonGroup","container":"bds123ButtonGroup-container","--variant_card":"bds123ButtonGroup---variant_card","--variant_flow":"bds123ButtonGroup---variant_flow","--variant_modal":"bds123ButtonGroup---variant_modal","--variant_content":"bds123ButtonGroup---variant_content","--variant_grid":"bds123ButtonGroup---variant_grid"};
|
|
2690
2712
|
|
|
2691
2713
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2692
2714
|
var import_design_system_foundation47 = require("@boostdev/design-system-foundation");
|
|
2693
2715
|
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
2694
|
-
function ButtonGroup({ children, className, variant,
|
|
2716
|
+
function ButtonGroup({ children, className, variant, ...rest }) {
|
|
2695
2717
|
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
2696
2718
|
"div",
|
|
2697
2719
|
{
|
|
2720
|
+
...rest,
|
|
2698
2721
|
role: "group",
|
|
2699
|
-
"aria-label": ariaLabel,
|
|
2700
2722
|
className: (0, import_design_system_foundation47.cn)(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]),
|
|
2701
2723
|
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: ButtonGroup_default.container, children })
|
|
2702
2724
|
}
|
|
@@ -2704,7 +2726,7 @@ function ButtonGroup({ children, className, variant, "aria-label": ariaLabel })
|
|
|
2704
2726
|
}
|
|
2705
2727
|
|
|
2706
2728
|
// src/components/layout/Card/Card.module.css
|
|
2707
|
-
var Card_default = {"card":"
|
|
2729
|
+
var Card_default = {"card":"bds123Card-card","--default":"bds123Card---default","--elevated":"bds123Card---elevated","--outlined":"bds123Card---outlined","--clickable":"bds123Card---clickable","--padding-none":"bds123Card---padding-none","--padding-small":"bds123Card---padding-small","--padding-medium":"bds123Card---padding-medium","--padding-large":"bds123Card---padding-large","--text-start":"bds123Card---text-start","--text-center":"bds123Card---text-center","--text-end":"bds123Card---text-end"};
|
|
2708
2730
|
|
|
2709
2731
|
// src/components/layout/Card/Card.tsx
|
|
2710
2732
|
var import_design_system_foundation48 = require("@boostdev/design-system-foundation");
|
|
@@ -2715,9 +2737,8 @@ function Card({
|
|
|
2715
2737
|
variant = "default",
|
|
2716
2738
|
padding = "medium",
|
|
2717
2739
|
textAlign = "start",
|
|
2718
|
-
style,
|
|
2719
2740
|
onClick,
|
|
2720
|
-
|
|
2741
|
+
...rest
|
|
2721
2742
|
}) {
|
|
2722
2743
|
const classNames = (0, import_design_system_foundation48.cn)(
|
|
2723
2744
|
Card_default.card,
|
|
@@ -2731,10 +2752,9 @@ function Card({
|
|
|
2731
2752
|
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
2732
2753
|
Component,
|
|
2733
2754
|
{
|
|
2755
|
+
...rest,
|
|
2734
2756
|
className: classNames,
|
|
2735
2757
|
onClick,
|
|
2736
|
-
style,
|
|
2737
|
-
"aria-label": ariaLabel,
|
|
2738
2758
|
...onClick && { type: "button" },
|
|
2739
2759
|
children
|
|
2740
2760
|
}
|
|
@@ -2742,7 +2762,7 @@ function Card({
|
|
|
2742
2762
|
}
|
|
2743
2763
|
|
|
2744
2764
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
2745
|
-
var SectionHeader_default = {"sectionHeader":"
|
|
2765
|
+
var SectionHeader_default = {"sectionHeader":"bds123SectionHeader-sectionHeader","title":"bds123SectionHeader-title","subtitle":"bds123SectionHeader-subtitle","--start":"bds123SectionHeader---start","--center":"bds123SectionHeader---center","--end":"bds123SectionHeader---end","--small":"bds123SectionHeader---small","--medium":"bds123SectionHeader---medium","--large":"bds123SectionHeader---large"};
|
|
2746
2766
|
|
|
2747
2767
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
2748
2768
|
var import_design_system_foundation49 = require("@boostdev/design-system-foundation");
|
|
@@ -2753,23 +2773,24 @@ function SectionHeader({
|
|
|
2753
2773
|
className,
|
|
2754
2774
|
alignment = "start",
|
|
2755
2775
|
size = "medium",
|
|
2756
|
-
titleAs = "h2"
|
|
2776
|
+
titleAs = "h2",
|
|
2777
|
+
...rest
|
|
2757
2778
|
}) {
|
|
2758
2779
|
const Title = titleAs;
|
|
2759
|
-
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: (0, import_design_system_foundation49.cn)(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2780
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { ...rest, className: (0, import_design_system_foundation49.cn)(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2760
2781
|
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Title, { className: SectionHeader_default.title, children: title }),
|
|
2761
2782
|
subtitle && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
2762
2783
|
] });
|
|
2763
2784
|
}
|
|
2764
2785
|
|
|
2765
2786
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2766
|
-
var IconWrapper_default = {"wrapper":"
|
|
2787
|
+
var IconWrapper_default = {"wrapper":"bds123IconWrapper-wrapper"};
|
|
2767
2788
|
|
|
2768
2789
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2769
2790
|
var import_design_system_foundation50 = require("@boostdev/design-system-foundation");
|
|
2770
2791
|
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
2771
|
-
function IconWrapper({ children, className,
|
|
2772
|
-
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: (0, import_design_system_foundation50.cn)(className, IconWrapper_default.wrapper),
|
|
2792
|
+
function IconWrapper({ children, className, ...rest }) {
|
|
2793
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { ...rest, className: (0, import_design_system_foundation50.cn)(className, IconWrapper_default.wrapper), children });
|
|
2773
2794
|
}
|
|
2774
2795
|
|
|
2775
2796
|
// src/index.ts
|