@boostdev/design-system-components 1.2.0 → 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 +46 -4
- package/README.md +15 -15
- package/dist/client.cjs +149 -124
- package/dist/client.css +503 -525
- package/dist/client.d.cts +71 -96
- package/dist/client.d.ts +71 -96
- package/dist/client.js +149 -124
- package/dist/index.cjs +149 -124
- package/dist/index.css +503 -525
- package/dist/index.d.cts +71 -96
- package/dist/index.d.ts +71 -96
- package/dist/index.js +149 -124
- package/dist/web-components/{chunk-6MH5UWUD.js → chunk-2FGATTGT.js} +5 -0
- package/dist/web-components/{chunk-5IPHEONG.js → chunk-6I2DBFQ7.js} +1 -0
- package/dist/web-components/{chunk-DI46Q2EA.js → chunk-OCODKRVZ.js} +57 -82
- package/dist/web-components/index.d.ts +571 -1
- package/dist/web-components/index.js +1501 -4
- package/dist/web-components/interaction/bds-collapsible.js +1 -1
- package/dist/web-components/interaction/bds-drawer.js +1 -1
- package/dist/web-components/interaction/form/bds-segmented-control.js +1 -1
- 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.module.css +37 -62
- package/src/components/interaction/Drawer/Drawer.spec.tsx +3 -3
- package/src/components/interaction/Drawer/Drawer.tsx +25 -24
- 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.mdx +8 -4
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.module.css +13 -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/src/stories/Introduction.mdx +2 -1
- package/src/web-components/index.ts +12 -0
- package/src/web-components/interaction/BdsAccordion.mdx +80 -28
- package/src/web-components/interaction/BdsAccordion.stories.tsx +67 -58
- package/src/web-components/interaction/BdsCollapsible.mdx +93 -23
- package/src/web-components/interaction/BdsCollapsible.stories.tsx +29 -48
- package/src/web-components/interaction/BdsDialog.mdx +88 -27
- package/src/web-components/interaction/BdsDialog.stories.tsx +129 -47
- package/src/web-components/interaction/BdsDrawer.mdx +85 -27
- package/src/web-components/interaction/BdsDrawer.stories.tsx +161 -31
- package/src/web-components/interaction/BdsDropdownMenu.mdx +108 -0
- package/src/web-components/interaction/BdsDropdownMenu.stories.tsx +91 -0
- package/src/web-components/interaction/BdsSkipLink.mdx +72 -16
- package/src/web-components/interaction/BdsSkipLink.stories.tsx +47 -34
- package/src/web-components/interaction/BdsTabs.mdx +97 -27
- package/src/web-components/interaction/BdsTabs.stories.tsx +69 -55
- package/src/web-components/interaction/BdsTooltip.mdx +84 -18
- package/src/web-components/interaction/BdsTooltip.stories.tsx +49 -30
- package/src/web-components/interaction/bds-collapsible.ts +1 -0
- package/src/web-components/interaction/bds-drawer.ts +59 -82
- package/src/web-components/interaction/bds-dropdown-menu-item.ts +124 -0
- package/src/web-components/interaction/bds-dropdown-menu.spec.ts +102 -0
- package/src/web-components/interaction/bds-dropdown-menu.ts +200 -0
- package/src/web-components/interaction/form/BdsCheckbox.mdx +57 -20
- package/src/web-components/interaction/form/BdsCheckbox.stories.tsx +35 -36
- package/src/web-components/interaction/form/BdsCheckboxGroup.mdx +70 -0
- package/src/web-components/interaction/form/BdsCheckboxGroup.stories.tsx +81 -0
- package/src/web-components/interaction/form/BdsCombobox.mdx +52 -33
- package/src/web-components/interaction/form/BdsCombobox.stories.tsx +55 -53
- package/src/web-components/interaction/form/BdsFileInput.mdx +59 -24
- package/src/web-components/interaction/form/BdsFileInput.stories.tsx +38 -53
- package/src/web-components/interaction/form/BdsFormInput.mdx +98 -0
- package/src/web-components/interaction/form/BdsFormInput.stories.tsx +139 -0
- package/src/web-components/interaction/form/BdsNumberInput.mdx +51 -22
- package/src/web-components/interaction/form/BdsNumberInput.stories.tsx +24 -46
- package/src/web-components/interaction/form/BdsRadio.mdx +53 -22
- package/src/web-components/interaction/form/BdsRadio.stories.tsx +19 -51
- package/src/web-components/interaction/form/BdsRadioGroup.mdx +73 -0
- package/src/web-components/interaction/form/BdsRadioGroup.stories.tsx +88 -0
- package/src/web-components/interaction/form/BdsSegmentedControl.mdx +76 -23
- package/src/web-components/interaction/form/BdsSegmentedControl.stories.tsx +64 -54
- package/src/web-components/interaction/form/BdsSelect.mdx +59 -21
- package/src/web-components/interaction/form/BdsSelect.stories.tsx +47 -56
- package/src/web-components/interaction/form/BdsSlider.mdx +55 -27
- package/src/web-components/interaction/form/BdsSlider.stories.tsx +23 -44
- package/src/web-components/interaction/form/BdsSwitch.mdx +53 -20
- package/src/web-components/interaction/form/BdsSwitch.stories.tsx +22 -37
- package/src/web-components/interaction/form/BdsTextarea.mdx +54 -22
- package/src/web-components/interaction/form/BdsTextarea.stories.tsx +35 -44
- package/src/web-components/interaction/form/bds-checkbox-group.spec.ts +55 -0
- package/src/web-components/interaction/form/bds-checkbox-group.ts +117 -0
- package/src/web-components/interaction/form/bds-form-input.spec.ts +83 -0
- package/src/web-components/interaction/form/bds-form-input.ts +268 -0
- package/src/web-components/interaction/form/bds-radio-group.spec.ts +62 -0
- package/src/web-components/interaction/form/bds-radio-group.ts +142 -0
- package/src/web-components/interaction/form/bds-segmented-control.ts +5 -0
- package/src/web-components/ui/BdsAvatar.mdx +29 -20
- package/src/web-components/ui/BdsAvatar.stories.tsx +14 -28
- package/src/web-components/ui/BdsBreadcrumb.mdx +22 -19
- package/src/web-components/ui/BdsBreadcrumb.stories.tsx +11 -21
- package/src/web-components/ui/BdsButtonGroup.mdx +69 -0
- package/src/web-components/ui/BdsButtonGroup.stories.tsx +66 -0
- package/src/web-components/ui/BdsCalendar.mdx +93 -0
- package/src/web-components/ui/BdsCalendar.stories.tsx +63 -0
- package/src/web-components/ui/BdsCard.mdx +30 -25
- package/src/web-components/ui/BdsCard.stories.tsx +19 -42
- package/src/web-components/ui/BdsCarousel.mdx +83 -0
- package/src/web-components/ui/BdsCarousel.stories.tsx +96 -0
- package/src/web-components/ui/BdsDescriptionList.mdx +13 -16
- package/src/web-components/ui/BdsDescriptionList.stories.tsx +34 -49
- package/src/web-components/ui/BdsIconWrapper.mdx +20 -20
- package/src/web-components/ui/BdsIconWrapper.stories.tsx +46 -41
- package/src/web-components/ui/BdsLink.mdx +21 -17
- package/src/web-components/ui/BdsLink.stories.tsx +19 -20
- package/src/web-components/ui/BdsLoading.mdx +9 -13
- package/src/web-components/ui/BdsLoading.stories.tsx +8 -10
- package/src/web-components/ui/BdsNotificationBanner.mdx +32 -37
- package/src/web-components/ui/BdsNotificationBanner.stories.tsx +38 -47
- package/src/web-components/ui/BdsPagination.mdx +74 -0
- package/src/web-components/ui/BdsPagination.stories.tsx +36 -0
- package/src/web-components/ui/BdsProgress.mdx +24 -17
- package/src/web-components/ui/BdsProgress.stories.tsx +55 -29
- package/src/web-components/ui/BdsProgressCircle.mdx +24 -18
- package/src/web-components/ui/BdsProgressCircle.stories.tsx +17 -29
- package/src/web-components/ui/BdsRating.mdx +22 -22
- package/src/web-components/ui/BdsRating.stories.tsx +19 -13
- package/src/web-components/ui/BdsSectionHeader.mdx +31 -28
- package/src/web-components/ui/BdsSectionHeader.stories.tsx +21 -23
- package/src/web-components/ui/BdsSeparator.mdx +22 -8
- package/src/web-components/ui/BdsSeparator.stories.tsx +27 -19
- package/src/web-components/ui/BdsSkeleton.mdx +20 -26
- package/src/web-components/ui/BdsSkeleton.stories.tsx +23 -23
- package/src/web-components/ui/BdsTable.mdx +81 -0
- package/src/web-components/ui/BdsTable.stories.tsx +83 -0
- package/src/web-components/ui/BdsTypography.mdx +20 -29
- package/src/web-components/ui/BdsTypography.stories.tsx +19 -18
- package/src/web-components/ui/bds-button-group.spec.ts +40 -0
- package/src/web-components/ui/bds-button-group.ts +78 -0
- package/src/web-components/ui/bds-calendar.spec.ts +91 -0
- package/src/web-components/ui/bds-calendar.ts +427 -0
- package/src/web-components/ui/bds-carousel.spec.ts +64 -0
- package/src/web-components/ui/bds-carousel.ts +296 -0
- package/src/web-components/ui/bds-pagination.spec.ts +67 -0
- package/src/web-components/ui/bds-pagination.ts +197 -0
- package/src/web-components/ui/bds-table.spec.ts +45 -0
- package/src/web-components/ui/bds-table.ts +96 -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;
|
|
@@ -1411,23 +1427,27 @@ function Drawer({
|
|
|
1411
1427
|
return () => dialog.removeEventListener("command", handleCommand);
|
|
1412
1428
|
}, [onOpen, onClose]);
|
|
1413
1429
|
const handleClick = (e) => {
|
|
1414
|
-
|
|
1430
|
+
const dialog = dialogRef.current;
|
|
1431
|
+
if (!dialog) return;
|
|
1432
|
+
const rect = dialog.getBoundingClientRect();
|
|
1433
|
+
const outside = e.clientX < rect.left || e.clientX > rect.right || e.clientY < rect.top || e.clientY > rect.bottom;
|
|
1434
|
+
if (outside) onClose();
|
|
1415
1435
|
};
|
|
1416
1436
|
const handleCancel = (e) => {
|
|
1417
1437
|
e.preventDefault();
|
|
1418
1438
|
onClose();
|
|
1419
1439
|
};
|
|
1420
|
-
return /* @__PURE__ */
|
|
1440
|
+
return /* @__PURE__ */ jsxs19(
|
|
1421
1441
|
"dialog",
|
|
1422
1442
|
{
|
|
1443
|
+
...rest,
|
|
1423
1444
|
ref: dialogRef,
|
|
1424
1445
|
id,
|
|
1425
1446
|
className: cn26(Drawer_default.drawer, Drawer_default[`--side_${side}`], className),
|
|
1426
|
-
"aria-label": ariaLabel,
|
|
1427
1447
|
"aria-modal": "true",
|
|
1428
1448
|
onClick: handleClick,
|
|
1429
1449
|
onCancel: handleCancel,
|
|
1430
|
-
children:
|
|
1450
|
+
children: [
|
|
1431
1451
|
/* @__PURE__ */ jsxs19("div", { className: Drawer_default.header, children: [
|
|
1432
1452
|
!!title && title,
|
|
1433
1453
|
/* @__PURE__ */ jsx26(
|
|
@@ -1443,7 +1463,7 @@ function Drawer({
|
|
|
1443
1463
|
)
|
|
1444
1464
|
] }),
|
|
1445
1465
|
/* @__PURE__ */ jsx26("div", { className: Drawer_default.body, children })
|
|
1446
|
-
]
|
|
1466
|
+
]
|
|
1447
1467
|
}
|
|
1448
1468
|
);
|
|
1449
1469
|
}
|
|
@@ -1459,7 +1479,7 @@ import {
|
|
|
1459
1479
|
} from "react";
|
|
1460
1480
|
|
|
1461
1481
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1462
|
-
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"};
|
|
1463
1483
|
|
|
1464
1484
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1465
1485
|
import { cn as cn27 } from "@boostdev/design-system-foundation";
|
|
@@ -1468,7 +1488,8 @@ function DropdownMenu({
|
|
|
1468
1488
|
trigger,
|
|
1469
1489
|
items,
|
|
1470
1490
|
placement = "bottom-start",
|
|
1471
|
-
className
|
|
1491
|
+
className,
|
|
1492
|
+
...rest
|
|
1472
1493
|
}) {
|
|
1473
1494
|
const [isOpen, setIsOpen] = useState6(false);
|
|
1474
1495
|
const containerRef = useRef6(null);
|
|
@@ -1531,7 +1552,7 @@ function DropdownMenu({
|
|
|
1531
1552
|
if (typeof existingOnClick === "function") existingOnClick(e);
|
|
1532
1553
|
}
|
|
1533
1554
|
}) : trigger;
|
|
1534
|
-
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: [
|
|
1535
1556
|
triggerEl,
|
|
1536
1557
|
isOpen && /* @__PURE__ */ jsx27(
|
|
1537
1558
|
"ul",
|
|
@@ -1579,7 +1600,7 @@ import {
|
|
|
1579
1600
|
} from "react";
|
|
1580
1601
|
|
|
1581
1602
|
// src/components/interaction/Popover/Popover.module.css
|
|
1582
|
-
var Popover_default = {"wrapper":"
|
|
1603
|
+
var Popover_default = {"wrapper":"bds122Popover-wrapper","panel":"bds122Popover-panel","g":"bds122Popover-g"};
|
|
1583
1604
|
|
|
1584
1605
|
// src/components/interaction/Popover/Popover.tsx
|
|
1585
1606
|
import { cn as cn28 } from "@boostdev/design-system-foundation";
|
|
@@ -1594,7 +1615,8 @@ function Popover({
|
|
|
1594
1615
|
content,
|
|
1595
1616
|
placement = "bottom",
|
|
1596
1617
|
className,
|
|
1597
|
-
"aria-label": ariaLabel
|
|
1618
|
+
"aria-label": ariaLabel,
|
|
1619
|
+
...rest
|
|
1598
1620
|
}) {
|
|
1599
1621
|
const [isOpen, setIsOpen] = useState7(false);
|
|
1600
1622
|
const containerRef = useRef7(null);
|
|
@@ -1643,7 +1665,7 @@ function Popover({
|
|
|
1643
1665
|
// avoid a double-toggle when both onClick and invoker fire.
|
|
1644
1666
|
onClick: children.props.onClick
|
|
1645
1667
|
}) : children;
|
|
1646
|
-
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: [
|
|
1647
1669
|
trigger,
|
|
1648
1670
|
/* @__PURE__ */ jsx28(
|
|
1649
1671
|
"div",
|
|
@@ -1663,15 +1685,16 @@ function Popover({
|
|
|
1663
1685
|
}
|
|
1664
1686
|
|
|
1665
1687
|
// src/components/interaction/Rating/Rating.module.css
|
|
1666
|
-
var Rating_default = {"rating":"
|
|
1688
|
+
var Rating_default = {"rating":"bds122Rating-rating","star":"bds122Rating-star","--filled":"bds122Rating---filled"};
|
|
1667
1689
|
|
|
1668
1690
|
// src/components/interaction/Rating/Rating.tsx
|
|
1669
1691
|
import { cn as cn29 } from "@boostdev/design-system-foundation";
|
|
1670
1692
|
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
1671
|
-
function Rating({ value, max = 5, className }) {
|
|
1693
|
+
function Rating({ value, max = 5, className, ...rest }) {
|
|
1672
1694
|
return /* @__PURE__ */ jsx29(
|
|
1673
1695
|
"div",
|
|
1674
1696
|
{
|
|
1697
|
+
...rest,
|
|
1675
1698
|
className: cn29(Rating_default.rating, className),
|
|
1676
1699
|
role: "img",
|
|
1677
1700
|
"aria-label": `${value} out of ${max} stars`,
|
|
@@ -1694,7 +1717,7 @@ function Rating({ value, max = 5, className }) {
|
|
|
1694
1717
|
import { useState as useState8, useEffect as useEffect6, createContext, useContext, useCallback, useMemo as useMemo2, useRef as useRef8 } from "react";
|
|
1695
1718
|
|
|
1696
1719
|
// src/components/interaction/Toast/Toast.module.css
|
|
1697
|
-
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"};
|
|
1698
1721
|
|
|
1699
1722
|
// src/components/interaction/Toast/Toast.tsx
|
|
1700
1723
|
import { cn as cn30 } from "@boostdev/design-system-foundation";
|
|
@@ -1767,10 +1790,10 @@ function useToast() {
|
|
|
1767
1790
|
import { useId as useId11 } from "react";
|
|
1768
1791
|
|
|
1769
1792
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1770
|
-
var Checkbox_default = {"checkboxGroup":"
|
|
1793
|
+
var Checkbox_default = {"checkboxGroup":"bds122Checkbox-checkboxGroup","inputWrapper":"bds122Checkbox-inputWrapper","checkbox":"bds122Checkbox-checkbox","checkboxError":"bds122Checkbox-checkboxError"};
|
|
1771
1794
|
|
|
1772
1795
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1773
|
-
var Message_default = {"error":"
|
|
1796
|
+
var Message_default = {"error":"bds122Message-error","hint":"bds122Message-hint"};
|
|
1774
1797
|
|
|
1775
1798
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1776
1799
|
import { cn as cn31 } from "@boostdev/design-system-foundation";
|
|
@@ -1781,7 +1804,7 @@ var Message = ({ message, type, inputId, className }) => {
|
|
|
1781
1804
|
};
|
|
1782
1805
|
|
|
1783
1806
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1784
|
-
var Label_default = {"label":"
|
|
1807
|
+
var Label_default = {"label":"bds122Label-label"};
|
|
1785
1808
|
|
|
1786
1809
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1787
1810
|
import { cn as cn32 } from "@boostdev/design-system-foundation";
|
|
@@ -1794,13 +1817,13 @@ var Label = ({ label, id, className }) => {
|
|
|
1794
1817
|
import { cn as cn34 } from "@boostdev/design-system-foundation";
|
|
1795
1818
|
|
|
1796
1819
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1797
|
-
var InputContainer_default = {"container":"
|
|
1820
|
+
var InputContainer_default = {"container":"bds122InputContainer-container"};
|
|
1798
1821
|
|
|
1799
1822
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1800
1823
|
import { cn as cn33 } from "@boostdev/design-system-foundation";
|
|
1801
1824
|
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
1802
|
-
var InputContainer = ({ children, className }) => {
|
|
1803
|
-
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 });
|
|
1804
1827
|
};
|
|
1805
1828
|
|
|
1806
1829
|
// src/components/interaction/form/Checkbox/Checkbox.tsx
|
|
@@ -1835,7 +1858,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1835
1858
|
import { useId as useId12 } from "react";
|
|
1836
1859
|
|
|
1837
1860
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.module.css
|
|
1838
|
-
var CheckboxGroup_default = {"group":"
|
|
1861
|
+
var CheckboxGroup_default = {"group":"bds122CheckboxGroup-group","legend":"bds122CheckboxGroup-legend","required":"bds122CheckboxGroup-required","items":"bds122CheckboxGroup-items"};
|
|
1839
1862
|
|
|
1840
1863
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
|
|
1841
1864
|
import { cn as cn35 } from "@boostdev/design-system-foundation";
|
|
@@ -1846,8 +1869,8 @@ function CheckboxGroup({
|
|
|
1846
1869
|
error,
|
|
1847
1870
|
hint,
|
|
1848
1871
|
required,
|
|
1849
|
-
|
|
1850
|
-
|
|
1872
|
+
className,
|
|
1873
|
+
...rest
|
|
1851
1874
|
}) {
|
|
1852
1875
|
const id = useId12();
|
|
1853
1876
|
const hintId = id + "hint";
|
|
@@ -1856,8 +1879,8 @@ function CheckboxGroup({
|
|
|
1856
1879
|
return /* @__PURE__ */ jsxs24(
|
|
1857
1880
|
"fieldset",
|
|
1858
1881
|
{
|
|
1882
|
+
...rest,
|
|
1859
1883
|
className: cn35(CheckboxGroup_default.group, className),
|
|
1860
|
-
disabled,
|
|
1861
1884
|
"aria-required": required || void 0,
|
|
1862
1885
|
"aria-describedby": describedBy,
|
|
1863
1886
|
children: [
|
|
@@ -1883,7 +1906,7 @@ import {
|
|
|
1883
1906
|
} from "react";
|
|
1884
1907
|
|
|
1885
1908
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1886
|
-
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"};
|
|
1887
1910
|
|
|
1888
1911
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1889
1912
|
import { cn as cn36 } from "@boostdev/design-system-foundation";
|
|
@@ -1898,7 +1921,8 @@ function Combobox({
|
|
|
1898
1921
|
disabled = false,
|
|
1899
1922
|
error,
|
|
1900
1923
|
hint,
|
|
1901
|
-
className
|
|
1924
|
+
className,
|
|
1925
|
+
...rest
|
|
1902
1926
|
}) {
|
|
1903
1927
|
const id = name + useId13();
|
|
1904
1928
|
const listboxId = id + "listbox";
|
|
@@ -1965,7 +1989,7 @@ function Combobox({
|
|
|
1965
1989
|
setIsOpen(false);
|
|
1966
1990
|
}
|
|
1967
1991
|
};
|
|
1968
|
-
return /* @__PURE__ */ jsxs25(InputContainer, { className: cn36(Combobox_default.formGroup, className), children: [
|
|
1992
|
+
return /* @__PURE__ */ jsxs25(InputContainer, { ...rest, className: cn36(Combobox_default.formGroup, className), children: [
|
|
1969
1993
|
/* @__PURE__ */ jsx36(Label, { id, label }),
|
|
1970
1994
|
/* @__PURE__ */ jsxs25("div", { ref: containerRef, className: Combobox_default.inputWrapper, children: [
|
|
1971
1995
|
/* @__PURE__ */ jsx36(
|
|
@@ -2033,7 +2057,7 @@ function Combobox({
|
|
|
2033
2057
|
import { useId as useId14, useRef as useRef10, useState as useState10 } from "react";
|
|
2034
2058
|
|
|
2035
2059
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
2036
|
-
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"};
|
|
2037
2061
|
|
|
2038
2062
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2039
2063
|
import { cn as cn37 } from "@boostdev/design-system-foundation";
|
|
@@ -2048,7 +2072,8 @@ function FileInput({
|
|
|
2048
2072
|
error,
|
|
2049
2073
|
hint,
|
|
2050
2074
|
onChange,
|
|
2051
|
-
className
|
|
2075
|
+
className,
|
|
2076
|
+
...rest
|
|
2052
2077
|
}) {
|
|
2053
2078
|
const uid = name + useId14();
|
|
2054
2079
|
const hintId = uid + "hint";
|
|
@@ -2086,7 +2111,7 @@ function FileInput({
|
|
|
2086
2111
|
if (!disabled) setIsDragging(true);
|
|
2087
2112
|
};
|
|
2088
2113
|
const handleDragLeave = () => setIsDragging(false);
|
|
2089
|
-
return /* @__PURE__ */ jsxs26(InputContainer, { className: cn37(FileInput_default.formGroup, className), children: [
|
|
2114
|
+
return /* @__PURE__ */ jsxs26(InputContainer, { ...rest, className: cn37(FileInput_default.formGroup, className), children: [
|
|
2090
2115
|
/* @__PURE__ */ jsxs26(
|
|
2091
2116
|
"label",
|
|
2092
2117
|
{
|
|
@@ -2133,7 +2158,7 @@ function FileInput({
|
|
|
2133
2158
|
import { useId as useId15 } from "react";
|
|
2134
2159
|
|
|
2135
2160
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
2136
|
-
var FormInput_default = {"formGroup":"
|
|
2161
|
+
var FormInput_default = {"formGroup":"bds122FormInput-formGroup","input":"bds122FormInput-input","inputError":"bds122FormInput-inputError"};
|
|
2137
2162
|
|
|
2138
2163
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2139
2164
|
import { cn as cn38 } from "@boostdev/design-system-foundation";
|
|
@@ -2177,7 +2202,7 @@ function FormInput({
|
|
|
2177
2202
|
import { useId as useId16, useRef as useRef11, useState as useState11 } from "react";
|
|
2178
2203
|
|
|
2179
2204
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
2180
|
-
var NumberInput_default = {"formGroup":"
|
|
2205
|
+
var NumberInput_default = {"formGroup":"bds122NumberInput-formGroup","inputRow":"bds122NumberInput-inputRow","input":"bds122NumberInput-input","inputError":"bds122NumberInput-inputError","stepper":"bds122NumberInput-stepper"};
|
|
2181
2206
|
|
|
2182
2207
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2183
2208
|
import { cn as cn39 } from "@boostdev/design-system-foundation";
|
|
@@ -2194,7 +2219,8 @@ function NumberInput({
|
|
|
2194
2219
|
error,
|
|
2195
2220
|
hint,
|
|
2196
2221
|
onChange,
|
|
2197
|
-
className
|
|
2222
|
+
className,
|
|
2223
|
+
...rest
|
|
2198
2224
|
}) {
|
|
2199
2225
|
const uid = name + useId16();
|
|
2200
2226
|
const hintId = uid + "hint";
|
|
@@ -2219,7 +2245,7 @@ function NumberInput({
|
|
|
2219
2245
|
}
|
|
2220
2246
|
onChange?.(next);
|
|
2221
2247
|
};
|
|
2222
|
-
return /* @__PURE__ */ jsxs28(InputContainer, { className: cn39(NumberInput_default.formGroup, className), children: [
|
|
2248
|
+
return /* @__PURE__ */ jsxs28(InputContainer, { ...rest, className: cn39(NumberInput_default.formGroup, className), children: [
|
|
2223
2249
|
/* @__PURE__ */ jsx39(Label, { id: uid, label }),
|
|
2224
2250
|
/* @__PURE__ */ jsxs28("div", { className: NumberInput_default.inputRow, children: [
|
|
2225
2251
|
/* @__PURE__ */ jsx39(
|
|
@@ -2281,7 +2307,7 @@ function NumberInput({
|
|
|
2281
2307
|
import { useId as useId17 } from "react";
|
|
2282
2308
|
|
|
2283
2309
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
2284
|
-
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"};
|
|
2285
2311
|
|
|
2286
2312
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2287
2313
|
import { cn as cn40 } from "@boostdev/design-system-foundation";
|
|
@@ -2319,7 +2345,7 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
2319
2345
|
import { useId as useId18 } from "react";
|
|
2320
2346
|
|
|
2321
2347
|
// src/components/interaction/form/RadioGroup/RadioGroup.module.css
|
|
2322
|
-
var RadioGroup_default = {"group":"
|
|
2348
|
+
var RadioGroup_default = {"group":"bds122RadioGroup-group","legend":"bds122RadioGroup-legend","required":"bds122RadioGroup-required","items":"bds122RadioGroup-items"};
|
|
2323
2349
|
|
|
2324
2350
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2325
2351
|
import { cn as cn41 } from "@boostdev/design-system-foundation";
|
|
@@ -2330,8 +2356,8 @@ function RadioGroup({
|
|
|
2330
2356
|
error,
|
|
2331
2357
|
hint,
|
|
2332
2358
|
required,
|
|
2333
|
-
|
|
2334
|
-
|
|
2359
|
+
className,
|
|
2360
|
+
...rest
|
|
2335
2361
|
}) {
|
|
2336
2362
|
const id = useId18();
|
|
2337
2363
|
const hintId = id + "hint";
|
|
@@ -2340,8 +2366,8 @@ function RadioGroup({
|
|
|
2340
2366
|
return /* @__PURE__ */ jsxs30(
|
|
2341
2367
|
"fieldset",
|
|
2342
2368
|
{
|
|
2369
|
+
...rest,
|
|
2343
2370
|
className: cn41(RadioGroup_default.group, className),
|
|
2344
|
-
disabled,
|
|
2345
2371
|
"aria-required": required || void 0,
|
|
2346
2372
|
"aria-describedby": describedBy,
|
|
2347
2373
|
children: [
|
|
@@ -2361,7 +2387,7 @@ function RadioGroup({
|
|
|
2361
2387
|
import { Children, cloneElement as cloneElement4, isValidElement as isValidElement4 } from "react";
|
|
2362
2388
|
|
|
2363
2389
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.module.css
|
|
2364
|
-
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"};
|
|
2365
2391
|
|
|
2366
2392
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2367
2393
|
import { cn as cn42 } from "@boostdev/design-system-foundation";
|
|
@@ -2373,7 +2399,7 @@ function SegmentedControl({
|
|
|
2373
2399
|
size = "medium",
|
|
2374
2400
|
variant = "outline",
|
|
2375
2401
|
className,
|
|
2376
|
-
|
|
2402
|
+
...rest
|
|
2377
2403
|
}) {
|
|
2378
2404
|
const validChildren = Children.toArray(children).filter(isValidElement4);
|
|
2379
2405
|
const autoIndex = selectedIndexProp === void 0 ? validChildren.findIndex((child) => {
|
|
@@ -2384,8 +2410,8 @@ function SegmentedControl({
|
|
|
2384
2410
|
return /* @__PURE__ */ jsxs31(
|
|
2385
2411
|
"div",
|
|
2386
2412
|
{
|
|
2413
|
+
...rest,
|
|
2387
2414
|
role: "group",
|
|
2388
|
-
"aria-label": ariaLabel,
|
|
2389
2415
|
className: cn42(SegmentedControl_default.control, SegmentedControl_default[`--size_${size}`], SegmentedControl_default[`--variant_${variant}`], className),
|
|
2390
2416
|
style: {
|
|
2391
2417
|
"--control_count": validChildren.length,
|
|
@@ -2417,7 +2443,7 @@ function SegmentedControl({
|
|
|
2417
2443
|
import { useId as useId19 } from "react";
|
|
2418
2444
|
|
|
2419
2445
|
// src/components/interaction/form/Select/Select.module.css
|
|
2420
|
-
var Select_default = {"formGroup":"
|
|
2446
|
+
var Select_default = {"formGroup":"bds122Select-formGroup","selectWrapper":"bds122Select-selectWrapper","select":"bds122Select-select","selectError":"bds122Select-selectError","chevron":"bds122Select-chevron"};
|
|
2421
2447
|
|
|
2422
2448
|
// src/components/interaction/form/Select/Select.tsx
|
|
2423
2449
|
import { cn as cn43 } from "@boostdev/design-system-foundation";
|
|
@@ -2468,7 +2494,7 @@ function Select({
|
|
|
2468
2494
|
import { useId as useId20, useState as useState12 } from "react";
|
|
2469
2495
|
|
|
2470
2496
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2471
|
-
var Slider_default = {"formGroup":"
|
|
2497
|
+
var Slider_default = {"formGroup":"bds122Slider-formGroup","labelRow":"bds122Slider-labelRow","value":"bds122Slider-value","slider":"bds122Slider-slider","sliderError":"bds122Slider-sliderError"};
|
|
2472
2498
|
|
|
2473
2499
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2474
2500
|
import { cn as cn44 } from "@boostdev/design-system-foundation";
|
|
@@ -2530,7 +2556,7 @@ function Slider({
|
|
|
2530
2556
|
import { useId as useId21 } from "react";
|
|
2531
2557
|
|
|
2532
2558
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2533
|
-
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"};
|
|
2534
2560
|
|
|
2535
2561
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2536
2562
|
import { cn as cn45 } from "@boostdev/design-system-foundation";
|
|
@@ -2578,7 +2604,7 @@ function Switch({
|
|
|
2578
2604
|
import { useId as useId22 } from "react";
|
|
2579
2605
|
|
|
2580
2606
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2581
|
-
var Textarea_default = {"formGroup":"
|
|
2607
|
+
var Textarea_default = {"formGroup":"bds122Textarea-formGroup","textarea":"bds122Textarea-textarea","textareaError":"bds122Textarea-textareaError"};
|
|
2582
2608
|
|
|
2583
2609
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2584
2610
|
import { cn as cn46 } from "@boostdev/design-system-foundation";
|
|
@@ -2617,17 +2643,17 @@ function Textarea({
|
|
|
2617
2643
|
}
|
|
2618
2644
|
|
|
2619
2645
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2620
|
-
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"};
|
|
2621
2647
|
|
|
2622
2648
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2623
2649
|
import { cn as cn47 } from "@boostdev/design-system-foundation";
|
|
2624
2650
|
import { jsx as jsx47 } from "react/jsx-runtime";
|
|
2625
|
-
function ButtonGroup({ children, className, variant,
|
|
2651
|
+
function ButtonGroup({ children, className, variant, ...rest }) {
|
|
2626
2652
|
return /* @__PURE__ */ jsx47(
|
|
2627
2653
|
"div",
|
|
2628
2654
|
{
|
|
2655
|
+
...rest,
|
|
2629
2656
|
role: "group",
|
|
2630
|
-
"aria-label": ariaLabel,
|
|
2631
2657
|
className: cn47(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]),
|
|
2632
2658
|
children: /* @__PURE__ */ jsx47("div", { className: ButtonGroup_default.container, children })
|
|
2633
2659
|
}
|
|
@@ -2635,7 +2661,7 @@ function ButtonGroup({ children, className, variant, "aria-label": ariaLabel })
|
|
|
2635
2661
|
}
|
|
2636
2662
|
|
|
2637
2663
|
// src/components/layout/Card/Card.module.css
|
|
2638
|
-
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"};
|
|
2639
2665
|
|
|
2640
2666
|
// src/components/layout/Card/Card.tsx
|
|
2641
2667
|
import { cn as cn48 } from "@boostdev/design-system-foundation";
|
|
@@ -2646,9 +2672,8 @@ function Card({
|
|
|
2646
2672
|
variant = "default",
|
|
2647
2673
|
padding = "medium",
|
|
2648
2674
|
textAlign = "start",
|
|
2649
|
-
style,
|
|
2650
2675
|
onClick,
|
|
2651
|
-
|
|
2676
|
+
...rest
|
|
2652
2677
|
}) {
|
|
2653
2678
|
const classNames = cn48(
|
|
2654
2679
|
Card_default.card,
|
|
@@ -2662,10 +2687,9 @@ function Card({
|
|
|
2662
2687
|
return /* @__PURE__ */ jsx48(
|
|
2663
2688
|
Component,
|
|
2664
2689
|
{
|
|
2690
|
+
...rest,
|
|
2665
2691
|
className: classNames,
|
|
2666
2692
|
onClick,
|
|
2667
|
-
style,
|
|
2668
|
-
"aria-label": ariaLabel,
|
|
2669
2693
|
...onClick && { type: "button" },
|
|
2670
2694
|
children
|
|
2671
2695
|
}
|
|
@@ -2673,7 +2697,7 @@ function Card({
|
|
|
2673
2697
|
}
|
|
2674
2698
|
|
|
2675
2699
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
2676
|
-
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"};
|
|
2677
2701
|
|
|
2678
2702
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
2679
2703
|
import { cn as cn49 } from "@boostdev/design-system-foundation";
|
|
@@ -2684,23 +2708,24 @@ function SectionHeader({
|
|
|
2684
2708
|
className,
|
|
2685
2709
|
alignment = "start",
|
|
2686
2710
|
size = "medium",
|
|
2687
|
-
titleAs = "h2"
|
|
2711
|
+
titleAs = "h2",
|
|
2712
|
+
...rest
|
|
2688
2713
|
}) {
|
|
2689
2714
|
const Title = titleAs;
|
|
2690
|
-
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: [
|
|
2691
2716
|
/* @__PURE__ */ jsx49(Title, { className: SectionHeader_default.title, children: title }),
|
|
2692
2717
|
subtitle && /* @__PURE__ */ jsx49("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
2693
2718
|
] });
|
|
2694
2719
|
}
|
|
2695
2720
|
|
|
2696
2721
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2697
|
-
var IconWrapper_default = {"wrapper":"
|
|
2722
|
+
var IconWrapper_default = {"wrapper":"bds122IconWrapper-wrapper"};
|
|
2698
2723
|
|
|
2699
2724
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2700
2725
|
import { cn as cn50 } from "@boostdev/design-system-foundation";
|
|
2701
2726
|
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
2702
|
-
function IconWrapper({ children, className,
|
|
2703
|
-
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 });
|
|
2704
2729
|
}
|
|
2705
2730
|
|
|
2706
2731
|
// src/index.ts
|