@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/client.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { useId, useState } from "react";
|
|
5
5
|
|
|
6
6
|
// src/components/ui/Accordion/Accordion.module.css
|
|
7
|
-
var Accordion_default = {"accordion":"
|
|
7
|
+
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"};
|
|
8
8
|
|
|
9
9
|
// src/components/ui/Accordion/Accordion.tsx
|
|
10
10
|
import { cn } from "@boostdev/design-system-foundation";
|
|
@@ -13,7 +13,8 @@ function Accordion({
|
|
|
13
13
|
items,
|
|
14
14
|
allowMultiple = false,
|
|
15
15
|
defaultOpen = [],
|
|
16
|
-
className
|
|
16
|
+
className,
|
|
17
|
+
...rest
|
|
17
18
|
}) {
|
|
18
19
|
const baseId = useId();
|
|
19
20
|
const [openIds, setOpenIds] = useState(defaultOpen);
|
|
@@ -24,7 +25,7 @@ function Accordion({
|
|
|
24
25
|
return allowMultiple ? [...prev, id] : [id];
|
|
25
26
|
});
|
|
26
27
|
};
|
|
27
|
-
return /* @__PURE__ */ jsx("div", { className: cn(Accordion_default.accordion, className), children: items.map((item) => {
|
|
28
|
+
return /* @__PURE__ */ jsx("div", { ...rest, className: cn(Accordion_default.accordion, className), children: items.map((item) => {
|
|
28
29
|
const isOpen = openIds.includes(item.id);
|
|
29
30
|
const triggerId = `${baseId}-trigger-${item.id}`;
|
|
30
31
|
const panelId = `${baseId}-panel-${item.id}`;
|
|
@@ -72,7 +73,7 @@ function Accordion({
|
|
|
72
73
|
}
|
|
73
74
|
|
|
74
75
|
// src/components/ui/Alert/Alert.module.css
|
|
75
|
-
var Alert_default = {"alert":"
|
|
76
|
+
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"};
|
|
76
77
|
|
|
77
78
|
// src/components/ui/Alert/Alert.tsx
|
|
78
79
|
import { cn as cn2 } from "@boostdev/design-system-foundation";
|
|
@@ -83,12 +84,14 @@ function Alert({
|
|
|
83
84
|
title,
|
|
84
85
|
children,
|
|
85
86
|
onDismiss,
|
|
86
|
-
className
|
|
87
|
+
className,
|
|
88
|
+
...rest
|
|
87
89
|
}) {
|
|
88
90
|
const isUrgent = variant === "error" || variant === "warning";
|
|
89
91
|
return /* @__PURE__ */ jsxs2(
|
|
90
92
|
"div",
|
|
91
93
|
{
|
|
94
|
+
...rest,
|
|
92
95
|
role: isUrgent ? "alert" : "status",
|
|
93
96
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
94
97
|
"aria-atomic": "true",
|
|
@@ -115,7 +118,7 @@ function Alert({
|
|
|
115
118
|
}
|
|
116
119
|
|
|
117
120
|
// src/components/ui/Avatar/Avatar.module.css
|
|
118
|
-
var Avatar_default = {"avatar":"
|
|
121
|
+
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"};
|
|
119
122
|
|
|
120
123
|
// src/components/ui/Avatar/Avatar.tsx
|
|
121
124
|
import { cn as cn3 } from "@boostdev/design-system-foundation";
|
|
@@ -123,15 +126,16 @@ import { jsx as jsx3 } from "react/jsx-runtime";
|
|
|
123
126
|
function getInitials(name) {
|
|
124
127
|
return name.split(" ").filter(Boolean).slice(0, 2).map((word) => word[0].toUpperCase()).join("");
|
|
125
128
|
}
|
|
126
|
-
function Avatar({ src, alt, name, size = "medium", className }) {
|
|
129
|
+
function Avatar({ src, alt, name, size = "medium", className, ...rest }) {
|
|
127
130
|
const sizeClass = Avatar_default[`--size_${size}`];
|
|
128
131
|
if (src) {
|
|
129
|
-
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 }) });
|
|
132
|
+
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 }) });
|
|
130
133
|
}
|
|
131
134
|
const initials = name ? getInitials(name) : "";
|
|
132
135
|
return /* @__PURE__ */ jsx3(
|
|
133
136
|
"span",
|
|
134
137
|
{
|
|
138
|
+
...rest,
|
|
135
139
|
role: "img",
|
|
136
140
|
"aria-label": name ?? "User avatar",
|
|
137
141
|
className: cn3(Avatar_default.avatar, Avatar_default["--fallback"], sizeClass, className),
|
|
@@ -141,23 +145,23 @@ function Avatar({ src, alt, name, size = "medium", className }) {
|
|
|
141
145
|
}
|
|
142
146
|
|
|
143
147
|
// src/components/ui/Badge/Badge.module.css
|
|
144
|
-
var Badge_default = {"badge":"
|
|
148
|
+
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"};
|
|
145
149
|
|
|
146
150
|
// src/components/ui/Badge/Badge.tsx
|
|
147
151
|
import { cn as cn4 } from "@boostdev/design-system-foundation";
|
|
148
152
|
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
149
|
-
function Badge({ children, variant = "primary", className }) {
|
|
150
|
-
return /* @__PURE__ */ jsx4("span", { className: cn4(Badge_default.badge, Badge_default[`--variant_${variant}`], className), children });
|
|
153
|
+
function Badge({ children, variant = "primary", className, ...rest }) {
|
|
154
|
+
return /* @__PURE__ */ jsx4("span", { ...rest, className: cn4(Badge_default.badge, Badge_default[`--variant_${variant}`], className), children });
|
|
151
155
|
}
|
|
152
156
|
|
|
153
157
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
154
|
-
var Breadcrumb_default = {"breadcrumb":"
|
|
158
|
+
var Breadcrumb_default = {"breadcrumb":"bds122Breadcrumb-breadcrumb","list":"bds122Breadcrumb-list","item":"bds122Breadcrumb-item","link":"bds122Breadcrumb-link","separator":"bds122Breadcrumb-separator","current":"bds122Breadcrumb-current"};
|
|
155
159
|
|
|
156
160
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
157
161
|
import { cn as cn5 } from "@boostdev/design-system-foundation";
|
|
158
162
|
import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
159
|
-
function Breadcrumb({ items, className }) {
|
|
160
|
-
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) => {
|
|
163
|
+
function Breadcrumb({ items, className, ...rest }) {
|
|
164
|
+
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) => {
|
|
161
165
|
const isLast = index === items.length - 1;
|
|
162
166
|
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: [
|
|
163
167
|
/* @__PURE__ */ jsx5("a", { href: item.href, className: Breadcrumb_default.link, children: item.label }),
|
|
@@ -167,7 +171,7 @@ function Breadcrumb({ items, className }) {
|
|
|
167
171
|
}
|
|
168
172
|
|
|
169
173
|
// src/components/ui/Collapsible/Collapsible.module.css
|
|
170
|
-
var Collapsible_default = {"collapsible":"
|
|
174
|
+
var Collapsible_default = {"collapsible":"bds122Collapsible-collapsible","summary":"bds122Collapsible-summary","summaryContent":"bds122Collapsible-summaryContent","icon":"bds122Collapsible-icon","content":"bds122Collapsible-content"};
|
|
171
175
|
|
|
172
176
|
// src/components/ui/Collapsible/Collapsible.tsx
|
|
173
177
|
import { cn as cn6 } from "@boostdev/design-system-foundation";
|
|
@@ -208,7 +212,7 @@ function Collapsible({
|
|
|
208
212
|
import { useState as useState2, useId as useId2 } from "react";
|
|
209
213
|
|
|
210
214
|
// src/components/ui/Calendar/Calendar.module.css
|
|
211
|
-
var Calendar_default = {"calendar":"
|
|
215
|
+
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"};
|
|
212
216
|
|
|
213
217
|
// src/components/ui/Calendar/Calendar.tsx
|
|
214
218
|
import { cn as cn7 } from "@boostdev/design-system-foundation";
|
|
@@ -254,7 +258,7 @@ function getDaysInMonth(year, month) {
|
|
|
254
258
|
function getFirstDayOfMonth(year, month) {
|
|
255
259
|
return new Date(year, month, 1).getDay();
|
|
256
260
|
}
|
|
257
|
-
function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
261
|
+
function Calendar({ value, defaultValue, min, max, onChange, className, ...rest }) {
|
|
258
262
|
const today = /* @__PURE__ */ new Date();
|
|
259
263
|
const controlled = value !== void 0;
|
|
260
264
|
const [internal, setInternal] = useState2(defaultValue);
|
|
@@ -308,7 +312,7 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
308
312
|
...Array.from({ length: daysInMonth }, (_, i) => ({ day: i + 1 }))
|
|
309
313
|
];
|
|
310
314
|
while (cells.length % 7 !== 0) cells.push(null);
|
|
311
|
-
return /* @__PURE__ */ jsxs5("div", { className: cn7(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
315
|
+
return /* @__PURE__ */ jsxs5("div", { ...rest, className: cn7(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
312
316
|
/* @__PURE__ */ jsxs5("div", { className: Calendar_default.header, children: [
|
|
313
317
|
/* @__PURE__ */ jsx7(
|
|
314
318
|
"button",
|
|
@@ -383,12 +387,12 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
383
387
|
import { useRef, useId as useId3 } from "react";
|
|
384
388
|
|
|
385
389
|
// src/components/ui/Carousel/Carousel.module.css
|
|
386
|
-
var Carousel_default = {"carousel":"
|
|
390
|
+
var Carousel_default = {"carousel":"bds122Carousel-carousel","track":"bds122Carousel-track","slide":"bds122Carousel-slide","navBtn":"bds122Carousel-navBtn"};
|
|
387
391
|
|
|
388
392
|
// src/components/ui/Carousel/Carousel.tsx
|
|
389
393
|
import { cn as cn8 } from "@boostdev/design-system-foundation";
|
|
390
394
|
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
391
|
-
function Carousel({ items, label, className }) {
|
|
395
|
+
function Carousel({ items, label, className, ...rest }) {
|
|
392
396
|
const trackRef = useRef(null);
|
|
393
397
|
const listId = useId3();
|
|
394
398
|
const scroll = (direction) => {
|
|
@@ -399,7 +403,7 @@ function Carousel({ items, label, className }) {
|
|
|
399
403
|
behavior: "smooth"
|
|
400
404
|
});
|
|
401
405
|
};
|
|
402
|
-
return /* @__PURE__ */ jsxs6("section", { "aria-label": label, className: cn8(Carousel_default.carousel, className), children: [
|
|
406
|
+
return /* @__PURE__ */ jsxs6("section", { ...rest, "aria-label": label, className: cn8(Carousel_default.carousel, className), children: [
|
|
403
407
|
/* @__PURE__ */ jsx8(
|
|
404
408
|
"button",
|
|
405
409
|
{
|
|
@@ -436,20 +440,20 @@ function Carousel({ items, label, className }) {
|
|
|
436
440
|
}
|
|
437
441
|
|
|
438
442
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
439
|
-
var DescriptionList_default = {"list":"
|
|
443
|
+
var DescriptionList_default = {"list":"bds122DescriptionList-list","group":"bds122DescriptionList-group","term":"bds122DescriptionList-term","details":"bds122DescriptionList-details","--layout_inline":"bds122DescriptionList---layout_inline"};
|
|
440
444
|
|
|
441
445
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
442
446
|
import { cn as cn9 } from "@boostdev/design-system-foundation";
|
|
443
447
|
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
444
|
-
function DescriptionList({ items, layout = "stacked", className }) {
|
|
445
|
-
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: [
|
|
448
|
+
function DescriptionList({ items, layout = "stacked", className, ...rest }) {
|
|
449
|
+
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: [
|
|
446
450
|
/* @__PURE__ */ jsx9("dt", { className: DescriptionList_default.term, children: item.term }),
|
|
447
451
|
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 })
|
|
448
452
|
] }, i)) });
|
|
449
453
|
}
|
|
450
454
|
|
|
451
455
|
// src/components/ui/Link/Link.module.css
|
|
452
|
-
var Link_default = {"link":"
|
|
456
|
+
var Link_default = {"link":"bds122Link-link","--variant_default":"bds122Link---variant_default","--variant_subtle":"bds122Link---variant_subtle","--variant_standalone":"bds122Link---variant_standalone","externalLabel":"bds122Link-externalLabel"};
|
|
453
457
|
|
|
454
458
|
// src/components/ui/Link/Link.tsx
|
|
455
459
|
import { cn as cn10 } from "@boostdev/design-system-foundation";
|
|
@@ -480,17 +484,17 @@ function Link({
|
|
|
480
484
|
}
|
|
481
485
|
|
|
482
486
|
// src/components/ui/Loading/Loading.module.css
|
|
483
|
-
var Loading_default = {"loading":"
|
|
487
|
+
var Loading_default = {"loading":"bds122Loading-loading","spinner":"bds122Loading-spinner","--size_small":"bds122Loading---size_small","--size_large":"bds122Loading---size_large"};
|
|
484
488
|
|
|
485
489
|
// src/components/ui/Loading/Loading.tsx
|
|
486
490
|
import { cn as cn11 } from "@boostdev/design-system-foundation";
|
|
487
491
|
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
488
|
-
function Loading({ size = "medium", className }) {
|
|
489
|
-
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" }) });
|
|
492
|
+
function Loading({ size = "medium", className, ...rest }) {
|
|
493
|
+
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" }) });
|
|
490
494
|
}
|
|
491
495
|
|
|
492
496
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
493
|
-
var NotificationBanner_default = {"banner":"
|
|
497
|
+
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"};
|
|
494
498
|
|
|
495
499
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
496
500
|
import { cn as cn12 } from "@boostdev/design-system-foundation";
|
|
@@ -500,12 +504,14 @@ function NotificationBanner({
|
|
|
500
504
|
children,
|
|
501
505
|
action,
|
|
502
506
|
onDismiss,
|
|
503
|
-
className
|
|
507
|
+
className,
|
|
508
|
+
...rest
|
|
504
509
|
}) {
|
|
505
510
|
const isUrgent = variant === "error" || variant === "warning";
|
|
506
511
|
return /* @__PURE__ */ jsxs9(
|
|
507
512
|
"div",
|
|
508
513
|
{
|
|
514
|
+
...rest,
|
|
509
515
|
role: isUrgent ? "alert" : "status",
|
|
510
516
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
511
517
|
"aria-atomic": "true",
|
|
@@ -529,7 +535,7 @@ function NotificationBanner({
|
|
|
529
535
|
}
|
|
530
536
|
|
|
531
537
|
// src/components/ui/Pagination/Pagination.module.css
|
|
532
|
-
var Pagination_default = {"pagination":"
|
|
538
|
+
var Pagination_default = {"pagination":"bds122Pagination-pagination","list":"bds122Pagination-list","button":"bds122Pagination-button","--active":"bds122Pagination---active","--nav":"bds122Pagination---nav","ellipsis":"bds122Pagination-ellipsis"};
|
|
533
539
|
|
|
534
540
|
// src/components/ui/Pagination/Pagination.tsx
|
|
535
541
|
import { cn as cn13 } from "@boostdev/design-system-foundation";
|
|
@@ -550,10 +556,11 @@ function Pagination({
|
|
|
550
556
|
currentPage,
|
|
551
557
|
totalPages,
|
|
552
558
|
onPageChange,
|
|
553
|
-
className
|
|
559
|
+
className,
|
|
560
|
+
...rest
|
|
554
561
|
}) {
|
|
555
562
|
const pages = getPageRange(currentPage, totalPages);
|
|
556
|
-
return /* @__PURE__ */ jsx13("nav", { "aria-label": "Pagination", className: cn13(Pagination_default.pagination, className), children: /* @__PURE__ */ jsxs10("ul", { className: Pagination_default.list, children: [
|
|
563
|
+
return /* @__PURE__ */ jsx13("nav", { ...rest, "aria-label": "Pagination", className: cn13(Pagination_default.pagination, className), children: /* @__PURE__ */ jsxs10("ul", { className: Pagination_default.list, children: [
|
|
557
564
|
/* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(
|
|
558
565
|
"button",
|
|
559
566
|
{
|
|
@@ -593,7 +600,7 @@ function Pagination({
|
|
|
593
600
|
}
|
|
594
601
|
|
|
595
602
|
// src/components/ui/Progress/Progress.module.css
|
|
596
|
-
var Progress_default = {"container":"
|
|
603
|
+
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"};
|
|
597
604
|
|
|
598
605
|
// src/components/ui/Progress/Progress.tsx
|
|
599
606
|
import { cn as cn14 } from "@boostdev/design-system-foundation";
|
|
@@ -604,10 +611,11 @@ function Progress({
|
|
|
604
611
|
label,
|
|
605
612
|
showLabel = false,
|
|
606
613
|
size = "medium",
|
|
607
|
-
className
|
|
614
|
+
className,
|
|
615
|
+
...rest
|
|
608
616
|
}) {
|
|
609
617
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
610
|
-
return /* @__PURE__ */ jsxs11("div", { className: cn14(Progress_default.container, className), children: [
|
|
618
|
+
return /* @__PURE__ */ jsxs11("div", { ...rest, className: cn14(Progress_default.container, className), children: [
|
|
611
619
|
showLabel && /* @__PURE__ */ jsxs11("div", { className: Progress_default.labelRow, children: [
|
|
612
620
|
/* @__PURE__ */ jsx14("span", { className: Progress_default.label, children: label }),
|
|
613
621
|
/* @__PURE__ */ jsxs11("span", { className: Progress_default.value, children: [
|
|
@@ -631,7 +639,7 @@ function Progress({
|
|
|
631
639
|
}
|
|
632
640
|
|
|
633
641
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
634
|
-
var ProgressCircle_default = {"wrapper":"
|
|
642
|
+
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"};
|
|
635
643
|
|
|
636
644
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
637
645
|
import { cn as cn15 } from "@boostdev/design-system-foundation";
|
|
@@ -644,7 +652,8 @@ function ProgressCircle({
|
|
|
644
652
|
label,
|
|
645
653
|
showValue = false,
|
|
646
654
|
size = "medium",
|
|
647
|
-
className
|
|
655
|
+
className,
|
|
656
|
+
...rest
|
|
648
657
|
}) {
|
|
649
658
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
650
659
|
const px = SIZE_PX[size];
|
|
@@ -655,6 +664,7 @@ function ProgressCircle({
|
|
|
655
664
|
return /* @__PURE__ */ jsxs12(
|
|
656
665
|
"div",
|
|
657
666
|
{
|
|
667
|
+
...rest,
|
|
658
668
|
role: "progressbar",
|
|
659
669
|
"aria-label": label,
|
|
660
670
|
"aria-valuenow": value,
|
|
@@ -710,49 +720,50 @@ function ProgressCircle({
|
|
|
710
720
|
}
|
|
711
721
|
|
|
712
722
|
// src/components/ui/Separator/Separator.module.css
|
|
713
|
-
var Separator_default = {"separator":"
|
|
723
|
+
var Separator_default = {"separator":"bds122Separator-separator","--horizontal":"bds122Separator---horizontal","--vertical":"bds122Separator---vertical"};
|
|
714
724
|
|
|
715
725
|
// src/components/ui/Separator/Separator.tsx
|
|
716
726
|
import { cn as cn16 } from "@boostdev/design-system-foundation";
|
|
717
727
|
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
718
|
-
function Separator({ orientation = "horizontal", className }) {
|
|
728
|
+
function Separator({ orientation = "horizontal", className, ...rest }) {
|
|
719
729
|
if (orientation === "vertical") {
|
|
720
730
|
return /* @__PURE__ */ jsx16(
|
|
721
731
|
"div",
|
|
722
732
|
{
|
|
733
|
+
...rest,
|
|
723
734
|
role: "separator",
|
|
724
735
|
"aria-orientation": "vertical",
|
|
725
736
|
className: cn16(Separator_default.separator, Separator_default["--vertical"], className)
|
|
726
737
|
}
|
|
727
738
|
);
|
|
728
739
|
}
|
|
729
|
-
return /* @__PURE__ */ jsx16("hr", { "aria-orientation": "horizontal", className: cn16(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
740
|
+
return /* @__PURE__ */ jsx16("hr", { ...rest, "aria-orientation": "horizontal", className: cn16(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
730
741
|
}
|
|
731
742
|
|
|
732
743
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
733
744
|
import { cn as cn17 } from "@boostdev/design-system-foundation";
|
|
734
745
|
|
|
735
746
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
736
|
-
var Skeleton_default = {"skeleton":"
|
|
747
|
+
var Skeleton_default = {"skeleton":"bds122Skeleton-skeleton"};
|
|
737
748
|
|
|
738
749
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
739
750
|
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
740
|
-
function Skeleton({ className }) {
|
|
741
|
-
return /* @__PURE__ */ jsx17("div", { "aria-hidden": "true", className: cn17(Skeleton_default.skeleton, className) });
|
|
751
|
+
function Skeleton({ className, ...rest }) {
|
|
752
|
+
return /* @__PURE__ */ jsx17("div", { ...rest, "aria-hidden": "true", className: cn17(Skeleton_default.skeleton, className) });
|
|
742
753
|
}
|
|
743
754
|
|
|
744
755
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
745
|
-
var SkipLink_default = {"skipLink":"
|
|
756
|
+
var SkipLink_default = {"skipLink":"bds122SkipLink-skipLink"};
|
|
746
757
|
|
|
747
758
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
748
759
|
import { cn as cn18 } from "@boostdev/design-system-foundation";
|
|
749
760
|
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
750
|
-
function SkipLink({ href = "#main", children = "Skip to main content", className }) {
|
|
751
|
-
return /* @__PURE__ */ jsx18("a", { href, className: cn18(SkipLink_default.skipLink, className), children });
|
|
761
|
+
function SkipLink({ href = "#main", children = "Skip to main content", className, ...rest }) {
|
|
762
|
+
return /* @__PURE__ */ jsx18("a", { ...rest, href, className: cn18(SkipLink_default.skipLink, className), children });
|
|
752
763
|
}
|
|
753
764
|
|
|
754
765
|
// src/components/ui/Table/Table.module.css
|
|
755
|
-
var Table_default = {"wrapper":"
|
|
766
|
+
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"};
|
|
756
767
|
|
|
757
768
|
// src/components/ui/Table/Table.tsx
|
|
758
769
|
import { cn as cn19 } from "@boostdev/design-system-foundation";
|
|
@@ -822,12 +833,12 @@ function Table({
|
|
|
822
833
|
import { useId as useId4, useRef as useRef2, useState as useState3 } from "react";
|
|
823
834
|
|
|
824
835
|
// src/components/ui/Tabs/Tabs.module.css
|
|
825
|
-
var Tabs_default = {"tabs":"
|
|
836
|
+
var Tabs_default = {"tabs":"bds122Tabs-tabs","tabList":"bds122Tabs-tabList","tab":"bds122Tabs-tab","--active":"bds122Tabs---active","panel":"bds122Tabs-panel"};
|
|
826
837
|
|
|
827
838
|
// src/components/ui/Tabs/Tabs.tsx
|
|
828
839
|
import { cn as cn20 } from "@boostdev/design-system-foundation";
|
|
829
840
|
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
830
|
-
function Tabs({ tabs, defaultTab, className }) {
|
|
841
|
+
function Tabs({ tabs, defaultTab, className, ...rest }) {
|
|
831
842
|
const baseId = useId4();
|
|
832
843
|
const [activeTab, setActiveTab] = useState3(defaultTab ?? tabs[0]?.id);
|
|
833
844
|
const tabRefs = useRef2([]);
|
|
@@ -852,7 +863,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
852
863
|
focusAt(enabledIndexes[enabledIndexes.length - 1]);
|
|
853
864
|
}
|
|
854
865
|
};
|
|
855
|
-
return /* @__PURE__ */ jsxs14("div", { className: cn20(Tabs_default.tabs, className), children: [
|
|
866
|
+
return /* @__PURE__ */ jsxs14("div", { ...rest, className: cn20(Tabs_default.tabs, className), children: [
|
|
856
867
|
/* @__PURE__ */ jsx20("div", { role: "tablist", className: Tabs_default.tabList, children: tabs.map((tab, i) => {
|
|
857
868
|
const tabId = `${baseId}-tab-${tab.id}`;
|
|
858
869
|
const panelId = `${baseId}-panel-${tab.id}`;
|
|
@@ -902,7 +913,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
902
913
|
import { cloneElement, isValidElement, useId as useId5, useState as useState4 } from "react";
|
|
903
914
|
|
|
904
915
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
905
|
-
var Tooltip_default = {"wrapper":"
|
|
916
|
+
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"};
|
|
906
917
|
|
|
907
918
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
908
919
|
import { cn as cn21 } from "@boostdev/design-system-foundation";
|
|
@@ -911,7 +922,8 @@ function Tooltip({
|
|
|
911
922
|
content,
|
|
912
923
|
placement = "top",
|
|
913
924
|
children,
|
|
914
|
-
className
|
|
925
|
+
className,
|
|
926
|
+
...rest
|
|
915
927
|
}) {
|
|
916
928
|
const tooltipId = useId5();
|
|
917
929
|
const [isVisible, setIsVisible] = useState4(false);
|
|
@@ -921,6 +933,7 @@ function Tooltip({
|
|
|
921
933
|
return /* @__PURE__ */ jsxs15(
|
|
922
934
|
"span",
|
|
923
935
|
{
|
|
936
|
+
...rest,
|
|
924
937
|
className: cn21(Tooltip_default.wrapper, className),
|
|
925
938
|
onMouseEnter: () => setIsVisible(true),
|
|
926
939
|
onMouseLeave: () => setIsVisible(false),
|
|
@@ -944,7 +957,7 @@ function Tooltip({
|
|
|
944
957
|
}
|
|
945
958
|
|
|
946
959
|
// src/components/ui/Typography/Typography.module.css
|
|
947
|
-
var Typography_default = {"typography":"
|
|
960
|
+
var Typography_default = {"typography":"bds122Typography-typography","--h1":"bds122Typography---h1","--h2":"bds122Typography---h2","--h3":"bds122Typography---h3","--body":"bds122Typography---body","--body_s":"bds122Typography---body_s"};
|
|
948
961
|
|
|
949
962
|
// src/components/ui/Typography/Typography.tsx
|
|
950
963
|
import { cn as cn22 } from "@boostdev/design-system-foundation";
|
|
@@ -956,13 +969,13 @@ var variantToElement = {
|
|
|
956
969
|
body: "p",
|
|
957
970
|
body_s: "p"
|
|
958
971
|
};
|
|
959
|
-
function Typography({ variant = "body", component, children, className }) {
|
|
972
|
+
function Typography({ variant = "body", component, children, className, ...rest }) {
|
|
960
973
|
const Component = component || variantToElement[variant];
|
|
961
|
-
return /* @__PURE__ */ jsx22(Component, { className: cn22(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
974
|
+
return /* @__PURE__ */ jsx22(Component, { ...rest, className: cn22(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
962
975
|
}
|
|
963
976
|
|
|
964
977
|
// src/components/interaction/Button/Button.module.css
|
|
965
|
-
var Button_default = {"button":"
|
|
978
|
+
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"};
|
|
966
979
|
|
|
967
980
|
// src/components/interaction/Button/Button.tsx
|
|
968
981
|
import { cn as cn23 } from "@boostdev/design-system-foundation";
|
|
@@ -1077,7 +1090,7 @@ function installInvokerCommandsPolyfill() {
|
|
|
1077
1090
|
}
|
|
1078
1091
|
|
|
1079
1092
|
// src/components/interaction/Command/Command.module.css
|
|
1080
|
-
var Command_default = {"dialog":"
|
|
1093
|
+
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"};
|
|
1081
1094
|
|
|
1082
1095
|
// src/components/interaction/Command/Command.tsx
|
|
1083
1096
|
import { cn as cn24 } from "@boostdev/design-system-foundation";
|
|
@@ -1090,7 +1103,8 @@ function Command({
|
|
|
1090
1103
|
onClose,
|
|
1091
1104
|
items,
|
|
1092
1105
|
placeholder = "Search commands\u2026",
|
|
1093
|
-
className
|
|
1106
|
+
className,
|
|
1107
|
+
...rest
|
|
1094
1108
|
}) {
|
|
1095
1109
|
const [query, setQuery] = useState5("");
|
|
1096
1110
|
const [activeIndex, setActiveIndex] = useState5(0);
|
|
@@ -1185,6 +1199,7 @@ function Command({
|
|
|
1185
1199
|
return /* @__PURE__ */ jsx24(
|
|
1186
1200
|
"dialog",
|
|
1187
1201
|
{
|
|
1202
|
+
...rest,
|
|
1188
1203
|
ref: dialogRef,
|
|
1189
1204
|
id: dialogId,
|
|
1190
1205
|
className: cn24(Command_default.dialog, className),
|
|
@@ -1252,14 +1267,14 @@ function Command({
|
|
|
1252
1267
|
import { useEffect as useEffect2, useId as useId7, useRef as useRef4 } from "react";
|
|
1253
1268
|
|
|
1254
1269
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1255
|
-
var Dialog_default = {"dialog":"
|
|
1270
|
+
var Dialog_default = {"dialog":"bds122Dialog-dialog","dialogContent":"bds122Dialog-dialogContent","closeButton":"bds122Dialog-closeButton"};
|
|
1256
1271
|
|
|
1257
1272
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1258
1273
|
import { cn as cn25 } from "@boostdev/design-system-foundation";
|
|
1259
1274
|
import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1260
1275
|
installInvokerCommandsPolyfill();
|
|
1261
1276
|
var FOCUSABLE_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
|
|
1262
|
-
function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClose }) {
|
|
1277
|
+
function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClose, ...rest }) {
|
|
1263
1278
|
const generatedId = useId7();
|
|
1264
1279
|
const id = idProp ?? generatedId;
|
|
1265
1280
|
const dialogRef = useRef4(null);
|
|
@@ -1328,6 +1343,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1328
1343
|
return /* @__PURE__ */ jsxs18(
|
|
1329
1344
|
"dialog",
|
|
1330
1345
|
{
|
|
1346
|
+
...rest,
|
|
1331
1347
|
ref: dialogRef,
|
|
1332
1348
|
id,
|
|
1333
1349
|
className: cn25(className, Dialog_default.dialog),
|
|
@@ -1357,7 +1373,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1357
1373
|
import { useEffect as useEffect3, useId as useId8, useRef as useRef5 } from "react";
|
|
1358
1374
|
|
|
1359
1375
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1360
|
-
var Drawer_default = {"drawer":"
|
|
1376
|
+
var Drawer_default = {"drawer":"bds122Drawer-drawer","--side_left":"bds122Drawer---side_left","header":"bds122Drawer-header","closeButton":"bds122Drawer-closeButton","body":"bds122Drawer-body"};
|
|
1361
1377
|
|
|
1362
1378
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1363
1379
|
import { cn as cn26 } from "@boostdev/design-system-foundation";
|
|
@@ -1371,8 +1387,8 @@ function Drawer({
|
|
|
1371
1387
|
title,
|
|
1372
1388
|
children,
|
|
1373
1389
|
side = "right",
|
|
1374
|
-
|
|
1375
|
-
|
|
1390
|
+
className,
|
|
1391
|
+
...rest
|
|
1376
1392
|
}) {
|
|
1377
1393
|
const generatedId = useId8();
|
|
1378
1394
|
const id = idProp ?? generatedId;
|
|
@@ -1413,23 +1429,27 @@ function Drawer({
|
|
|
1413
1429
|
return () => dialog.removeEventListener("command", handleCommand);
|
|
1414
1430
|
}, [onOpen, onClose]);
|
|
1415
1431
|
const handleClick = (e) => {
|
|
1416
|
-
|
|
1432
|
+
const dialog = dialogRef.current;
|
|
1433
|
+
if (!dialog) return;
|
|
1434
|
+
const rect = dialog.getBoundingClientRect();
|
|
1435
|
+
const outside = e.clientX < rect.left || e.clientX > rect.right || e.clientY < rect.top || e.clientY > rect.bottom;
|
|
1436
|
+
if (outside) onClose();
|
|
1417
1437
|
};
|
|
1418
1438
|
const handleCancel = (e) => {
|
|
1419
1439
|
e.preventDefault();
|
|
1420
1440
|
onClose();
|
|
1421
1441
|
};
|
|
1422
|
-
return /* @__PURE__ */
|
|
1442
|
+
return /* @__PURE__ */ jsxs19(
|
|
1423
1443
|
"dialog",
|
|
1424
1444
|
{
|
|
1445
|
+
...rest,
|
|
1425
1446
|
ref: dialogRef,
|
|
1426
1447
|
id,
|
|
1427
1448
|
className: cn26(Drawer_default.drawer, Drawer_default[`--side_${side}`], className),
|
|
1428
|
-
"aria-label": ariaLabel,
|
|
1429
1449
|
"aria-modal": "true",
|
|
1430
1450
|
onClick: handleClick,
|
|
1431
1451
|
onCancel: handleCancel,
|
|
1432
|
-
children:
|
|
1452
|
+
children: [
|
|
1433
1453
|
/* @__PURE__ */ jsxs19("div", { className: Drawer_default.header, children: [
|
|
1434
1454
|
!!title && title,
|
|
1435
1455
|
/* @__PURE__ */ jsx26(
|
|
@@ -1445,7 +1465,7 @@ function Drawer({
|
|
|
1445
1465
|
)
|
|
1446
1466
|
] }),
|
|
1447
1467
|
/* @__PURE__ */ jsx26("div", { className: Drawer_default.body, children })
|
|
1448
|
-
]
|
|
1468
|
+
]
|
|
1449
1469
|
}
|
|
1450
1470
|
);
|
|
1451
1471
|
}
|
|
@@ -1461,7 +1481,7 @@ import {
|
|
|
1461
1481
|
} from "react";
|
|
1462
1482
|
|
|
1463
1483
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1464
|
-
var DropdownMenu_default = {"wrapper":"
|
|
1484
|
+
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"};
|
|
1465
1485
|
|
|
1466
1486
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1467
1487
|
import { cn as cn27 } from "@boostdev/design-system-foundation";
|
|
@@ -1470,7 +1490,8 @@ function DropdownMenu({
|
|
|
1470
1490
|
trigger,
|
|
1471
1491
|
items,
|
|
1472
1492
|
placement = "bottom-start",
|
|
1473
|
-
className
|
|
1493
|
+
className,
|
|
1494
|
+
...rest
|
|
1474
1495
|
}) {
|
|
1475
1496
|
const [isOpen, setIsOpen] = useState6(false);
|
|
1476
1497
|
const containerRef = useRef6(null);
|
|
@@ -1533,7 +1554,7 @@ function DropdownMenu({
|
|
|
1533
1554
|
if (typeof existingOnClick === "function") existingOnClick(e);
|
|
1534
1555
|
}
|
|
1535
1556
|
}) : trigger;
|
|
1536
|
-
return /* @__PURE__ */ jsxs20("div", { ref: containerRef, className: cn27(DropdownMenu_default.wrapper, className), children: [
|
|
1557
|
+
return /* @__PURE__ */ jsxs20("div", { ...rest, ref: containerRef, className: cn27(DropdownMenu_default.wrapper, className), children: [
|
|
1537
1558
|
triggerEl,
|
|
1538
1559
|
isOpen && /* @__PURE__ */ jsx27(
|
|
1539
1560
|
"ul",
|
|
@@ -1581,7 +1602,7 @@ import {
|
|
|
1581
1602
|
} from "react";
|
|
1582
1603
|
|
|
1583
1604
|
// src/components/interaction/Popover/Popover.module.css
|
|
1584
|
-
var Popover_default = {"wrapper":"
|
|
1605
|
+
var Popover_default = {"wrapper":"bds122Popover-wrapper","panel":"bds122Popover-panel","g":"bds122Popover-g"};
|
|
1585
1606
|
|
|
1586
1607
|
// src/components/interaction/Popover/Popover.tsx
|
|
1587
1608
|
import { cn as cn28 } from "@boostdev/design-system-foundation";
|
|
@@ -1596,7 +1617,8 @@ function Popover({
|
|
|
1596
1617
|
content,
|
|
1597
1618
|
placement = "bottom",
|
|
1598
1619
|
className,
|
|
1599
|
-
"aria-label": ariaLabel
|
|
1620
|
+
"aria-label": ariaLabel,
|
|
1621
|
+
...rest
|
|
1600
1622
|
}) {
|
|
1601
1623
|
const [isOpen, setIsOpen] = useState7(false);
|
|
1602
1624
|
const containerRef = useRef7(null);
|
|
@@ -1645,7 +1667,7 @@ function Popover({
|
|
|
1645
1667
|
// avoid a double-toggle when both onClick and invoker fire.
|
|
1646
1668
|
onClick: children.props.onClick
|
|
1647
1669
|
}) : children;
|
|
1648
|
-
return /* @__PURE__ */ jsxs21("span", { ref: containerRef, className: cn28(Popover_default.wrapper, className), children: [
|
|
1670
|
+
return /* @__PURE__ */ jsxs21("span", { ...rest, ref: containerRef, className: cn28(Popover_default.wrapper, className), children: [
|
|
1649
1671
|
trigger,
|
|
1650
1672
|
/* @__PURE__ */ jsx28(
|
|
1651
1673
|
"div",
|
|
@@ -1665,15 +1687,16 @@ function Popover({
|
|
|
1665
1687
|
}
|
|
1666
1688
|
|
|
1667
1689
|
// src/components/interaction/Rating/Rating.module.css
|
|
1668
|
-
var Rating_default = {"rating":"
|
|
1690
|
+
var Rating_default = {"rating":"bds122Rating-rating","star":"bds122Rating-star","--filled":"bds122Rating---filled"};
|
|
1669
1691
|
|
|
1670
1692
|
// src/components/interaction/Rating/Rating.tsx
|
|
1671
1693
|
import { cn as cn29 } from "@boostdev/design-system-foundation";
|
|
1672
1694
|
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
1673
|
-
function Rating({ value, max = 5, className }) {
|
|
1695
|
+
function Rating({ value, max = 5, className, ...rest }) {
|
|
1674
1696
|
return /* @__PURE__ */ jsx29(
|
|
1675
1697
|
"div",
|
|
1676
1698
|
{
|
|
1699
|
+
...rest,
|
|
1677
1700
|
className: cn29(Rating_default.rating, className),
|
|
1678
1701
|
role: "img",
|
|
1679
1702
|
"aria-label": `${value} out of ${max} stars`,
|
|
@@ -1696,7 +1719,7 @@ function Rating({ value, max = 5, className }) {
|
|
|
1696
1719
|
import { useState as useState8, useEffect as useEffect6, createContext, useContext, useCallback, useMemo as useMemo2, useRef as useRef8 } from "react";
|
|
1697
1720
|
|
|
1698
1721
|
// src/components/interaction/Toast/Toast.module.css
|
|
1699
|
-
var Toast_default = {"toastContainer":"
|
|
1722
|
+
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"};
|
|
1700
1723
|
|
|
1701
1724
|
// src/components/interaction/Toast/Toast.tsx
|
|
1702
1725
|
import { cn as cn30 } from "@boostdev/design-system-foundation";
|
|
@@ -1769,10 +1792,10 @@ function useToast() {
|
|
|
1769
1792
|
import { useId as useId11 } from "react";
|
|
1770
1793
|
|
|
1771
1794
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1772
|
-
var Checkbox_default = {"checkboxGroup":"
|
|
1795
|
+
var Checkbox_default = {"checkboxGroup":"bds122Checkbox-checkboxGroup","inputWrapper":"bds122Checkbox-inputWrapper","checkbox":"bds122Checkbox-checkbox","checkboxError":"bds122Checkbox-checkboxError"};
|
|
1773
1796
|
|
|
1774
1797
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1775
|
-
var Message_default = {"error":"
|
|
1798
|
+
var Message_default = {"error":"bds122Message-error","hint":"bds122Message-hint"};
|
|
1776
1799
|
|
|
1777
1800
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1778
1801
|
import { cn as cn31 } from "@boostdev/design-system-foundation";
|
|
@@ -1783,7 +1806,7 @@ var Message = ({ message, type, inputId, className }) => {
|
|
|
1783
1806
|
};
|
|
1784
1807
|
|
|
1785
1808
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1786
|
-
var Label_default = {"label":"
|
|
1809
|
+
var Label_default = {"label":"bds122Label-label"};
|
|
1787
1810
|
|
|
1788
1811
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1789
1812
|
import { cn as cn32 } from "@boostdev/design-system-foundation";
|
|
@@ -1796,13 +1819,13 @@ var Label = ({ label, id, className }) => {
|
|
|
1796
1819
|
import { cn as cn34 } from "@boostdev/design-system-foundation";
|
|
1797
1820
|
|
|
1798
1821
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1799
|
-
var InputContainer_default = {"container":"
|
|
1822
|
+
var InputContainer_default = {"container":"bds122InputContainer-container"};
|
|
1800
1823
|
|
|
1801
1824
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1802
1825
|
import { cn as cn33 } from "@boostdev/design-system-foundation";
|
|
1803
1826
|
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
1804
|
-
var InputContainer = ({ children, className }) => {
|
|
1805
|
-
return /* @__PURE__ */ jsx33("div", { className: cn33(InputContainer_default.container, className), children });
|
|
1827
|
+
var InputContainer = ({ children, className, ...rest }) => {
|
|
1828
|
+
return /* @__PURE__ */ jsx33("div", { ...rest, className: cn33(InputContainer_default.container, className), children });
|
|
1806
1829
|
};
|
|
1807
1830
|
|
|
1808
1831
|
// src/components/interaction/form/Checkbox/Checkbox.tsx
|
|
@@ -1837,7 +1860,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1837
1860
|
import { useId as useId12 } from "react";
|
|
1838
1861
|
|
|
1839
1862
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.module.css
|
|
1840
|
-
var CheckboxGroup_default = {"group":"
|
|
1863
|
+
var CheckboxGroup_default = {"group":"bds122CheckboxGroup-group","legend":"bds122CheckboxGroup-legend","required":"bds122CheckboxGroup-required","items":"bds122CheckboxGroup-items"};
|
|
1841
1864
|
|
|
1842
1865
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
|
|
1843
1866
|
import { cn as cn35 } from "@boostdev/design-system-foundation";
|
|
@@ -1848,8 +1871,8 @@ function CheckboxGroup({
|
|
|
1848
1871
|
error,
|
|
1849
1872
|
hint,
|
|
1850
1873
|
required,
|
|
1851
|
-
|
|
1852
|
-
|
|
1874
|
+
className,
|
|
1875
|
+
...rest
|
|
1853
1876
|
}) {
|
|
1854
1877
|
const id = useId12();
|
|
1855
1878
|
const hintId = id + "hint";
|
|
@@ -1858,8 +1881,8 @@ function CheckboxGroup({
|
|
|
1858
1881
|
return /* @__PURE__ */ jsxs24(
|
|
1859
1882
|
"fieldset",
|
|
1860
1883
|
{
|
|
1884
|
+
...rest,
|
|
1861
1885
|
className: cn35(CheckboxGroup_default.group, className),
|
|
1862
|
-
disabled,
|
|
1863
1886
|
"aria-required": required || void 0,
|
|
1864
1887
|
"aria-describedby": describedBy,
|
|
1865
1888
|
children: [
|
|
@@ -1885,7 +1908,7 @@ import {
|
|
|
1885
1908
|
} from "react";
|
|
1886
1909
|
|
|
1887
1910
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1888
|
-
var Combobox_default = {"formGroup":"
|
|
1911
|
+
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"};
|
|
1889
1912
|
|
|
1890
1913
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1891
1914
|
import { cn as cn36 } from "@boostdev/design-system-foundation";
|
|
@@ -1900,7 +1923,8 @@ function Combobox({
|
|
|
1900
1923
|
disabled = false,
|
|
1901
1924
|
error,
|
|
1902
1925
|
hint,
|
|
1903
|
-
className
|
|
1926
|
+
className,
|
|
1927
|
+
...rest
|
|
1904
1928
|
}) {
|
|
1905
1929
|
const id = name + useId13();
|
|
1906
1930
|
const listboxId = id + "listbox";
|
|
@@ -1967,7 +1991,7 @@ function Combobox({
|
|
|
1967
1991
|
setIsOpen(false);
|
|
1968
1992
|
}
|
|
1969
1993
|
};
|
|
1970
|
-
return /* @__PURE__ */ jsxs25(InputContainer, { className: cn36(Combobox_default.formGroup, className), children: [
|
|
1994
|
+
return /* @__PURE__ */ jsxs25(InputContainer, { ...rest, className: cn36(Combobox_default.formGroup, className), children: [
|
|
1971
1995
|
/* @__PURE__ */ jsx36(Label, { id, label }),
|
|
1972
1996
|
/* @__PURE__ */ jsxs25("div", { ref: containerRef, className: Combobox_default.inputWrapper, children: [
|
|
1973
1997
|
/* @__PURE__ */ jsx36(
|
|
@@ -2035,7 +2059,7 @@ function Combobox({
|
|
|
2035
2059
|
import { useId as useId14, useRef as useRef10, useState as useState10 } from "react";
|
|
2036
2060
|
|
|
2037
2061
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
2038
|
-
var FileInput_default = {"formGroup":"
|
|
2062
|
+
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"};
|
|
2039
2063
|
|
|
2040
2064
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2041
2065
|
import { cn as cn37 } from "@boostdev/design-system-foundation";
|
|
@@ -2050,7 +2074,8 @@ function FileInput({
|
|
|
2050
2074
|
error,
|
|
2051
2075
|
hint,
|
|
2052
2076
|
onChange,
|
|
2053
|
-
className
|
|
2077
|
+
className,
|
|
2078
|
+
...rest
|
|
2054
2079
|
}) {
|
|
2055
2080
|
const uid = name + useId14();
|
|
2056
2081
|
const hintId = uid + "hint";
|
|
@@ -2088,7 +2113,7 @@ function FileInput({
|
|
|
2088
2113
|
if (!disabled) setIsDragging(true);
|
|
2089
2114
|
};
|
|
2090
2115
|
const handleDragLeave = () => setIsDragging(false);
|
|
2091
|
-
return /* @__PURE__ */ jsxs26(InputContainer, { className: cn37(FileInput_default.formGroup, className), children: [
|
|
2116
|
+
return /* @__PURE__ */ jsxs26(InputContainer, { ...rest, className: cn37(FileInput_default.formGroup, className), children: [
|
|
2092
2117
|
/* @__PURE__ */ jsxs26(
|
|
2093
2118
|
"label",
|
|
2094
2119
|
{
|
|
@@ -2135,7 +2160,7 @@ function FileInput({
|
|
|
2135
2160
|
import { useId as useId15 } from "react";
|
|
2136
2161
|
|
|
2137
2162
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
2138
|
-
var FormInput_default = {"formGroup":"
|
|
2163
|
+
var FormInput_default = {"formGroup":"bds122FormInput-formGroup","input":"bds122FormInput-input","inputError":"bds122FormInput-inputError"};
|
|
2139
2164
|
|
|
2140
2165
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2141
2166
|
import { cn as cn38 } from "@boostdev/design-system-foundation";
|
|
@@ -2179,7 +2204,7 @@ function FormInput({
|
|
|
2179
2204
|
import { useId as useId16, useRef as useRef11, useState as useState11 } from "react";
|
|
2180
2205
|
|
|
2181
2206
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
2182
|
-
var NumberInput_default = {"formGroup":"
|
|
2207
|
+
var NumberInput_default = {"formGroup":"bds122NumberInput-formGroup","inputRow":"bds122NumberInput-inputRow","input":"bds122NumberInput-input","inputError":"bds122NumberInput-inputError","stepper":"bds122NumberInput-stepper"};
|
|
2183
2208
|
|
|
2184
2209
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2185
2210
|
import { cn as cn39 } from "@boostdev/design-system-foundation";
|
|
@@ -2196,7 +2221,8 @@ function NumberInput({
|
|
|
2196
2221
|
error,
|
|
2197
2222
|
hint,
|
|
2198
2223
|
onChange,
|
|
2199
|
-
className
|
|
2224
|
+
className,
|
|
2225
|
+
...rest
|
|
2200
2226
|
}) {
|
|
2201
2227
|
const uid = name + useId16();
|
|
2202
2228
|
const hintId = uid + "hint";
|
|
@@ -2221,7 +2247,7 @@ function NumberInput({
|
|
|
2221
2247
|
}
|
|
2222
2248
|
onChange?.(next);
|
|
2223
2249
|
};
|
|
2224
|
-
return /* @__PURE__ */ jsxs28(InputContainer, { className: cn39(NumberInput_default.formGroup, className), children: [
|
|
2250
|
+
return /* @__PURE__ */ jsxs28(InputContainer, { ...rest, className: cn39(NumberInput_default.formGroup, className), children: [
|
|
2225
2251
|
/* @__PURE__ */ jsx39(Label, { id: uid, label }),
|
|
2226
2252
|
/* @__PURE__ */ jsxs28("div", { className: NumberInput_default.inputRow, children: [
|
|
2227
2253
|
/* @__PURE__ */ jsx39(
|
|
@@ -2283,7 +2309,7 @@ function NumberInput({
|
|
|
2283
2309
|
import { useId as useId17 } from "react";
|
|
2284
2310
|
|
|
2285
2311
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
2286
|
-
var Radio_default = {"radioGroup":"
|
|
2312
|
+
var Radio_default = {"radioGroup":"bds122Radio-radioGroup","inputWrapper":"bds122Radio-inputWrapper","textWrapper":"bds122Radio-textWrapper","description":"bds122Radio-description","radio":"bds122Radio-radio","radioError":"bds122Radio-radioError"};
|
|
2287
2313
|
|
|
2288
2314
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2289
2315
|
import { cn as cn40 } from "@boostdev/design-system-foundation";
|
|
@@ -2321,7 +2347,7 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
2321
2347
|
import { useId as useId18 } from "react";
|
|
2322
2348
|
|
|
2323
2349
|
// src/components/interaction/form/RadioGroup/RadioGroup.module.css
|
|
2324
|
-
var RadioGroup_default = {"group":"
|
|
2350
|
+
var RadioGroup_default = {"group":"bds122RadioGroup-group","legend":"bds122RadioGroup-legend","required":"bds122RadioGroup-required","items":"bds122RadioGroup-items"};
|
|
2325
2351
|
|
|
2326
2352
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2327
2353
|
import { cn as cn41 } from "@boostdev/design-system-foundation";
|
|
@@ -2332,8 +2358,8 @@ function RadioGroup({
|
|
|
2332
2358
|
error,
|
|
2333
2359
|
hint,
|
|
2334
2360
|
required,
|
|
2335
|
-
|
|
2336
|
-
|
|
2361
|
+
className,
|
|
2362
|
+
...rest
|
|
2337
2363
|
}) {
|
|
2338
2364
|
const id = useId18();
|
|
2339
2365
|
const hintId = id + "hint";
|
|
@@ -2342,8 +2368,8 @@ function RadioGroup({
|
|
|
2342
2368
|
return /* @__PURE__ */ jsxs30(
|
|
2343
2369
|
"fieldset",
|
|
2344
2370
|
{
|
|
2371
|
+
...rest,
|
|
2345
2372
|
className: cn41(RadioGroup_default.group, className),
|
|
2346
|
-
disabled,
|
|
2347
2373
|
"aria-required": required || void 0,
|
|
2348
2374
|
"aria-describedby": describedBy,
|
|
2349
2375
|
children: [
|
|
@@ -2363,7 +2389,7 @@ function RadioGroup({
|
|
|
2363
2389
|
import { Children, cloneElement as cloneElement4, isValidElement as isValidElement4 } from "react";
|
|
2364
2390
|
|
|
2365
2391
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.module.css
|
|
2366
|
-
var SegmentedControl_default = {"control":"
|
|
2392
|
+
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"};
|
|
2367
2393
|
|
|
2368
2394
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2369
2395
|
import { cn as cn42 } from "@boostdev/design-system-foundation";
|
|
@@ -2375,7 +2401,7 @@ function SegmentedControl({
|
|
|
2375
2401
|
size = "medium",
|
|
2376
2402
|
variant = "outline",
|
|
2377
2403
|
className,
|
|
2378
|
-
|
|
2404
|
+
...rest
|
|
2379
2405
|
}) {
|
|
2380
2406
|
const validChildren = Children.toArray(children).filter(isValidElement4);
|
|
2381
2407
|
const autoIndex = selectedIndexProp === void 0 ? validChildren.findIndex((child) => {
|
|
@@ -2386,8 +2412,8 @@ function SegmentedControl({
|
|
|
2386
2412
|
return /* @__PURE__ */ jsxs31(
|
|
2387
2413
|
"div",
|
|
2388
2414
|
{
|
|
2415
|
+
...rest,
|
|
2389
2416
|
role: "group",
|
|
2390
|
-
"aria-label": ariaLabel,
|
|
2391
2417
|
className: cn42(SegmentedControl_default.control, SegmentedControl_default[`--size_${size}`], SegmentedControl_default[`--variant_${variant}`], className),
|
|
2392
2418
|
style: {
|
|
2393
2419
|
"--control_count": validChildren.length,
|
|
@@ -2419,7 +2445,7 @@ function SegmentedControl({
|
|
|
2419
2445
|
import { useId as useId19 } from "react";
|
|
2420
2446
|
|
|
2421
2447
|
// src/components/interaction/form/Select/Select.module.css
|
|
2422
|
-
var Select_default = {"formGroup":"
|
|
2448
|
+
var Select_default = {"formGroup":"bds122Select-formGroup","selectWrapper":"bds122Select-selectWrapper","select":"bds122Select-select","selectError":"bds122Select-selectError","chevron":"bds122Select-chevron"};
|
|
2423
2449
|
|
|
2424
2450
|
// src/components/interaction/form/Select/Select.tsx
|
|
2425
2451
|
import { cn as cn43 } from "@boostdev/design-system-foundation";
|
|
@@ -2470,7 +2496,7 @@ function Select({
|
|
|
2470
2496
|
import { useId as useId20, useState as useState12 } from "react";
|
|
2471
2497
|
|
|
2472
2498
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2473
|
-
var Slider_default = {"formGroup":"
|
|
2499
|
+
var Slider_default = {"formGroup":"bds122Slider-formGroup","labelRow":"bds122Slider-labelRow","value":"bds122Slider-value","slider":"bds122Slider-slider","sliderError":"bds122Slider-sliderError"};
|
|
2474
2500
|
|
|
2475
2501
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2476
2502
|
import { cn as cn44 } from "@boostdev/design-system-foundation";
|
|
@@ -2532,7 +2558,7 @@ function Slider({
|
|
|
2532
2558
|
import { useId as useId21 } from "react";
|
|
2533
2559
|
|
|
2534
2560
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2535
|
-
var Switch_default = {"switchGroup":"
|
|
2561
|
+
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"};
|
|
2536
2562
|
|
|
2537
2563
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2538
2564
|
import { cn as cn45 } from "@boostdev/design-system-foundation";
|
|
@@ -2580,7 +2606,7 @@ function Switch({
|
|
|
2580
2606
|
import { useId as useId22 } from "react";
|
|
2581
2607
|
|
|
2582
2608
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2583
|
-
var Textarea_default = {"formGroup":"
|
|
2609
|
+
var Textarea_default = {"formGroup":"bds122Textarea-formGroup","textarea":"bds122Textarea-textarea","textareaError":"bds122Textarea-textareaError"};
|
|
2584
2610
|
|
|
2585
2611
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2586
2612
|
import { cn as cn46 } from "@boostdev/design-system-foundation";
|
|
@@ -2619,17 +2645,17 @@ function Textarea({
|
|
|
2619
2645
|
}
|
|
2620
2646
|
|
|
2621
2647
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2622
|
-
var ButtonGroup_default = {"buttonGroup":"
|
|
2648
|
+
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"};
|
|
2623
2649
|
|
|
2624
2650
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2625
2651
|
import { cn as cn47 } from "@boostdev/design-system-foundation";
|
|
2626
2652
|
import { jsx as jsx47 } from "react/jsx-runtime";
|
|
2627
|
-
function ButtonGroup({ children, className, variant,
|
|
2653
|
+
function ButtonGroup({ children, className, variant, ...rest }) {
|
|
2628
2654
|
return /* @__PURE__ */ jsx47(
|
|
2629
2655
|
"div",
|
|
2630
2656
|
{
|
|
2657
|
+
...rest,
|
|
2631
2658
|
role: "group",
|
|
2632
|
-
"aria-label": ariaLabel,
|
|
2633
2659
|
className: cn47(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]),
|
|
2634
2660
|
children: /* @__PURE__ */ jsx47("div", { className: ButtonGroup_default.container, children })
|
|
2635
2661
|
}
|
|
@@ -2637,7 +2663,7 @@ function ButtonGroup({ children, className, variant, "aria-label": ariaLabel })
|
|
|
2637
2663
|
}
|
|
2638
2664
|
|
|
2639
2665
|
// src/components/layout/Card/Card.module.css
|
|
2640
|
-
var Card_default = {"card":"
|
|
2666
|
+
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"};
|
|
2641
2667
|
|
|
2642
2668
|
// src/components/layout/Card/Card.tsx
|
|
2643
2669
|
import { cn as cn48 } from "@boostdev/design-system-foundation";
|
|
@@ -2648,9 +2674,8 @@ function Card({
|
|
|
2648
2674
|
variant = "default",
|
|
2649
2675
|
padding = "medium",
|
|
2650
2676
|
textAlign = "start",
|
|
2651
|
-
style,
|
|
2652
2677
|
onClick,
|
|
2653
|
-
|
|
2678
|
+
...rest
|
|
2654
2679
|
}) {
|
|
2655
2680
|
const classNames = cn48(
|
|
2656
2681
|
Card_default.card,
|
|
@@ -2664,10 +2689,9 @@ function Card({
|
|
|
2664
2689
|
return /* @__PURE__ */ jsx48(
|
|
2665
2690
|
Component,
|
|
2666
2691
|
{
|
|
2692
|
+
...rest,
|
|
2667
2693
|
className: classNames,
|
|
2668
2694
|
onClick,
|
|
2669
|
-
style,
|
|
2670
|
-
"aria-label": ariaLabel,
|
|
2671
2695
|
...onClick && { type: "button" },
|
|
2672
2696
|
children
|
|
2673
2697
|
}
|
|
@@ -2675,7 +2699,7 @@ function Card({
|
|
|
2675
2699
|
}
|
|
2676
2700
|
|
|
2677
2701
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
2678
|
-
var SectionHeader_default = {"sectionHeader":"
|
|
2702
|
+
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"};
|
|
2679
2703
|
|
|
2680
2704
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
2681
2705
|
import { cn as cn49 } from "@boostdev/design-system-foundation";
|
|
@@ -2686,23 +2710,24 @@ function SectionHeader({
|
|
|
2686
2710
|
className,
|
|
2687
2711
|
alignment = "start",
|
|
2688
2712
|
size = "medium",
|
|
2689
|
-
titleAs = "h2"
|
|
2713
|
+
titleAs = "h2",
|
|
2714
|
+
...rest
|
|
2690
2715
|
}) {
|
|
2691
2716
|
const Title = titleAs;
|
|
2692
|
-
return /* @__PURE__ */ jsxs36("div", { className: cn49(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2717
|
+
return /* @__PURE__ */ jsxs36("div", { ...rest, className: cn49(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2693
2718
|
/* @__PURE__ */ jsx49(Title, { className: SectionHeader_default.title, children: title }),
|
|
2694
2719
|
subtitle && /* @__PURE__ */ jsx49("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
2695
2720
|
] });
|
|
2696
2721
|
}
|
|
2697
2722
|
|
|
2698
2723
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2699
|
-
var IconWrapper_default = {"wrapper":"
|
|
2724
|
+
var IconWrapper_default = {"wrapper":"bds122IconWrapper-wrapper"};
|
|
2700
2725
|
|
|
2701
2726
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2702
2727
|
import { cn as cn50 } from "@boostdev/design-system-foundation";
|
|
2703
2728
|
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
2704
|
-
function IconWrapper({ children, className,
|
|
2705
|
-
return /* @__PURE__ */ jsx50("div", { className: cn50(className, IconWrapper_default.wrapper),
|
|
2729
|
+
function IconWrapper({ children, className, ...rest }) {
|
|
2730
|
+
return /* @__PURE__ */ jsx50("div", { ...rest, className: cn50(className, IconWrapper_default.wrapper), children });
|
|
2706
2731
|
}
|
|
2707
2732
|
|
|
2708
2733
|
// src/index.ts
|