@boostdev/design-system-components 1.2.1 → 1.2.2
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 +21 -0
- package/README.md +15 -15
- package/dist/client.cjs +141 -120
- package/dist/client.css +468 -468
- 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 +468 -468
- package/dist/index.d.cts +71 -96
- package/dist/index.d.ts +71 -96
- package/dist/index.js +141 -120
- package/package.json +1 -1
- package/src/components/interaction/Command/Command.tsx +4 -3
- package/src/components/interaction/Dialog/Dialog.tsx +4 -5
- 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.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.tsx +4 -2
- package/src/components/interaction/form/FileInput/FileInput.tsx +4 -3
- 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.tsx +4 -6
- 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.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.tsx +4 -3
- package/src/components/ui/Avatar/Avatar.tsx +5 -3
- package/src/components/ui/Badge/Badge.tsx +4 -5
- package/src/components/ui/Breadcrumb/Breadcrumb.tsx +4 -3
- package/src/components/ui/Calendar/Calendar.tsx +4 -4
- package/src/components/ui/Carousel/Carousel.tsx +4 -4
- package/src/components/ui/DescriptionList/DescriptionList.tsx +4 -4
- package/src/components/ui/Loading/Loading.tsx +4 -3
- package/src/components/ui/NotificationBanner/NotificationBanner.tsx +4 -2
- package/src/components/ui/Pagination/Pagination.tsx +4 -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.tsx +4 -2
- package/src/components/ui/Typography/Typography.tsx +4 -5
- package/src/stories/DesignSystem/Grid.mdx +2 -0
package/dist/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { useId, useState } from "react";
|
|
3
3
|
|
|
4
4
|
// src/components/ui/Accordion/Accordion.module.css
|
|
5
|
-
var Accordion_default = {"accordion":"
|
|
5
|
+
var Accordion_default = {"accordion":"bds122Accordion-accordion","item":"bds122Accordion-item","heading":"bds122Accordion-heading","trigger":"bds122Accordion-trigger","triggerLabel":"bds122Accordion-triggerLabel","chevron":"bds122Accordion-chevron","--open":"bds122Accordion---open","panel":"bds122Accordion-panel","panelContent":"bds122Accordion-panelContent"};
|
|
6
6
|
|
|
7
7
|
// src/components/ui/Accordion/Accordion.tsx
|
|
8
8
|
import { cn } from "@boostdev/design-system-foundation";
|
|
@@ -11,7 +11,8 @@ function Accordion({
|
|
|
11
11
|
items,
|
|
12
12
|
allowMultiple = false,
|
|
13
13
|
defaultOpen = [],
|
|
14
|
-
className
|
|
14
|
+
className,
|
|
15
|
+
...rest
|
|
15
16
|
}) {
|
|
16
17
|
const baseId = useId();
|
|
17
18
|
const [openIds, setOpenIds] = useState(defaultOpen);
|
|
@@ -22,7 +23,7 @@ function Accordion({
|
|
|
22
23
|
return allowMultiple ? [...prev, id] : [id];
|
|
23
24
|
});
|
|
24
25
|
};
|
|
25
|
-
return /* @__PURE__ */ jsx("div", { className: cn(Accordion_default.accordion, className), children: items.map((item) => {
|
|
26
|
+
return /* @__PURE__ */ jsx("div", { ...rest, className: cn(Accordion_default.accordion, className), children: items.map((item) => {
|
|
26
27
|
const isOpen = openIds.includes(item.id);
|
|
27
28
|
const triggerId = `${baseId}-trigger-${item.id}`;
|
|
28
29
|
const panelId = `${baseId}-panel-${item.id}`;
|
|
@@ -70,7 +71,7 @@ function Accordion({
|
|
|
70
71
|
}
|
|
71
72
|
|
|
72
73
|
// src/components/ui/Alert/Alert.module.css
|
|
73
|
-
var Alert_default = {"alert":"
|
|
74
|
+
var Alert_default = {"alert":"bds122Alert-alert","--variant_info":"bds122Alert---variant_info","--variant_success":"bds122Alert---variant_success","--variant_warning":"bds122Alert---variant_warning","--variant_error":"bds122Alert---variant_error","icon":"bds122Alert-icon","content":"bds122Alert-content","title":"bds122Alert-title","dismiss":"bds122Alert-dismiss"};
|
|
74
75
|
|
|
75
76
|
// src/components/ui/Alert/Alert.tsx
|
|
76
77
|
import { cn as cn2 } from "@boostdev/design-system-foundation";
|
|
@@ -81,12 +82,14 @@ function Alert({
|
|
|
81
82
|
title,
|
|
82
83
|
children,
|
|
83
84
|
onDismiss,
|
|
84
|
-
className
|
|
85
|
+
className,
|
|
86
|
+
...rest
|
|
85
87
|
}) {
|
|
86
88
|
const isUrgent = variant === "error" || variant === "warning";
|
|
87
89
|
return /* @__PURE__ */ jsxs2(
|
|
88
90
|
"div",
|
|
89
91
|
{
|
|
92
|
+
...rest,
|
|
90
93
|
role: isUrgent ? "alert" : "status",
|
|
91
94
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
92
95
|
"aria-atomic": "true",
|
|
@@ -113,7 +116,7 @@ function Alert({
|
|
|
113
116
|
}
|
|
114
117
|
|
|
115
118
|
// src/components/ui/Avatar/Avatar.module.css
|
|
116
|
-
var Avatar_default = {"avatar":"
|
|
119
|
+
var Avatar_default = {"avatar":"bds122Avatar-avatar","--fallback":"bds122Avatar---fallback","--size_small":"bds122Avatar---size_small","--size_medium":"bds122Avatar---size_medium","--size_large":"bds122Avatar---size_large","image":"bds122Avatar-image","initials":"bds122Avatar-initials"};
|
|
117
120
|
|
|
118
121
|
// src/components/ui/Avatar/Avatar.tsx
|
|
119
122
|
import { cn as cn3 } from "@boostdev/design-system-foundation";
|
|
@@ -121,15 +124,16 @@ import { jsx as jsx3 } from "react/jsx-runtime";
|
|
|
121
124
|
function getInitials(name) {
|
|
122
125
|
return name.split(" ").filter(Boolean).slice(0, 2).map((word) => word[0].toUpperCase()).join("");
|
|
123
126
|
}
|
|
124
|
-
function Avatar({ src, alt, name, size = "medium", className }) {
|
|
127
|
+
function Avatar({ src, alt, name, size = "medium", className, ...rest }) {
|
|
125
128
|
const sizeClass = Avatar_default[`--size_${size}`];
|
|
126
129
|
if (src) {
|
|
127
|
-
return /* @__PURE__ */ jsx3("span", { className: cn3(Avatar_default.avatar, sizeClass, className), children: /* @__PURE__ */ jsx3("img", { src, alt: alt ?? name ?? "User avatar", className: Avatar_default.image }) });
|
|
130
|
+
return /* @__PURE__ */ jsx3("span", { ...rest, className: cn3(Avatar_default.avatar, sizeClass, className), children: /* @__PURE__ */ jsx3("img", { src, alt: alt ?? name ?? "User avatar", className: Avatar_default.image }) });
|
|
128
131
|
}
|
|
129
132
|
const initials = name ? getInitials(name) : "";
|
|
130
133
|
return /* @__PURE__ */ jsx3(
|
|
131
134
|
"span",
|
|
132
135
|
{
|
|
136
|
+
...rest,
|
|
133
137
|
role: "img",
|
|
134
138
|
"aria-label": name ?? "User avatar",
|
|
135
139
|
className: cn3(Avatar_default.avatar, Avatar_default["--fallback"], sizeClass, className),
|
|
@@ -139,23 +143,23 @@ function Avatar({ src, alt, name, size = "medium", className }) {
|
|
|
139
143
|
}
|
|
140
144
|
|
|
141
145
|
// src/components/ui/Badge/Badge.module.css
|
|
142
|
-
var Badge_default = {"badge":"
|
|
146
|
+
var Badge_default = {"badge":"bds122Badge-badge","--variant_primary":"bds122Badge---variant_primary","--variant_secondary":"bds122Badge---variant_secondary","--variant_success":"bds122Badge---variant_success","--variant_error":"bds122Badge---variant_error","--variant_warning":"bds122Badge---variant_warning"};
|
|
143
147
|
|
|
144
148
|
// src/components/ui/Badge/Badge.tsx
|
|
145
149
|
import { cn as cn4 } from "@boostdev/design-system-foundation";
|
|
146
150
|
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
147
|
-
function Badge({ children, variant = "primary", className }) {
|
|
148
|
-
return /* @__PURE__ */ jsx4("span", { className: cn4(Badge_default.badge, Badge_default[`--variant_${variant}`], className), children });
|
|
151
|
+
function Badge({ children, variant = "primary", className, ...rest }) {
|
|
152
|
+
return /* @__PURE__ */ jsx4("span", { ...rest, className: cn4(Badge_default.badge, Badge_default[`--variant_${variant}`], className), children });
|
|
149
153
|
}
|
|
150
154
|
|
|
151
155
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
152
|
-
var Breadcrumb_default = {"breadcrumb":"
|
|
156
|
+
var Breadcrumb_default = {"breadcrumb":"bds122Breadcrumb-breadcrumb","list":"bds122Breadcrumb-list","item":"bds122Breadcrumb-item","link":"bds122Breadcrumb-link","separator":"bds122Breadcrumb-separator","current":"bds122Breadcrumb-current"};
|
|
153
157
|
|
|
154
158
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
155
159
|
import { cn as cn5 } from "@boostdev/design-system-foundation";
|
|
156
160
|
import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
157
|
-
function Breadcrumb({ items, className }) {
|
|
158
|
-
return /* @__PURE__ */ jsx5("nav", { "aria-label": "Breadcrumb", className: cn5(Breadcrumb_default.breadcrumb, className), children: /* @__PURE__ */ jsx5("ol", { className: Breadcrumb_default.list, children: items.map((item, index) => {
|
|
161
|
+
function Breadcrumb({ items, className, ...rest }) {
|
|
162
|
+
return /* @__PURE__ */ jsx5("nav", { ...rest, "aria-label": "Breadcrumb", className: cn5(Breadcrumb_default.breadcrumb, className), children: /* @__PURE__ */ jsx5("ol", { className: Breadcrumb_default.list, children: items.map((item, index) => {
|
|
159
163
|
const isLast = index === items.length - 1;
|
|
160
164
|
return /* @__PURE__ */ jsx5("li", { className: Breadcrumb_default.item, children: isLast ? /* @__PURE__ */ jsx5("span", { "aria-current": "page", className: Breadcrumb_default.current, children: item.label }) : /* @__PURE__ */ jsxs3(Fragment, { children: [
|
|
161
165
|
/* @__PURE__ */ jsx5("a", { href: item.href, className: Breadcrumb_default.link, children: item.label }),
|
|
@@ -165,7 +169,7 @@ function Breadcrumb({ items, className }) {
|
|
|
165
169
|
}
|
|
166
170
|
|
|
167
171
|
// src/components/ui/Collapsible/Collapsible.module.css
|
|
168
|
-
var Collapsible_default = {"collapsible":"
|
|
172
|
+
var Collapsible_default = {"collapsible":"bds122Collapsible-collapsible","summary":"bds122Collapsible-summary","summaryContent":"bds122Collapsible-summaryContent","icon":"bds122Collapsible-icon","content":"bds122Collapsible-content"};
|
|
169
173
|
|
|
170
174
|
// src/components/ui/Collapsible/Collapsible.tsx
|
|
171
175
|
import { cn as cn6 } from "@boostdev/design-system-foundation";
|
|
@@ -206,7 +210,7 @@ function Collapsible({
|
|
|
206
210
|
import { useState as useState2, useId as useId2 } from "react";
|
|
207
211
|
|
|
208
212
|
// src/components/ui/Calendar/Calendar.module.css
|
|
209
|
-
var Calendar_default = {"calendar":"
|
|
213
|
+
var Calendar_default = {"calendar":"bds122Calendar-calendar","header":"bds122Calendar-header","monthYear":"bds122Calendar-monthYear","navBtn":"bds122Calendar-navBtn","grid":"bds122Calendar-grid","weekday":"bds122Calendar-weekday","empty":"bds122Calendar-empty","day":"bds122Calendar-day","disabled":"bds122Calendar-disabled","selected":"bds122Calendar-selected","today":"bds122Calendar-today"};
|
|
210
214
|
|
|
211
215
|
// src/components/ui/Calendar/Calendar.tsx
|
|
212
216
|
import { cn as cn7 } from "@boostdev/design-system-foundation";
|
|
@@ -252,7 +256,7 @@ function getDaysInMonth(year, month) {
|
|
|
252
256
|
function getFirstDayOfMonth(year, month) {
|
|
253
257
|
return new Date(year, month, 1).getDay();
|
|
254
258
|
}
|
|
255
|
-
function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
259
|
+
function Calendar({ value, defaultValue, min, max, onChange, className, ...rest }) {
|
|
256
260
|
const today = /* @__PURE__ */ new Date();
|
|
257
261
|
const controlled = value !== void 0;
|
|
258
262
|
const [internal, setInternal] = useState2(defaultValue);
|
|
@@ -306,7 +310,7 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
306
310
|
...Array.from({ length: daysInMonth }, (_, i) => ({ day: i + 1 }))
|
|
307
311
|
];
|
|
308
312
|
while (cells.length % 7 !== 0) cells.push(null);
|
|
309
|
-
return /* @__PURE__ */ jsxs5("div", { className: cn7(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
313
|
+
return /* @__PURE__ */ jsxs5("div", { ...rest, className: cn7(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
310
314
|
/* @__PURE__ */ jsxs5("div", { className: Calendar_default.header, children: [
|
|
311
315
|
/* @__PURE__ */ jsx7(
|
|
312
316
|
"button",
|
|
@@ -381,12 +385,12 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
381
385
|
import { useRef, useId as useId3 } from "react";
|
|
382
386
|
|
|
383
387
|
// src/components/ui/Carousel/Carousel.module.css
|
|
384
|
-
var Carousel_default = {"carousel":"
|
|
388
|
+
var Carousel_default = {"carousel":"bds122Carousel-carousel","track":"bds122Carousel-track","slide":"bds122Carousel-slide","navBtn":"bds122Carousel-navBtn"};
|
|
385
389
|
|
|
386
390
|
// src/components/ui/Carousel/Carousel.tsx
|
|
387
391
|
import { cn as cn8 } from "@boostdev/design-system-foundation";
|
|
388
392
|
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
389
|
-
function Carousel({ items, label, className }) {
|
|
393
|
+
function Carousel({ items, label, className, ...rest }) {
|
|
390
394
|
const trackRef = useRef(null);
|
|
391
395
|
const listId = useId3();
|
|
392
396
|
const scroll = (direction) => {
|
|
@@ -397,7 +401,7 @@ function Carousel({ items, label, className }) {
|
|
|
397
401
|
behavior: "smooth"
|
|
398
402
|
});
|
|
399
403
|
};
|
|
400
|
-
return /* @__PURE__ */ jsxs6("section", { "aria-label": label, className: cn8(Carousel_default.carousel, className), children: [
|
|
404
|
+
return /* @__PURE__ */ jsxs6("section", { ...rest, "aria-label": label, className: cn8(Carousel_default.carousel, className), children: [
|
|
401
405
|
/* @__PURE__ */ jsx8(
|
|
402
406
|
"button",
|
|
403
407
|
{
|
|
@@ -434,20 +438,20 @@ function Carousel({ items, label, className }) {
|
|
|
434
438
|
}
|
|
435
439
|
|
|
436
440
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
437
|
-
var DescriptionList_default = {"list":"
|
|
441
|
+
var DescriptionList_default = {"list":"bds122DescriptionList-list","group":"bds122DescriptionList-group","term":"bds122DescriptionList-term","details":"bds122DescriptionList-details","--layout_inline":"bds122DescriptionList---layout_inline"};
|
|
438
442
|
|
|
439
443
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
440
444
|
import { cn as cn9 } from "@boostdev/design-system-foundation";
|
|
441
445
|
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
442
|
-
function DescriptionList({ items, layout = "stacked", className }) {
|
|
443
|
-
return /* @__PURE__ */ jsx9("dl", { className: cn9(DescriptionList_default.list, DescriptionList_default[`--layout_${layout}`], className), children: items.map((item, i) => /* @__PURE__ */ jsxs7("div", { className: DescriptionList_default.group, children: [
|
|
446
|
+
function DescriptionList({ items, layout = "stacked", className, ...rest }) {
|
|
447
|
+
return /* @__PURE__ */ jsx9("dl", { ...rest, className: cn9(DescriptionList_default.list, DescriptionList_default[`--layout_${layout}`], className), children: items.map((item, i) => /* @__PURE__ */ jsxs7("div", { className: DescriptionList_default.group, children: [
|
|
444
448
|
/* @__PURE__ */ jsx9("dt", { className: DescriptionList_default.term, children: item.term }),
|
|
445
449
|
Array.isArray(item.details) ? item.details.map((d, j) => /* @__PURE__ */ jsx9("dd", { className: DescriptionList_default.details, children: d }, j)) : /* @__PURE__ */ jsx9("dd", { className: DescriptionList_default.details, children: item.details })
|
|
446
450
|
] }, i)) });
|
|
447
451
|
}
|
|
448
452
|
|
|
449
453
|
// src/components/ui/Link/Link.module.css
|
|
450
|
-
var Link_default = {"link":"
|
|
454
|
+
var Link_default = {"link":"bds122Link-link","--variant_default":"bds122Link---variant_default","--variant_subtle":"bds122Link---variant_subtle","--variant_standalone":"bds122Link---variant_standalone","externalLabel":"bds122Link-externalLabel"};
|
|
451
455
|
|
|
452
456
|
// src/components/ui/Link/Link.tsx
|
|
453
457
|
import { cn as cn10 } from "@boostdev/design-system-foundation";
|
|
@@ -478,17 +482,17 @@ function Link({
|
|
|
478
482
|
}
|
|
479
483
|
|
|
480
484
|
// src/components/ui/Loading/Loading.module.css
|
|
481
|
-
var Loading_default = {"loading":"
|
|
485
|
+
var Loading_default = {"loading":"bds122Loading-loading","spinner":"bds122Loading-spinner","--size_small":"bds122Loading---size_small","--size_large":"bds122Loading---size_large"};
|
|
482
486
|
|
|
483
487
|
// src/components/ui/Loading/Loading.tsx
|
|
484
488
|
import { cn as cn11 } from "@boostdev/design-system-foundation";
|
|
485
489
|
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
486
|
-
function Loading({ size = "medium", className }) {
|
|
487
|
-
return /* @__PURE__ */ jsx11("div", { className: cn11(Loading_default.loading, Loading_default[`--size_${size}`], className), children: /* @__PURE__ */ jsx11("div", { className: Loading_default.spinner, role: "status", "aria-label": "Loading" }) });
|
|
490
|
+
function Loading({ size = "medium", className, ...rest }) {
|
|
491
|
+
return /* @__PURE__ */ jsx11("div", { ...rest, className: cn11(Loading_default.loading, Loading_default[`--size_${size}`], className), children: /* @__PURE__ */ jsx11("div", { className: Loading_default.spinner, role: "status", "aria-label": "Loading" }) });
|
|
488
492
|
}
|
|
489
493
|
|
|
490
494
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
491
|
-
var NotificationBanner_default = {"banner":"
|
|
495
|
+
var NotificationBanner_default = {"banner":"bds122NotificationBanner-banner","--variant_info":"bds122NotificationBanner---variant_info","--variant_success":"bds122NotificationBanner---variant_success","--variant_warning":"bds122NotificationBanner---variant_warning","--variant_error":"bds122NotificationBanner---variant_error","content":"bds122NotificationBanner-content","action":"bds122NotificationBanner-action","dismiss":"bds122NotificationBanner-dismiss"};
|
|
492
496
|
|
|
493
497
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
494
498
|
import { cn as cn12 } from "@boostdev/design-system-foundation";
|
|
@@ -498,12 +502,14 @@ function NotificationBanner({
|
|
|
498
502
|
children,
|
|
499
503
|
action,
|
|
500
504
|
onDismiss,
|
|
501
|
-
className
|
|
505
|
+
className,
|
|
506
|
+
...rest
|
|
502
507
|
}) {
|
|
503
508
|
const isUrgent = variant === "error" || variant === "warning";
|
|
504
509
|
return /* @__PURE__ */ jsxs9(
|
|
505
510
|
"div",
|
|
506
511
|
{
|
|
512
|
+
...rest,
|
|
507
513
|
role: isUrgent ? "alert" : "status",
|
|
508
514
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
509
515
|
"aria-atomic": "true",
|
|
@@ -527,7 +533,7 @@ function NotificationBanner({
|
|
|
527
533
|
}
|
|
528
534
|
|
|
529
535
|
// src/components/ui/Pagination/Pagination.module.css
|
|
530
|
-
var Pagination_default = {"pagination":"
|
|
536
|
+
var Pagination_default = {"pagination":"bds122Pagination-pagination","list":"bds122Pagination-list","button":"bds122Pagination-button","--active":"bds122Pagination---active","--nav":"bds122Pagination---nav","ellipsis":"bds122Pagination-ellipsis"};
|
|
531
537
|
|
|
532
538
|
// src/components/ui/Pagination/Pagination.tsx
|
|
533
539
|
import { cn as cn13 } from "@boostdev/design-system-foundation";
|
|
@@ -548,10 +554,11 @@ function Pagination({
|
|
|
548
554
|
currentPage,
|
|
549
555
|
totalPages,
|
|
550
556
|
onPageChange,
|
|
551
|
-
className
|
|
557
|
+
className,
|
|
558
|
+
...rest
|
|
552
559
|
}) {
|
|
553
560
|
const pages = getPageRange(currentPage, totalPages);
|
|
554
|
-
return /* @__PURE__ */ jsx13("nav", { "aria-label": "Pagination", className: cn13(Pagination_default.pagination, className), children: /* @__PURE__ */ jsxs10("ul", { className: Pagination_default.list, children: [
|
|
561
|
+
return /* @__PURE__ */ jsx13("nav", { ...rest, "aria-label": "Pagination", className: cn13(Pagination_default.pagination, className), children: /* @__PURE__ */ jsxs10("ul", { className: Pagination_default.list, children: [
|
|
555
562
|
/* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(
|
|
556
563
|
"button",
|
|
557
564
|
{
|
|
@@ -591,7 +598,7 @@ function Pagination({
|
|
|
591
598
|
}
|
|
592
599
|
|
|
593
600
|
// src/components/ui/Progress/Progress.module.css
|
|
594
|
-
var Progress_default = {"container":"
|
|
601
|
+
var Progress_default = {"container":"bds122Progress-container","labelRow":"bds122Progress-labelRow","value":"bds122Progress-value","track":"bds122Progress-track","--size_small":"bds122Progress---size_small","--size_medium":"bds122Progress---size_medium","--size_large":"bds122Progress---size_large","fill":"bds122Progress-fill"};
|
|
595
602
|
|
|
596
603
|
// src/components/ui/Progress/Progress.tsx
|
|
597
604
|
import { cn as cn14 } from "@boostdev/design-system-foundation";
|
|
@@ -602,10 +609,11 @@ function Progress({
|
|
|
602
609
|
label,
|
|
603
610
|
showLabel = false,
|
|
604
611
|
size = "medium",
|
|
605
|
-
className
|
|
612
|
+
className,
|
|
613
|
+
...rest
|
|
606
614
|
}) {
|
|
607
615
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
608
|
-
return /* @__PURE__ */ jsxs11("div", { className: cn14(Progress_default.container, className), children: [
|
|
616
|
+
return /* @__PURE__ */ jsxs11("div", { ...rest, className: cn14(Progress_default.container, className), children: [
|
|
609
617
|
showLabel && /* @__PURE__ */ jsxs11("div", { className: Progress_default.labelRow, children: [
|
|
610
618
|
/* @__PURE__ */ jsx14("span", { className: Progress_default.label, children: label }),
|
|
611
619
|
/* @__PURE__ */ jsxs11("span", { className: Progress_default.value, children: [
|
|
@@ -629,7 +637,7 @@ function Progress({
|
|
|
629
637
|
}
|
|
630
638
|
|
|
631
639
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
632
|
-
var ProgressCircle_default = {"wrapper":"
|
|
640
|
+
var ProgressCircle_default = {"wrapper":"bds122ProgressCircle-wrapper","svg":"bds122ProgressCircle-svg","track":"bds122ProgressCircle-track","fill":"bds122ProgressCircle-fill","value":"bds122ProgressCircle-value","--size_small":"bds122ProgressCircle---size_small","--size_medium":"bds122ProgressCircle---size_medium","--size_large":"bds122ProgressCircle---size_large"};
|
|
633
641
|
|
|
634
642
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
635
643
|
import { cn as cn15 } from "@boostdev/design-system-foundation";
|
|
@@ -642,7 +650,8 @@ function ProgressCircle({
|
|
|
642
650
|
label,
|
|
643
651
|
showValue = false,
|
|
644
652
|
size = "medium",
|
|
645
|
-
className
|
|
653
|
+
className,
|
|
654
|
+
...rest
|
|
646
655
|
}) {
|
|
647
656
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
648
657
|
const px = SIZE_PX[size];
|
|
@@ -653,6 +662,7 @@ function ProgressCircle({
|
|
|
653
662
|
return /* @__PURE__ */ jsxs12(
|
|
654
663
|
"div",
|
|
655
664
|
{
|
|
665
|
+
...rest,
|
|
656
666
|
role: "progressbar",
|
|
657
667
|
"aria-label": label,
|
|
658
668
|
"aria-valuenow": value,
|
|
@@ -708,49 +718,50 @@ function ProgressCircle({
|
|
|
708
718
|
}
|
|
709
719
|
|
|
710
720
|
// src/components/ui/Separator/Separator.module.css
|
|
711
|
-
var Separator_default = {"separator":"
|
|
721
|
+
var Separator_default = {"separator":"bds122Separator-separator","--horizontal":"bds122Separator---horizontal","--vertical":"bds122Separator---vertical"};
|
|
712
722
|
|
|
713
723
|
// src/components/ui/Separator/Separator.tsx
|
|
714
724
|
import { cn as cn16 } from "@boostdev/design-system-foundation";
|
|
715
725
|
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
716
|
-
function Separator({ orientation = "horizontal", className }) {
|
|
726
|
+
function Separator({ orientation = "horizontal", className, ...rest }) {
|
|
717
727
|
if (orientation === "vertical") {
|
|
718
728
|
return /* @__PURE__ */ jsx16(
|
|
719
729
|
"div",
|
|
720
730
|
{
|
|
731
|
+
...rest,
|
|
721
732
|
role: "separator",
|
|
722
733
|
"aria-orientation": "vertical",
|
|
723
734
|
className: cn16(Separator_default.separator, Separator_default["--vertical"], className)
|
|
724
735
|
}
|
|
725
736
|
);
|
|
726
737
|
}
|
|
727
|
-
return /* @__PURE__ */ jsx16("hr", { "aria-orientation": "horizontal", className: cn16(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
738
|
+
return /* @__PURE__ */ jsx16("hr", { ...rest, "aria-orientation": "horizontal", className: cn16(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
728
739
|
}
|
|
729
740
|
|
|
730
741
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
731
742
|
import { cn as cn17 } from "@boostdev/design-system-foundation";
|
|
732
743
|
|
|
733
744
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
734
|
-
var Skeleton_default = {"skeleton":"
|
|
745
|
+
var Skeleton_default = {"skeleton":"bds122Skeleton-skeleton"};
|
|
735
746
|
|
|
736
747
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
737
748
|
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
738
|
-
function Skeleton({ className }) {
|
|
739
|
-
return /* @__PURE__ */ jsx17("div", { "aria-hidden": "true", className: cn17(Skeleton_default.skeleton, className) });
|
|
749
|
+
function Skeleton({ className, ...rest }) {
|
|
750
|
+
return /* @__PURE__ */ jsx17("div", { ...rest, "aria-hidden": "true", className: cn17(Skeleton_default.skeleton, className) });
|
|
740
751
|
}
|
|
741
752
|
|
|
742
753
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
743
|
-
var SkipLink_default = {"skipLink":"
|
|
754
|
+
var SkipLink_default = {"skipLink":"bds122SkipLink-skipLink"};
|
|
744
755
|
|
|
745
756
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
746
757
|
import { cn as cn18 } from "@boostdev/design-system-foundation";
|
|
747
758
|
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
748
|
-
function SkipLink({ href = "#main", children = "Skip to main content", className }) {
|
|
749
|
-
return /* @__PURE__ */ jsx18("a", { href, className: cn18(SkipLink_default.skipLink, className), children });
|
|
759
|
+
function SkipLink({ href = "#main", children = "Skip to main content", className, ...rest }) {
|
|
760
|
+
return /* @__PURE__ */ jsx18("a", { ...rest, href, className: cn18(SkipLink_default.skipLink, className), children });
|
|
750
761
|
}
|
|
751
762
|
|
|
752
763
|
// src/components/ui/Table/Table.module.css
|
|
753
|
-
var Table_default = {"wrapper":"
|
|
764
|
+
var Table_default = {"wrapper":"bds122Table-wrapper","table":"bds122Table-table","caption":"bds122Table-caption","thead":"bds122Table-thead","th":"bds122Table-th","--sortable":"bds122Table---sortable","sortButton":"bds122Table-sortButton","sortIcon":"bds122Table-sortIcon","--sort-active":"bds122Table---sort-active","--sort-desc":"bds122Table---sort-desc","tbody":"bds122Table-tbody","tr":"bds122Table-tr","td":"bds122Table-td"};
|
|
754
765
|
|
|
755
766
|
// src/components/ui/Table/Table.tsx
|
|
756
767
|
import { cn as cn19 } from "@boostdev/design-system-foundation";
|
|
@@ -820,12 +831,12 @@ function Table({
|
|
|
820
831
|
import { useId as useId4, useRef as useRef2, useState as useState3 } from "react";
|
|
821
832
|
|
|
822
833
|
// src/components/ui/Tabs/Tabs.module.css
|
|
823
|
-
var Tabs_default = {"tabs":"
|
|
834
|
+
var Tabs_default = {"tabs":"bds122Tabs-tabs","tabList":"bds122Tabs-tabList","tab":"bds122Tabs-tab","--active":"bds122Tabs---active","panel":"bds122Tabs-panel"};
|
|
824
835
|
|
|
825
836
|
// src/components/ui/Tabs/Tabs.tsx
|
|
826
837
|
import { cn as cn20 } from "@boostdev/design-system-foundation";
|
|
827
838
|
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
828
|
-
function Tabs({ tabs, defaultTab, className }) {
|
|
839
|
+
function Tabs({ tabs, defaultTab, className, ...rest }) {
|
|
829
840
|
const baseId = useId4();
|
|
830
841
|
const [activeTab, setActiveTab] = useState3(defaultTab ?? tabs[0]?.id);
|
|
831
842
|
const tabRefs = useRef2([]);
|
|
@@ -850,7 +861,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
850
861
|
focusAt(enabledIndexes[enabledIndexes.length - 1]);
|
|
851
862
|
}
|
|
852
863
|
};
|
|
853
|
-
return /* @__PURE__ */ jsxs14("div", { className: cn20(Tabs_default.tabs, className), children: [
|
|
864
|
+
return /* @__PURE__ */ jsxs14("div", { ...rest, className: cn20(Tabs_default.tabs, className), children: [
|
|
854
865
|
/* @__PURE__ */ jsx20("div", { role: "tablist", className: Tabs_default.tabList, children: tabs.map((tab, i) => {
|
|
855
866
|
const tabId = `${baseId}-tab-${tab.id}`;
|
|
856
867
|
const panelId = `${baseId}-panel-${tab.id}`;
|
|
@@ -900,7 +911,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
900
911
|
import { cloneElement, isValidElement, useId as useId5, useState as useState4 } from "react";
|
|
901
912
|
|
|
902
913
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
903
|
-
var Tooltip_default = {"wrapper":"
|
|
914
|
+
var Tooltip_default = {"wrapper":"bds122Tooltip-wrapper","tooltip":"bds122Tooltip-tooltip","--placement_top":"bds122Tooltip---placement_top","--placement_bottom":"bds122Tooltip---placement_bottom","--placement_left":"bds122Tooltip---placement_left","--placement_right":"bds122Tooltip---placement_right"};
|
|
904
915
|
|
|
905
916
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
906
917
|
import { cn as cn21 } from "@boostdev/design-system-foundation";
|
|
@@ -909,7 +920,8 @@ function Tooltip({
|
|
|
909
920
|
content,
|
|
910
921
|
placement = "top",
|
|
911
922
|
children,
|
|
912
|
-
className
|
|
923
|
+
className,
|
|
924
|
+
...rest
|
|
913
925
|
}) {
|
|
914
926
|
const tooltipId = useId5();
|
|
915
927
|
const [isVisible, setIsVisible] = useState4(false);
|
|
@@ -919,6 +931,7 @@ function Tooltip({
|
|
|
919
931
|
return /* @__PURE__ */ jsxs15(
|
|
920
932
|
"span",
|
|
921
933
|
{
|
|
934
|
+
...rest,
|
|
922
935
|
className: cn21(Tooltip_default.wrapper, className),
|
|
923
936
|
onMouseEnter: () => setIsVisible(true),
|
|
924
937
|
onMouseLeave: () => setIsVisible(false),
|
|
@@ -942,7 +955,7 @@ function Tooltip({
|
|
|
942
955
|
}
|
|
943
956
|
|
|
944
957
|
// src/components/ui/Typography/Typography.module.css
|
|
945
|
-
var Typography_default = {"typography":"
|
|
958
|
+
var Typography_default = {"typography":"bds122Typography-typography","--h1":"bds122Typography---h1","--h2":"bds122Typography---h2","--h3":"bds122Typography---h3","--body":"bds122Typography---body","--body_s":"bds122Typography---body_s"};
|
|
946
959
|
|
|
947
960
|
// src/components/ui/Typography/Typography.tsx
|
|
948
961
|
import { cn as cn22 } from "@boostdev/design-system-foundation";
|
|
@@ -954,13 +967,13 @@ var variantToElement = {
|
|
|
954
967
|
body: "p",
|
|
955
968
|
body_s: "p"
|
|
956
969
|
};
|
|
957
|
-
function Typography({ variant = "body", component, children, className }) {
|
|
970
|
+
function Typography({ variant = "body", component, children, className, ...rest }) {
|
|
958
971
|
const Component = component || variantToElement[variant];
|
|
959
|
-
return /* @__PURE__ */ jsx22(Component, { className: cn22(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
972
|
+
return /* @__PURE__ */ jsx22(Component, { ...rest, className: cn22(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
960
973
|
}
|
|
961
974
|
|
|
962
975
|
// src/components/interaction/Button/Button.module.css
|
|
963
|
-
var Button_default = {"button":"
|
|
976
|
+
var Button_default = {"button":"bds122Button-button","--default":"bds122Button---default","--outline":"bds122Button---outline","--ghost":"bds122Button---ghost","--size_small":"bds122Button---size_small","--size_medium":"bds122Button---size_medium","--size_large":"bds122Button---size_large","--hasPulse":"bds122Button---hasPulse","iconStart":"bds122Button-iconStart","iconEnd":"bds122Button-iconEnd"};
|
|
964
977
|
|
|
965
978
|
// src/components/interaction/Button/Button.tsx
|
|
966
979
|
import { cn as cn23 } from "@boostdev/design-system-foundation";
|
|
@@ -1075,7 +1088,7 @@ function installInvokerCommandsPolyfill() {
|
|
|
1075
1088
|
}
|
|
1076
1089
|
|
|
1077
1090
|
// src/components/interaction/Command/Command.module.css
|
|
1078
|
-
var Command_default = {"dialog":"
|
|
1091
|
+
var Command_default = {"dialog":"bds122Command-dialog","palette":"bds122Command-palette","searchRow":"bds122Command-searchRow","searchIcon":"bds122Command-searchIcon","search":"bds122Command-search","escHint":"bds122Command-escHint","list":"bds122Command-list","groupList":"bds122Command-groupList","group":"bds122Command-group","item":"bds122Command-item","itemActive":"bds122Command-itemActive","itemLabel":"bds122Command-itemLabel","itemDesc":"bds122Command-itemDesc","shortcut":"bds122Command-shortcut","empty":"bds122Command-empty"};
|
|
1079
1092
|
|
|
1080
1093
|
// src/components/interaction/Command/Command.tsx
|
|
1081
1094
|
import { cn as cn24 } from "@boostdev/design-system-foundation";
|
|
@@ -1088,7 +1101,8 @@ function Command({
|
|
|
1088
1101
|
onClose,
|
|
1089
1102
|
items,
|
|
1090
1103
|
placeholder = "Search commands\u2026",
|
|
1091
|
-
className
|
|
1104
|
+
className,
|
|
1105
|
+
...rest
|
|
1092
1106
|
}) {
|
|
1093
1107
|
const [query, setQuery] = useState5("");
|
|
1094
1108
|
const [activeIndex, setActiveIndex] = useState5(0);
|
|
@@ -1183,6 +1197,7 @@ function Command({
|
|
|
1183
1197
|
return /* @__PURE__ */ jsx24(
|
|
1184
1198
|
"dialog",
|
|
1185
1199
|
{
|
|
1200
|
+
...rest,
|
|
1186
1201
|
ref: dialogRef,
|
|
1187
1202
|
id: dialogId,
|
|
1188
1203
|
className: cn24(Command_default.dialog, className),
|
|
@@ -1250,14 +1265,14 @@ function Command({
|
|
|
1250
1265
|
import { useEffect as useEffect2, useId as useId7, useRef as useRef4 } from "react";
|
|
1251
1266
|
|
|
1252
1267
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1253
|
-
var Dialog_default = {"dialog":"
|
|
1268
|
+
var Dialog_default = {"dialog":"bds122Dialog-dialog","dialogContent":"bds122Dialog-dialogContent","closeButton":"bds122Dialog-closeButton"};
|
|
1254
1269
|
|
|
1255
1270
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1256
1271
|
import { cn as cn25 } from "@boostdev/design-system-foundation";
|
|
1257
1272
|
import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1258
1273
|
installInvokerCommandsPolyfill();
|
|
1259
1274
|
var FOCUSABLE_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
|
|
1260
|
-
function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClose }) {
|
|
1275
|
+
function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClose, ...rest }) {
|
|
1261
1276
|
const generatedId = useId7();
|
|
1262
1277
|
const id = idProp ?? generatedId;
|
|
1263
1278
|
const dialogRef = useRef4(null);
|
|
@@ -1326,6 +1341,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1326
1341
|
return /* @__PURE__ */ jsxs18(
|
|
1327
1342
|
"dialog",
|
|
1328
1343
|
{
|
|
1344
|
+
...rest,
|
|
1329
1345
|
ref: dialogRef,
|
|
1330
1346
|
id,
|
|
1331
1347
|
className: cn25(className, Dialog_default.dialog),
|
|
@@ -1355,7 +1371,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1355
1371
|
import { useEffect as useEffect3, useId as useId8, useRef as useRef5 } from "react";
|
|
1356
1372
|
|
|
1357
1373
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1358
|
-
var Drawer_default = {"drawer":"
|
|
1374
|
+
var Drawer_default = {"drawer":"bds122Drawer-drawer","--side_left":"bds122Drawer---side_left","header":"bds122Drawer-header","closeButton":"bds122Drawer-closeButton","body":"bds122Drawer-body"};
|
|
1359
1375
|
|
|
1360
1376
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1361
1377
|
import { cn as cn26 } from "@boostdev/design-system-foundation";
|
|
@@ -1369,8 +1385,8 @@ function Drawer({
|
|
|
1369
1385
|
title,
|
|
1370
1386
|
children,
|
|
1371
1387
|
side = "right",
|
|
1372
|
-
|
|
1373
|
-
|
|
1388
|
+
className,
|
|
1389
|
+
...rest
|
|
1374
1390
|
}) {
|
|
1375
1391
|
const generatedId = useId8();
|
|
1376
1392
|
const id = idProp ?? generatedId;
|
|
@@ -1424,10 +1440,10 @@ function Drawer({
|
|
|
1424
1440
|
return /* @__PURE__ */ jsxs19(
|
|
1425
1441
|
"dialog",
|
|
1426
1442
|
{
|
|
1443
|
+
...rest,
|
|
1427
1444
|
ref: dialogRef,
|
|
1428
1445
|
id,
|
|
1429
1446
|
className: cn26(Drawer_default.drawer, Drawer_default[`--side_${side}`], className),
|
|
1430
|
-
"aria-label": ariaLabel,
|
|
1431
1447
|
"aria-modal": "true",
|
|
1432
1448
|
onClick: handleClick,
|
|
1433
1449
|
onCancel: handleCancel,
|
|
@@ -1463,7 +1479,7 @@ import {
|
|
|
1463
1479
|
} from "react";
|
|
1464
1480
|
|
|
1465
1481
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1466
|
-
var DropdownMenu_default = {"wrapper":"
|
|
1482
|
+
var DropdownMenu_default = {"wrapper":"bds122DropdownMenu-wrapper","menu":"bds122DropdownMenu-menu","--placement_bottom-start":"bds122DropdownMenu---placement_bottom-start","--placement_bottom-end":"bds122DropdownMenu---placement_bottom-end","separator":"bds122DropdownMenu-separator","item":"bds122DropdownMenu-item","icon":"bds122DropdownMenu-icon"};
|
|
1467
1483
|
|
|
1468
1484
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1469
1485
|
import { cn as cn27 } from "@boostdev/design-system-foundation";
|
|
@@ -1472,7 +1488,8 @@ function DropdownMenu({
|
|
|
1472
1488
|
trigger,
|
|
1473
1489
|
items,
|
|
1474
1490
|
placement = "bottom-start",
|
|
1475
|
-
className
|
|
1491
|
+
className,
|
|
1492
|
+
...rest
|
|
1476
1493
|
}) {
|
|
1477
1494
|
const [isOpen, setIsOpen] = useState6(false);
|
|
1478
1495
|
const containerRef = useRef6(null);
|
|
@@ -1535,7 +1552,7 @@ function DropdownMenu({
|
|
|
1535
1552
|
if (typeof existingOnClick === "function") existingOnClick(e);
|
|
1536
1553
|
}
|
|
1537
1554
|
}) : trigger;
|
|
1538
|
-
return /* @__PURE__ */ jsxs20("div", { ref: containerRef, className: cn27(DropdownMenu_default.wrapper, className), children: [
|
|
1555
|
+
return /* @__PURE__ */ jsxs20("div", { ...rest, ref: containerRef, className: cn27(DropdownMenu_default.wrapper, className), children: [
|
|
1539
1556
|
triggerEl,
|
|
1540
1557
|
isOpen && /* @__PURE__ */ jsx27(
|
|
1541
1558
|
"ul",
|
|
@@ -1583,7 +1600,7 @@ import {
|
|
|
1583
1600
|
} from "react";
|
|
1584
1601
|
|
|
1585
1602
|
// src/components/interaction/Popover/Popover.module.css
|
|
1586
|
-
var Popover_default = {"wrapper":"
|
|
1603
|
+
var Popover_default = {"wrapper":"bds122Popover-wrapper","panel":"bds122Popover-panel","g":"bds122Popover-g"};
|
|
1587
1604
|
|
|
1588
1605
|
// src/components/interaction/Popover/Popover.tsx
|
|
1589
1606
|
import { cn as cn28 } from "@boostdev/design-system-foundation";
|
|
@@ -1598,7 +1615,8 @@ function Popover({
|
|
|
1598
1615
|
content,
|
|
1599
1616
|
placement = "bottom",
|
|
1600
1617
|
className,
|
|
1601
|
-
"aria-label": ariaLabel
|
|
1618
|
+
"aria-label": ariaLabel,
|
|
1619
|
+
...rest
|
|
1602
1620
|
}) {
|
|
1603
1621
|
const [isOpen, setIsOpen] = useState7(false);
|
|
1604
1622
|
const containerRef = useRef7(null);
|
|
@@ -1647,7 +1665,7 @@ function Popover({
|
|
|
1647
1665
|
// avoid a double-toggle when both onClick and invoker fire.
|
|
1648
1666
|
onClick: children.props.onClick
|
|
1649
1667
|
}) : children;
|
|
1650
|
-
return /* @__PURE__ */ jsxs21("span", { ref: containerRef, className: cn28(Popover_default.wrapper, className), children: [
|
|
1668
|
+
return /* @__PURE__ */ jsxs21("span", { ...rest, ref: containerRef, className: cn28(Popover_default.wrapper, className), children: [
|
|
1651
1669
|
trigger,
|
|
1652
1670
|
/* @__PURE__ */ jsx28(
|
|
1653
1671
|
"div",
|
|
@@ -1667,15 +1685,16 @@ function Popover({
|
|
|
1667
1685
|
}
|
|
1668
1686
|
|
|
1669
1687
|
// src/components/interaction/Rating/Rating.module.css
|
|
1670
|
-
var Rating_default = {"rating":"
|
|
1688
|
+
var Rating_default = {"rating":"bds122Rating-rating","star":"bds122Rating-star","--filled":"bds122Rating---filled"};
|
|
1671
1689
|
|
|
1672
1690
|
// src/components/interaction/Rating/Rating.tsx
|
|
1673
1691
|
import { cn as cn29 } from "@boostdev/design-system-foundation";
|
|
1674
1692
|
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
1675
|
-
function Rating({ value, max = 5, className }) {
|
|
1693
|
+
function Rating({ value, max = 5, className, ...rest }) {
|
|
1676
1694
|
return /* @__PURE__ */ jsx29(
|
|
1677
1695
|
"div",
|
|
1678
1696
|
{
|
|
1697
|
+
...rest,
|
|
1679
1698
|
className: cn29(Rating_default.rating, className),
|
|
1680
1699
|
role: "img",
|
|
1681
1700
|
"aria-label": `${value} out of ${max} stars`,
|
|
@@ -1698,7 +1717,7 @@ function Rating({ value, max = 5, className }) {
|
|
|
1698
1717
|
import { useState as useState8, useEffect as useEffect6, createContext, useContext, useCallback, useMemo as useMemo2, useRef as useRef8 } from "react";
|
|
1699
1718
|
|
|
1700
1719
|
// src/components/interaction/Toast/Toast.module.css
|
|
1701
|
-
var Toast_default = {"toastContainer":"
|
|
1720
|
+
var Toast_default = {"toastContainer":"bds122Toast-toastContainer","toast":"bds122Toast-toast","--variant_success":"bds122Toast---variant_success","--variant_warning":"bds122Toast---variant_warning","--variant_info":"bds122Toast---variant_info","--variant_error":"bds122Toast---variant_error","message":"bds122Toast-message","closeButton":"bds122Toast-closeButton"};
|
|
1702
1721
|
|
|
1703
1722
|
// src/components/interaction/Toast/Toast.tsx
|
|
1704
1723
|
import { cn as cn30 } from "@boostdev/design-system-foundation";
|
|
@@ -1771,10 +1790,10 @@ function useToast() {
|
|
|
1771
1790
|
import { useId as useId11 } from "react";
|
|
1772
1791
|
|
|
1773
1792
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1774
|
-
var Checkbox_default = {"checkboxGroup":"
|
|
1793
|
+
var Checkbox_default = {"checkboxGroup":"bds122Checkbox-checkboxGroup","inputWrapper":"bds122Checkbox-inputWrapper","checkbox":"bds122Checkbox-checkbox","checkboxError":"bds122Checkbox-checkboxError"};
|
|
1775
1794
|
|
|
1776
1795
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1777
|
-
var Message_default = {"error":"
|
|
1796
|
+
var Message_default = {"error":"bds122Message-error","hint":"bds122Message-hint"};
|
|
1778
1797
|
|
|
1779
1798
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1780
1799
|
import { cn as cn31 } from "@boostdev/design-system-foundation";
|
|
@@ -1785,7 +1804,7 @@ var Message = ({ message, type, inputId, className }) => {
|
|
|
1785
1804
|
};
|
|
1786
1805
|
|
|
1787
1806
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1788
|
-
var Label_default = {"label":"
|
|
1807
|
+
var Label_default = {"label":"bds122Label-label"};
|
|
1789
1808
|
|
|
1790
1809
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1791
1810
|
import { cn as cn32 } from "@boostdev/design-system-foundation";
|
|
@@ -1798,13 +1817,13 @@ var Label = ({ label, id, className }) => {
|
|
|
1798
1817
|
import { cn as cn34 } from "@boostdev/design-system-foundation";
|
|
1799
1818
|
|
|
1800
1819
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1801
|
-
var InputContainer_default = {"container":"
|
|
1820
|
+
var InputContainer_default = {"container":"bds122InputContainer-container"};
|
|
1802
1821
|
|
|
1803
1822
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1804
1823
|
import { cn as cn33 } from "@boostdev/design-system-foundation";
|
|
1805
1824
|
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
1806
|
-
var InputContainer = ({ children, className }) => {
|
|
1807
|
-
return /* @__PURE__ */ jsx33("div", { className: cn33(InputContainer_default.container, className), children });
|
|
1825
|
+
var InputContainer = ({ children, className, ...rest }) => {
|
|
1826
|
+
return /* @__PURE__ */ jsx33("div", { ...rest, className: cn33(InputContainer_default.container, className), children });
|
|
1808
1827
|
};
|
|
1809
1828
|
|
|
1810
1829
|
// src/components/interaction/form/Checkbox/Checkbox.tsx
|
|
@@ -1839,7 +1858,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1839
1858
|
import { useId as useId12 } from "react";
|
|
1840
1859
|
|
|
1841
1860
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.module.css
|
|
1842
|
-
var CheckboxGroup_default = {"group":"
|
|
1861
|
+
var CheckboxGroup_default = {"group":"bds122CheckboxGroup-group","legend":"bds122CheckboxGroup-legend","required":"bds122CheckboxGroup-required","items":"bds122CheckboxGroup-items"};
|
|
1843
1862
|
|
|
1844
1863
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
|
|
1845
1864
|
import { cn as cn35 } from "@boostdev/design-system-foundation";
|
|
@@ -1850,8 +1869,8 @@ function CheckboxGroup({
|
|
|
1850
1869
|
error,
|
|
1851
1870
|
hint,
|
|
1852
1871
|
required,
|
|
1853
|
-
|
|
1854
|
-
|
|
1872
|
+
className,
|
|
1873
|
+
...rest
|
|
1855
1874
|
}) {
|
|
1856
1875
|
const id = useId12();
|
|
1857
1876
|
const hintId = id + "hint";
|
|
@@ -1860,8 +1879,8 @@ function CheckboxGroup({
|
|
|
1860
1879
|
return /* @__PURE__ */ jsxs24(
|
|
1861
1880
|
"fieldset",
|
|
1862
1881
|
{
|
|
1882
|
+
...rest,
|
|
1863
1883
|
className: cn35(CheckboxGroup_default.group, className),
|
|
1864
|
-
disabled,
|
|
1865
1884
|
"aria-required": required || void 0,
|
|
1866
1885
|
"aria-describedby": describedBy,
|
|
1867
1886
|
children: [
|
|
@@ -1887,7 +1906,7 @@ import {
|
|
|
1887
1906
|
} from "react";
|
|
1888
1907
|
|
|
1889
1908
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1890
|
-
var Combobox_default = {"formGroup":"
|
|
1909
|
+
var Combobox_default = {"formGroup":"bds122Combobox-formGroup","inputWrapper":"bds122Combobox-inputWrapper","input":"bds122Combobox-input","inputError":"bds122Combobox-inputError","chevron":"bds122Combobox-chevron","listbox":"bds122Combobox-listbox","option":"bds122Combobox-option","--highlighted":"bds122Combobox---highlighted","--selected":"bds122Combobox---selected","--disabled":"bds122Combobox---disabled"};
|
|
1891
1910
|
|
|
1892
1911
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1893
1912
|
import { cn as cn36 } from "@boostdev/design-system-foundation";
|
|
@@ -1902,7 +1921,8 @@ function Combobox({
|
|
|
1902
1921
|
disabled = false,
|
|
1903
1922
|
error,
|
|
1904
1923
|
hint,
|
|
1905
|
-
className
|
|
1924
|
+
className,
|
|
1925
|
+
...rest
|
|
1906
1926
|
}) {
|
|
1907
1927
|
const id = name + useId13();
|
|
1908
1928
|
const listboxId = id + "listbox";
|
|
@@ -1969,7 +1989,7 @@ function Combobox({
|
|
|
1969
1989
|
setIsOpen(false);
|
|
1970
1990
|
}
|
|
1971
1991
|
};
|
|
1972
|
-
return /* @__PURE__ */ jsxs25(InputContainer, { className: cn36(Combobox_default.formGroup, className), children: [
|
|
1992
|
+
return /* @__PURE__ */ jsxs25(InputContainer, { ...rest, className: cn36(Combobox_default.formGroup, className), children: [
|
|
1973
1993
|
/* @__PURE__ */ jsx36(Label, { id, label }),
|
|
1974
1994
|
/* @__PURE__ */ jsxs25("div", { ref: containerRef, className: Combobox_default.inputWrapper, children: [
|
|
1975
1995
|
/* @__PURE__ */ jsx36(
|
|
@@ -2037,7 +2057,7 @@ function Combobox({
|
|
|
2037
2057
|
import { useId as useId14, useRef as useRef10, useState as useState10 } from "react";
|
|
2038
2058
|
|
|
2039
2059
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
2040
|
-
var FileInput_default = {"formGroup":"
|
|
2060
|
+
var FileInput_default = {"formGroup":"bds122FileInput-formGroup","fieldLabel":"bds122FileInput-fieldLabel","dropZone":"bds122FileInput-dropZone","isDragging":"bds122FileInput-isDragging","hasError":"bds122FileInput-hasError","isDisabled":"bds122FileInput-isDisabled","icon":"bds122FileInput-icon","prompt":"bds122FileInput-prompt","acceptHint":"bds122FileInput-acceptHint","hiddenInput":"bds122FileInput-hiddenInput"};
|
|
2041
2061
|
|
|
2042
2062
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2043
2063
|
import { cn as cn37 } from "@boostdev/design-system-foundation";
|
|
@@ -2052,7 +2072,8 @@ function FileInput({
|
|
|
2052
2072
|
error,
|
|
2053
2073
|
hint,
|
|
2054
2074
|
onChange,
|
|
2055
|
-
className
|
|
2075
|
+
className,
|
|
2076
|
+
...rest
|
|
2056
2077
|
}) {
|
|
2057
2078
|
const uid = name + useId14();
|
|
2058
2079
|
const hintId = uid + "hint";
|
|
@@ -2090,7 +2111,7 @@ function FileInput({
|
|
|
2090
2111
|
if (!disabled) setIsDragging(true);
|
|
2091
2112
|
};
|
|
2092
2113
|
const handleDragLeave = () => setIsDragging(false);
|
|
2093
|
-
return /* @__PURE__ */ jsxs26(InputContainer, { className: cn37(FileInput_default.formGroup, className), children: [
|
|
2114
|
+
return /* @__PURE__ */ jsxs26(InputContainer, { ...rest, className: cn37(FileInput_default.formGroup, className), children: [
|
|
2094
2115
|
/* @__PURE__ */ jsxs26(
|
|
2095
2116
|
"label",
|
|
2096
2117
|
{
|
|
@@ -2137,7 +2158,7 @@ function FileInput({
|
|
|
2137
2158
|
import { useId as useId15 } from "react";
|
|
2138
2159
|
|
|
2139
2160
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
2140
|
-
var FormInput_default = {"formGroup":"
|
|
2161
|
+
var FormInput_default = {"formGroup":"bds122FormInput-formGroup","input":"bds122FormInput-input","inputError":"bds122FormInput-inputError"};
|
|
2141
2162
|
|
|
2142
2163
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2143
2164
|
import { cn as cn38 } from "@boostdev/design-system-foundation";
|
|
@@ -2181,7 +2202,7 @@ function FormInput({
|
|
|
2181
2202
|
import { useId as useId16, useRef as useRef11, useState as useState11 } from "react";
|
|
2182
2203
|
|
|
2183
2204
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
2184
|
-
var NumberInput_default = {"formGroup":"
|
|
2205
|
+
var NumberInput_default = {"formGroup":"bds122NumberInput-formGroup","inputRow":"bds122NumberInput-inputRow","input":"bds122NumberInput-input","inputError":"bds122NumberInput-inputError","stepper":"bds122NumberInput-stepper"};
|
|
2185
2206
|
|
|
2186
2207
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2187
2208
|
import { cn as cn39 } from "@boostdev/design-system-foundation";
|
|
@@ -2198,7 +2219,8 @@ function NumberInput({
|
|
|
2198
2219
|
error,
|
|
2199
2220
|
hint,
|
|
2200
2221
|
onChange,
|
|
2201
|
-
className
|
|
2222
|
+
className,
|
|
2223
|
+
...rest
|
|
2202
2224
|
}) {
|
|
2203
2225
|
const uid = name + useId16();
|
|
2204
2226
|
const hintId = uid + "hint";
|
|
@@ -2223,7 +2245,7 @@ function NumberInput({
|
|
|
2223
2245
|
}
|
|
2224
2246
|
onChange?.(next);
|
|
2225
2247
|
};
|
|
2226
|
-
return /* @__PURE__ */ jsxs28(InputContainer, { className: cn39(NumberInput_default.formGroup, className), children: [
|
|
2248
|
+
return /* @__PURE__ */ jsxs28(InputContainer, { ...rest, className: cn39(NumberInput_default.formGroup, className), children: [
|
|
2227
2249
|
/* @__PURE__ */ jsx39(Label, { id: uid, label }),
|
|
2228
2250
|
/* @__PURE__ */ jsxs28("div", { className: NumberInput_default.inputRow, children: [
|
|
2229
2251
|
/* @__PURE__ */ jsx39(
|
|
@@ -2285,7 +2307,7 @@ function NumberInput({
|
|
|
2285
2307
|
import { useId as useId17 } from "react";
|
|
2286
2308
|
|
|
2287
2309
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
2288
|
-
var Radio_default = {"radioGroup":"
|
|
2310
|
+
var Radio_default = {"radioGroup":"bds122Radio-radioGroup","inputWrapper":"bds122Radio-inputWrapper","textWrapper":"bds122Radio-textWrapper","description":"bds122Radio-description","radio":"bds122Radio-radio","radioError":"bds122Radio-radioError"};
|
|
2289
2311
|
|
|
2290
2312
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2291
2313
|
import { cn as cn40 } from "@boostdev/design-system-foundation";
|
|
@@ -2323,7 +2345,7 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
2323
2345
|
import { useId as useId18 } from "react";
|
|
2324
2346
|
|
|
2325
2347
|
// src/components/interaction/form/RadioGroup/RadioGroup.module.css
|
|
2326
|
-
var RadioGroup_default = {"group":"
|
|
2348
|
+
var RadioGroup_default = {"group":"bds122RadioGroup-group","legend":"bds122RadioGroup-legend","required":"bds122RadioGroup-required","items":"bds122RadioGroup-items"};
|
|
2327
2349
|
|
|
2328
2350
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2329
2351
|
import { cn as cn41 } from "@boostdev/design-system-foundation";
|
|
@@ -2334,8 +2356,8 @@ function RadioGroup({
|
|
|
2334
2356
|
error,
|
|
2335
2357
|
hint,
|
|
2336
2358
|
required,
|
|
2337
|
-
|
|
2338
|
-
|
|
2359
|
+
className,
|
|
2360
|
+
...rest
|
|
2339
2361
|
}) {
|
|
2340
2362
|
const id = useId18();
|
|
2341
2363
|
const hintId = id + "hint";
|
|
@@ -2344,8 +2366,8 @@ function RadioGroup({
|
|
|
2344
2366
|
return /* @__PURE__ */ jsxs30(
|
|
2345
2367
|
"fieldset",
|
|
2346
2368
|
{
|
|
2369
|
+
...rest,
|
|
2347
2370
|
className: cn41(RadioGroup_default.group, className),
|
|
2348
|
-
disabled,
|
|
2349
2371
|
"aria-required": required || void 0,
|
|
2350
2372
|
"aria-describedby": describedBy,
|
|
2351
2373
|
children: [
|
|
@@ -2365,7 +2387,7 @@ function RadioGroup({
|
|
|
2365
2387
|
import { Children, cloneElement as cloneElement4, isValidElement as isValidElement4 } from "react";
|
|
2366
2388
|
|
|
2367
2389
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.module.css
|
|
2368
|
-
var SegmentedControl_default = {"control":"
|
|
2390
|
+
var SegmentedControl_default = {"control":"bds122SegmentedControl-control","thumb":"bds122SegmentedControl-thumb","indicator":"bds122SegmentedControl-indicator","item":"bds122SegmentedControl-item","--active":"bds122SegmentedControl---active","--disabled":"bds122SegmentedControl---disabled","--size_small":"bds122SegmentedControl---size_small","--size_large":"bds122SegmentedControl---size_large","--variant_outline":"bds122SegmentedControl---variant_outline"};
|
|
2369
2391
|
|
|
2370
2392
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2371
2393
|
import { cn as cn42 } from "@boostdev/design-system-foundation";
|
|
@@ -2377,7 +2399,7 @@ function SegmentedControl({
|
|
|
2377
2399
|
size = "medium",
|
|
2378
2400
|
variant = "outline",
|
|
2379
2401
|
className,
|
|
2380
|
-
|
|
2402
|
+
...rest
|
|
2381
2403
|
}) {
|
|
2382
2404
|
const validChildren = Children.toArray(children).filter(isValidElement4);
|
|
2383
2405
|
const autoIndex = selectedIndexProp === void 0 ? validChildren.findIndex((child) => {
|
|
@@ -2388,8 +2410,8 @@ function SegmentedControl({
|
|
|
2388
2410
|
return /* @__PURE__ */ jsxs31(
|
|
2389
2411
|
"div",
|
|
2390
2412
|
{
|
|
2413
|
+
...rest,
|
|
2391
2414
|
role: "group",
|
|
2392
|
-
"aria-label": ariaLabel,
|
|
2393
2415
|
className: cn42(SegmentedControl_default.control, SegmentedControl_default[`--size_${size}`], SegmentedControl_default[`--variant_${variant}`], className),
|
|
2394
2416
|
style: {
|
|
2395
2417
|
"--control_count": validChildren.length,
|
|
@@ -2421,7 +2443,7 @@ function SegmentedControl({
|
|
|
2421
2443
|
import { useId as useId19 } from "react";
|
|
2422
2444
|
|
|
2423
2445
|
// src/components/interaction/form/Select/Select.module.css
|
|
2424
|
-
var Select_default = {"formGroup":"
|
|
2446
|
+
var Select_default = {"formGroup":"bds122Select-formGroup","selectWrapper":"bds122Select-selectWrapper","select":"bds122Select-select","selectError":"bds122Select-selectError","chevron":"bds122Select-chevron"};
|
|
2425
2447
|
|
|
2426
2448
|
// src/components/interaction/form/Select/Select.tsx
|
|
2427
2449
|
import { cn as cn43 } from "@boostdev/design-system-foundation";
|
|
@@ -2472,7 +2494,7 @@ function Select({
|
|
|
2472
2494
|
import { useId as useId20, useState as useState12 } from "react";
|
|
2473
2495
|
|
|
2474
2496
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2475
|
-
var Slider_default = {"formGroup":"
|
|
2497
|
+
var Slider_default = {"formGroup":"bds122Slider-formGroup","labelRow":"bds122Slider-labelRow","value":"bds122Slider-value","slider":"bds122Slider-slider","sliderError":"bds122Slider-sliderError"};
|
|
2476
2498
|
|
|
2477
2499
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2478
2500
|
import { cn as cn44 } from "@boostdev/design-system-foundation";
|
|
@@ -2534,7 +2556,7 @@ function Slider({
|
|
|
2534
2556
|
import { useId as useId21 } from "react";
|
|
2535
2557
|
|
|
2536
2558
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2537
|
-
var Switch_default = {"switchGroup":"
|
|
2559
|
+
var Switch_default = {"switchGroup":"bds122Switch-switchGroup","--size_small":"bds122Switch---size_small","--size_medium":"bds122Switch---size_medium","--size_large":"bds122Switch---size_large","inputWrapper":"bds122Switch-inputWrapper","trackWrapper":"bds122Switch-trackWrapper","switch":"bds122Switch-switch","track":"bds122Switch-track","thumb":"bds122Switch-thumb","switchError":"bds122Switch-switchError"};
|
|
2538
2560
|
|
|
2539
2561
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2540
2562
|
import { cn as cn45 } from "@boostdev/design-system-foundation";
|
|
@@ -2582,7 +2604,7 @@ function Switch({
|
|
|
2582
2604
|
import { useId as useId22 } from "react";
|
|
2583
2605
|
|
|
2584
2606
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2585
|
-
var Textarea_default = {"formGroup":"
|
|
2607
|
+
var Textarea_default = {"formGroup":"bds122Textarea-formGroup","textarea":"bds122Textarea-textarea","textareaError":"bds122Textarea-textareaError"};
|
|
2586
2608
|
|
|
2587
2609
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2588
2610
|
import { cn as cn46 } from "@boostdev/design-system-foundation";
|
|
@@ -2621,17 +2643,17 @@ function Textarea({
|
|
|
2621
2643
|
}
|
|
2622
2644
|
|
|
2623
2645
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2624
|
-
var ButtonGroup_default = {"buttonGroup":"
|
|
2646
|
+
var ButtonGroup_default = {"buttonGroup":"bds122ButtonGroup-buttonGroup","container":"bds122ButtonGroup-container","--variant_card":"bds122ButtonGroup---variant_card","--variant_flow":"bds122ButtonGroup---variant_flow","--variant_modal":"bds122ButtonGroup---variant_modal","--variant_content":"bds122ButtonGroup---variant_content","--variant_grid":"bds122ButtonGroup---variant_grid"};
|
|
2625
2647
|
|
|
2626
2648
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2627
2649
|
import { cn as cn47 } from "@boostdev/design-system-foundation";
|
|
2628
2650
|
import { jsx as jsx47 } from "react/jsx-runtime";
|
|
2629
|
-
function ButtonGroup({ children, className, variant,
|
|
2651
|
+
function ButtonGroup({ children, className, variant, ...rest }) {
|
|
2630
2652
|
return /* @__PURE__ */ jsx47(
|
|
2631
2653
|
"div",
|
|
2632
2654
|
{
|
|
2655
|
+
...rest,
|
|
2633
2656
|
role: "group",
|
|
2634
|
-
"aria-label": ariaLabel,
|
|
2635
2657
|
className: cn47(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]),
|
|
2636
2658
|
children: /* @__PURE__ */ jsx47("div", { className: ButtonGroup_default.container, children })
|
|
2637
2659
|
}
|
|
@@ -2639,7 +2661,7 @@ function ButtonGroup({ children, className, variant, "aria-label": ariaLabel })
|
|
|
2639
2661
|
}
|
|
2640
2662
|
|
|
2641
2663
|
// src/components/layout/Card/Card.module.css
|
|
2642
|
-
var Card_default = {"card":"
|
|
2664
|
+
var Card_default = {"card":"bds122Card-card","--default":"bds122Card---default","--elevated":"bds122Card---elevated","--outlined":"bds122Card---outlined","--clickable":"bds122Card---clickable","--padding-none":"bds122Card---padding-none","--padding-small":"bds122Card---padding-small","--padding-medium":"bds122Card---padding-medium","--padding-large":"bds122Card---padding-large","--text-start":"bds122Card---text-start","--text-center":"bds122Card---text-center","--text-end":"bds122Card---text-end"};
|
|
2643
2665
|
|
|
2644
2666
|
// src/components/layout/Card/Card.tsx
|
|
2645
2667
|
import { cn as cn48 } from "@boostdev/design-system-foundation";
|
|
@@ -2650,9 +2672,8 @@ function Card({
|
|
|
2650
2672
|
variant = "default",
|
|
2651
2673
|
padding = "medium",
|
|
2652
2674
|
textAlign = "start",
|
|
2653
|
-
style,
|
|
2654
2675
|
onClick,
|
|
2655
|
-
|
|
2676
|
+
...rest
|
|
2656
2677
|
}) {
|
|
2657
2678
|
const classNames = cn48(
|
|
2658
2679
|
Card_default.card,
|
|
@@ -2666,10 +2687,9 @@ function Card({
|
|
|
2666
2687
|
return /* @__PURE__ */ jsx48(
|
|
2667
2688
|
Component,
|
|
2668
2689
|
{
|
|
2690
|
+
...rest,
|
|
2669
2691
|
className: classNames,
|
|
2670
2692
|
onClick,
|
|
2671
|
-
style,
|
|
2672
|
-
"aria-label": ariaLabel,
|
|
2673
2693
|
...onClick && { type: "button" },
|
|
2674
2694
|
children
|
|
2675
2695
|
}
|
|
@@ -2677,7 +2697,7 @@ function Card({
|
|
|
2677
2697
|
}
|
|
2678
2698
|
|
|
2679
2699
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
2680
|
-
var SectionHeader_default = {"sectionHeader":"
|
|
2700
|
+
var SectionHeader_default = {"sectionHeader":"bds122SectionHeader-sectionHeader","title":"bds122SectionHeader-title","subtitle":"bds122SectionHeader-subtitle","--start":"bds122SectionHeader---start","--center":"bds122SectionHeader---center","--end":"bds122SectionHeader---end","--small":"bds122SectionHeader---small","--medium":"bds122SectionHeader---medium","--large":"bds122SectionHeader---large"};
|
|
2681
2701
|
|
|
2682
2702
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
2683
2703
|
import { cn as cn49 } from "@boostdev/design-system-foundation";
|
|
@@ -2688,23 +2708,24 @@ function SectionHeader({
|
|
|
2688
2708
|
className,
|
|
2689
2709
|
alignment = "start",
|
|
2690
2710
|
size = "medium",
|
|
2691
|
-
titleAs = "h2"
|
|
2711
|
+
titleAs = "h2",
|
|
2712
|
+
...rest
|
|
2692
2713
|
}) {
|
|
2693
2714
|
const Title = titleAs;
|
|
2694
|
-
return /* @__PURE__ */ jsxs36("div", { className: cn49(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2715
|
+
return /* @__PURE__ */ jsxs36("div", { ...rest, className: cn49(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2695
2716
|
/* @__PURE__ */ jsx49(Title, { className: SectionHeader_default.title, children: title }),
|
|
2696
2717
|
subtitle && /* @__PURE__ */ jsx49("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
2697
2718
|
] });
|
|
2698
2719
|
}
|
|
2699
2720
|
|
|
2700
2721
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2701
|
-
var IconWrapper_default = {"wrapper":"
|
|
2722
|
+
var IconWrapper_default = {"wrapper":"bds122IconWrapper-wrapper"};
|
|
2702
2723
|
|
|
2703
2724
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2704
2725
|
import { cn as cn50 } from "@boostdev/design-system-foundation";
|
|
2705
2726
|
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
2706
|
-
function IconWrapper({ children, className,
|
|
2707
|
-
return /* @__PURE__ */ jsx50("div", { className: cn50(className, IconWrapper_default.wrapper),
|
|
2727
|
+
function IconWrapper({ children, className, ...rest }) {
|
|
2728
|
+
return /* @__PURE__ */ jsx50("div", { ...rest, className: cn50(className, IconWrapper_default.wrapper), children });
|
|
2708
2729
|
}
|
|
2709
2730
|
|
|
2710
2731
|
// src/index.ts
|