@boostdev/design-system-components 0.1.3 → 0.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client.cjs +185 -104
- package/dist/client.css +444 -427
- package/dist/client.d.cts +15 -13
- package/dist/client.d.ts +15 -13
- package/dist/client.js +189 -107
- package/dist/index.cjs +185 -104
- package/dist/index.css +444 -427
- package/dist/index.d.cts +15 -13
- package/dist/index.d.ts +15 -13
- package/dist/index.js +189 -107
- package/package.json +3 -3
- package/src/components/interaction/Button/Button.tsx +35 -8
- package/src/components/interaction/Dialog/Dialog.spec.tsx +10 -10
- package/src/components/interaction/Dialog/Dialog.tsx +21 -7
- package/src/components/interaction/DropdownMenu/DropdownMenu.tsx +1 -1
- package/src/components/interaction/DropdownMenu/index.ts +1 -0
- package/src/components/interaction/Toast/Toast.module.css +28 -0
- package/src/components/interaction/Toast/Toast.tsx +10 -1
- package/src/components/interaction/form/Checkbox/Checkbox.module.css +1 -1
- package/src/components/interaction/form/Checkbox/Checkbox.tsx +2 -1
- package/src/components/interaction/form/Combobox/Combobox.tsx +11 -3
- package/src/components/interaction/form/Combobox/index.ts +1 -0
- package/src/components/interaction/form/FileInput/FileInput.tsx +15 -2
- package/src/components/interaction/form/FormInput/FormInput.tsx +4 -3
- package/src/components/interaction/form/NumberInput/NumberInput.tsx +21 -17
- package/src/components/interaction/form/Radio/Radio.module.css +1 -1
- package/src/components/interaction/form/Radio/Radio.tsx +2 -1
- package/src/components/interaction/form/Select/Select.spec.tsx +2 -1
- package/src/components/interaction/form/Select/Select.tsx +3 -3
- package/src/components/interaction/form/Select/index.ts +1 -0
- package/src/components/interaction/form/Slider/Slider.tsx +5 -4
- package/src/components/interaction/form/Switch/Switch.tsx +1 -1
- package/src/components/interaction/form/Textarea/Textarea.tsx +1 -1
- package/src/components/interaction/form/atoms/Message.tsx +2 -2
- package/src/components/layout/ButtonGroup/ButtonGroup.tsx +1 -1
- package/src/components/layout/Card/Card.module.css +1 -1
- package/src/components/layout/Card/Card.tsx +3 -0
- package/src/components/layout/IconWrapper/IconWrapper.module.css +3 -6
- package/src/components/layout/SectionHeader/SectionHeader.module.css +2 -5
- package/src/components/layout/SectionHeader/SectionHeader.tsx +2 -3
- package/src/components/ui/Accordion/Accordion.tsx +1 -1
- package/src/components/ui/Accordion/index.ts +1 -0
- package/src/components/ui/Breadcrumb/Breadcrumb.tsx +2 -2
- package/src/components/ui/Breadcrumb/index.ts +1 -0
- package/src/components/ui/Calendar/Calendar.tsx +8 -3
- package/src/components/ui/DescriptionList/DescriptionList.tsx +1 -1
- package/src/components/ui/DescriptionList/index.ts +1 -0
- package/src/components/ui/Link/Link.tsx +3 -1
- package/src/components/ui/Separator/Separator.module.css +3 -6
- package/src/components/ui/Table/Table.tsx +1 -1
- package/src/components/ui/Table/index.ts +1 -0
- package/src/components/ui/Tabs/Tabs.tsx +1 -1
- package/src/components/ui/Tabs/index.ts +1 -0
- package/src/components/ui/Typography/Typography.module.css +1 -4
- package/src/index.ts +8 -0
package/dist/index.cjs
CHANGED
|
@@ -72,7 +72,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
72
72
|
var import_react = require("react");
|
|
73
73
|
|
|
74
74
|
// src/components/ui/Accordion/Accordion.module.css
|
|
75
|
-
var Accordion_default = {};
|
|
75
|
+
var Accordion_default = {"accordion":"bds015-accordion","item":"bds015-item","heading":"bds015-heading","trigger":"bds015-trigger","triggerLabel":"bds015-triggerLabel","chevron":"bds015-chevron","--open":"bds015---open","panel":"bds015-panel","panelContent":"bds015-panelContent"};
|
|
76
76
|
|
|
77
77
|
// src/components/ui/Accordion/Accordion.tsx
|
|
78
78
|
var import_design_system_foundation = require("@boostdev/design-system-foundation");
|
|
@@ -140,7 +140,7 @@ function Accordion({
|
|
|
140
140
|
}
|
|
141
141
|
|
|
142
142
|
// src/components/ui/Alert/Alert.module.css
|
|
143
|
-
var Alert_default = {};
|
|
143
|
+
var Alert_default = {"alert":"bds015-alert","--variant_info":"bds015---variant_info","--variant_success":"bds015---variant_success","--variant_warning":"bds015---variant_warning","--variant_error":"bds015---variant_error","icon":"bds015-icon","content":"bds015-content","title":"bds015-title","dismiss":"bds015-dismiss"};
|
|
144
144
|
|
|
145
145
|
// src/components/ui/Alert/Alert.tsx
|
|
146
146
|
var import_design_system_foundation2 = require("@boostdev/design-system-foundation");
|
|
@@ -183,7 +183,7 @@ function Alert({
|
|
|
183
183
|
}
|
|
184
184
|
|
|
185
185
|
// src/components/ui/Avatar/Avatar.module.css
|
|
186
|
-
var Avatar_default = {};
|
|
186
|
+
var Avatar_default = {"avatar":"bds015-avatar","--fallback":"bds015---fallback","--size_small":"bds015---size_small","--size_medium":"bds015---size_medium","--size_large":"bds015---size_large","image":"bds015-image","initials":"bds015-initials"};
|
|
187
187
|
|
|
188
188
|
// src/components/ui/Avatar/Avatar.tsx
|
|
189
189
|
var import_design_system_foundation3 = require("@boostdev/design-system-foundation");
|
|
@@ -209,7 +209,7 @@ function Avatar({ src, alt, name, size = "medium", className }) {
|
|
|
209
209
|
}
|
|
210
210
|
|
|
211
211
|
// src/components/ui/Badge/Badge.module.css
|
|
212
|
-
var Badge_default = {};
|
|
212
|
+
var Badge_default = {"badge":"bds015-badge","--variant_primary":"bds015---variant_primary","--variant_secondary":"bds015---variant_secondary","--variant_success":"bds015---variant_success","--variant_error":"bds015---variant_error","--variant_warning":"bds015---variant_warning"};
|
|
213
213
|
|
|
214
214
|
// src/components/ui/Badge/Badge.tsx
|
|
215
215
|
var import_design_system_foundation4 = require("@boostdev/design-system-foundation");
|
|
@@ -219,7 +219,7 @@ function Badge({ children, variant = "primary", className }) {
|
|
|
219
219
|
}
|
|
220
220
|
|
|
221
221
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
222
|
-
var Breadcrumb_default = {};
|
|
222
|
+
var Breadcrumb_default = {"breadcrumb":"bds015-breadcrumb","list":"bds015-list","item":"bds015-item","link":"bds015-link","separator":"bds015-separator","current":"bds015-current"};
|
|
223
223
|
|
|
224
224
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
225
225
|
var import_design_system_foundation5 = require("@boostdev/design-system-foundation");
|
|
@@ -230,7 +230,7 @@ function Breadcrumb({ items, className }) {
|
|
|
230
230
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("li", { className: Breadcrumb_default.item, children: isLast ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { "aria-current": "page", className: Breadcrumb_default.current, children: item.label }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
|
|
231
231
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("a", { href: item.href, className: Breadcrumb_default.link, children: item.label }),
|
|
232
232
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: Breadcrumb_default.separator, "aria-hidden": "true", children: "\u203A" })
|
|
233
|
-
] }) },
|
|
233
|
+
] }) }, index);
|
|
234
234
|
}) }) });
|
|
235
235
|
}
|
|
236
236
|
|
|
@@ -238,7 +238,7 @@ function Breadcrumb({ items, className }) {
|
|
|
238
238
|
var import_react2 = require("react");
|
|
239
239
|
|
|
240
240
|
// src/components/ui/Calendar/Calendar.module.css
|
|
241
|
-
var Calendar_default = {};
|
|
241
|
+
var Calendar_default = {"calendar":"bds015-calendar","header":"bds015-header","monthYear":"bds015-monthYear","navBtn":"bds015-navBtn","grid":"bds015-grid","weekday":"bds015-weekday","empty":"bds015-empty","day":"bds015-day","disabled":"bds015-disabled","selected":"bds015-selected","today":"bds015-today"};
|
|
242
242
|
|
|
243
243
|
// src/components/ui/Calendar/Calendar.tsx
|
|
244
244
|
var import_design_system_foundation6 = require("@boostdev/design-system-foundation");
|
|
@@ -261,10 +261,13 @@ var MONTHS = [
|
|
|
261
261
|
function isSameDay(a, b) {
|
|
262
262
|
return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
|
|
263
263
|
}
|
|
264
|
+
function toMidnight(date) {
|
|
265
|
+
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
|
266
|
+
}
|
|
264
267
|
function isOutOfRange(date, min, max) {
|
|
265
|
-
|
|
266
|
-
if (
|
|
267
|
-
return
|
|
268
|
+
const d = toMidnight(date);
|
|
269
|
+
if (min && d < toMidnight(min)) return true;
|
|
270
|
+
return !!(max && d > toMidnight(max));
|
|
268
271
|
}
|
|
269
272
|
function getDaysInMonth(year, month) {
|
|
270
273
|
return new Date(year, month + 1, 0).getDate();
|
|
@@ -401,7 +404,7 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
401
404
|
var import_react3 = require("react");
|
|
402
405
|
|
|
403
406
|
// src/components/ui/Carousel/Carousel.module.css
|
|
404
|
-
var Carousel_default = {};
|
|
407
|
+
var Carousel_default = {"carousel":"bds015-carousel","track":"bds015-track","slide":"bds015-slide","navBtn":"bds015-navBtn"};
|
|
405
408
|
|
|
406
409
|
// src/components/ui/Carousel/Carousel.tsx
|
|
407
410
|
var import_design_system_foundation7 = require("@boostdev/design-system-foundation");
|
|
@@ -454,7 +457,7 @@ function Carousel({ items, label, className }) {
|
|
|
454
457
|
}
|
|
455
458
|
|
|
456
459
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
457
|
-
var DescriptionList_default = {};
|
|
460
|
+
var DescriptionList_default = {"list":"bds015-list","group":"bds015-group","term":"bds015-term","details":"bds015-details","--layout_inline":"bds015---layout_inline"};
|
|
458
461
|
|
|
459
462
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
460
463
|
var import_design_system_foundation8 = require("@boostdev/design-system-foundation");
|
|
@@ -467,7 +470,7 @@ function DescriptionList({ items, layout = "stacked", className }) {
|
|
|
467
470
|
}
|
|
468
471
|
|
|
469
472
|
// src/components/ui/Link/Link.module.css
|
|
470
|
-
var Link_default = {};
|
|
473
|
+
var Link_default = {"link":"bds015-link","--variant_default":"bds015---variant_default","--variant_subtle":"bds015---variant_subtle","--variant_standalone":"bds015---variant_standalone","externalLabel":"bds015-externalLabel"};
|
|
471
474
|
|
|
472
475
|
// src/components/ui/Link/Link.tsx
|
|
473
476
|
var import_design_system_foundation9 = require("@boostdev/design-system-foundation");
|
|
@@ -477,6 +480,7 @@ function Link({
|
|
|
477
480
|
children,
|
|
478
481
|
variant = "default",
|
|
479
482
|
external = false,
|
|
483
|
+
externalLabel = "(opens in new tab)",
|
|
480
484
|
className,
|
|
481
485
|
...props
|
|
482
486
|
}) {
|
|
@@ -490,14 +494,14 @@ function Link({
|
|
|
490
494
|
...props,
|
|
491
495
|
children: [
|
|
492
496
|
children,
|
|
493
|
-
external && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: Link_default.externalLabel, children:
|
|
497
|
+
external && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: Link_default.externalLabel, children: externalLabel })
|
|
494
498
|
]
|
|
495
499
|
}
|
|
496
500
|
);
|
|
497
501
|
}
|
|
498
502
|
|
|
499
503
|
// src/components/ui/Loading/Loading.module.css
|
|
500
|
-
var Loading_default = {};
|
|
504
|
+
var Loading_default = {"loading":"bds015-loading","spinner":"bds015-spinner","--size_small":"bds015---size_small","--size_large":"bds015---size_large"};
|
|
501
505
|
|
|
502
506
|
// src/components/ui/Loading/Loading.tsx
|
|
503
507
|
var import_design_system_foundation10 = require("@boostdev/design-system-foundation");
|
|
@@ -507,7 +511,7 @@ function Loading({ size = "medium", className }) {
|
|
|
507
511
|
}
|
|
508
512
|
|
|
509
513
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
510
|
-
var NotificationBanner_default = {};
|
|
514
|
+
var NotificationBanner_default = {"banner":"bds015-banner","--variant_info":"bds015---variant_info","--variant_success":"bds015---variant_success","--variant_warning":"bds015---variant_warning","--variant_error":"bds015---variant_error","content":"bds015-content","action":"bds015-action","dismiss":"bds015-dismiss"};
|
|
511
515
|
|
|
512
516
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
513
517
|
var import_design_system_foundation11 = require("@boostdev/design-system-foundation");
|
|
@@ -546,7 +550,7 @@ function NotificationBanner({
|
|
|
546
550
|
}
|
|
547
551
|
|
|
548
552
|
// src/components/ui/Pagination/Pagination.module.css
|
|
549
|
-
var Pagination_default = {};
|
|
553
|
+
var Pagination_default = {"pagination":"bds015-pagination","list":"bds015-list","button":"bds015-button","--active":"bds015---active","--nav":"bds015---nav","ellipsis":"bds015-ellipsis"};
|
|
550
554
|
|
|
551
555
|
// src/components/ui/Pagination/Pagination.tsx
|
|
552
556
|
var import_design_system_foundation12 = require("@boostdev/design-system-foundation");
|
|
@@ -610,7 +614,7 @@ function Pagination({
|
|
|
610
614
|
}
|
|
611
615
|
|
|
612
616
|
// src/components/ui/Progress/Progress.module.css
|
|
613
|
-
var Progress_default = {};
|
|
617
|
+
var Progress_default = {"container":"bds015-container","labelRow":"bds015-labelRow","label":"bds015-label","value":"bds015-value","track":"bds015-track","--size_small":"bds015---size_small","--size_medium":"bds015---size_medium","--size_large":"bds015---size_large","fill":"bds015-fill"};
|
|
614
618
|
|
|
615
619
|
// src/components/ui/Progress/Progress.tsx
|
|
616
620
|
var import_design_system_foundation13 = require("@boostdev/design-system-foundation");
|
|
@@ -648,7 +652,7 @@ function Progress({
|
|
|
648
652
|
}
|
|
649
653
|
|
|
650
654
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
651
|
-
var ProgressCircle_default = {};
|
|
655
|
+
var ProgressCircle_default = {"wrapper":"bds015-wrapper","svg":"bds015-svg","track":"bds015-track","fill":"bds015-fill","value":"bds015-value","--size_small":"bds015---size_small","--size_medium":"bds015---size_medium","--size_large":"bds015---size_large"};
|
|
652
656
|
|
|
653
657
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
654
658
|
var import_design_system_foundation14 = require("@boostdev/design-system-foundation");
|
|
@@ -727,7 +731,7 @@ function ProgressCircle({
|
|
|
727
731
|
}
|
|
728
732
|
|
|
729
733
|
// src/components/ui/Separator/Separator.module.css
|
|
730
|
-
var Separator_default = {};
|
|
734
|
+
var Separator_default = {"separator":"bds015-separator","--horizontal":"bds015---horizontal","--vertical":"bds015---vertical"};
|
|
731
735
|
|
|
732
736
|
// src/components/ui/Separator/Separator.tsx
|
|
733
737
|
var import_design_system_foundation15 = require("@boostdev/design-system-foundation");
|
|
@@ -750,7 +754,7 @@ function Separator({ orientation = "horizontal", className }) {
|
|
|
750
754
|
var import_design_system_foundation16 = require("@boostdev/design-system-foundation");
|
|
751
755
|
|
|
752
756
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
753
|
-
var Skeleton_default = {};
|
|
757
|
+
var Skeleton_default = {"skeleton":"bds015-skeleton"};
|
|
754
758
|
|
|
755
759
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
756
760
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
@@ -759,7 +763,7 @@ function Skeleton({ className }) {
|
|
|
759
763
|
}
|
|
760
764
|
|
|
761
765
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
762
|
-
var SkipLink_default = {};
|
|
766
|
+
var SkipLink_default = {"skipLink":"bds015-skipLink"};
|
|
763
767
|
|
|
764
768
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
765
769
|
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
@@ -768,7 +772,7 @@ function SkipLink({ href = "#main", children = "Skip to main content" }) {
|
|
|
768
772
|
}
|
|
769
773
|
|
|
770
774
|
// src/components/ui/Table/Table.module.css
|
|
771
|
-
var Table_default = {};
|
|
775
|
+
var Table_default = {"wrapper":"bds015-wrapper","table":"bds015-table","caption":"bds015-caption","thead":"bds015-thead","th":"bds015-th","--sortable":"bds015---sortable","sortButton":"bds015-sortButton","sortIcon":"bds015-sortIcon","--sort-active":"bds015---sort-active","--sort-desc":"bds015---sort-desc","tbody":"bds015-tbody","tr":"bds015-tr","td":"bds015-td"};
|
|
772
776
|
|
|
773
777
|
// src/components/ui/Table/Table.tsx
|
|
774
778
|
var import_design_system_foundation17 = require("@boostdev/design-system-foundation");
|
|
@@ -837,7 +841,7 @@ function Table({
|
|
|
837
841
|
var import_react4 = require("react");
|
|
838
842
|
|
|
839
843
|
// src/components/ui/Tabs/Tabs.module.css
|
|
840
|
-
var Tabs_default = {};
|
|
844
|
+
var Tabs_default = {"tabs":"bds015-tabs","tabList":"bds015-tabList","tab":"bds015-tab","--active":"bds015---active","panel":"bds015-panel"};
|
|
841
845
|
|
|
842
846
|
// src/components/ui/Tabs/Tabs.tsx
|
|
843
847
|
var import_design_system_foundation18 = require("@boostdev/design-system-foundation");
|
|
@@ -918,7 +922,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
918
922
|
var import_react5 = require("react");
|
|
919
923
|
|
|
920
924
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
921
|
-
var Tooltip_default = {};
|
|
925
|
+
var Tooltip_default = {"wrapper":"bds015-wrapper","tooltip":"bds015-tooltip","--placement_top":"bds015---placement_top","--placement_bottom":"bds015---placement_bottom","--placement_left":"bds015---placement_left","--placement_right":"bds015---placement_right"};
|
|
922
926
|
|
|
923
927
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
924
928
|
var import_design_system_foundation19 = require("@boostdev/design-system-foundation");
|
|
@@ -948,7 +952,7 @@ function Tooltip({
|
|
|
948
952
|
}
|
|
949
953
|
|
|
950
954
|
// src/components/ui/Typography/Typography.module.css
|
|
951
|
-
var Typography_default = {};
|
|
955
|
+
var Typography_default = {"typography":"bds015-typography","--h1":"bds015---h1","--h2":"bds015---h2","--h3":"bds015---h3","--body":"bds015---body","--body_s":"bds015---body_s"};
|
|
952
956
|
|
|
953
957
|
// src/components/ui/Typography/Typography.tsx
|
|
954
958
|
var import_design_system_foundation20 = require("@boostdev/design-system-foundation");
|
|
@@ -966,14 +970,14 @@ function Typography({ variant = "body", component, children, className }) {
|
|
|
966
970
|
}
|
|
967
971
|
|
|
968
972
|
// src/components/interaction/Button/Button.module.css
|
|
969
|
-
var Button_default = {};
|
|
973
|
+
var Button_default = {"button":"bds015-button","--primary":"bds015---primary","--secondary":"bds015---secondary","--size_small":"bds015---size_small","--size_medium":"bds015---size_medium","--size_large":"bds015---size_large","--hasPulse":"bds015---hasPulse","prefix":"bds015-prefix","suffix":"bds015-suffix"};
|
|
970
974
|
|
|
971
975
|
// src/components/interaction/Button/Button.tsx
|
|
972
976
|
var import_design_system_foundation21 = require("@boostdev/design-system-foundation");
|
|
973
977
|
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
974
978
|
function Button({
|
|
975
979
|
children,
|
|
976
|
-
className
|
|
980
|
+
className,
|
|
977
981
|
variant = "primary",
|
|
978
982
|
type = "button",
|
|
979
983
|
iconStart,
|
|
@@ -994,22 +998,55 @@ function Button({
|
|
|
994
998
|
hasPulse && Button_default["--hasPulse"],
|
|
995
999
|
className
|
|
996
1000
|
);
|
|
997
|
-
const
|
|
998
|
-
|
|
1001
|
+
const handleAnchorClick = (e) => {
|
|
1002
|
+
if (disabled) {
|
|
1003
|
+
e.preventDefault();
|
|
1004
|
+
return;
|
|
1005
|
+
}
|
|
1006
|
+
onClick?.(e);
|
|
1007
|
+
};
|
|
1008
|
+
const handleButtonClick = (e) => {
|
|
1009
|
+
onClick?.(e);
|
|
1010
|
+
};
|
|
1011
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
|
|
1012
|
+
Boolean(iconStart) && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: Button_default.prefix, children: iconStart }),
|
|
999
1013
|
children,
|
|
1000
|
-
|
|
1014
|
+
Boolean(iconEnd) && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: Button_default.suffix, children: iconEnd })
|
|
1001
1015
|
] });
|
|
1002
1016
|
if (href) {
|
|
1003
|
-
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1017
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1018
|
+
"a",
|
|
1019
|
+
{
|
|
1020
|
+
className: classNames,
|
|
1021
|
+
href: disabled ? void 0 : href,
|
|
1022
|
+
target,
|
|
1023
|
+
rel,
|
|
1024
|
+
"aria-disabled": disabled,
|
|
1025
|
+
tabIndex: disabled ? -1 : void 0,
|
|
1026
|
+
onClick: handleAnchorClick,
|
|
1027
|
+
...rest,
|
|
1028
|
+
children: content
|
|
1029
|
+
}
|
|
1030
|
+
);
|
|
1004
1031
|
}
|
|
1005
|
-
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1032
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1033
|
+
"button",
|
|
1034
|
+
{
|
|
1035
|
+
type,
|
|
1036
|
+
className: classNames,
|
|
1037
|
+
disabled,
|
|
1038
|
+
onClick: handleButtonClick,
|
|
1039
|
+
...rest,
|
|
1040
|
+
children: content
|
|
1041
|
+
}
|
|
1042
|
+
);
|
|
1006
1043
|
}
|
|
1007
1044
|
|
|
1008
1045
|
// src/components/interaction/Command/Command.tsx
|
|
1009
1046
|
var import_react6 = require("react");
|
|
1010
1047
|
|
|
1011
1048
|
// src/components/interaction/Command/Command.module.css
|
|
1012
|
-
var Command_default = {};
|
|
1049
|
+
var Command_default = {"dialog":"bds015-dialog","palette":"bds015-palette","searchRow":"bds015-searchRow","searchIcon":"bds015-searchIcon","search":"bds015-search","escHint":"bds015-escHint","list":"bds015-list","groupList":"bds015-groupList","group":"bds015-group","item":"bds015-item","itemActive":"bds015-itemActive","itemLabel":"bds015-itemLabel","itemDesc":"bds015-itemDesc","shortcut":"bds015-shortcut","empty":"bds015-empty"};
|
|
1013
1050
|
|
|
1014
1051
|
// src/components/interaction/Command/Command.tsx
|
|
1015
1052
|
var import_design_system_foundation22 = require("@boostdev/design-system-foundation");
|
|
@@ -1148,42 +1185,58 @@ function Command({
|
|
|
1148
1185
|
var import_react7 = require("react");
|
|
1149
1186
|
|
|
1150
1187
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1151
|
-
var Dialog_default = {};
|
|
1188
|
+
var Dialog_default = {"dialog":"bds015-dialog","closeForm":"bds015-closeForm","closeButton":"bds015-closeButton"};
|
|
1152
1189
|
|
|
1153
1190
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1154
1191
|
var import_design_system_foundation23 = require("@boostdev/design-system-foundation");
|
|
1155
1192
|
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1156
|
-
function Dialog({ children,
|
|
1193
|
+
function Dialog({ children, isOpen = false, className, onClose }) {
|
|
1157
1194
|
const dialogRef = (0, import_react7.useRef)(null);
|
|
1158
1195
|
(0, import_react7.useEffect)(() => {
|
|
1159
1196
|
const dialog = dialogRef.current;
|
|
1160
1197
|
if (!dialog) return;
|
|
1161
|
-
if (
|
|
1198
|
+
if (isOpen) {
|
|
1162
1199
|
dialog.showModal();
|
|
1163
1200
|
} else if (dialog.open) {
|
|
1164
1201
|
dialog.close();
|
|
1165
1202
|
}
|
|
1166
|
-
}, [
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1203
|
+
}, [isOpen]);
|
|
1204
|
+
const handleBackdropClick = (e) => {
|
|
1205
|
+
if (e.target === dialogRef.current) onClose?.();
|
|
1206
|
+
};
|
|
1207
|
+
const handleCancel = (e) => {
|
|
1208
|
+
e.preventDefault();
|
|
1209
|
+
onClose?.();
|
|
1210
|
+
};
|
|
1211
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
1212
|
+
"dialog",
|
|
1213
|
+
{
|
|
1214
|
+
ref: dialogRef,
|
|
1215
|
+
className: (0, import_design_system_foundation23.cn)(className, Dialog_default.dialog),
|
|
1216
|
+
onClick: handleBackdropClick,
|
|
1217
|
+
onCancel: handleCancel,
|
|
1218
|
+
children: [
|
|
1219
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("form", { method: "dialog", className: Dialog_default.closeForm, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1220
|
+
"button",
|
|
1221
|
+
{
|
|
1222
|
+
type: "submit",
|
|
1223
|
+
className: Dialog_default.closeButton,
|
|
1224
|
+
onClick: onClose,
|
|
1225
|
+
"aria-label": "Close dialog",
|
|
1226
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6L6 18M6 6l12 12" }) })
|
|
1227
|
+
}
|
|
1228
|
+
) }),
|
|
1229
|
+
children
|
|
1230
|
+
]
|
|
1231
|
+
}
|
|
1232
|
+
);
|
|
1180
1233
|
}
|
|
1181
1234
|
|
|
1182
1235
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1183
1236
|
var import_react8 = require("react");
|
|
1184
1237
|
|
|
1185
1238
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1186
|
-
var Drawer_default = {};
|
|
1239
|
+
var Drawer_default = {"drawer":"bds015-drawer","panel":"bds015-panel","--side_right":"bds015---side_right","--side_left":"bds015---side_left","header":"bds015-header","title":"bds015-title","closeButton":"bds015-closeButton","body":"bds015-body"};
|
|
1187
1240
|
|
|
1188
1241
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1189
1242
|
var import_design_system_foundation24 = require("@boostdev/design-system-foundation");
|
|
@@ -1245,7 +1298,7 @@ function Drawer({
|
|
|
1245
1298
|
var import_react9 = require("react");
|
|
1246
1299
|
|
|
1247
1300
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1248
|
-
var DropdownMenu_default = {};
|
|
1301
|
+
var DropdownMenu_default = {"wrapper":"bds015-wrapper","menu":"bds015-menu","--placement_bottom-start":"bds015---placement_bottom-start","--placement_bottom-end":"bds015---placement_bottom-end","separator":"bds015-separator","item":"bds015-item","icon":"bds015-icon"};
|
|
1249
1302
|
|
|
1250
1303
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1251
1304
|
var import_design_system_foundation25 = require("@boostdev/design-system-foundation");
|
|
@@ -1358,7 +1411,7 @@ function DropdownMenu({
|
|
|
1358
1411
|
var import_react10 = require("react");
|
|
1359
1412
|
|
|
1360
1413
|
// src/components/interaction/Popover/Popover.module.css
|
|
1361
|
-
var Popover_default = {};
|
|
1414
|
+
var Popover_default = {"wrapper":"bds015-wrapper","panel":"bds015-panel","--placement_bottom":"bds015---placement_bottom","--placement_top":"bds015---placement_top","--placement_right":"bds015---placement_right","--placement_left":"bds015---placement_left"};
|
|
1362
1415
|
|
|
1363
1416
|
// src/components/interaction/Popover/Popover.tsx
|
|
1364
1417
|
var import_design_system_foundation26 = require("@boostdev/design-system-foundation");
|
|
@@ -1414,7 +1467,7 @@ function Popover({
|
|
|
1414
1467
|
}
|
|
1415
1468
|
|
|
1416
1469
|
// src/components/interaction/Rating/Rating.module.css
|
|
1417
|
-
var Rating_default = {};
|
|
1470
|
+
var Rating_default = {"rating":"bds015-rating","star":"bds015-star","--filled":"bds015---filled"};
|
|
1418
1471
|
|
|
1419
1472
|
// src/components/interaction/Rating/Rating.tsx
|
|
1420
1473
|
var import_design_system_foundation27 = require("@boostdev/design-system-foundation");
|
|
@@ -1445,7 +1498,7 @@ function Rating({ value, max = 5, className }) {
|
|
|
1445
1498
|
var import_react11 = require("react");
|
|
1446
1499
|
|
|
1447
1500
|
// src/components/interaction/Toast/Toast.module.css
|
|
1448
|
-
var Toast_default = {};
|
|
1501
|
+
var Toast_default = {"toastContainer":"bds015-toastContainer","toast":"bds015-toast","--variant_success":"bds015---variant_success","--variant_error":"bds015---variant_error","--variant_info":"bds015---variant_info","message":"bds015-message","closeButton":"bds015-closeButton"};
|
|
1449
1502
|
|
|
1450
1503
|
// src/components/interaction/Toast/Toast.tsx
|
|
1451
1504
|
var import_design_system_foundation28 = require("@boostdev/design-system-foundation");
|
|
@@ -1478,7 +1531,10 @@ function ToastItem({ toast, onRemove }) {
|
|
|
1478
1531
|
const timer = setTimeout(onRemove, 5e3);
|
|
1479
1532
|
return () => clearTimeout(timer);
|
|
1480
1533
|
}, [onRemove]);
|
|
1481
|
-
return /* @__PURE__ */ (0, import_jsx_runtime29.
|
|
1534
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: (0, import_design_system_foundation28.cn)(Toast_default.toast, Toast_default[`--variant_${toast.variant}`]), role: "status", children: [
|
|
1535
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: Toast_default.message, children: toast.message }),
|
|
1536
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("button", { type: "button", className: Toast_default.closeButton, onClick: onRemove, "aria-label": "Dismiss", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6L6 18M6 6l12 12" }) }) })
|
|
1537
|
+
] });
|
|
1482
1538
|
}
|
|
1483
1539
|
function useToast() {
|
|
1484
1540
|
const context = (0, import_react11.useContext)(ToastContext);
|
|
@@ -1492,20 +1548,20 @@ function useToast() {
|
|
|
1492
1548
|
var import_react12 = require("react");
|
|
1493
1549
|
|
|
1494
1550
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1495
|
-
var Checkbox_default = {};
|
|
1551
|
+
var Checkbox_default = {"checkboxGroup":"bds015-checkboxGroup","inputWrapper":"bds015-inputWrapper","checkbox":"bds015-checkbox","checkboxError":"bds015-checkboxError"};
|
|
1496
1552
|
|
|
1497
1553
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1498
|
-
var Message_default = {};
|
|
1554
|
+
var Message_default = {"error":"bds015-error","hint":"bds015-hint"};
|
|
1499
1555
|
|
|
1500
1556
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1501
1557
|
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1502
1558
|
var Message = ({ message, type, inputId }) => {
|
|
1503
1559
|
if (!message) return null;
|
|
1504
|
-
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("
|
|
1560
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { id: inputId + type, className: Message_default[type], children: message });
|
|
1505
1561
|
};
|
|
1506
1562
|
|
|
1507
1563
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1508
|
-
var Label_default = {};
|
|
1564
|
+
var Label_default = {"label":"bds015-label"};
|
|
1509
1565
|
|
|
1510
1566
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1511
1567
|
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
@@ -1517,7 +1573,7 @@ var Label = ({ label, id }) => {
|
|
|
1517
1573
|
var import_design_system_foundation30 = require("@boostdev/design-system-foundation");
|
|
1518
1574
|
|
|
1519
1575
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1520
|
-
var InputContainer_default = {};
|
|
1576
|
+
var InputContainer_default = {"container":"bds015-container"};
|
|
1521
1577
|
|
|
1522
1578
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1523
1579
|
var import_design_system_foundation29 = require("@boostdev/design-system-foundation");
|
|
@@ -1532,13 +1588,14 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1532
1588
|
const id = name + (0, import_react12.useId)();
|
|
1533
1589
|
const hintId = id + "hint";
|
|
1534
1590
|
const errorId = id + "error";
|
|
1535
|
-
const describedBy =
|
|
1591
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1536
1592
|
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(InputContainer, { className: (0, import_design_system_foundation30.cn)(Checkbox_default.checkboxGroup, className), children: [
|
|
1537
1593
|
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: Checkbox_default.inputWrapper, children: [
|
|
1538
1594
|
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1539
1595
|
"input",
|
|
1540
1596
|
{
|
|
1541
1597
|
"aria-describedby": describedBy,
|
|
1598
|
+
"aria-invalid": !!error,
|
|
1542
1599
|
type: "checkbox",
|
|
1543
1600
|
id,
|
|
1544
1601
|
name,
|
|
@@ -1557,7 +1614,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1557
1614
|
var import_react13 = require("react");
|
|
1558
1615
|
|
|
1559
1616
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1560
|
-
var Combobox_default = {};
|
|
1617
|
+
var Combobox_default = {"formGroup":"bds015-formGroup","inputWrapper":"bds015-inputWrapper","input":"bds015-input","inputError":"bds015-inputError","chevron":"bds015-chevron","listbox":"bds015-listbox","option":"bds015-option","--highlighted":"bds015---highlighted","--selected":"bds015---selected","--disabled":"bds015---disabled"};
|
|
1561
1618
|
|
|
1562
1619
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1563
1620
|
var import_design_system_foundation31 = require("@boostdev/design-system-foundation");
|
|
@@ -1569,6 +1626,7 @@ function Combobox({
|
|
|
1569
1626
|
placeholder,
|
|
1570
1627
|
value,
|
|
1571
1628
|
onChange,
|
|
1629
|
+
disabled = false,
|
|
1572
1630
|
error,
|
|
1573
1631
|
hint,
|
|
1574
1632
|
className
|
|
@@ -1577,9 +1635,12 @@ function Combobox({
|
|
|
1577
1635
|
const listboxId = id + "listbox";
|
|
1578
1636
|
const hintId = id + "hint";
|
|
1579
1637
|
const errorId = id + "error";
|
|
1580
|
-
const describedBy = error
|
|
1581
|
-
const selectedOption = options.find((o) => o.value === value);
|
|
1638
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1639
|
+
const selectedOption = (0, import_react13.useMemo)(() => options.find((o) => o.value === value), [options, value]);
|
|
1582
1640
|
const [inputValue, setInputValue] = (0, import_react13.useState)(selectedOption?.label ?? "");
|
|
1641
|
+
(0, import_react13.useEffect)(() => {
|
|
1642
|
+
setInputValue(selectedOption?.label ?? "");
|
|
1643
|
+
}, [selectedOption]);
|
|
1583
1644
|
const [isOpen, setIsOpen] = (0, import_react13.useState)(false);
|
|
1584
1645
|
const [highlightedIndex, setHighlightedIndex] = (0, import_react13.useState)(-1);
|
|
1585
1646
|
const containerRef = (0, import_react13.useRef)(null);
|
|
@@ -1656,6 +1717,7 @@ function Combobox({
|
|
|
1656
1717
|
autoComplete: "off",
|
|
1657
1718
|
placeholder,
|
|
1658
1719
|
value: inputValue,
|
|
1720
|
+
disabled,
|
|
1659
1721
|
className: (0, import_design_system_foundation31.cn)(Combobox_default.input, error ? Combobox_default.inputError : void 0),
|
|
1660
1722
|
onChange: handleInputChange,
|
|
1661
1723
|
onKeyDown: handleKeyDown,
|
|
@@ -1703,7 +1765,7 @@ function Combobox({
|
|
|
1703
1765
|
var import_react14 = require("react");
|
|
1704
1766
|
|
|
1705
1767
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
1706
|
-
var FileInput_default = {};
|
|
1768
|
+
var FileInput_default = {"formGroup":"bds015-formGroup","dropZone":"bds015-dropZone","isDragging":"bds015-isDragging","hasError":"bds015-hasError","isDisabled":"bds015-isDisabled","icon":"bds015-icon","prompt":"bds015-prompt","acceptHint":"bds015-acceptHint","hiddenInput":"bds015-hiddenInput"};
|
|
1707
1769
|
|
|
1708
1770
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
1709
1771
|
var import_design_system_foundation32 = require("@boostdev/design-system-foundation");
|
|
@@ -1722,10 +1784,19 @@ function FileInput({
|
|
|
1722
1784
|
const uid = name + (0, import_react14.useId)();
|
|
1723
1785
|
const hintId = uid + "hint";
|
|
1724
1786
|
const errorId = uid + "error";
|
|
1725
|
-
const describedBy = error
|
|
1787
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1726
1788
|
const inputRef = (0, import_react14.useRef)(null);
|
|
1727
1789
|
const [isDragging, setIsDragging] = (0, import_react14.useState)(false);
|
|
1728
1790
|
const [fileNames, setFileNames] = (0, import_react14.useState)([]);
|
|
1791
|
+
const isFileAccepted = (file) => {
|
|
1792
|
+
if (!accept) return true;
|
|
1793
|
+
return accept.split(",").some((token) => {
|
|
1794
|
+
const t = token.trim();
|
|
1795
|
+
if (t.startsWith(".")) return file.name.toLowerCase().endsWith(t.toLowerCase());
|
|
1796
|
+
if (t.endsWith("/*")) return file.type.startsWith(t.slice(0, -1));
|
|
1797
|
+
return file.type === t;
|
|
1798
|
+
});
|
|
1799
|
+
};
|
|
1729
1800
|
const handleFiles = (files) => {
|
|
1730
1801
|
if (!files) return;
|
|
1731
1802
|
setFileNames(Array.from(files).map((f) => f.name));
|
|
@@ -1736,7 +1807,10 @@ function FileInput({
|
|
|
1736
1807
|
e.preventDefault();
|
|
1737
1808
|
setIsDragging(false);
|
|
1738
1809
|
if (disabled) return;
|
|
1739
|
-
|
|
1810
|
+
const dt = new DataTransfer();
|
|
1811
|
+
Array.from(e.dataTransfer.files).filter(isFileAccepted).forEach((f) => dt.items.add(f));
|
|
1812
|
+
if (inputRef.current) inputRef.current.files = dt.files;
|
|
1813
|
+
handleFiles(dt.files.length > 0 ? dt.files : null);
|
|
1740
1814
|
};
|
|
1741
1815
|
const handleDragOver = (e) => {
|
|
1742
1816
|
e.preventDefault();
|
|
@@ -1788,7 +1862,7 @@ function FileInput({
|
|
|
1788
1862
|
var import_react15 = require("react");
|
|
1789
1863
|
|
|
1790
1864
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
1791
|
-
var FormInput_default = {};
|
|
1865
|
+
var FormInput_default = {"formGroup":"bds015-formGroup","input":"bds015-input","inputError":"bds015-inputError"};
|
|
1792
1866
|
|
|
1793
1867
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
1794
1868
|
var import_design_system_foundation33 = require("@boostdev/design-system-foundation");
|
|
@@ -1805,7 +1879,7 @@ function FormInput({
|
|
|
1805
1879
|
const id = name + (0, import_react15.useId)();
|
|
1806
1880
|
const hintId = id + "hint";
|
|
1807
1881
|
const errorId = id + "error";
|
|
1808
|
-
const describedBy =
|
|
1882
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1809
1883
|
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(InputContainer, { className: (0, import_design_system_foundation33.cn)(FormInput_default.formGroup, className), children: [
|
|
1810
1884
|
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Label, { id, label }),
|
|
1811
1885
|
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
@@ -1829,7 +1903,7 @@ function FormInput({
|
|
|
1829
1903
|
var import_react16 = require("react");
|
|
1830
1904
|
|
|
1831
1905
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
1832
|
-
var NumberInput_default = {};
|
|
1906
|
+
var NumberInput_default = {"formGroup":"bds015-formGroup","inputRow":"bds015-inputRow","input":"bds015-input","inputError":"bds015-inputError","stepper":"bds015-stepper"};
|
|
1833
1907
|
|
|
1834
1908
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
1835
1909
|
var import_design_system_foundation34 = require("@boostdev/design-system-foundation");
|
|
@@ -1851,18 +1925,18 @@ function NumberInput({
|
|
|
1851
1925
|
const uid = name + (0, import_react16.useId)();
|
|
1852
1926
|
const hintId = uid + "hint";
|
|
1853
1927
|
const errorId = uid + "error";
|
|
1854
|
-
const describedBy = error
|
|
1928
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1855
1929
|
const inputRef = (0, import_react16.useRef)(null);
|
|
1930
|
+
const isControlled = value !== void 0;
|
|
1931
|
+
const [internalValue, setInternalValue] = (0, import_react16.useState)(defaultValue ?? 0);
|
|
1932
|
+
const currentValue = isControlled ? value : internalValue;
|
|
1856
1933
|
const clamp = (v) => {
|
|
1857
1934
|
const withMin = min !== void 0 ? Math.max(min, v) : v;
|
|
1858
|
-
|
|
1859
|
-
return withMax;
|
|
1935
|
+
return max !== void 0 ? Math.min(max, withMin) : withMin;
|
|
1860
1936
|
};
|
|
1861
1937
|
const adjust = (delta) => {
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
const next = clamp(current + delta);
|
|
1865
|
-
inputRef.current.value = String(next);
|
|
1938
|
+
const next = clamp(currentValue + delta);
|
|
1939
|
+
if (!isControlled) setInternalValue(next);
|
|
1866
1940
|
onChange?.(next);
|
|
1867
1941
|
};
|
|
1868
1942
|
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(InputContainer, { className: (0, import_design_system_foundation34.cn)(NumberInput_default.formGroup, className), children: [
|
|
@@ -1874,7 +1948,7 @@ function NumberInput({
|
|
|
1874
1948
|
type: "button",
|
|
1875
1949
|
className: NumberInput_default.stepper,
|
|
1876
1950
|
"aria-label": "Decrease",
|
|
1877
|
-
disabled: disabled || min !== void 0 &&
|
|
1951
|
+
disabled: disabled || min !== void 0 && currentValue <= min,
|
|
1878
1952
|
onClick: () => adjust(-step),
|
|
1879
1953
|
tabIndex: -1,
|
|
1880
1954
|
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 12h14" }) })
|
|
@@ -1887,8 +1961,7 @@ function NumberInput({
|
|
|
1887
1961
|
id: uid,
|
|
1888
1962
|
type: "number",
|
|
1889
1963
|
name,
|
|
1890
|
-
defaultValue,
|
|
1891
|
-
value,
|
|
1964
|
+
...isControlled ? { value } : { defaultValue },
|
|
1892
1965
|
min,
|
|
1893
1966
|
max,
|
|
1894
1967
|
step,
|
|
@@ -1896,7 +1969,11 @@ function NumberInput({
|
|
|
1896
1969
|
"aria-invalid": !!error,
|
|
1897
1970
|
"aria-describedby": describedBy,
|
|
1898
1971
|
className: (0, import_design_system_foundation34.cn)(NumberInput_default.input, error ? NumberInput_default.inputError : void 0),
|
|
1899
|
-
onChange: (e) =>
|
|
1972
|
+
onChange: (e) => {
|
|
1973
|
+
const v = parseFloat(e.target.value);
|
|
1974
|
+
if (!isControlled) setInternalValue(isNaN(v) ? 0 : v);
|
|
1975
|
+
onChange?.(v);
|
|
1976
|
+
}
|
|
1900
1977
|
}
|
|
1901
1978
|
),
|
|
1902
1979
|
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
@@ -1905,7 +1982,7 @@ function NumberInput({
|
|
|
1905
1982
|
type: "button",
|
|
1906
1983
|
className: NumberInput_default.stepper,
|
|
1907
1984
|
"aria-label": "Increase",
|
|
1908
|
-
disabled: disabled || max !== void 0 &&
|
|
1985
|
+
disabled: disabled || max !== void 0 && currentValue >= max,
|
|
1909
1986
|
onClick: () => adjust(step),
|
|
1910
1987
|
tabIndex: -1,
|
|
1911
1988
|
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 5v14M5 12h14" }) })
|
|
@@ -1921,7 +1998,7 @@ function NumberInput({
|
|
|
1921
1998
|
var import_react17 = require("react");
|
|
1922
1999
|
|
|
1923
2000
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
1924
|
-
var Radio_default = {};
|
|
2001
|
+
var Radio_default = {"radioGroup":"bds015-radioGroup","inputWrapper":"bds015-inputWrapper","radio":"bds015-radio","radioError":"bds015-radioError"};
|
|
1925
2002
|
|
|
1926
2003
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
1927
2004
|
var import_design_system_foundation35 = require("@boostdev/design-system-foundation");
|
|
@@ -1930,13 +2007,14 @@ function Radio({ label, name, error, hint, className, ...props }) {
|
|
|
1930
2007
|
const id = name + (0, import_react17.useId)();
|
|
1931
2008
|
const hintId = id + "hint";
|
|
1932
2009
|
const errorId = id + "error";
|
|
1933
|
-
const describedBy =
|
|
2010
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1934
2011
|
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(InputContainer, { className: (0, import_design_system_foundation35.cn)(Radio_default.radioGroup, className), children: [
|
|
1935
2012
|
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: Radio_default.inputWrapper, children: [
|
|
1936
2013
|
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
1937
2014
|
"input",
|
|
1938
2015
|
{
|
|
1939
2016
|
"aria-describedby": describedBy,
|
|
2017
|
+
"aria-invalid": !!error,
|
|
1940
2018
|
type: "radio",
|
|
1941
2019
|
id,
|
|
1942
2020
|
name,
|
|
@@ -1955,7 +2033,7 @@ function Radio({ label, name, error, hint, className, ...props }) {
|
|
|
1955
2033
|
var import_react18 = require("react");
|
|
1956
2034
|
|
|
1957
2035
|
// src/components/interaction/form/Select/Select.module.css
|
|
1958
|
-
var Select_default = {};
|
|
2036
|
+
var Select_default = {"formGroup":"bds015-formGroup","selectWrapper":"bds015-selectWrapper","select":"bds015-select","selectError":"bds015-selectError","chevron":"bds015-chevron"};
|
|
1959
2037
|
|
|
1960
2038
|
// src/components/interaction/form/Select/Select.tsx
|
|
1961
2039
|
var import_design_system_foundation36 = require("@boostdev/design-system-foundation");
|
|
@@ -1973,7 +2051,7 @@ function Select({
|
|
|
1973
2051
|
const id = name + (0, import_react18.useId)();
|
|
1974
2052
|
const hintId = id + "hint";
|
|
1975
2053
|
const errorId = id + "error";
|
|
1976
|
-
const describedBy = error
|
|
2054
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1977
2055
|
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(InputContainer, { className: (0, import_design_system_foundation36.cn)(Select_default.formGroup, className), children: [
|
|
1978
2056
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Label, { id, label }),
|
|
1979
2057
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: Select_default.selectWrapper, children: [
|
|
@@ -1987,7 +2065,7 @@ function Select({
|
|
|
1987
2065
|
className: (0, import_design_system_foundation36.cn)(Select_default.select, error ? Select_default.selectError : void 0),
|
|
1988
2066
|
...props,
|
|
1989
2067
|
children: [
|
|
1990
|
-
placeholder && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("option", { value: "", disabled: true, children: placeholder }),
|
|
2068
|
+
placeholder && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("option", { value: "", disabled: true, hidden: true, children: placeholder }),
|
|
1991
2069
|
options.map(({ value, label: optLabel, disabled }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("option", { value, disabled, children: optLabel }, value))
|
|
1992
2070
|
]
|
|
1993
2071
|
}
|
|
@@ -2003,7 +2081,7 @@ function Select({
|
|
|
2003
2081
|
var import_react19 = require("react");
|
|
2004
2082
|
|
|
2005
2083
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2006
|
-
var Slider_default = {};
|
|
2084
|
+
var Slider_default = {"formGroup":"bds015-formGroup","labelRow":"bds015-labelRow","value":"bds015-value","slider":"bds015-slider","sliderError":"bds015-sliderError"};
|
|
2007
2085
|
|
|
2008
2086
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2009
2087
|
var import_design_system_foundation37 = require("@boostdev/design-system-foundation");
|
|
@@ -2023,12 +2101,13 @@ function Slider({
|
|
|
2023
2101
|
const id = name + (0, import_react19.useId)();
|
|
2024
2102
|
const hintId = id + "hint";
|
|
2025
2103
|
const errorId = id + "error";
|
|
2026
|
-
const describedBy = error
|
|
2027
|
-
const
|
|
2028
|
-
const [
|
|
2104
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2105
|
+
const isControlled = props.value !== void 0;
|
|
2106
|
+
const [internalValue, setInternalValue] = (0, import_react19.useState)(Number(props.defaultValue ?? min));
|
|
2107
|
+
const currentValue = isControlled ? Number(props.value) : internalValue;
|
|
2029
2108
|
const fillPct = (currentValue - min) / (max - min) * 100;
|
|
2030
2109
|
const handleChange = (e) => {
|
|
2031
|
-
|
|
2110
|
+
if (!isControlled) setInternalValue(Number(e.target.value));
|
|
2032
2111
|
onChange?.(e);
|
|
2033
2112
|
};
|
|
2034
2113
|
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(InputContainer, { className: (0, import_design_system_foundation37.cn)(Slider_default.formGroup, className), children: [
|
|
@@ -2063,7 +2142,7 @@ function Slider({
|
|
|
2063
2142
|
var import_react20 = require("react");
|
|
2064
2143
|
|
|
2065
2144
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2066
|
-
var Switch_default = {};
|
|
2145
|
+
var Switch_default = {"switchGroup":"bds015-switchGroup","--size_small":"bds015---size_small","--size_medium":"bds015---size_medium","--size_large":"bds015---size_large","inputWrapper":"bds015-inputWrapper","trackWrapper":"bds015-trackWrapper","switch":"bds015-switch","track":"bds015-track","thumb":"bds015-thumb","switchError":"bds015-switchError"};
|
|
2067
2146
|
|
|
2068
2147
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2069
2148
|
var import_design_system_foundation38 = require("@boostdev/design-system-foundation");
|
|
@@ -2080,7 +2159,7 @@ function Switch({
|
|
|
2080
2159
|
const id = name + (0, import_react20.useId)();
|
|
2081
2160
|
const hintId = id + "hint";
|
|
2082
2161
|
const errorId = id + "error";
|
|
2083
|
-
const describedBy = error
|
|
2162
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2084
2163
|
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(InputContainer, { className: (0, import_design_system_foundation38.cn)(Switch_default.switchGroup, Switch_default[`--size_${size}`], className), children: [
|
|
2085
2164
|
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: Switch_default.inputWrapper, children: [
|
|
2086
2165
|
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: Switch_default.trackWrapper, children: [
|
|
@@ -2109,7 +2188,7 @@ function Switch({
|
|
|
2109
2188
|
var import_react21 = require("react");
|
|
2110
2189
|
|
|
2111
2190
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2112
|
-
var Textarea_default = {};
|
|
2191
|
+
var Textarea_default = {"formGroup":"bds015-formGroup","textarea":"bds015-textarea","textareaError":"bds015-textareaError"};
|
|
2113
2192
|
|
|
2114
2193
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2115
2194
|
var import_design_system_foundation39 = require("@boostdev/design-system-foundation");
|
|
@@ -2125,7 +2204,7 @@ function Textarea({
|
|
|
2125
2204
|
const id = name + (0, import_react21.useId)();
|
|
2126
2205
|
const hintId = id + "hint";
|
|
2127
2206
|
const errorId = id + "error";
|
|
2128
|
-
const describedBy = error
|
|
2207
|
+
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2129
2208
|
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(InputContainer, { className: (0, import_design_system_foundation39.cn)(Textarea_default.formGroup, className), children: [
|
|
2130
2209
|
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Label, { id, label }),
|
|
2131
2210
|
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
@@ -2145,17 +2224,17 @@ function Textarea({
|
|
|
2145
2224
|
}
|
|
2146
2225
|
|
|
2147
2226
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2148
|
-
var ButtonGroup_default = {};
|
|
2227
|
+
var ButtonGroup_default = {"buttonGroup":"bds015-buttonGroup","container":"bds015-container","--variant__card":"bds015---variant__card","--variant__flow":"bds015---variant__flow","--variant__modal":"bds015---variant__modal","--variant__content":"bds015---variant__content","--variant__grid":"bds015---variant__grid"};
|
|
2149
2228
|
|
|
2150
2229
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2151
2230
|
var import_design_system_foundation40 = require("@boostdev/design-system-foundation");
|
|
2152
2231
|
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2153
2232
|
function ButtonGroup({ children, className, variant }) {
|
|
2154
|
-
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: (0, import_design_system_foundation40.cn)(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--
|
|
2233
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: (0, import_design_system_foundation40.cn)(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: ButtonGroup_default.container, children }) });
|
|
2155
2234
|
}
|
|
2156
2235
|
|
|
2157
2236
|
// src/components/layout/Card/Card.module.css
|
|
2158
|
-
var Card_default = {};
|
|
2237
|
+
var Card_default = {"card":"bds015-card","--default":"bds015---default","--elevated":"bds015---elevated","--outlined":"bds015---outlined","--clickable":"bds015---clickable","--padding-none":"bds015---padding-none","--padding-small":"bds015---padding-small","--padding-medium":"bds015---padding-medium","--padding-large":"bds015---padding-large","--text-start":"bds015---text-start","--text-center":"bds015---text-center","--text-end":"bds015---text-end"};
|
|
2159
2238
|
|
|
2160
2239
|
// src/components/layout/Card/Card.tsx
|
|
2161
2240
|
var import_design_system_foundation41 = require("@boostdev/design-system-foundation");
|
|
@@ -2167,7 +2246,8 @@ function Card({
|
|
|
2167
2246
|
padding = "medium",
|
|
2168
2247
|
textAlign = "start",
|
|
2169
2248
|
style,
|
|
2170
|
-
onClick
|
|
2249
|
+
onClick,
|
|
2250
|
+
"aria-label": ariaLabel
|
|
2171
2251
|
}) {
|
|
2172
2252
|
const classNames = (0, import_design_system_foundation41.cn)(
|
|
2173
2253
|
Card_default.card,
|
|
@@ -2184,6 +2264,7 @@ function Card({
|
|
|
2184
2264
|
className: classNames,
|
|
2185
2265
|
onClick,
|
|
2186
2266
|
style,
|
|
2267
|
+
"aria-label": ariaLabel,
|
|
2187
2268
|
...onClick && { type: "button" },
|
|
2188
2269
|
children
|
|
2189
2270
|
}
|
|
@@ -2191,7 +2272,7 @@ function Card({
|
|
|
2191
2272
|
}
|
|
2192
2273
|
|
|
2193
2274
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
2194
|
-
var SectionHeader_default = {};
|
|
2275
|
+
var SectionHeader_default = {"sectionHeader":"bds015-sectionHeader","title":"bds015-title","subtitle":"bds015-subtitle","--start":"bds015---start","--center":"bds015---center","--end":"bds015---end","--small":"bds015---small","--medium":"bds015---medium","--large":"bds015---large"};
|
|
2195
2276
|
|
|
2196
2277
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
2197
2278
|
var import_design_system_foundation42 = require("@boostdev/design-system-foundation");
|
|
@@ -2212,7 +2293,7 @@ function SectionHeader({
|
|
|
2212
2293
|
}
|
|
2213
2294
|
|
|
2214
2295
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2215
|
-
var IconWrapper_default = {};
|
|
2296
|
+
var IconWrapper_default = {"wrapper":"bds015-wrapper"};
|
|
2216
2297
|
|
|
2217
2298
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2218
2299
|
var import_design_system_foundation43 = require("@boostdev/design-system-foundation");
|