@boostdev/design-system-components 2.6.0 → 2.7.0
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 +257 -219
- package/dist/client.css +585 -537
- package/dist/client.d.cts +27 -1
- package/dist/client.d.ts +27 -1
- package/dist/client.js +220 -183
- package/dist/index.cjs +257 -219
- package/dist/index.css +585 -537
- package/dist/index.d.cts +27 -1
- package/dist/index.d.ts +27 -1
- package/dist/index.js +220 -183
- package/dist/web-components/index.d.ts +56 -1
- package/dist/web-components/index.js +117 -0
- package/package.json +3 -2
- package/src/components/interaction/form/FieldGroup/FieldGroup.mdx +113 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.module.css +96 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.spec.tsx +196 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.stories.tsx +99 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.tsx +64 -0
- package/src/components/interaction/form/FieldGroup/index.ts +2 -0
- package/src/components/interaction/form/atoms/Message.module.css +4 -0
- package/src/index.ts +2 -0
- package/src/web-components/index.ts +2 -0
- package/src/web-components/interaction/form/BdsFieldGroup.mdx +67 -0
- package/src/web-components/interaction/form/BdsFieldGroup.stories.tsx +110 -0
- package/src/web-components/interaction/form/bds-checkbox-group.ts +1 -0
- package/src/web-components/interaction/form/bds-field-group.spec.ts +64 -0
- package/src/web-components/interaction/form/bds-field-group.ts +157 -0
- package/src/web-components/interaction/form/bds-form-input.ts +1 -0
- package/src/web-components/interaction/form/bds-radio-group.ts +1 -0
package/dist/client.cjs
CHANGED
|
@@ -51,6 +51,7 @@ __export(client_exports, {
|
|
|
51
51
|
Dialog: () => Dialog,
|
|
52
52
|
Drawer: () => Drawer,
|
|
53
53
|
DropdownMenu: () => DropdownMenu,
|
|
54
|
+
FieldGroup: () => FieldGroup,
|
|
54
55
|
FileInput: () => FileInput,
|
|
55
56
|
FormInput: () => FormInput,
|
|
56
57
|
Grid: () => Grid,
|
|
@@ -82,7 +83,7 @@ __export(client_exports, {
|
|
|
82
83
|
ToastProvider: () => ToastProvider,
|
|
83
84
|
Tooltip: () => Tooltip,
|
|
84
85
|
Typography: () => Typography,
|
|
85
|
-
cn: () =>
|
|
86
|
+
cn: () => import_design_system_foundation54.cn,
|
|
86
87
|
useToast: () => useToast
|
|
87
88
|
});
|
|
88
89
|
module.exports = __toCommonJS(client_exports);
|
|
@@ -91,7 +92,7 @@ module.exports = __toCommonJS(client_exports);
|
|
|
91
92
|
var import_react = require("react");
|
|
92
93
|
|
|
93
94
|
// src/components/ui/Accordion/Accordion.module.css
|
|
94
|
-
var Accordion_default = {"component":"
|
|
95
|
+
var Accordion_default = {"component":"bds270Accordion-component","accordion":"bds270Accordion-accordion","item":"bds270Accordion-item","heading":"bds270Accordion-heading","trigger":"bds270Accordion-trigger","triggerLabel":"bds270Accordion-triggerLabel","chevron":"bds270Accordion-chevron","--open":"bds270Accordion---open","panel":"bds270Accordion-panel","panelContent":"bds270Accordion-panelContent"};
|
|
95
96
|
|
|
96
97
|
// src/components/ui/Accordion/Accordion.tsx
|
|
97
98
|
var import_design_system_foundation = require("@boostdev/design-system-foundation");
|
|
@@ -160,7 +161,7 @@ function Accordion({
|
|
|
160
161
|
}
|
|
161
162
|
|
|
162
163
|
// src/components/ui/Alert/Alert.module.css
|
|
163
|
-
var Alert_default = {"component":"
|
|
164
|
+
var Alert_default = {"component":"bds270Alert-component","alert":"bds270Alert-alert","--variant_info":"bds270Alert---variant_info","--variant_success":"bds270Alert---variant_success","--variant_warning":"bds270Alert---variant_warning","--variant_error":"bds270Alert---variant_error","icon":"bds270Alert-icon","content":"bds270Alert-content","title":"bds270Alert-title","dismiss":"bds270Alert-dismiss"};
|
|
164
165
|
|
|
165
166
|
// src/components/ui/Alert/Alert.tsx
|
|
166
167
|
var import_design_system_foundation2 = require("@boostdev/design-system-foundation");
|
|
@@ -205,7 +206,7 @@ function Alert({
|
|
|
205
206
|
}
|
|
206
207
|
|
|
207
208
|
// src/components/ui/Avatar/Avatar.module.css
|
|
208
|
-
var Avatar_default = {"component":"
|
|
209
|
+
var Avatar_default = {"component":"bds270Avatar-component","avatar":"bds270Avatar-avatar","--fallback":"bds270Avatar---fallback","--size_small":"bds270Avatar---size_small","--size_medium":"bds270Avatar---size_medium","--size_large":"bds270Avatar---size_large","image":"bds270Avatar-image","initials":"bds270Avatar-initials"};
|
|
209
210
|
|
|
210
211
|
// src/components/ui/Avatar/Avatar.tsx
|
|
211
212
|
var import_design_system_foundation3 = require("@boostdev/design-system-foundation");
|
|
@@ -232,7 +233,7 @@ function Avatar({ src, alt, name, size = "medium", className, ...rest }) {
|
|
|
232
233
|
}
|
|
233
234
|
|
|
234
235
|
// src/components/ui/Badge/Badge.module.css
|
|
235
|
-
var Badge_default = {"component":"
|
|
236
|
+
var Badge_default = {"component":"bds270Badge-component","badge":"bds270Badge-badge","--variant_primary":"bds270Badge---variant_primary","--variant_secondary":"bds270Badge---variant_secondary","--variant_success":"bds270Badge---variant_success","--variant_error":"bds270Badge---variant_error","--variant_warning":"bds270Badge---variant_warning"};
|
|
236
237
|
|
|
237
238
|
// src/components/ui/Badge/Badge.tsx
|
|
238
239
|
var import_design_system_foundation4 = require("@boostdev/design-system-foundation");
|
|
@@ -242,7 +243,7 @@ function Badge({ children, variant = "primary", className, ...rest }) {
|
|
|
242
243
|
}
|
|
243
244
|
|
|
244
245
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
245
|
-
var Breadcrumb_default = {"component":"
|
|
246
|
+
var Breadcrumb_default = {"component":"bds270Breadcrumb-component","breadcrumb":"bds270Breadcrumb-breadcrumb","list":"bds270Breadcrumb-list","item":"bds270Breadcrumb-item","link":"bds270Breadcrumb-link","separator":"bds270Breadcrumb-separator","current":"bds270Breadcrumb-current"};
|
|
246
247
|
|
|
247
248
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
248
249
|
var import_design_system_foundation5 = require("@boostdev/design-system-foundation");
|
|
@@ -258,7 +259,7 @@ function Breadcrumb({ items, className, ...rest }) {
|
|
|
258
259
|
}
|
|
259
260
|
|
|
260
261
|
// src/components/ui/Collapsible/Collapsible.module.css
|
|
261
|
-
var Collapsible_default = {"component":"
|
|
262
|
+
var Collapsible_default = {"component":"bds270Collapsible-component","collapsible":"bds270Collapsible-collapsible","summary":"bds270Collapsible-summary","summaryContent":"bds270Collapsible-summaryContent","icon":"bds270Collapsible-icon","content":"bds270Collapsible-content"};
|
|
262
263
|
|
|
263
264
|
// src/components/ui/Collapsible/Collapsible.tsx
|
|
264
265
|
var import_design_system_foundation6 = require("@boostdev/design-system-foundation");
|
|
@@ -299,7 +300,7 @@ function Collapsible({
|
|
|
299
300
|
var import_react2 = require("react");
|
|
300
301
|
|
|
301
302
|
// src/components/ui/Calendar/Calendar.module.css
|
|
302
|
-
var Calendar_default = {"component":"
|
|
303
|
+
var Calendar_default = {"component":"bds270Calendar-component","calendar":"bds270Calendar-calendar","header":"bds270Calendar-header","monthYear":"bds270Calendar-monthYear","navBtn":"bds270Calendar-navBtn","grid":"bds270Calendar-grid","weekday":"bds270Calendar-weekday","empty":"bds270Calendar-empty","day":"bds270Calendar-day","disabled":"bds270Calendar-disabled","selected":"bds270Calendar-selected","today":"bds270Calendar-today"};
|
|
303
304
|
|
|
304
305
|
// src/components/ui/Calendar/Calendar.tsx
|
|
305
306
|
var import_design_system_foundation7 = require("@boostdev/design-system-foundation");
|
|
@@ -474,7 +475,7 @@ function Calendar({ value, defaultValue, min, max, onChange, className, ...rest
|
|
|
474
475
|
var import_react3 = require("react");
|
|
475
476
|
|
|
476
477
|
// src/components/ui/Carousel/Carousel.module.css
|
|
477
|
-
var Carousel_default = {"component":"
|
|
478
|
+
var Carousel_default = {"component":"bds270Carousel-component","carousel":"bds270Carousel-carousel","track":"bds270Carousel-track","slide":"bds270Carousel-slide","navBtn":"bds270Carousel-navBtn"};
|
|
478
479
|
|
|
479
480
|
// src/components/ui/Carousel/Carousel.tsx
|
|
480
481
|
var import_design_system_foundation8 = require("@boostdev/design-system-foundation");
|
|
@@ -527,7 +528,7 @@ function Carousel({ items, label, className, ...rest }) {
|
|
|
527
528
|
}
|
|
528
529
|
|
|
529
530
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
530
|
-
var DescriptionList_default = {"component":"
|
|
531
|
+
var DescriptionList_default = {"component":"bds270DescriptionList-component","list":"bds270DescriptionList-list","group":"bds270DescriptionList-group","term":"bds270DescriptionList-term","details":"bds270DescriptionList-details","--layout_inline":"bds270DescriptionList---layout_inline"};
|
|
531
532
|
|
|
532
533
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
533
534
|
var import_design_system_foundation9 = require("@boostdev/design-system-foundation");
|
|
@@ -540,7 +541,7 @@ function DescriptionList({ items, layout = "stacked", className, ...rest }) {
|
|
|
540
541
|
}
|
|
541
542
|
|
|
542
543
|
// src/components/ui/Link/Link.module.css
|
|
543
|
-
var Link_default = {"component":"
|
|
544
|
+
var Link_default = {"component":"bds270Link-component","link":"bds270Link-link","--variant_default":"bds270Link---variant_default","--variant_subtle":"bds270Link---variant_subtle","--variant_standalone":"bds270Link---variant_standalone","externalLabel":"bds270Link-externalLabel"};
|
|
544
545
|
|
|
545
546
|
// src/components/ui/Link/Link.tsx
|
|
546
547
|
var import_design_system_foundation10 = require("@boostdev/design-system-foundation");
|
|
@@ -571,7 +572,7 @@ function Link({
|
|
|
571
572
|
}
|
|
572
573
|
|
|
573
574
|
// src/components/ui/Loading/Loading.module.css
|
|
574
|
-
var Loading_default = {"component":"
|
|
575
|
+
var Loading_default = {"component":"bds270Loading-component","loading":"bds270Loading-loading","spinner":"bds270Loading-spinner","--size_small":"bds270Loading---size_small","--size_large":"bds270Loading---size_large"};
|
|
575
576
|
|
|
576
577
|
// src/components/ui/Loading/Loading.tsx
|
|
577
578
|
var import_design_system_foundation11 = require("@boostdev/design-system-foundation");
|
|
@@ -581,7 +582,7 @@ function Loading({ size = "medium", className, ...rest }) {
|
|
|
581
582
|
}
|
|
582
583
|
|
|
583
584
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
584
|
-
var NotificationBanner_default = {"component":"
|
|
585
|
+
var NotificationBanner_default = {"component":"bds270NotificationBanner-component","banner":"bds270NotificationBanner-banner","--variant_info":"bds270NotificationBanner---variant_info","--variant_success":"bds270NotificationBanner---variant_success","--variant_warning":"bds270NotificationBanner---variant_warning","--variant_error":"bds270NotificationBanner---variant_error","content":"bds270NotificationBanner-content","action":"bds270NotificationBanner-action","dismiss":"bds270NotificationBanner-dismiss"};
|
|
585
586
|
|
|
586
587
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
587
588
|
var import_design_system_foundation12 = require("@boostdev/design-system-foundation");
|
|
@@ -622,7 +623,7 @@ function NotificationBanner({
|
|
|
622
623
|
}
|
|
623
624
|
|
|
624
625
|
// src/components/ui/Pagination/Pagination.module.css
|
|
625
|
-
var Pagination_default = {"component":"
|
|
626
|
+
var Pagination_default = {"component":"bds270Pagination-component","pagination":"bds270Pagination-pagination","list":"bds270Pagination-list","button":"bds270Pagination-button","--active":"bds270Pagination---active","--nav":"bds270Pagination---nav","ellipsis":"bds270Pagination-ellipsis"};
|
|
626
627
|
|
|
627
628
|
// src/components/ui/Pagination/Pagination.tsx
|
|
628
629
|
var import_design_system_foundation13 = require("@boostdev/design-system-foundation");
|
|
@@ -687,7 +688,7 @@ function Pagination({
|
|
|
687
688
|
}
|
|
688
689
|
|
|
689
690
|
// src/components/ui/Progress/Progress.module.css
|
|
690
|
-
var Progress_default = {"component":"
|
|
691
|
+
var Progress_default = {"component":"bds270Progress-component","container":"bds270Progress-container","labelRow":"bds270Progress-labelRow","value":"bds270Progress-value","track":"bds270Progress-track","--size_small":"bds270Progress---size_small","--size_medium":"bds270Progress---size_medium","--size_large":"bds270Progress---size_large","fill":"bds270Progress-fill"};
|
|
691
692
|
|
|
692
693
|
// src/components/ui/Progress/Progress.tsx
|
|
693
694
|
var import_design_system_foundation14 = require("@boostdev/design-system-foundation");
|
|
@@ -726,7 +727,7 @@ function Progress({
|
|
|
726
727
|
}
|
|
727
728
|
|
|
728
729
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
729
|
-
var ProgressCircle_default = {"component":"
|
|
730
|
+
var ProgressCircle_default = {"component":"bds270ProgressCircle-component","wrapper":"bds270ProgressCircle-wrapper","svg":"bds270ProgressCircle-svg","track":"bds270ProgressCircle-track","fill":"bds270ProgressCircle-fill","value":"bds270ProgressCircle-value","--size_small":"bds270ProgressCircle---size_small","--size_medium":"bds270ProgressCircle---size_medium","--size_large":"bds270ProgressCircle---size_large"};
|
|
730
731
|
|
|
731
732
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
732
733
|
var import_design_system_foundation15 = require("@boostdev/design-system-foundation");
|
|
@@ -807,7 +808,7 @@ function ProgressCircle({
|
|
|
807
808
|
}
|
|
808
809
|
|
|
809
810
|
// src/components/ui/Separator/Separator.module.css
|
|
810
|
-
var Separator_default = {"component":"
|
|
811
|
+
var Separator_default = {"component":"bds270Separator-component","separator":"bds270Separator-separator","--horizontal":"bds270Separator---horizontal","--vertical":"bds270Separator---vertical"};
|
|
811
812
|
|
|
812
813
|
// src/components/ui/Separator/Separator.tsx
|
|
813
814
|
var import_design_system_foundation16 = require("@boostdev/design-system-foundation");
|
|
@@ -831,7 +832,7 @@ function Separator({ orientation = "horizontal", className, ...rest }) {
|
|
|
831
832
|
var import_design_system_foundation17 = require("@boostdev/design-system-foundation");
|
|
832
833
|
|
|
833
834
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
834
|
-
var Skeleton_default = {"component":"
|
|
835
|
+
var Skeleton_default = {"component":"bds270Skeleton-component","skeleton":"bds270Skeleton-skeleton"};
|
|
835
836
|
|
|
836
837
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
837
838
|
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
@@ -840,7 +841,7 @@ function Skeleton({ className, ...rest }) {
|
|
|
840
841
|
}
|
|
841
842
|
|
|
842
843
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
843
|
-
var SkipLink_default = {"component":"
|
|
844
|
+
var SkipLink_default = {"component":"bds270SkipLink-component","skipLink":"bds270SkipLink-skipLink"};
|
|
844
845
|
|
|
845
846
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
846
847
|
var import_design_system_foundation18 = require("@boostdev/design-system-foundation");
|
|
@@ -850,7 +851,7 @@ function SkipLink({ href = "#main", children = "Skip to main content", className
|
|
|
850
851
|
}
|
|
851
852
|
|
|
852
853
|
// src/components/ui/Table/Table.module.css
|
|
853
|
-
var Table_default = {"component":"
|
|
854
|
+
var Table_default = {"component":"bds270Table-component","wrapper":"bds270Table-wrapper","table":"bds270Table-table","caption":"bds270Table-caption","thead":"bds270Table-thead","th":"bds270Table-th","--sortable":"bds270Table---sortable","sortButton":"bds270Table-sortButton","sortIcon":"bds270Table-sortIcon","--sort-active":"bds270Table---sort-active","--sort-desc":"bds270Table---sort-desc","tbody":"bds270Table-tbody","tr":"bds270Table-tr","td":"bds270Table-td"};
|
|
854
855
|
|
|
855
856
|
// src/components/ui/Table/Table.tsx
|
|
856
857
|
var import_design_system_foundation19 = require("@boostdev/design-system-foundation");
|
|
@@ -920,7 +921,7 @@ function Table({
|
|
|
920
921
|
var import_react4 = require("react");
|
|
921
922
|
|
|
922
923
|
// src/components/ui/Tabs/Tabs.module.css
|
|
923
|
-
var Tabs_default = {"component":"
|
|
924
|
+
var Tabs_default = {"component":"bds270Tabs-component","tabs":"bds270Tabs-tabs","tabList":"bds270Tabs-tabList","tab":"bds270Tabs-tab","--active":"bds270Tabs---active","panel":"bds270Tabs-panel"};
|
|
924
925
|
|
|
925
926
|
// src/components/ui/Tabs/Tabs.tsx
|
|
926
927
|
var import_design_system_foundation20 = require("@boostdev/design-system-foundation");
|
|
@@ -1000,7 +1001,7 @@ function Tabs({ tabs, defaultTab, className, ...rest }) {
|
|
|
1000
1001
|
var import_react5 = require("react");
|
|
1001
1002
|
|
|
1002
1003
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
1003
|
-
var Tooltip_default = {"component":"
|
|
1004
|
+
var Tooltip_default = {"component":"bds270Tooltip-component","wrapper":"bds270Tooltip-wrapper","tooltip":"bds270Tooltip-tooltip","--placement_top":"bds270Tooltip---placement_top","--placement_bottom":"bds270Tooltip---placement_bottom","--placement_left":"bds270Tooltip---placement_left","--placement_right":"bds270Tooltip---placement_right"};
|
|
1004
1005
|
|
|
1005
1006
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
1006
1007
|
var import_design_system_foundation21 = require("@boostdev/design-system-foundation");
|
|
@@ -1044,7 +1045,7 @@ function Tooltip({
|
|
|
1044
1045
|
}
|
|
1045
1046
|
|
|
1046
1047
|
// src/components/ui/Typography/Typography.module.css
|
|
1047
|
-
var Typography_default = {"component":"
|
|
1048
|
+
var Typography_default = {"component":"bds270Typography-component","typography":"bds270Typography-typography","--h1":"bds270Typography---h1","--h2":"bds270Typography---h2","--h3":"bds270Typography---h3","--body":"bds270Typography---body","--body_s":"bds270Typography---body_s"};
|
|
1048
1049
|
|
|
1049
1050
|
// src/components/ui/Typography/Typography.tsx
|
|
1050
1051
|
var import_design_system_foundation22 = require("@boostdev/design-system-foundation");
|
|
@@ -1062,7 +1063,7 @@ function Typography({ variant = "body", component, children, className, ...rest
|
|
|
1062
1063
|
}
|
|
1063
1064
|
|
|
1064
1065
|
// src/components/interaction/Button/Button.module.css
|
|
1065
|
-
var Button_default = {"component":"
|
|
1066
|
+
var Button_default = {"component":"bds270Button-component","button":"bds270Button-button","--default":"bds270Button---default","--outline":"bds270Button---outline","--ghost":"bds270Button---ghost","--size_small":"bds270Button---size_small","--size_medium":"bds270Button---size_medium","--size_large":"bds270Button---size_large","--hasPulse":"bds270Button---hasPulse","iconStart":"bds270Button-iconStart","iconEnd":"bds270Button-iconEnd","--iconOnly":"bds270Button---iconOnly"};
|
|
1066
1067
|
|
|
1067
1068
|
// src/components/interaction/Button/Button.tsx
|
|
1068
1069
|
var import_design_system_foundation23 = require("@boostdev/design-system-foundation");
|
|
@@ -1179,7 +1180,7 @@ function installInvokerCommandsPolyfill() {
|
|
|
1179
1180
|
}
|
|
1180
1181
|
|
|
1181
1182
|
// src/components/interaction/Command/Command.module.css
|
|
1182
|
-
var Command_default = {"component":"
|
|
1183
|
+
var Command_default = {"component":"bds270Command-component","dialog":"bds270Command-dialog","palette":"bds270Command-palette","searchRow":"bds270Command-searchRow","searchIcon":"bds270Command-searchIcon","search":"bds270Command-search","escHint":"bds270Command-escHint","list":"bds270Command-list","groupList":"bds270Command-groupList","group":"bds270Command-group","item":"bds270Command-item","itemActive":"bds270Command-itemActive","itemLabel":"bds270Command-itemLabel","itemDesc":"bds270Command-itemDesc","shortcut":"bds270Command-shortcut","empty":"bds270Command-empty"};
|
|
1183
1184
|
|
|
1184
1185
|
// src/components/interaction/Command/Command.tsx
|
|
1185
1186
|
var import_design_system_foundation24 = require("@boostdev/design-system-foundation");
|
|
@@ -1356,7 +1357,7 @@ function Command({
|
|
|
1356
1357
|
var import_react7 = require("react");
|
|
1357
1358
|
|
|
1358
1359
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1359
|
-
var Dialog_default = {"component":"
|
|
1360
|
+
var Dialog_default = {"component":"bds270Dialog-component","dialog":"bds270Dialog-dialog","dialogContent":"bds270Dialog-dialogContent","closeButton":"bds270Dialog-closeButton"};
|
|
1360
1361
|
|
|
1361
1362
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1362
1363
|
var import_design_system_foundation25 = require("@boostdev/design-system-foundation");
|
|
@@ -1462,7 +1463,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1462
1463
|
var import_react8 = require("react");
|
|
1463
1464
|
|
|
1464
1465
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1465
|
-
var Drawer_default = {"component":"
|
|
1466
|
+
var Drawer_default = {"component":"bds270Drawer-component","drawer":"bds270Drawer-drawer","--side_left":"bds270Drawer---side_left","header":"bds270Drawer-header","closeButton":"bds270Drawer-closeButton","body":"bds270Drawer-body"};
|
|
1466
1467
|
|
|
1467
1468
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1468
1469
|
var import_design_system_foundation26 = require("@boostdev/design-system-foundation");
|
|
@@ -1563,7 +1564,7 @@ function Drawer({
|
|
|
1563
1564
|
var import_react9 = require("react");
|
|
1564
1565
|
|
|
1565
1566
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1566
|
-
var DropdownMenu_default = {"component":"
|
|
1567
|
+
var DropdownMenu_default = {"component":"bds270DropdownMenu-component","wrapper":"bds270DropdownMenu-wrapper","menu":"bds270DropdownMenu-menu","--placement_bottom-start":"bds270DropdownMenu---placement_bottom-start","--placement_bottom-end":"bds270DropdownMenu---placement_bottom-end","separator":"bds270DropdownMenu-separator","item":"bds270DropdownMenu-item","icon":"bds270DropdownMenu-icon"};
|
|
1567
1568
|
|
|
1568
1569
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1569
1570
|
var import_design_system_foundation27 = require("@boostdev/design-system-foundation");
|
|
@@ -1677,7 +1678,7 @@ function DropdownMenu({
|
|
|
1677
1678
|
var import_react10 = require("react");
|
|
1678
1679
|
|
|
1679
1680
|
// src/components/interaction/Popover/Popover.module.css
|
|
1680
|
-
var Popover_default = {"component":"
|
|
1681
|
+
var Popover_default = {"component":"bds270Popover-component","wrapper":"bds270Popover-wrapper","panel":"bds270Popover-panel","g":"bds270Popover-g"};
|
|
1681
1682
|
|
|
1682
1683
|
// src/components/interaction/Popover/Popover.tsx
|
|
1683
1684
|
var import_design_system_foundation28 = require("@boostdev/design-system-foundation");
|
|
@@ -1762,7 +1763,7 @@ function Popover({
|
|
|
1762
1763
|
}
|
|
1763
1764
|
|
|
1764
1765
|
// src/components/interaction/Rating/Rating.module.css
|
|
1765
|
-
var Rating_default = {"component":"
|
|
1766
|
+
var Rating_default = {"component":"bds270Rating-component","rating":"bds270Rating-rating","star":"bds270Rating-star","--filled":"bds270Rating---filled"};
|
|
1766
1767
|
|
|
1767
1768
|
// src/components/interaction/Rating/Rating.tsx
|
|
1768
1769
|
var import_design_system_foundation29 = require("@boostdev/design-system-foundation");
|
|
@@ -1794,7 +1795,7 @@ function Rating({ value, max = 5, className, ...rest }) {
|
|
|
1794
1795
|
var import_react11 = require("react");
|
|
1795
1796
|
|
|
1796
1797
|
// src/components/interaction/Toast/Toast.module.css
|
|
1797
|
-
var Toast_default = {"component":"
|
|
1798
|
+
var Toast_default = {"component":"bds270Toast-component","toastContainer":"bds270Toast-toastContainer","toast":"bds270Toast-toast","--variant_success":"bds270Toast---variant_success","--variant_warning":"bds270Toast---variant_warning","--variant_info":"bds270Toast---variant_info","--variant_error":"bds270Toast---variant_error","message":"bds270Toast-message","closeButton":"bds270Toast-closeButton"};
|
|
1798
1799
|
|
|
1799
1800
|
// src/components/interaction/Toast/Toast.tsx
|
|
1800
1801
|
var import_design_system_foundation30 = require("@boostdev/design-system-foundation");
|
|
@@ -1872,10 +1873,10 @@ function useToast() {
|
|
|
1872
1873
|
var import_react12 = require("react");
|
|
1873
1874
|
|
|
1874
1875
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1875
|
-
var Checkbox_default = {"component":"
|
|
1876
|
+
var Checkbox_default = {"component":"bds270Checkbox-component","checkboxGroup":"bds270Checkbox-checkboxGroup","inputWrapper":"bds270Checkbox-inputWrapper","checkbox":"bds270Checkbox-checkbox","checkboxError":"bds270Checkbox-checkboxError"};
|
|
1876
1877
|
|
|
1877
1878
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1878
|
-
var Message_default = {"component":"
|
|
1879
|
+
var Message_default = {"component":"bds270Message-component","error":"bds270Message-error","hint":"bds270Message-hint"};
|
|
1879
1880
|
|
|
1880
1881
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1881
1882
|
var import_design_system_foundation31 = require("@boostdev/design-system-foundation");
|
|
@@ -1886,7 +1887,7 @@ var Message = ({ message, type, inputId, className }) => {
|
|
|
1886
1887
|
};
|
|
1887
1888
|
|
|
1888
1889
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1889
|
-
var Label_default = {"component":"
|
|
1890
|
+
var Label_default = {"component":"bds270Label-component","label":"bds270Label-label"};
|
|
1890
1891
|
|
|
1891
1892
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1892
1893
|
var import_design_system_foundation32 = require("@boostdev/design-system-foundation");
|
|
@@ -1899,7 +1900,7 @@ var Label = ({ label, id, className }) => {
|
|
|
1899
1900
|
var import_design_system_foundation34 = require("@boostdev/design-system-foundation");
|
|
1900
1901
|
|
|
1901
1902
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1902
|
-
var InputContainer_default = {"component":"
|
|
1903
|
+
var InputContainer_default = {"component":"bds270InputContainer-component","container":"bds270InputContainer-container"};
|
|
1903
1904
|
|
|
1904
1905
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1905
1906
|
var import_design_system_foundation33 = require("@boostdev/design-system-foundation");
|
|
@@ -1940,7 +1941,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1940
1941
|
var import_react13 = require("react");
|
|
1941
1942
|
|
|
1942
1943
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.module.css
|
|
1943
|
-
var CheckboxGroup_default = {"component":"
|
|
1944
|
+
var CheckboxGroup_default = {"component":"bds270CheckboxGroup-component","group":"bds270CheckboxGroup-group","legend":"bds270CheckboxGroup-legend","required":"bds270CheckboxGroup-required","items":"bds270CheckboxGroup-items"};
|
|
1944
1945
|
|
|
1945
1946
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
|
|
1946
1947
|
var import_design_system_foundation35 = require("@boostdev/design-system-foundation");
|
|
@@ -1982,7 +1983,7 @@ function CheckboxGroup({
|
|
|
1982
1983
|
var import_react14 = require("react");
|
|
1983
1984
|
|
|
1984
1985
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1985
|
-
var Combobox_default = {"component":"
|
|
1986
|
+
var Combobox_default = {"component":"bds270Combobox-component","formGroup":"bds270Combobox-formGroup","inputWrapper":"bds270Combobox-inputWrapper","input":"bds270Combobox-input","inputError":"bds270Combobox-inputError","chevron":"bds270Combobox-chevron","listbox":"bds270Combobox-listbox","option":"bds270Combobox-option","--highlighted":"bds270Combobox---highlighted","--selected":"bds270Combobox---selected","--disabled":"bds270Combobox---disabled"};
|
|
1986
1987
|
|
|
1987
1988
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1988
1989
|
var import_design_system_foundation36 = require("@boostdev/design-system-foundation");
|
|
@@ -2129,15 +2130,51 @@ function Combobox({
|
|
|
2129
2130
|
] });
|
|
2130
2131
|
}
|
|
2131
2132
|
|
|
2132
|
-
// src/components/interaction/form/
|
|
2133
|
+
// src/components/interaction/form/FieldGroup/FieldGroup.tsx
|
|
2133
2134
|
var import_react15 = require("react");
|
|
2135
|
+
var import_design_system_foundation37 = require("@boostdev/design-system-foundation");
|
|
2136
|
+
|
|
2137
|
+
// src/components/interaction/form/FieldGroup/FieldGroup.module.css
|
|
2138
|
+
var FieldGroup_default = {"component":"bds270FieldGroup-component","fieldGroup":"bds270FieldGroup-fieldGroup","legend":"bds270FieldGroup-legend","fields":"bds270FieldGroup-fields","--variant_horizontal":"bds270FieldGroup---variant_horizontal"};
|
|
2139
|
+
|
|
2140
|
+
// src/components/interaction/form/FieldGroup/FieldGroup.tsx
|
|
2141
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2142
|
+
function FieldGroup({
|
|
2143
|
+
variant = "horizontal",
|
|
2144
|
+
legend,
|
|
2145
|
+
children,
|
|
2146
|
+
className,
|
|
2147
|
+
style,
|
|
2148
|
+
...rest
|
|
2149
|
+
}) {
|
|
2150
|
+
const fieldCount = import_react15.Children.count(children);
|
|
2151
|
+
const styleWithCount = {
|
|
2152
|
+
...style,
|
|
2153
|
+
"--fieldGroup_field-count": fieldCount
|
|
2154
|
+
};
|
|
2155
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
2156
|
+
"fieldset",
|
|
2157
|
+
{
|
|
2158
|
+
...rest,
|
|
2159
|
+
style: styleWithCount,
|
|
2160
|
+
className: (0, import_design_system_foundation37.cn)(FieldGroup_default.fieldGroup, FieldGroup_default[`--variant_${variant}`], className),
|
|
2161
|
+
children: [
|
|
2162
|
+
legend !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("legend", { className: FieldGroup_default.legend, children: legend }),
|
|
2163
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: FieldGroup_default.fields, children })
|
|
2164
|
+
]
|
|
2165
|
+
}
|
|
2166
|
+
);
|
|
2167
|
+
}
|
|
2168
|
+
|
|
2169
|
+
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2170
|
+
var import_react16 = require("react");
|
|
2134
2171
|
|
|
2135
2172
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
2136
|
-
var FileInput_default = {"component":"
|
|
2173
|
+
var FileInput_default = {"component":"bds270FileInput-component","formGroup":"bds270FileInput-formGroup","fieldLabel":"bds270FileInput-fieldLabel","dropZone":"bds270FileInput-dropZone","isDragging":"bds270FileInput-isDragging","hasError":"bds270FileInput-hasError","isDisabled":"bds270FileInput-isDisabled","icon":"bds270FileInput-icon","prompt":"bds270FileInput-prompt","acceptHint":"bds270FileInput-acceptHint","hiddenInput":"bds270FileInput-hiddenInput"};
|
|
2137
2174
|
|
|
2138
2175
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2139
|
-
var
|
|
2140
|
-
var
|
|
2176
|
+
var import_design_system_foundation38 = require("@boostdev/design-system-foundation");
|
|
2177
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2141
2178
|
function FileInput({
|
|
2142
2179
|
label,
|
|
2143
2180
|
name,
|
|
@@ -2151,13 +2188,13 @@ function FileInput({
|
|
|
2151
2188
|
className,
|
|
2152
2189
|
...rest
|
|
2153
2190
|
}) {
|
|
2154
|
-
const uid = name + (0,
|
|
2191
|
+
const uid = name + (0, import_react16.useId)();
|
|
2155
2192
|
const hintId = uid + "hint";
|
|
2156
2193
|
const errorId = uid + "error";
|
|
2157
2194
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2158
|
-
const inputRef = (0,
|
|
2159
|
-
const [isDragging, setIsDragging] = (0,
|
|
2160
|
-
const [fileNames, setFileNames] = (0,
|
|
2195
|
+
const inputRef = (0, import_react16.useRef)(null);
|
|
2196
|
+
const [isDragging, setIsDragging] = (0, import_react16.useState)(false);
|
|
2197
|
+
const [fileNames, setFileNames] = (0, import_react16.useState)([]);
|
|
2161
2198
|
const isFileAccepted = (file) => {
|
|
2162
2199
|
if (!accept) return true;
|
|
2163
2200
|
return accept.split(",").some((token) => {
|
|
@@ -2187,24 +2224,24 @@ function FileInput({
|
|
|
2187
2224
|
if (!disabled) setIsDragging(true);
|
|
2188
2225
|
};
|
|
2189
2226
|
const handleDragLeave = () => setIsDragging(false);
|
|
2190
|
-
return /* @__PURE__ */ (0,
|
|
2191
|
-
/* @__PURE__ */ (0,
|
|
2227
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(InputContainer, { ...rest, className: (0, import_design_system_foundation38.cn)(FileInput_default.formGroup, className), children: [
|
|
2228
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
2192
2229
|
"label",
|
|
2193
2230
|
{
|
|
2194
2231
|
htmlFor: uid,
|
|
2195
|
-
className: (0,
|
|
2232
|
+
className: (0, import_design_system_foundation38.cn)(FileInput_default.dropZone, isDragging && FileInput_default.isDragging, error && FileInput_default.hasError, disabled && FileInput_default.isDisabled),
|
|
2196
2233
|
onDrop: handleDrop,
|
|
2197
2234
|
onDragOver: handleDragOver,
|
|
2198
2235
|
onDragLeave: handleDragLeave,
|
|
2199
2236
|
children: [
|
|
2200
|
-
/* @__PURE__ */ (0,
|
|
2201
|
-
/* @__PURE__ */ (0,
|
|
2202
|
-
/* @__PURE__ */ (0,
|
|
2203
|
-
/* @__PURE__ */ (0,
|
|
2237
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: FileInput_default.fieldLabel, children: label }),
|
|
2238
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("svg", { "aria-hidden": "true", className: FileInput_default.icon, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" }) }),
|
|
2239
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: FileInput_default.prompt, children: fileNames.length > 0 ? fileNames.join(", ") : /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
|
|
2240
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("strong", { children: "Click to upload" }),
|
|
2204
2241
|
" or drag and drop"
|
|
2205
2242
|
] }) }),
|
|
2206
|
-
accept && /* @__PURE__ */ (0,
|
|
2207
|
-
/* @__PURE__ */ (0,
|
|
2243
|
+
accept && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: FileInput_default.acceptHint, children: accept }),
|
|
2244
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2208
2245
|
"input",
|
|
2209
2246
|
{
|
|
2210
2247
|
ref: inputRef,
|
|
@@ -2225,20 +2262,20 @@ function FileInput({
|
|
|
2225
2262
|
]
|
|
2226
2263
|
}
|
|
2227
2264
|
),
|
|
2228
|
-
/* @__PURE__ */ (0,
|
|
2229
|
-
/* @__PURE__ */ (0,
|
|
2265
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Message, { inputId: uid, type: "error", message: error }),
|
|
2266
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Message, { inputId: uid, type: "hint", message: hint })
|
|
2230
2267
|
] });
|
|
2231
2268
|
}
|
|
2232
2269
|
|
|
2233
2270
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2234
|
-
var
|
|
2271
|
+
var import_react17 = require("react");
|
|
2235
2272
|
|
|
2236
2273
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
2237
|
-
var FormInput_default = {"component":"
|
|
2274
|
+
var FormInput_default = {"component":"bds270FormInput-component","formGroup":"bds270FormInput-formGroup","input":"bds270FormInput-input","inputError":"bds270FormInput-inputError"};
|
|
2238
2275
|
|
|
2239
2276
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2240
|
-
var
|
|
2241
|
-
var
|
|
2277
|
+
var import_design_system_foundation39 = require("@boostdev/design-system-foundation");
|
|
2278
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2242
2279
|
function FormInput({
|
|
2243
2280
|
label,
|
|
2244
2281
|
name,
|
|
@@ -2249,13 +2286,13 @@ function FormInput({
|
|
|
2249
2286
|
required,
|
|
2250
2287
|
...props
|
|
2251
2288
|
}) {
|
|
2252
|
-
const id = name + (0,
|
|
2289
|
+
const id = name + (0, import_react17.useId)();
|
|
2253
2290
|
const hintId = id + "hint";
|
|
2254
2291
|
const errorId = id + "error";
|
|
2255
2292
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2256
|
-
return /* @__PURE__ */ (0,
|
|
2257
|
-
/* @__PURE__ */ (0,
|
|
2258
|
-
/* @__PURE__ */ (0,
|
|
2293
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(InputContainer, { className: (0, import_design_system_foundation39.cn)(FormInput_default.formGroup, className), children: [
|
|
2294
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Label, { id, label }),
|
|
2295
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2259
2296
|
"input",
|
|
2260
2297
|
{
|
|
2261
2298
|
"aria-invalid": !!error,
|
|
@@ -2265,24 +2302,24 @@ function FormInput({
|
|
|
2265
2302
|
id,
|
|
2266
2303
|
name,
|
|
2267
2304
|
required,
|
|
2268
|
-
className: (0,
|
|
2305
|
+
className: (0, import_design_system_foundation39.cn)(FormInput_default.input, error && FormInput_default.inputError),
|
|
2269
2306
|
...props
|
|
2270
2307
|
}
|
|
2271
2308
|
),
|
|
2272
|
-
/* @__PURE__ */ (0,
|
|
2273
|
-
/* @__PURE__ */ (0,
|
|
2309
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2310
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2274
2311
|
] });
|
|
2275
2312
|
}
|
|
2276
2313
|
|
|
2277
2314
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2278
|
-
var
|
|
2315
|
+
var import_react18 = require("react");
|
|
2279
2316
|
|
|
2280
2317
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
2281
|
-
var NumberInput_default = {"component":"
|
|
2318
|
+
var NumberInput_default = {"component":"bds270NumberInput-component","formGroup":"bds270NumberInput-formGroup","inputRow":"bds270NumberInput-inputRow","input":"bds270NumberInput-input","inputError":"bds270NumberInput-inputError","stepper":"bds270NumberInput-stepper"};
|
|
2282
2319
|
|
|
2283
2320
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2284
|
-
var
|
|
2285
|
-
var
|
|
2321
|
+
var import_design_system_foundation40 = require("@boostdev/design-system-foundation");
|
|
2322
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2286
2323
|
function NumberInput({
|
|
2287
2324
|
label,
|
|
2288
2325
|
name,
|
|
@@ -2298,13 +2335,13 @@ function NumberInput({
|
|
|
2298
2335
|
className,
|
|
2299
2336
|
...rest
|
|
2300
2337
|
}) {
|
|
2301
|
-
const uid = name + (0,
|
|
2338
|
+
const uid = name + (0, import_react18.useId)();
|
|
2302
2339
|
const hintId = uid + "hint";
|
|
2303
2340
|
const errorId = uid + "error";
|
|
2304
2341
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2305
|
-
const inputRef = (0,
|
|
2342
|
+
const inputRef = (0, import_react18.useRef)(null);
|
|
2306
2343
|
const isControlled = value !== void 0;
|
|
2307
|
-
const [internalValue, setInternalValue] = (0,
|
|
2344
|
+
const [internalValue, setInternalValue] = (0, import_react18.useState)(defaultValue ?? 0);
|
|
2308
2345
|
const currentValue = isControlled ? value : internalValue;
|
|
2309
2346
|
const clamp = (v) => {
|
|
2310
2347
|
const withMin = min !== void 0 ? Math.max(min, v) : v;
|
|
@@ -2321,10 +2358,10 @@ function NumberInput({
|
|
|
2321
2358
|
}
|
|
2322
2359
|
onChange?.(next);
|
|
2323
2360
|
};
|
|
2324
|
-
return /* @__PURE__ */ (0,
|
|
2325
|
-
/* @__PURE__ */ (0,
|
|
2326
|
-
/* @__PURE__ */ (0,
|
|
2327
|
-
/* @__PURE__ */ (0,
|
|
2361
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(InputContainer, { ...rest, className: (0, import_design_system_foundation40.cn)(NumberInput_default.formGroup, className), children: [
|
|
2362
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Label, { id: uid, label }),
|
|
2363
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: NumberInput_default.inputRow, children: [
|
|
2364
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
2328
2365
|
"button",
|
|
2329
2366
|
{
|
|
2330
2367
|
type: "button",
|
|
@@ -2334,10 +2371,10 @@ function NumberInput({
|
|
|
2334
2371
|
disabled: disabled || min !== void 0 && currentValue <= min,
|
|
2335
2372
|
onClick: () => adjust(-step),
|
|
2336
2373
|
tabIndex: -1,
|
|
2337
|
-
children: /* @__PURE__ */ (0,
|
|
2374
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 12h14" }) })
|
|
2338
2375
|
}
|
|
2339
2376
|
),
|
|
2340
|
-
/* @__PURE__ */ (0,
|
|
2377
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
2341
2378
|
"input",
|
|
2342
2379
|
{
|
|
2343
2380
|
ref: inputRef,
|
|
@@ -2351,7 +2388,7 @@ function NumberInput({
|
|
|
2351
2388
|
disabled,
|
|
2352
2389
|
"aria-invalid": !!error,
|
|
2353
2390
|
"aria-describedby": describedBy,
|
|
2354
|
-
className: (0,
|
|
2391
|
+
className: (0, import_design_system_foundation40.cn)(NumberInput_default.input, error ? NumberInput_default.inputError : void 0),
|
|
2355
2392
|
onChange: (e) => {
|
|
2356
2393
|
const v = parseFloat(e.target.value);
|
|
2357
2394
|
const safe = isNaN(v) ? 0 : v;
|
|
@@ -2360,7 +2397,7 @@ function NumberInput({
|
|
|
2360
2397
|
}
|
|
2361
2398
|
}
|
|
2362
2399
|
),
|
|
2363
|
-
/* @__PURE__ */ (0,
|
|
2400
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
2364
2401
|
"button",
|
|
2365
2402
|
{
|
|
2366
2403
|
type: "button",
|
|
@@ -2370,32 +2407,32 @@ function NumberInput({
|
|
|
2370
2407
|
disabled: disabled || max !== void 0 && currentValue >= max,
|
|
2371
2408
|
onClick: () => adjust(step),
|
|
2372
2409
|
tabIndex: -1,
|
|
2373
|
-
children: /* @__PURE__ */ (0,
|
|
2410
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 5v14M5 12h14" }) })
|
|
2374
2411
|
}
|
|
2375
2412
|
)
|
|
2376
2413
|
] }),
|
|
2377
|
-
/* @__PURE__ */ (0,
|
|
2378
|
-
/* @__PURE__ */ (0,
|
|
2414
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Message, { inputId: uid, type: "error", message: error }),
|
|
2415
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Message, { inputId: uid, type: "hint", message: hint })
|
|
2379
2416
|
] });
|
|
2380
2417
|
}
|
|
2381
2418
|
|
|
2382
2419
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2383
|
-
var
|
|
2420
|
+
var import_react19 = require("react");
|
|
2384
2421
|
|
|
2385
2422
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
2386
|
-
var Radio_default = {"component":"
|
|
2423
|
+
var Radio_default = {"component":"bds270Radio-component","radioGroup":"bds270Radio-radioGroup","inputWrapper":"bds270Radio-inputWrapper","textWrapper":"bds270Radio-textWrapper","description":"bds270Radio-description","radio":"bds270Radio-radio","radioError":"bds270Radio-radioError"};
|
|
2387
2424
|
|
|
2388
2425
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2389
|
-
var
|
|
2390
|
-
var
|
|
2426
|
+
var import_design_system_foundation41 = require("@boostdev/design-system-foundation");
|
|
2427
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2391
2428
|
function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
2392
|
-
const id = name + (0,
|
|
2429
|
+
const id = name + (0, import_react19.useId)();
|
|
2393
2430
|
const hintId = id + "hint";
|
|
2394
2431
|
const errorId = id + "error";
|
|
2395
2432
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2396
|
-
return /* @__PURE__ */ (0,
|
|
2397
|
-
/* @__PURE__ */ (0,
|
|
2398
|
-
/* @__PURE__ */ (0,
|
|
2433
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(InputContainer, { className: (0, import_design_system_foundation41.cn)(Radio_default.radioGroup, className), children: [
|
|
2434
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: Radio_default.inputWrapper, children: [
|
|
2435
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
2399
2436
|
"input",
|
|
2400
2437
|
{
|
|
2401
2438
|
"aria-describedby": describedBy,
|
|
@@ -2403,29 +2440,29 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
2403
2440
|
type: "radio",
|
|
2404
2441
|
id,
|
|
2405
2442
|
name,
|
|
2406
|
-
className: (0,
|
|
2443
|
+
className: (0, import_design_system_foundation41.cn)(Radio_default.radio, error && Radio_default.radioError),
|
|
2407
2444
|
...props
|
|
2408
2445
|
}
|
|
2409
2446
|
),
|
|
2410
|
-
/* @__PURE__ */ (0,
|
|
2411
|
-
/* @__PURE__ */ (0,
|
|
2412
|
-
description && /* @__PURE__ */ (0,
|
|
2447
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: Radio_default.textWrapper, children: [
|
|
2448
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Label, { id, label }),
|
|
2449
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: Radio_default.description, children: description })
|
|
2413
2450
|
] })
|
|
2414
2451
|
] }),
|
|
2415
|
-
/* @__PURE__ */ (0,
|
|
2416
|
-
/* @__PURE__ */ (0,
|
|
2452
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2453
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2417
2454
|
] });
|
|
2418
2455
|
}
|
|
2419
2456
|
|
|
2420
2457
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2421
|
-
var
|
|
2458
|
+
var import_react20 = require("react");
|
|
2422
2459
|
|
|
2423
2460
|
// src/components/interaction/form/RadioGroup/RadioGroup.module.css
|
|
2424
|
-
var RadioGroup_default = {"component":"
|
|
2461
|
+
var RadioGroup_default = {"component":"bds270RadioGroup-component","group":"bds270RadioGroup-group","legend":"bds270RadioGroup-legend","required":"bds270RadioGroup-required","items":"bds270RadioGroup-items"};
|
|
2425
2462
|
|
|
2426
2463
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2427
|
-
var
|
|
2428
|
-
var
|
|
2464
|
+
var import_design_system_foundation42 = require("@boostdev/design-system-foundation");
|
|
2465
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2429
2466
|
function RadioGroup({
|
|
2430
2467
|
legend,
|
|
2431
2468
|
children,
|
|
@@ -2435,39 +2472,39 @@ function RadioGroup({
|
|
|
2435
2472
|
className,
|
|
2436
2473
|
...rest
|
|
2437
2474
|
}) {
|
|
2438
|
-
const id = (0,
|
|
2475
|
+
const id = (0, import_react20.useId)();
|
|
2439
2476
|
const hintId = id + "hint";
|
|
2440
2477
|
const errorId = id + "error";
|
|
2441
2478
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2442
|
-
return /* @__PURE__ */ (0,
|
|
2479
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
2443
2480
|
"fieldset",
|
|
2444
2481
|
{
|
|
2445
2482
|
...rest,
|
|
2446
|
-
className: (0,
|
|
2483
|
+
className: (0, import_design_system_foundation42.cn)(RadioGroup_default.group, className),
|
|
2447
2484
|
"aria-required": required || void 0,
|
|
2448
2485
|
"aria-describedby": describedBy,
|
|
2449
2486
|
children: [
|
|
2450
|
-
/* @__PURE__ */ (0,
|
|
2487
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("legend", { className: RadioGroup_default.legend, children: [
|
|
2451
2488
|
legend,
|
|
2452
|
-
required && /* @__PURE__ */ (0,
|
|
2489
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: RadioGroup_default.required, "aria-hidden": "true", children: " *" })
|
|
2453
2490
|
] }),
|
|
2454
|
-
/* @__PURE__ */ (0,
|
|
2455
|
-
/* @__PURE__ */ (0,
|
|
2456
|
-
/* @__PURE__ */ (0,
|
|
2491
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: RadioGroup_default.items, children }),
|
|
2492
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2493
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2457
2494
|
]
|
|
2458
2495
|
}
|
|
2459
2496
|
);
|
|
2460
2497
|
}
|
|
2461
2498
|
|
|
2462
2499
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2463
|
-
var
|
|
2500
|
+
var import_react21 = require("react");
|
|
2464
2501
|
|
|
2465
2502
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.module.css
|
|
2466
|
-
var SegmentedControl_default = {"component":"
|
|
2503
|
+
var SegmentedControl_default = {"component":"bds270SegmentedControl-component","control":"bds270SegmentedControl-control","thumb":"bds270SegmentedControl-thumb","indicator":"bds270SegmentedControl-indicator","item":"bds270SegmentedControl-item","--active":"bds270SegmentedControl---active","--disabled":"bds270SegmentedControl---disabled","--size_small":"bds270SegmentedControl---size_small","--size_large":"bds270SegmentedControl---size_large","--variant_outline":"bds270SegmentedControl---variant_outline"};
|
|
2467
2504
|
|
|
2468
2505
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2469
|
-
var
|
|
2470
|
-
var
|
|
2506
|
+
var import_design_system_foundation43 = require("@boostdev/design-system-foundation");
|
|
2507
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2471
2508
|
function SegmentedControl({
|
|
2472
2509
|
children,
|
|
2473
2510
|
selectedIndex: selectedIndexProp,
|
|
@@ -2477,32 +2514,32 @@ function SegmentedControl({
|
|
|
2477
2514
|
className,
|
|
2478
2515
|
...rest
|
|
2479
2516
|
}) {
|
|
2480
|
-
const validChildren =
|
|
2517
|
+
const validChildren = import_react21.Children.toArray(children).filter(import_react21.isValidElement);
|
|
2481
2518
|
const autoIndex = selectedIndexProp === void 0 ? validChildren.findIndex((child) => {
|
|
2482
2519
|
const p = child.props;
|
|
2483
2520
|
return p["aria-current"] === "page" || p["aria-pressed"] === true || p["aria-selected"] === true;
|
|
2484
2521
|
}) : -1;
|
|
2485
2522
|
const activeIndex = Math.max(0, selectedIndexProp ?? (autoIndex >= 0 ? autoIndex : 0));
|
|
2486
|
-
return /* @__PURE__ */ (0,
|
|
2523
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
|
|
2487
2524
|
"div",
|
|
2488
2525
|
{
|
|
2489
2526
|
...rest,
|
|
2490
2527
|
role: "group",
|
|
2491
|
-
className: (0,
|
|
2528
|
+
className: (0, import_design_system_foundation43.cn)(SegmentedControl_default.control, SegmentedControl_default[`--size_${size}`], SegmentedControl_default[`--variant_${variant}`], className),
|
|
2492
2529
|
style: {
|
|
2493
2530
|
"--control_count": validChildren.length,
|
|
2494
2531
|
"--control_selected-index": activeIndex
|
|
2495
2532
|
},
|
|
2496
2533
|
children: [
|
|
2497
|
-
/* @__PURE__ */ (0,
|
|
2498
|
-
/* @__PURE__ */ (0,
|
|
2534
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: SegmentedControl_default.thumb, "aria-hidden": "true" }),
|
|
2535
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: SegmentedControl_default.indicator, "aria-hidden": "true" }),
|
|
2499
2536
|
validChildren.map((child, index) => {
|
|
2500
2537
|
const isActive = index === activeIndex;
|
|
2501
2538
|
const p = child.props;
|
|
2502
2539
|
const isDisabled = disabled || !!p.disabled || p["aria-disabled"] === true;
|
|
2503
|
-
return (0,
|
|
2540
|
+
return (0, import_react21.cloneElement)(child, {
|
|
2504
2541
|
key: child.key ?? index,
|
|
2505
|
-
className: (0,
|
|
2542
|
+
className: (0, import_design_system_foundation43.cn)(
|
|
2506
2543
|
SegmentedControl_default.item,
|
|
2507
2544
|
isActive && SegmentedControl_default["--active"],
|
|
2508
2545
|
isDisabled && SegmentedControl_default["--disabled"],
|
|
@@ -2516,14 +2553,14 @@ function SegmentedControl({
|
|
|
2516
2553
|
}
|
|
2517
2554
|
|
|
2518
2555
|
// src/components/interaction/form/Select/Select.tsx
|
|
2519
|
-
var
|
|
2556
|
+
var import_react22 = require("react");
|
|
2520
2557
|
|
|
2521
2558
|
// src/components/interaction/form/Select/Select.module.css
|
|
2522
|
-
var Select_default = {"component":"
|
|
2559
|
+
var Select_default = {"component":"bds270Select-component","formGroup":"bds270Select-formGroup","selectWrapper":"bds270Select-selectWrapper","select":"bds270Select-select","selectError":"bds270Select-selectError","chevron":"bds270Select-chevron"};
|
|
2523
2560
|
|
|
2524
2561
|
// src/components/interaction/form/Select/Select.tsx
|
|
2525
|
-
var
|
|
2526
|
-
var
|
|
2562
|
+
var import_design_system_foundation44 = require("@boostdev/design-system-foundation");
|
|
2563
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2527
2564
|
function Select({
|
|
2528
2565
|
label,
|
|
2529
2566
|
name,
|
|
@@ -2535,14 +2572,14 @@ function Select({
|
|
|
2535
2572
|
required,
|
|
2536
2573
|
...props
|
|
2537
2574
|
}) {
|
|
2538
|
-
const id = name + (0,
|
|
2575
|
+
const id = name + (0, import_react22.useId)();
|
|
2539
2576
|
const hintId = id + "hint";
|
|
2540
2577
|
const errorId = id + "error";
|
|
2541
2578
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2542
|
-
return /* @__PURE__ */ (0,
|
|
2543
|
-
/* @__PURE__ */ (0,
|
|
2544
|
-
/* @__PURE__ */ (0,
|
|
2545
|
-
/* @__PURE__ */ (0,
|
|
2579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(InputContainer, { className: (0, import_design_system_foundation44.cn)(Select_default.formGroup, className), children: [
|
|
2580
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Label, { id, label }),
|
|
2581
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: Select_default.selectWrapper, children: [
|
|
2582
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
|
|
2546
2583
|
"select",
|
|
2547
2584
|
{
|
|
2548
2585
|
id,
|
|
@@ -2551,30 +2588,30 @@ function Select({
|
|
|
2551
2588
|
"aria-required": required || void 0,
|
|
2552
2589
|
"aria-describedby": describedBy,
|
|
2553
2590
|
required,
|
|
2554
|
-
className: (0,
|
|
2591
|
+
className: (0, import_design_system_foundation44.cn)(Select_default.select, error ? Select_default.selectError : void 0),
|
|
2555
2592
|
...props,
|
|
2556
2593
|
children: [
|
|
2557
|
-
placeholder && /* @__PURE__ */ (0,
|
|
2558
|
-
options.map(({ value, label: optLabel, disabled }) => /* @__PURE__ */ (0,
|
|
2594
|
+
placeholder && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("option", { value: "", disabled: true, hidden: true, children: placeholder }),
|
|
2595
|
+
options.map(({ value, label: optLabel, disabled }) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("option", { value, disabled, children: optLabel }, value))
|
|
2559
2596
|
]
|
|
2560
2597
|
}
|
|
2561
2598
|
),
|
|
2562
|
-
/* @__PURE__ */ (0,
|
|
2599
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: Select_default.chevron, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 9l6 6 6-6" }) }) })
|
|
2563
2600
|
] }),
|
|
2564
|
-
/* @__PURE__ */ (0,
|
|
2565
|
-
/* @__PURE__ */ (0,
|
|
2601
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2602
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2566
2603
|
] });
|
|
2567
2604
|
}
|
|
2568
2605
|
|
|
2569
2606
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2570
|
-
var
|
|
2607
|
+
var import_react23 = require("react");
|
|
2571
2608
|
|
|
2572
2609
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2573
|
-
var Slider_default = {"component":"
|
|
2610
|
+
var Slider_default = {"component":"bds270Slider-component","formGroup":"bds270Slider-formGroup","labelRow":"bds270Slider-labelRow","value":"bds270Slider-value","slider":"bds270Slider-slider","sliderError":"bds270Slider-sliderError"};
|
|
2574
2611
|
|
|
2575
2612
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2576
|
-
var
|
|
2577
|
-
var
|
|
2613
|
+
var import_design_system_foundation45 = require("@boostdev/design-system-foundation");
|
|
2614
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2578
2615
|
function Slider({
|
|
2579
2616
|
label,
|
|
2580
2617
|
name,
|
|
@@ -2587,24 +2624,24 @@ function Slider({
|
|
|
2587
2624
|
onChange,
|
|
2588
2625
|
...props
|
|
2589
2626
|
}) {
|
|
2590
|
-
const id = name + (0,
|
|
2627
|
+
const id = name + (0, import_react23.useId)();
|
|
2591
2628
|
const hintId = id + "hint";
|
|
2592
2629
|
const errorId = id + "error";
|
|
2593
2630
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2594
2631
|
const isControlled = props.value !== void 0;
|
|
2595
|
-
const [internalValue, setInternalValue] = (0,
|
|
2632
|
+
const [internalValue, setInternalValue] = (0, import_react23.useState)(Number(props.defaultValue ?? min));
|
|
2596
2633
|
const currentValue = isControlled ? Number(props.value) : internalValue;
|
|
2597
2634
|
const fillPct = (currentValue - min) / (max - min) * 100;
|
|
2598
2635
|
const handleChange = (e) => {
|
|
2599
2636
|
if (!isControlled) setInternalValue(Number(e.target.value));
|
|
2600
2637
|
onChange?.(e);
|
|
2601
2638
|
};
|
|
2602
|
-
return /* @__PURE__ */ (0,
|
|
2603
|
-
/* @__PURE__ */ (0,
|
|
2604
|
-
/* @__PURE__ */ (0,
|
|
2605
|
-
showValue && /* @__PURE__ */ (0,
|
|
2639
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(InputContainer, { className: (0, import_design_system_foundation45.cn)(Slider_default.formGroup, className), children: [
|
|
2640
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: Slider_default.labelRow, children: [
|
|
2641
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Label, { id, label }),
|
|
2642
|
+
showValue && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: Slider_default.value, children: currentValue })
|
|
2606
2643
|
] }),
|
|
2607
|
-
/* @__PURE__ */ (0,
|
|
2644
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2608
2645
|
"input",
|
|
2609
2646
|
{
|
|
2610
2647
|
type: "range",
|
|
@@ -2617,26 +2654,26 @@ function Slider({
|
|
|
2617
2654
|
"aria-valuemax": max,
|
|
2618
2655
|
"aria-valuenow": currentValue,
|
|
2619
2656
|
"aria-valuetext": String(currentValue),
|
|
2620
|
-
className: (0,
|
|
2657
|
+
className: (0, import_design_system_foundation45.cn)(Slider_default.slider, error ? Slider_default.sliderError : void 0),
|
|
2621
2658
|
style: { "--slider_fill": `${fillPct}%` },
|
|
2622
2659
|
onChange: handleChange,
|
|
2623
2660
|
...props
|
|
2624
2661
|
}
|
|
2625
2662
|
),
|
|
2626
|
-
/* @__PURE__ */ (0,
|
|
2627
|
-
/* @__PURE__ */ (0,
|
|
2663
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2664
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2628
2665
|
] });
|
|
2629
2666
|
}
|
|
2630
2667
|
|
|
2631
2668
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2632
|
-
var
|
|
2669
|
+
var import_react24 = require("react");
|
|
2633
2670
|
|
|
2634
2671
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2635
|
-
var Switch_default = {"component":"
|
|
2672
|
+
var Switch_default = {"component":"bds270Switch-component","switchGroup":"bds270Switch-switchGroup","--size_small":"bds270Switch---size_small","--size_medium":"bds270Switch---size_medium","--size_large":"bds270Switch---size_large","inputWrapper":"bds270Switch-inputWrapper","trackWrapper":"bds270Switch-trackWrapper","switch":"bds270Switch-switch","track":"bds270Switch-track","thumb":"bds270Switch-thumb","switchError":"bds270Switch-switchError"};
|
|
2636
2673
|
|
|
2637
2674
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2638
|
-
var
|
|
2639
|
-
var
|
|
2675
|
+
var import_design_system_foundation46 = require("@boostdev/design-system-foundation");
|
|
2676
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
2640
2677
|
function Switch({
|
|
2641
2678
|
label,
|
|
2642
2679
|
name,
|
|
@@ -2647,15 +2684,15 @@ function Switch({
|
|
|
2647
2684
|
prefix,
|
|
2648
2685
|
...props
|
|
2649
2686
|
}) {
|
|
2650
|
-
const id = name + (0,
|
|
2687
|
+
const id = name + (0, import_react24.useId)();
|
|
2651
2688
|
const hintId = id + "hint";
|
|
2652
2689
|
const errorId = id + "error";
|
|
2653
2690
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2654
|
-
return /* @__PURE__ */ (0,
|
|
2655
|
-
/* @__PURE__ */ (0,
|
|
2656
|
-
prefix && /* @__PURE__ */ (0,
|
|
2657
|
-
/* @__PURE__ */ (0,
|
|
2658
|
-
/* @__PURE__ */ (0,
|
|
2691
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(InputContainer, { className: (0, import_design_system_foundation46.cn)(Switch_default.switchGroup, Switch_default[`--size_${size}`], className), children: [
|
|
2692
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: Switch_default.inputWrapper, children: [
|
|
2693
|
+
prefix && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children: prefix }),
|
|
2694
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: Switch_default.trackWrapper, children: [
|
|
2695
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2659
2696
|
"input",
|
|
2660
2697
|
{
|
|
2661
2698
|
type: "checkbox",
|
|
@@ -2663,28 +2700,28 @@ function Switch({
|
|
|
2663
2700
|
id,
|
|
2664
2701
|
name,
|
|
2665
2702
|
"aria-describedby": describedBy,
|
|
2666
|
-
className: (0,
|
|
2703
|
+
className: (0, import_design_system_foundation46.cn)(Switch_default.switch, error ? Switch_default.switchError : void 0),
|
|
2667
2704
|
...props
|
|
2668
2705
|
}
|
|
2669
2706
|
),
|
|
2670
|
-
/* @__PURE__ */ (0,
|
|
2707
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: Switch_default.track, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: Switch_default.thumb }) })
|
|
2671
2708
|
] }),
|
|
2672
|
-
/* @__PURE__ */ (0,
|
|
2709
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Label, { id, label })
|
|
2673
2710
|
] }),
|
|
2674
|
-
/* @__PURE__ */ (0,
|
|
2675
|
-
/* @__PURE__ */ (0,
|
|
2711
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2712
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2676
2713
|
] });
|
|
2677
2714
|
}
|
|
2678
2715
|
|
|
2679
2716
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2680
|
-
var
|
|
2717
|
+
var import_react25 = require("react");
|
|
2681
2718
|
|
|
2682
2719
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2683
|
-
var Textarea_default = {"component":"
|
|
2720
|
+
var Textarea_default = {"component":"bds270Textarea-component","formGroup":"bds270Textarea-formGroup","textarea":"bds270Textarea-textarea","textareaError":"bds270Textarea-textareaError"};
|
|
2684
2721
|
|
|
2685
2722
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2686
|
-
var
|
|
2687
|
-
var
|
|
2723
|
+
var import_design_system_foundation47 = require("@boostdev/design-system-foundation");
|
|
2724
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
2688
2725
|
function Textarea({
|
|
2689
2726
|
label,
|
|
2690
2727
|
name,
|
|
@@ -2694,13 +2731,13 @@ function Textarea({
|
|
|
2694
2731
|
required,
|
|
2695
2732
|
...props
|
|
2696
2733
|
}) {
|
|
2697
|
-
const id = name + (0,
|
|
2734
|
+
const id = name + (0, import_react25.useId)();
|
|
2698
2735
|
const hintId = id + "hint";
|
|
2699
2736
|
const errorId = id + "error";
|
|
2700
2737
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2701
|
-
return /* @__PURE__ */ (0,
|
|
2702
|
-
/* @__PURE__ */ (0,
|
|
2703
|
-
/* @__PURE__ */ (0,
|
|
2738
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(InputContainer, { className: (0, import_design_system_foundation47.cn)(Textarea_default.formGroup, className), children: [
|
|
2739
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Label, { id, label }),
|
|
2740
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
2704
2741
|
"textarea",
|
|
2705
2742
|
{
|
|
2706
2743
|
id,
|
|
@@ -2709,40 +2746,40 @@ function Textarea({
|
|
|
2709
2746
|
"aria-describedby": describedBy,
|
|
2710
2747
|
"aria-required": required || void 0,
|
|
2711
2748
|
required,
|
|
2712
|
-
className: (0,
|
|
2749
|
+
className: (0, import_design_system_foundation47.cn)(Textarea_default.textarea, error ? Textarea_default.textareaError : void 0),
|
|
2713
2750
|
...props
|
|
2714
2751
|
}
|
|
2715
2752
|
),
|
|
2716
|
-
/* @__PURE__ */ (0,
|
|
2717
|
-
/* @__PURE__ */ (0,
|
|
2753
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Message, { inputId: id, type: "error", message: error }),
|
|
2754
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Message, { inputId: id, type: "hint", message: hint })
|
|
2718
2755
|
] });
|
|
2719
2756
|
}
|
|
2720
2757
|
|
|
2721
2758
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2722
|
-
var ButtonGroup_default = {"component":"
|
|
2759
|
+
var ButtonGroup_default = {"component":"bds270ButtonGroup-component","buttonGroup":"bds270ButtonGroup-buttonGroup","container":"bds270ButtonGroup-container","--variant_card":"bds270ButtonGroup---variant_card","--variant_flow":"bds270ButtonGroup---variant_flow","--variant_modal":"bds270ButtonGroup---variant_modal","--variant_content":"bds270ButtonGroup---variant_content","--variant_grid":"bds270ButtonGroup---variant_grid"};
|
|
2723
2760
|
|
|
2724
2761
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2725
|
-
var
|
|
2726
|
-
var
|
|
2762
|
+
var import_design_system_foundation48 = require("@boostdev/design-system-foundation");
|
|
2763
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
2727
2764
|
function ButtonContainer({ children, className, variant, ...rest }) {
|
|
2728
|
-
return /* @__PURE__ */ (0,
|
|
2765
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
2729
2766
|
"div",
|
|
2730
2767
|
{
|
|
2731
2768
|
...rest,
|
|
2732
2769
|
role: "group",
|
|
2733
|
-
className: (0,
|
|
2734
|
-
children: /* @__PURE__ */ (0,
|
|
2770
|
+
className: (0, import_design_system_foundation48.cn)(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]),
|
|
2771
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: ButtonGroup_default.container, children })
|
|
2735
2772
|
}
|
|
2736
2773
|
);
|
|
2737
2774
|
}
|
|
2738
2775
|
var ButtonGroup = ButtonContainer;
|
|
2739
2776
|
|
|
2740
2777
|
// src/components/layout/Card/Card.module.css
|
|
2741
|
-
var Card_default = {"component":"
|
|
2778
|
+
var Card_default = {"component":"bds270Card-component","card":"bds270Card-card","--default":"bds270Card---default","--elevated":"bds270Card---elevated","--outlined":"bds270Card---outlined","--clickable":"bds270Card---clickable","--padding-none":"bds270Card---padding-none","--padding-small":"bds270Card---padding-small","--padding-medium":"bds270Card---padding-medium","--padding-large":"bds270Card---padding-large","--padding-extra-large":"bds270Card---padding-extra-large","--text-start":"bds270Card---text-start","--text-center":"bds270Card---text-center","--text-end":"bds270Card---text-end"};
|
|
2742
2779
|
|
|
2743
2780
|
// src/components/layout/Card/Card.tsx
|
|
2744
|
-
var
|
|
2745
|
-
var
|
|
2781
|
+
var import_design_system_foundation49 = require("@boostdev/design-system-foundation");
|
|
2782
|
+
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
2746
2783
|
function Card({
|
|
2747
2784
|
children,
|
|
2748
2785
|
className,
|
|
@@ -2753,7 +2790,7 @@ function Card({
|
|
|
2753
2790
|
onClick,
|
|
2754
2791
|
...rest
|
|
2755
2792
|
}) {
|
|
2756
|
-
const classNames = (0,
|
|
2793
|
+
const classNames = (0, import_design_system_foundation49.cn)(
|
|
2757
2794
|
Card_default.card,
|
|
2758
2795
|
Card_default[`--${variant}`],
|
|
2759
2796
|
Card_default[`--padding-${padding}`],
|
|
@@ -2762,7 +2799,7 @@ function Card({
|
|
|
2762
2799
|
className
|
|
2763
2800
|
);
|
|
2764
2801
|
const Component = as ?? (onClick ? "button" : "div");
|
|
2765
|
-
return /* @__PURE__ */ (0,
|
|
2802
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
2766
2803
|
Component,
|
|
2767
2804
|
{
|
|
2768
2805
|
...rest,
|
|
@@ -2775,16 +2812,16 @@ function Card({
|
|
|
2775
2812
|
}
|
|
2776
2813
|
|
|
2777
2814
|
// src/components/layout/Grid/Grid.tsx
|
|
2778
|
-
var
|
|
2815
|
+
var import_react27 = require("react");
|
|
2779
2816
|
|
|
2780
2817
|
// src/components/layout/Grid/Grid.module.css
|
|
2781
|
-
var Grid_default = {"component":"
|
|
2818
|
+
var Grid_default = {"component":"bds270Grid-component","grid":"bds270Grid-grid","--main":"bds270Grid---main","--page":"bds270Grid---page","--funnel":"bds270Grid---funnel","--custom":"bds270Grid---custom","--centered":"bds270Grid---centered","item":"bds270Grid-item","w3":"bds270Grid-w3","org":"bds270Grid-org","ts":"bds270Grid-ts","--masonry":"bds270Grid---masonry"};
|
|
2782
2819
|
|
|
2783
2820
|
// src/components/layout/Grid/Grid.tsx
|
|
2784
|
-
var
|
|
2821
|
+
var import_design_system_foundation50 = require("@boostdev/design-system-foundation");
|
|
2785
2822
|
|
|
2786
2823
|
// src/components/layout/Grid/masonry.ts
|
|
2787
|
-
var
|
|
2824
|
+
var import_react26 = require("react");
|
|
2788
2825
|
var NAMED_SPAN_VAR = {
|
|
2789
2826
|
"three-quarters": "--bds-grid_columns-75",
|
|
2790
2827
|
"two-thirds": "--bds-grid_columns-66",
|
|
@@ -2933,7 +2970,7 @@ function restoreOriginalColumn(el) {
|
|
|
2933
2970
|
}
|
|
2934
2971
|
function useMasonry(ref, enabled, options = {}) {
|
|
2935
2972
|
const { preferredColumnSpan, rowUnitPx } = options;
|
|
2936
|
-
(0,
|
|
2973
|
+
(0, import_react26.useLayoutEffect)(() => {
|
|
2937
2974
|
const container = ref.current;
|
|
2938
2975
|
if (!container || !enabled) return;
|
|
2939
2976
|
if (supportsNativeMasonry()) return;
|
|
@@ -3005,10 +3042,10 @@ function useMasonry(ref, enabled, options = {}) {
|
|
|
3005
3042
|
}
|
|
3006
3043
|
|
|
3007
3044
|
// src/components/layout/Grid/Grid.tsx
|
|
3008
|
-
var
|
|
3045
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
3009
3046
|
var _GridContext;
|
|
3010
3047
|
function getGridContext() {
|
|
3011
|
-
_GridContext ??= (0,
|
|
3048
|
+
_GridContext ??= (0, import_react27.createContext)({ autoSpanMedia: false });
|
|
3012
3049
|
return _GridContext;
|
|
3013
3050
|
}
|
|
3014
3051
|
function Grid({
|
|
@@ -3025,12 +3062,12 @@ function Grid({
|
|
|
3025
3062
|
style,
|
|
3026
3063
|
...rest
|
|
3027
3064
|
}) {
|
|
3028
|
-
const ref = (0,
|
|
3065
|
+
const ref = (0, import_react27.useRef)(null);
|
|
3029
3066
|
useMasonry(ref, isMasonry, {
|
|
3030
3067
|
preferredColumnSpan: masonryPreferredColumnSpan,
|
|
3031
3068
|
rowUnitPx: masonryRowUnitPx
|
|
3032
3069
|
});
|
|
3033
|
-
const classNames = (0,
|
|
3070
|
+
const classNames = (0, import_design_system_foundation50.cn)(
|
|
3034
3071
|
Grid_default.grid,
|
|
3035
3072
|
Grid_default[`--${variant}`],
|
|
3036
3073
|
isCentered && Grid_default["--centered"],
|
|
@@ -3040,13 +3077,13 @@ function Grid({
|
|
|
3040
3077
|
const composedStyle = variant === "custom" && columns !== void 0 ? { ...style, ["--grid_columns"]: columns } : style;
|
|
3041
3078
|
const Component = as ?? "div";
|
|
3042
3079
|
const GridContext = getGridContext();
|
|
3043
|
-
const ctx = (0,
|
|
3044
|
-
return /* @__PURE__ */ (0,
|
|
3080
|
+
const ctx = (0, import_react27.useMemo)(() => ({ autoSpanMedia }), [autoSpanMedia]);
|
|
3081
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Component, { ref, ...rest, className: classNames, style: composedStyle, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(GridContext.Provider, { value: ctx, children }) });
|
|
3045
3082
|
}
|
|
3046
3083
|
|
|
3047
3084
|
// src/components/layout/Grid/GridItem.tsx
|
|
3048
|
-
var
|
|
3049
|
-
var
|
|
3085
|
+
var import_react28 = require("react");
|
|
3086
|
+
var import_design_system_foundation51 = require("@boostdev/design-system-foundation");
|
|
3050
3087
|
|
|
3051
3088
|
// src/components/layout/Grid/autoSpan.ts
|
|
3052
3089
|
function aspectToColumnSpan(ratio) {
|
|
@@ -3078,7 +3115,7 @@ function mediaReadyEvent(media) {
|
|
|
3078
3115
|
}
|
|
3079
3116
|
|
|
3080
3117
|
// src/components/layout/Grid/GridItem.tsx
|
|
3081
|
-
var
|
|
3118
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
3082
3119
|
var GridItemSpan = {
|
|
3083
3120
|
full: "full",
|
|
3084
3121
|
threeQuarters: "three-quarters",
|
|
@@ -3111,11 +3148,11 @@ function GridItem({
|
|
|
3111
3148
|
style,
|
|
3112
3149
|
...rest
|
|
3113
3150
|
}) {
|
|
3114
|
-
const { autoSpanMedia } = (0,
|
|
3151
|
+
const { autoSpanMedia } = (0, import_react28.useContext)(getGridContext());
|
|
3115
3152
|
const effectiveSpan = columnSpan ?? (autoSpanMedia ? "auto" : "full");
|
|
3116
|
-
const ref = (0,
|
|
3117
|
-
const [autoSpan, setAutoSpan] = (0,
|
|
3118
|
-
(0,
|
|
3153
|
+
const ref = (0, import_react28.useRef)(null);
|
|
3154
|
+
const [autoSpan, setAutoSpan] = (0, import_react28.useState)("one-quarter");
|
|
3155
|
+
(0, import_react28.useLayoutEffect)(() => {
|
|
3119
3156
|
if (effectiveSpan !== "auto") return;
|
|
3120
3157
|
const el = ref.current;
|
|
3121
3158
|
if (!el) return;
|
|
@@ -3160,13 +3197,13 @@ function GridItem({
|
|
|
3160
3197
|
};
|
|
3161
3198
|
const Component = as ?? "div";
|
|
3162
3199
|
const isColumnSpanAuto = columnSpan === void 0 && !hasExplicitRange;
|
|
3163
|
-
return /* @__PURE__ */ (0,
|
|
3200
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
3164
3201
|
Component,
|
|
3165
3202
|
{
|
|
3166
3203
|
ref,
|
|
3167
3204
|
...rest,
|
|
3168
3205
|
"data-column-span-auto": isColumnSpanAuto ? "" : void 0,
|
|
3169
|
-
className: (0,
|
|
3206
|
+
className: (0, import_design_system_foundation51.cn)(Grid_default.item, className),
|
|
3170
3207
|
style: composedStyle,
|
|
3171
3208
|
children
|
|
3172
3209
|
}
|
|
@@ -3174,11 +3211,11 @@ function GridItem({
|
|
|
3174
3211
|
}
|
|
3175
3212
|
|
|
3176
3213
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
3177
|
-
var SectionHeader_default = {"component":"
|
|
3214
|
+
var SectionHeader_default = {"component":"bds270SectionHeader-component","sectionHeader":"bds270SectionHeader-sectionHeader","title":"bds270SectionHeader-title","subtitle":"bds270SectionHeader-subtitle","--start":"bds270SectionHeader---start","--center":"bds270SectionHeader---center","--end":"bds270SectionHeader---end","--medium":"bds270SectionHeader---medium","--xs":"bds270SectionHeader---xs","--small":"bds270SectionHeader---small","--large":"bds270SectionHeader---large"};
|
|
3178
3215
|
|
|
3179
3216
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
3180
|
-
var
|
|
3181
|
-
var
|
|
3217
|
+
var import_design_system_foundation52 = require("@boostdev/design-system-foundation");
|
|
3218
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
3182
3219
|
function SectionHeader({
|
|
3183
3220
|
title,
|
|
3184
3221
|
subtitle,
|
|
@@ -3189,24 +3226,24 @@ function SectionHeader({
|
|
|
3189
3226
|
...rest
|
|
3190
3227
|
}) {
|
|
3191
3228
|
const Title = titleAs;
|
|
3192
|
-
return /* @__PURE__ */ (0,
|
|
3193
|
-
/* @__PURE__ */ (0,
|
|
3194
|
-
subtitle && /* @__PURE__ */ (0,
|
|
3229
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { ...rest, className: (0, import_design_system_foundation52.cn)(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
3230
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Title, { className: SectionHeader_default.title, children: title }),
|
|
3231
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
3195
3232
|
] });
|
|
3196
3233
|
}
|
|
3197
3234
|
|
|
3198
3235
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
3199
|
-
var IconWrapper_default = {"component":"
|
|
3236
|
+
var IconWrapper_default = {"component":"bds270IconWrapper-component","wrapper":"bds270IconWrapper-wrapper"};
|
|
3200
3237
|
|
|
3201
3238
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
3202
|
-
var
|
|
3203
|
-
var
|
|
3239
|
+
var import_design_system_foundation53 = require("@boostdev/design-system-foundation");
|
|
3240
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
3204
3241
|
function IconWrapper({ children, className, ...rest }) {
|
|
3205
|
-
return /* @__PURE__ */ (0,
|
|
3242
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { ...rest, className: (0, import_design_system_foundation53.cn)(className, IconWrapper_default.wrapper), children });
|
|
3206
3243
|
}
|
|
3207
3244
|
|
|
3208
3245
|
// src/index.ts
|
|
3209
|
-
var
|
|
3246
|
+
var import_design_system_foundation54 = require("@boostdev/design-system-foundation");
|
|
3210
3247
|
// Annotate the CommonJS export names for ESM import in node:
|
|
3211
3248
|
0 && (module.exports = {
|
|
3212
3249
|
Accordion,
|
|
@@ -3229,6 +3266,7 @@ var import_design_system_foundation53 = require("@boostdev/design-system-foundat
|
|
|
3229
3266
|
Dialog,
|
|
3230
3267
|
Drawer,
|
|
3231
3268
|
DropdownMenu,
|
|
3269
|
+
FieldGroup,
|
|
3232
3270
|
FileInput,
|
|
3233
3271
|
FormInput,
|
|
3234
3272
|
Grid,
|