@boostdev/design-system-components 2.1.0 → 2.2.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/AGENTS.md +2 -1
- package/README.md +40 -0
- package/dist/client.cjs +303 -60
- package/dist/client.css +568 -527
- package/dist/client.d.cts +39 -1
- package/dist/client.d.ts +39 -1
- package/dist/client.js +309 -60
- package/dist/index.cjs +303 -60
- package/dist/index.css +568 -527
- package/dist/index.d.cts +39 -1
- package/dist/index.d.ts +39 -1
- package/dist/index.js +309 -60
- package/dist/web-components/index.d.ts +129 -1
- package/dist/web-components/index.js +311 -0
- package/package.json +1 -1
- package/src/components/layout/Grid/Grid.mdx +244 -0
- package/src/components/layout/Grid/Grid.module.css +59 -0
- package/src/components/layout/Grid/Grid.spec.tsx +401 -0
- package/src/components/layout/Grid/Grid.stories.tsx +160 -0
- package/src/components/layout/Grid/Grid.tsx +85 -0
- package/src/components/layout/Grid/GridItem.tsx +150 -0
- package/src/components/layout/Grid/autoSpan.ts +77 -0
- package/src/components/layout/Grid/index.ts +4 -0
- package/src/components/layout/Grid/masonry.ts +134 -0
- package/src/index.ts +2 -0
- package/src/web-components/index.ts +4 -0
- package/src/web-components/layout/BdsGrid.mdx +210 -0
- package/src/web-components/layout/BdsGrid.stories.tsx +209 -0
- package/src/web-components/layout/BdsGridItem.mdx +52 -0
- package/src/web-components/layout/BdsGridItem.stories.tsx +72 -0
- package/src/web-components/layout/bds-grid-item.spec.ts +102 -0
- package/src/web-components/layout/bds-grid-item.ts +177 -0
- package/src/web-components/layout/bds-grid.spec.ts +62 -0
- package/src/web-components/layout/bds-grid.ts +184 -0
package/dist/index.cjs
CHANGED
|
@@ -52,6 +52,9 @@ __export(index_exports, {
|
|
|
52
52
|
DropdownMenu: () => DropdownMenu,
|
|
53
53
|
FileInput: () => FileInput,
|
|
54
54
|
FormInput: () => FormInput,
|
|
55
|
+
Grid: () => Grid,
|
|
56
|
+
GridItem: () => GridItem,
|
|
57
|
+
GridItemSpan: () => GridItemSpan,
|
|
55
58
|
IconWrapper: () => IconWrapper,
|
|
56
59
|
Link: () => Link,
|
|
57
60
|
Loading: () => Loading,
|
|
@@ -78,7 +81,7 @@ __export(index_exports, {
|
|
|
78
81
|
ToastProvider: () => ToastProvider,
|
|
79
82
|
Tooltip: () => Tooltip,
|
|
80
83
|
Typography: () => Typography,
|
|
81
|
-
cn: () =>
|
|
84
|
+
cn: () => import_design_system_foundation53.cn,
|
|
82
85
|
useToast: () => useToast
|
|
83
86
|
});
|
|
84
87
|
module.exports = __toCommonJS(index_exports);
|
|
@@ -87,7 +90,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
87
90
|
var import_react = require("react");
|
|
88
91
|
|
|
89
92
|
// src/components/ui/Accordion/Accordion.module.css
|
|
90
|
-
var Accordion_default = {"component":"
|
|
93
|
+
var Accordion_default = {"component":"bds220Accordion-component","accordion":"bds220Accordion-accordion","item":"bds220Accordion-item","heading":"bds220Accordion-heading","trigger":"bds220Accordion-trigger","triggerLabel":"bds220Accordion-triggerLabel","chevron":"bds220Accordion-chevron","--open":"bds220Accordion---open","panel":"bds220Accordion-panel","panelContent":"bds220Accordion-panelContent"};
|
|
91
94
|
|
|
92
95
|
// src/components/ui/Accordion/Accordion.tsx
|
|
93
96
|
var import_design_system_foundation = require("@boostdev/design-system-foundation");
|
|
@@ -156,7 +159,7 @@ function Accordion({
|
|
|
156
159
|
}
|
|
157
160
|
|
|
158
161
|
// src/components/ui/Alert/Alert.module.css
|
|
159
|
-
var Alert_default = {"component":"
|
|
162
|
+
var Alert_default = {"component":"bds220Alert-component","alert":"bds220Alert-alert","--variant_info":"bds220Alert---variant_info","--variant_success":"bds220Alert---variant_success","--variant_warning":"bds220Alert---variant_warning","--variant_error":"bds220Alert---variant_error","icon":"bds220Alert-icon","content":"bds220Alert-content","title":"bds220Alert-title","dismiss":"bds220Alert-dismiss"};
|
|
160
163
|
|
|
161
164
|
// src/components/ui/Alert/Alert.tsx
|
|
162
165
|
var import_design_system_foundation2 = require("@boostdev/design-system-foundation");
|
|
@@ -201,7 +204,7 @@ function Alert({
|
|
|
201
204
|
}
|
|
202
205
|
|
|
203
206
|
// src/components/ui/Avatar/Avatar.module.css
|
|
204
|
-
var Avatar_default = {"component":"
|
|
207
|
+
var Avatar_default = {"component":"bds220Avatar-component","avatar":"bds220Avatar-avatar","--fallback":"bds220Avatar---fallback","--size_small":"bds220Avatar---size_small","--size_medium":"bds220Avatar---size_medium","--size_large":"bds220Avatar---size_large","image":"bds220Avatar-image","initials":"bds220Avatar-initials"};
|
|
205
208
|
|
|
206
209
|
// src/components/ui/Avatar/Avatar.tsx
|
|
207
210
|
var import_design_system_foundation3 = require("@boostdev/design-system-foundation");
|
|
@@ -228,7 +231,7 @@ function Avatar({ src, alt, name, size = "medium", className, ...rest }) {
|
|
|
228
231
|
}
|
|
229
232
|
|
|
230
233
|
// src/components/ui/Badge/Badge.module.css
|
|
231
|
-
var Badge_default = {"component":"
|
|
234
|
+
var Badge_default = {"component":"bds220Badge-component","badge":"bds220Badge-badge","--variant_primary":"bds220Badge---variant_primary","--variant_secondary":"bds220Badge---variant_secondary","--variant_success":"bds220Badge---variant_success","--variant_error":"bds220Badge---variant_error","--variant_warning":"bds220Badge---variant_warning"};
|
|
232
235
|
|
|
233
236
|
// src/components/ui/Badge/Badge.tsx
|
|
234
237
|
var import_design_system_foundation4 = require("@boostdev/design-system-foundation");
|
|
@@ -238,7 +241,7 @@ function Badge({ children, variant = "primary", className, ...rest }) {
|
|
|
238
241
|
}
|
|
239
242
|
|
|
240
243
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
241
|
-
var Breadcrumb_default = {"component":"
|
|
244
|
+
var Breadcrumb_default = {"component":"bds220Breadcrumb-component","breadcrumb":"bds220Breadcrumb-breadcrumb","list":"bds220Breadcrumb-list","item":"bds220Breadcrumb-item","link":"bds220Breadcrumb-link","separator":"bds220Breadcrumb-separator","current":"bds220Breadcrumb-current"};
|
|
242
245
|
|
|
243
246
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
244
247
|
var import_design_system_foundation5 = require("@boostdev/design-system-foundation");
|
|
@@ -254,7 +257,7 @@ function Breadcrumb({ items, className, ...rest }) {
|
|
|
254
257
|
}
|
|
255
258
|
|
|
256
259
|
// src/components/ui/Collapsible/Collapsible.module.css
|
|
257
|
-
var Collapsible_default = {"component":"
|
|
260
|
+
var Collapsible_default = {"component":"bds220Collapsible-component","collapsible":"bds220Collapsible-collapsible","summary":"bds220Collapsible-summary","summaryContent":"bds220Collapsible-summaryContent","icon":"bds220Collapsible-icon","content":"bds220Collapsible-content"};
|
|
258
261
|
|
|
259
262
|
// src/components/ui/Collapsible/Collapsible.tsx
|
|
260
263
|
var import_design_system_foundation6 = require("@boostdev/design-system-foundation");
|
|
@@ -295,7 +298,7 @@ function Collapsible({
|
|
|
295
298
|
var import_react2 = require("react");
|
|
296
299
|
|
|
297
300
|
// src/components/ui/Calendar/Calendar.module.css
|
|
298
|
-
var Calendar_default = {"component":"
|
|
301
|
+
var Calendar_default = {"component":"bds220Calendar-component","calendar":"bds220Calendar-calendar","header":"bds220Calendar-header","monthYear":"bds220Calendar-monthYear","navBtn":"bds220Calendar-navBtn","grid":"bds220Calendar-grid","weekday":"bds220Calendar-weekday","empty":"bds220Calendar-empty","day":"bds220Calendar-day","disabled":"bds220Calendar-disabled","selected":"bds220Calendar-selected","today":"bds220Calendar-today"};
|
|
299
302
|
|
|
300
303
|
// src/components/ui/Calendar/Calendar.tsx
|
|
301
304
|
var import_design_system_foundation7 = require("@boostdev/design-system-foundation");
|
|
@@ -470,7 +473,7 @@ function Calendar({ value, defaultValue, min, max, onChange, className, ...rest
|
|
|
470
473
|
var import_react3 = require("react");
|
|
471
474
|
|
|
472
475
|
// src/components/ui/Carousel/Carousel.module.css
|
|
473
|
-
var Carousel_default = {"component":"
|
|
476
|
+
var Carousel_default = {"component":"bds220Carousel-component","carousel":"bds220Carousel-carousel","track":"bds220Carousel-track","slide":"bds220Carousel-slide","navBtn":"bds220Carousel-navBtn"};
|
|
474
477
|
|
|
475
478
|
// src/components/ui/Carousel/Carousel.tsx
|
|
476
479
|
var import_design_system_foundation8 = require("@boostdev/design-system-foundation");
|
|
@@ -523,7 +526,7 @@ function Carousel({ items, label, className, ...rest }) {
|
|
|
523
526
|
}
|
|
524
527
|
|
|
525
528
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
526
|
-
var DescriptionList_default = {"component":"
|
|
529
|
+
var DescriptionList_default = {"component":"bds220DescriptionList-component","list":"bds220DescriptionList-list","group":"bds220DescriptionList-group","term":"bds220DescriptionList-term","details":"bds220DescriptionList-details","--layout_inline":"bds220DescriptionList---layout_inline"};
|
|
527
530
|
|
|
528
531
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
529
532
|
var import_design_system_foundation9 = require("@boostdev/design-system-foundation");
|
|
@@ -536,7 +539,7 @@ function DescriptionList({ items, layout = "stacked", className, ...rest }) {
|
|
|
536
539
|
}
|
|
537
540
|
|
|
538
541
|
// src/components/ui/Link/Link.module.css
|
|
539
|
-
var Link_default = {"component":"
|
|
542
|
+
var Link_default = {"component":"bds220Link-component","link":"bds220Link-link","--variant_default":"bds220Link---variant_default","--variant_subtle":"bds220Link---variant_subtle","--variant_standalone":"bds220Link---variant_standalone","externalLabel":"bds220Link-externalLabel"};
|
|
540
543
|
|
|
541
544
|
// src/components/ui/Link/Link.tsx
|
|
542
545
|
var import_design_system_foundation10 = require("@boostdev/design-system-foundation");
|
|
@@ -567,7 +570,7 @@ function Link({
|
|
|
567
570
|
}
|
|
568
571
|
|
|
569
572
|
// src/components/ui/Loading/Loading.module.css
|
|
570
|
-
var Loading_default = {"component":"
|
|
573
|
+
var Loading_default = {"component":"bds220Loading-component","loading":"bds220Loading-loading","spinner":"bds220Loading-spinner","--size_small":"bds220Loading---size_small","--size_large":"bds220Loading---size_large"};
|
|
571
574
|
|
|
572
575
|
// src/components/ui/Loading/Loading.tsx
|
|
573
576
|
var import_design_system_foundation11 = require("@boostdev/design-system-foundation");
|
|
@@ -577,7 +580,7 @@ function Loading({ size = "medium", className, ...rest }) {
|
|
|
577
580
|
}
|
|
578
581
|
|
|
579
582
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
580
|
-
var NotificationBanner_default = {"component":"
|
|
583
|
+
var NotificationBanner_default = {"component":"bds220NotificationBanner-component","banner":"bds220NotificationBanner-banner","--variant_info":"bds220NotificationBanner---variant_info","--variant_success":"bds220NotificationBanner---variant_success","--variant_warning":"bds220NotificationBanner---variant_warning","--variant_error":"bds220NotificationBanner---variant_error","content":"bds220NotificationBanner-content","action":"bds220NotificationBanner-action","dismiss":"bds220NotificationBanner-dismiss"};
|
|
581
584
|
|
|
582
585
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
583
586
|
var import_design_system_foundation12 = require("@boostdev/design-system-foundation");
|
|
@@ -618,7 +621,7 @@ function NotificationBanner({
|
|
|
618
621
|
}
|
|
619
622
|
|
|
620
623
|
// src/components/ui/Pagination/Pagination.module.css
|
|
621
|
-
var Pagination_default = {"component":"
|
|
624
|
+
var Pagination_default = {"component":"bds220Pagination-component","pagination":"bds220Pagination-pagination","list":"bds220Pagination-list","button":"bds220Pagination-button","--active":"bds220Pagination---active","--nav":"bds220Pagination---nav","ellipsis":"bds220Pagination-ellipsis"};
|
|
622
625
|
|
|
623
626
|
// src/components/ui/Pagination/Pagination.tsx
|
|
624
627
|
var import_design_system_foundation13 = require("@boostdev/design-system-foundation");
|
|
@@ -683,7 +686,7 @@ function Pagination({
|
|
|
683
686
|
}
|
|
684
687
|
|
|
685
688
|
// src/components/ui/Progress/Progress.module.css
|
|
686
|
-
var Progress_default = {"component":"
|
|
689
|
+
var Progress_default = {"component":"bds220Progress-component","container":"bds220Progress-container","labelRow":"bds220Progress-labelRow","value":"bds220Progress-value","track":"bds220Progress-track","--size_small":"bds220Progress---size_small","--size_medium":"bds220Progress---size_medium","--size_large":"bds220Progress---size_large","fill":"bds220Progress-fill"};
|
|
687
690
|
|
|
688
691
|
// src/components/ui/Progress/Progress.tsx
|
|
689
692
|
var import_design_system_foundation14 = require("@boostdev/design-system-foundation");
|
|
@@ -722,7 +725,7 @@ function Progress({
|
|
|
722
725
|
}
|
|
723
726
|
|
|
724
727
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
725
|
-
var ProgressCircle_default = {"component":"
|
|
728
|
+
var ProgressCircle_default = {"component":"bds220ProgressCircle-component","wrapper":"bds220ProgressCircle-wrapper","svg":"bds220ProgressCircle-svg","track":"bds220ProgressCircle-track","fill":"bds220ProgressCircle-fill","value":"bds220ProgressCircle-value","--size_small":"bds220ProgressCircle---size_small","--size_medium":"bds220ProgressCircle---size_medium","--size_large":"bds220ProgressCircle---size_large"};
|
|
726
729
|
|
|
727
730
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
728
731
|
var import_design_system_foundation15 = require("@boostdev/design-system-foundation");
|
|
@@ -803,7 +806,7 @@ function ProgressCircle({
|
|
|
803
806
|
}
|
|
804
807
|
|
|
805
808
|
// src/components/ui/Separator/Separator.module.css
|
|
806
|
-
var Separator_default = {"component":"
|
|
809
|
+
var Separator_default = {"component":"bds220Separator-component","separator":"bds220Separator-separator","--horizontal":"bds220Separator---horizontal","--vertical":"bds220Separator---vertical"};
|
|
807
810
|
|
|
808
811
|
// src/components/ui/Separator/Separator.tsx
|
|
809
812
|
var import_design_system_foundation16 = require("@boostdev/design-system-foundation");
|
|
@@ -827,7 +830,7 @@ function Separator({ orientation = "horizontal", className, ...rest }) {
|
|
|
827
830
|
var import_design_system_foundation17 = require("@boostdev/design-system-foundation");
|
|
828
831
|
|
|
829
832
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
830
|
-
var Skeleton_default = {"component":"
|
|
833
|
+
var Skeleton_default = {"component":"bds220Skeleton-component","skeleton":"bds220Skeleton-skeleton"};
|
|
831
834
|
|
|
832
835
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
833
836
|
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
@@ -836,7 +839,7 @@ function Skeleton({ className, ...rest }) {
|
|
|
836
839
|
}
|
|
837
840
|
|
|
838
841
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
839
|
-
var SkipLink_default = {"component":"
|
|
842
|
+
var SkipLink_default = {"component":"bds220SkipLink-component","skipLink":"bds220SkipLink-skipLink"};
|
|
840
843
|
|
|
841
844
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
842
845
|
var import_design_system_foundation18 = require("@boostdev/design-system-foundation");
|
|
@@ -846,7 +849,7 @@ function SkipLink({ href = "#main", children = "Skip to main content", className
|
|
|
846
849
|
}
|
|
847
850
|
|
|
848
851
|
// src/components/ui/Table/Table.module.css
|
|
849
|
-
var Table_default = {"component":"
|
|
852
|
+
var Table_default = {"component":"bds220Table-component","wrapper":"bds220Table-wrapper","table":"bds220Table-table","caption":"bds220Table-caption","thead":"bds220Table-thead","th":"bds220Table-th","--sortable":"bds220Table---sortable","sortButton":"bds220Table-sortButton","sortIcon":"bds220Table-sortIcon","--sort-active":"bds220Table---sort-active","--sort-desc":"bds220Table---sort-desc","tbody":"bds220Table-tbody","tr":"bds220Table-tr","td":"bds220Table-td"};
|
|
850
853
|
|
|
851
854
|
// src/components/ui/Table/Table.tsx
|
|
852
855
|
var import_design_system_foundation19 = require("@boostdev/design-system-foundation");
|
|
@@ -916,7 +919,7 @@ function Table({
|
|
|
916
919
|
var import_react4 = require("react");
|
|
917
920
|
|
|
918
921
|
// src/components/ui/Tabs/Tabs.module.css
|
|
919
|
-
var Tabs_default = {"component":"
|
|
922
|
+
var Tabs_default = {"component":"bds220Tabs-component","tabs":"bds220Tabs-tabs","tabList":"bds220Tabs-tabList","tab":"bds220Tabs-tab","--active":"bds220Tabs---active","panel":"bds220Tabs-panel"};
|
|
920
923
|
|
|
921
924
|
// src/components/ui/Tabs/Tabs.tsx
|
|
922
925
|
var import_design_system_foundation20 = require("@boostdev/design-system-foundation");
|
|
@@ -996,7 +999,7 @@ function Tabs({ tabs, defaultTab, className, ...rest }) {
|
|
|
996
999
|
var import_react5 = require("react");
|
|
997
1000
|
|
|
998
1001
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
999
|
-
var Tooltip_default = {"component":"
|
|
1002
|
+
var Tooltip_default = {"component":"bds220Tooltip-component","wrapper":"bds220Tooltip-wrapper","tooltip":"bds220Tooltip-tooltip","--placement_top":"bds220Tooltip---placement_top","--placement_bottom":"bds220Tooltip---placement_bottom","--placement_left":"bds220Tooltip---placement_left","--placement_right":"bds220Tooltip---placement_right"};
|
|
1000
1003
|
|
|
1001
1004
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
1002
1005
|
var import_design_system_foundation21 = require("@boostdev/design-system-foundation");
|
|
@@ -1040,7 +1043,7 @@ function Tooltip({
|
|
|
1040
1043
|
}
|
|
1041
1044
|
|
|
1042
1045
|
// src/components/ui/Typography/Typography.module.css
|
|
1043
|
-
var Typography_default = {"component":"
|
|
1046
|
+
var Typography_default = {"component":"bds220Typography-component","typography":"bds220Typography-typography","--h1":"bds220Typography---h1","--h2":"bds220Typography---h2","--h3":"bds220Typography---h3","--body":"bds220Typography---body","--body_s":"bds220Typography---body_s"};
|
|
1044
1047
|
|
|
1045
1048
|
// src/components/ui/Typography/Typography.tsx
|
|
1046
1049
|
var import_design_system_foundation22 = require("@boostdev/design-system-foundation");
|
|
@@ -1058,7 +1061,7 @@ function Typography({ variant = "body", component, children, className, ...rest
|
|
|
1058
1061
|
}
|
|
1059
1062
|
|
|
1060
1063
|
// src/components/interaction/Button/Button.module.css
|
|
1061
|
-
var Button_default = {"component":"
|
|
1064
|
+
var Button_default = {"component":"bds220Button-component","button":"bds220Button-button","--default":"bds220Button---default","--outline":"bds220Button---outline","--ghost":"bds220Button---ghost","--size_small":"bds220Button---size_small","--size_medium":"bds220Button---size_medium","--size_large":"bds220Button---size_large","--hasPulse":"bds220Button---hasPulse","iconStart":"bds220Button-iconStart","iconEnd":"bds220Button-iconEnd","--iconOnly":"bds220Button---iconOnly"};
|
|
1062
1065
|
|
|
1063
1066
|
// src/components/interaction/Button/Button.tsx
|
|
1064
1067
|
var import_design_system_foundation23 = require("@boostdev/design-system-foundation");
|
|
@@ -1175,7 +1178,7 @@ function installInvokerCommandsPolyfill() {
|
|
|
1175
1178
|
}
|
|
1176
1179
|
|
|
1177
1180
|
// src/components/interaction/Command/Command.module.css
|
|
1178
|
-
var Command_default = {"component":"
|
|
1181
|
+
var Command_default = {"component":"bds220Command-component","dialog":"bds220Command-dialog","palette":"bds220Command-palette","searchRow":"bds220Command-searchRow","searchIcon":"bds220Command-searchIcon","search":"bds220Command-search","escHint":"bds220Command-escHint","list":"bds220Command-list","groupList":"bds220Command-groupList","group":"bds220Command-group","item":"bds220Command-item","itemActive":"bds220Command-itemActive","itemLabel":"bds220Command-itemLabel","itemDesc":"bds220Command-itemDesc","shortcut":"bds220Command-shortcut","empty":"bds220Command-empty"};
|
|
1179
1182
|
|
|
1180
1183
|
// src/components/interaction/Command/Command.tsx
|
|
1181
1184
|
var import_design_system_foundation24 = require("@boostdev/design-system-foundation");
|
|
@@ -1352,7 +1355,7 @@ function Command({
|
|
|
1352
1355
|
var import_react7 = require("react");
|
|
1353
1356
|
|
|
1354
1357
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1355
|
-
var Dialog_default = {"component":"
|
|
1358
|
+
var Dialog_default = {"component":"bds220Dialog-component","dialog":"bds220Dialog-dialog","dialogContent":"bds220Dialog-dialogContent","closeButton":"bds220Dialog-closeButton"};
|
|
1356
1359
|
|
|
1357
1360
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1358
1361
|
var import_design_system_foundation25 = require("@boostdev/design-system-foundation");
|
|
@@ -1458,7 +1461,7 @@ function Dialog({ children, id: idProp, isOpen = false, className, onOpen, onClo
|
|
|
1458
1461
|
var import_react8 = require("react");
|
|
1459
1462
|
|
|
1460
1463
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1461
|
-
var Drawer_default = {"component":"
|
|
1464
|
+
var Drawer_default = {"component":"bds220Drawer-component","drawer":"bds220Drawer-drawer","--side_left":"bds220Drawer---side_left","header":"bds220Drawer-header","closeButton":"bds220Drawer-closeButton","body":"bds220Drawer-body"};
|
|
1462
1465
|
|
|
1463
1466
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1464
1467
|
var import_design_system_foundation26 = require("@boostdev/design-system-foundation");
|
|
@@ -1559,7 +1562,7 @@ function Drawer({
|
|
|
1559
1562
|
var import_react9 = require("react");
|
|
1560
1563
|
|
|
1561
1564
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1562
|
-
var DropdownMenu_default = {"component":"
|
|
1565
|
+
var DropdownMenu_default = {"component":"bds220DropdownMenu-component","wrapper":"bds220DropdownMenu-wrapper","menu":"bds220DropdownMenu-menu","--placement_bottom-start":"bds220DropdownMenu---placement_bottom-start","--placement_bottom-end":"bds220DropdownMenu---placement_bottom-end","separator":"bds220DropdownMenu-separator","item":"bds220DropdownMenu-item","icon":"bds220DropdownMenu-icon"};
|
|
1563
1566
|
|
|
1564
1567
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1565
1568
|
var import_design_system_foundation27 = require("@boostdev/design-system-foundation");
|
|
@@ -1673,7 +1676,7 @@ function DropdownMenu({
|
|
|
1673
1676
|
var import_react10 = require("react");
|
|
1674
1677
|
|
|
1675
1678
|
// src/components/interaction/Popover/Popover.module.css
|
|
1676
|
-
var Popover_default = {"component":"
|
|
1679
|
+
var Popover_default = {"component":"bds220Popover-component","wrapper":"bds220Popover-wrapper","panel":"bds220Popover-panel","g":"bds220Popover-g"};
|
|
1677
1680
|
|
|
1678
1681
|
// src/components/interaction/Popover/Popover.tsx
|
|
1679
1682
|
var import_design_system_foundation28 = require("@boostdev/design-system-foundation");
|
|
@@ -1758,7 +1761,7 @@ function Popover({
|
|
|
1758
1761
|
}
|
|
1759
1762
|
|
|
1760
1763
|
// src/components/interaction/Rating/Rating.module.css
|
|
1761
|
-
var Rating_default = {"component":"
|
|
1764
|
+
var Rating_default = {"component":"bds220Rating-component","rating":"bds220Rating-rating","star":"bds220Rating-star","--filled":"bds220Rating---filled"};
|
|
1762
1765
|
|
|
1763
1766
|
// src/components/interaction/Rating/Rating.tsx
|
|
1764
1767
|
var import_design_system_foundation29 = require("@boostdev/design-system-foundation");
|
|
@@ -1790,7 +1793,7 @@ function Rating({ value, max = 5, className, ...rest }) {
|
|
|
1790
1793
|
var import_react11 = require("react");
|
|
1791
1794
|
|
|
1792
1795
|
// src/components/interaction/Toast/Toast.module.css
|
|
1793
|
-
var Toast_default = {"component":"
|
|
1796
|
+
var Toast_default = {"component":"bds220Toast-component","toastContainer":"bds220Toast-toastContainer","toast":"bds220Toast-toast","--variant_success":"bds220Toast---variant_success","--variant_warning":"bds220Toast---variant_warning","--variant_info":"bds220Toast---variant_info","--variant_error":"bds220Toast---variant_error","message":"bds220Toast-message","closeButton":"bds220Toast-closeButton"};
|
|
1794
1797
|
|
|
1795
1798
|
// src/components/interaction/Toast/Toast.tsx
|
|
1796
1799
|
var import_design_system_foundation30 = require("@boostdev/design-system-foundation");
|
|
@@ -1868,10 +1871,10 @@ function useToast() {
|
|
|
1868
1871
|
var import_react12 = require("react");
|
|
1869
1872
|
|
|
1870
1873
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1871
|
-
var Checkbox_default = {"component":"
|
|
1874
|
+
var Checkbox_default = {"component":"bds220Checkbox-component","checkboxGroup":"bds220Checkbox-checkboxGroup","inputWrapper":"bds220Checkbox-inputWrapper","checkbox":"bds220Checkbox-checkbox","checkboxError":"bds220Checkbox-checkboxError"};
|
|
1872
1875
|
|
|
1873
1876
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1874
|
-
var Message_default = {"component":"
|
|
1877
|
+
var Message_default = {"component":"bds220Message-component","error":"bds220Message-error","hint":"bds220Message-hint"};
|
|
1875
1878
|
|
|
1876
1879
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1877
1880
|
var import_design_system_foundation31 = require("@boostdev/design-system-foundation");
|
|
@@ -1882,7 +1885,7 @@ var Message = ({ message, type, inputId, className }) => {
|
|
|
1882
1885
|
};
|
|
1883
1886
|
|
|
1884
1887
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1885
|
-
var Label_default = {"component":"
|
|
1888
|
+
var Label_default = {"component":"bds220Label-component","label":"bds220Label-label"};
|
|
1886
1889
|
|
|
1887
1890
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1888
1891
|
var import_design_system_foundation32 = require("@boostdev/design-system-foundation");
|
|
@@ -1895,7 +1898,7 @@ var Label = ({ label, id, className }) => {
|
|
|
1895
1898
|
var import_design_system_foundation34 = require("@boostdev/design-system-foundation");
|
|
1896
1899
|
|
|
1897
1900
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1898
|
-
var InputContainer_default = {"component":"
|
|
1901
|
+
var InputContainer_default = {"component":"bds220InputContainer-component","container":"bds220InputContainer-container"};
|
|
1899
1902
|
|
|
1900
1903
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1901
1904
|
var import_design_system_foundation33 = require("@boostdev/design-system-foundation");
|
|
@@ -1936,7 +1939,7 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1936
1939
|
var import_react13 = require("react");
|
|
1937
1940
|
|
|
1938
1941
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.module.css
|
|
1939
|
-
var CheckboxGroup_default = {"component":"
|
|
1942
|
+
var CheckboxGroup_default = {"component":"bds220CheckboxGroup-component","group":"bds220CheckboxGroup-group","legend":"bds220CheckboxGroup-legend","required":"bds220CheckboxGroup-required","items":"bds220CheckboxGroup-items"};
|
|
1940
1943
|
|
|
1941
1944
|
// src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx
|
|
1942
1945
|
var import_design_system_foundation35 = require("@boostdev/design-system-foundation");
|
|
@@ -1978,7 +1981,7 @@ function CheckboxGroup({
|
|
|
1978
1981
|
var import_react14 = require("react");
|
|
1979
1982
|
|
|
1980
1983
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1981
|
-
var Combobox_default = {"component":"
|
|
1984
|
+
var Combobox_default = {"component":"bds220Combobox-component","formGroup":"bds220Combobox-formGroup","inputWrapper":"bds220Combobox-inputWrapper","input":"bds220Combobox-input","inputError":"bds220Combobox-inputError","chevron":"bds220Combobox-chevron","listbox":"bds220Combobox-listbox","option":"bds220Combobox-option","--highlighted":"bds220Combobox---highlighted","--selected":"bds220Combobox---selected","--disabled":"bds220Combobox---disabled"};
|
|
1982
1985
|
|
|
1983
1986
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1984
1987
|
var import_design_system_foundation36 = require("@boostdev/design-system-foundation");
|
|
@@ -2129,7 +2132,7 @@ function Combobox({
|
|
|
2129
2132
|
var import_react15 = require("react");
|
|
2130
2133
|
|
|
2131
2134
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
2132
|
-
var FileInput_default = {"component":"
|
|
2135
|
+
var FileInput_default = {"component":"bds220FileInput-component","formGroup":"bds220FileInput-formGroup","fieldLabel":"bds220FileInput-fieldLabel","dropZone":"bds220FileInput-dropZone","isDragging":"bds220FileInput-isDragging","hasError":"bds220FileInput-hasError","isDisabled":"bds220FileInput-isDisabled","icon":"bds220FileInput-icon","prompt":"bds220FileInput-prompt","acceptHint":"bds220FileInput-acceptHint","hiddenInput":"bds220FileInput-hiddenInput"};
|
|
2133
2136
|
|
|
2134
2137
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
2135
2138
|
var import_design_system_foundation37 = require("@boostdev/design-system-foundation");
|
|
@@ -2230,7 +2233,7 @@ function FileInput({
|
|
|
2230
2233
|
var import_react16 = require("react");
|
|
2231
2234
|
|
|
2232
2235
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
2233
|
-
var FormInput_default = {"component":"
|
|
2236
|
+
var FormInput_default = {"component":"bds220FormInput-component","formGroup":"bds220FormInput-formGroup","input":"bds220FormInput-input","inputError":"bds220FormInput-inputError"};
|
|
2234
2237
|
|
|
2235
2238
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
2236
2239
|
var import_design_system_foundation38 = require("@boostdev/design-system-foundation");
|
|
@@ -2274,7 +2277,7 @@ function FormInput({
|
|
|
2274
2277
|
var import_react17 = require("react");
|
|
2275
2278
|
|
|
2276
2279
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
2277
|
-
var NumberInput_default = {"component":"
|
|
2280
|
+
var NumberInput_default = {"component":"bds220NumberInput-component","formGroup":"bds220NumberInput-formGroup","inputRow":"bds220NumberInput-inputRow","input":"bds220NumberInput-input","inputError":"bds220NumberInput-inputError","stepper":"bds220NumberInput-stepper"};
|
|
2278
2281
|
|
|
2279
2282
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
2280
2283
|
var import_design_system_foundation39 = require("@boostdev/design-system-foundation");
|
|
@@ -2379,7 +2382,7 @@ function NumberInput({
|
|
|
2379
2382
|
var import_react18 = require("react");
|
|
2380
2383
|
|
|
2381
2384
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
2382
|
-
var Radio_default = {"component":"
|
|
2385
|
+
var Radio_default = {"component":"bds220Radio-component","radioGroup":"bds220Radio-radioGroup","inputWrapper":"bds220Radio-inputWrapper","textWrapper":"bds220Radio-textWrapper","description":"bds220Radio-description","radio":"bds220Radio-radio","radioError":"bds220Radio-radioError"};
|
|
2383
2386
|
|
|
2384
2387
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
2385
2388
|
var import_design_system_foundation40 = require("@boostdev/design-system-foundation");
|
|
@@ -2417,7 +2420,7 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
2417
2420
|
var import_react19 = require("react");
|
|
2418
2421
|
|
|
2419
2422
|
// src/components/interaction/form/RadioGroup/RadioGroup.module.css
|
|
2420
|
-
var RadioGroup_default = {"component":"
|
|
2423
|
+
var RadioGroup_default = {"component":"bds220RadioGroup-component","group":"bds220RadioGroup-group","legend":"bds220RadioGroup-legend","required":"bds220RadioGroup-required","items":"bds220RadioGroup-items"};
|
|
2421
2424
|
|
|
2422
2425
|
// src/components/interaction/form/RadioGroup/RadioGroup.tsx
|
|
2423
2426
|
var import_design_system_foundation41 = require("@boostdev/design-system-foundation");
|
|
@@ -2459,7 +2462,7 @@ function RadioGroup({
|
|
|
2459
2462
|
var import_react20 = require("react");
|
|
2460
2463
|
|
|
2461
2464
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.module.css
|
|
2462
|
-
var SegmentedControl_default = {"component":"
|
|
2465
|
+
var SegmentedControl_default = {"component":"bds220SegmentedControl-component","control":"bds220SegmentedControl-control","thumb":"bds220SegmentedControl-thumb","indicator":"bds220SegmentedControl-indicator","item":"bds220SegmentedControl-item","--active":"bds220SegmentedControl---active","--disabled":"bds220SegmentedControl---disabled","--size_small":"bds220SegmentedControl---size_small","--size_large":"bds220SegmentedControl---size_large","--variant_outline":"bds220SegmentedControl---variant_outline"};
|
|
2463
2466
|
|
|
2464
2467
|
// src/components/interaction/form/SegmentedControl/SegmentedControl.tsx
|
|
2465
2468
|
var import_design_system_foundation42 = require("@boostdev/design-system-foundation");
|
|
@@ -2515,7 +2518,7 @@ function SegmentedControl({
|
|
|
2515
2518
|
var import_react21 = require("react");
|
|
2516
2519
|
|
|
2517
2520
|
// src/components/interaction/form/Select/Select.module.css
|
|
2518
|
-
var Select_default = {"component":"
|
|
2521
|
+
var Select_default = {"component":"bds220Select-component","formGroup":"bds220Select-formGroup","selectWrapper":"bds220Select-selectWrapper","select":"bds220Select-select","selectError":"bds220Select-selectError","chevron":"bds220Select-chevron"};
|
|
2519
2522
|
|
|
2520
2523
|
// src/components/interaction/form/Select/Select.tsx
|
|
2521
2524
|
var import_design_system_foundation43 = require("@boostdev/design-system-foundation");
|
|
@@ -2566,7 +2569,7 @@ function Select({
|
|
|
2566
2569
|
var import_react22 = require("react");
|
|
2567
2570
|
|
|
2568
2571
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2569
|
-
var Slider_default = {"component":"
|
|
2572
|
+
var Slider_default = {"component":"bds220Slider-component","formGroup":"bds220Slider-formGroup","labelRow":"bds220Slider-labelRow","value":"bds220Slider-value","slider":"bds220Slider-slider","sliderError":"bds220Slider-sliderError"};
|
|
2570
2573
|
|
|
2571
2574
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2572
2575
|
var import_design_system_foundation44 = require("@boostdev/design-system-foundation");
|
|
@@ -2628,7 +2631,7 @@ function Slider({
|
|
|
2628
2631
|
var import_react23 = require("react");
|
|
2629
2632
|
|
|
2630
2633
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2631
|
-
var Switch_default = {"component":"
|
|
2634
|
+
var Switch_default = {"component":"bds220Switch-component","switchGroup":"bds220Switch-switchGroup","--size_small":"bds220Switch---size_small","--size_medium":"bds220Switch---size_medium","--size_large":"bds220Switch---size_large","inputWrapper":"bds220Switch-inputWrapper","trackWrapper":"bds220Switch-trackWrapper","switch":"bds220Switch-switch","track":"bds220Switch-track","thumb":"bds220Switch-thumb","switchError":"bds220Switch-switchError"};
|
|
2632
2635
|
|
|
2633
2636
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2634
2637
|
var import_design_system_foundation45 = require("@boostdev/design-system-foundation");
|
|
@@ -2676,7 +2679,7 @@ function Switch({
|
|
|
2676
2679
|
var import_react24 = require("react");
|
|
2677
2680
|
|
|
2678
2681
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2679
|
-
var Textarea_default = {"component":"
|
|
2682
|
+
var Textarea_default = {"component":"bds220Textarea-component","formGroup":"bds220Textarea-formGroup","textarea":"bds220Textarea-textarea","textareaError":"bds220Textarea-textareaError"};
|
|
2680
2683
|
|
|
2681
2684
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2682
2685
|
var import_design_system_foundation46 = require("@boostdev/design-system-foundation");
|
|
@@ -2715,7 +2718,7 @@ function Textarea({
|
|
|
2715
2718
|
}
|
|
2716
2719
|
|
|
2717
2720
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2718
|
-
var ButtonGroup_default = {"component":"
|
|
2721
|
+
var ButtonGroup_default = {"component":"bds220ButtonGroup-component","buttonGroup":"bds220ButtonGroup-buttonGroup","container":"bds220ButtonGroup-container","--variant_card":"bds220ButtonGroup---variant_card","--variant_flow":"bds220ButtonGroup---variant_flow","--variant_modal":"bds220ButtonGroup---variant_modal","--variant_content":"bds220ButtonGroup---variant_content","--variant_grid":"bds220ButtonGroup---variant_grid"};
|
|
2719
2722
|
|
|
2720
2723
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2721
2724
|
var import_design_system_foundation47 = require("@boostdev/design-system-foundation");
|
|
@@ -2734,7 +2737,7 @@ function ButtonContainer({ children, className, variant, ...rest }) {
|
|
|
2734
2737
|
var ButtonGroup = ButtonContainer;
|
|
2735
2738
|
|
|
2736
2739
|
// src/components/layout/Card/Card.module.css
|
|
2737
|
-
var Card_default = {"component":"
|
|
2740
|
+
var Card_default = {"component":"bds220Card-component","card":"bds220Card-card","--default":"bds220Card---default","--elevated":"bds220Card---elevated","--outlined":"bds220Card---outlined","--clickable":"bds220Card---clickable","--padding-none":"bds220Card---padding-none","--padding-small":"bds220Card---padding-small","--padding-medium":"bds220Card---padding-medium","--padding-large":"bds220Card---padding-large","--padding-extra-large":"bds220Card---padding-extra-large","--text-start":"bds220Card---text-start","--text-center":"bds220Card---text-center","--text-end":"bds220Card---text-end"};
|
|
2738
2741
|
|
|
2739
2742
|
// src/components/layout/Card/Card.tsx
|
|
2740
2743
|
var import_design_system_foundation48 = require("@boostdev/design-system-foundation");
|
|
@@ -2770,12 +2773,249 @@ function Card({
|
|
|
2770
2773
|
);
|
|
2771
2774
|
}
|
|
2772
2775
|
|
|
2773
|
-
// src/components/layout/
|
|
2774
|
-
var
|
|
2776
|
+
// src/components/layout/Grid/Grid.tsx
|
|
2777
|
+
var import_react26 = require("react");
|
|
2775
2778
|
|
|
2776
|
-
// src/components/layout/
|
|
2779
|
+
// src/components/layout/Grid/Grid.module.css
|
|
2780
|
+
var Grid_default = {"component":"bds220Grid-component","grid":"bds220Grid-grid","--main":"bds220Grid---main","--page":"bds220Grid---page","--funnel":"bds220Grid---funnel","--custom":"bds220Grid---custom","--centered":"bds220Grid---centered","item":"bds220Grid-item","w3":"bds220Grid-w3","org":"bds220Grid-org","ts":"bds220Grid-ts","--masonry":"bds220Grid---masonry"};
|
|
2781
|
+
|
|
2782
|
+
// src/components/layout/Grid/Grid.tsx
|
|
2777
2783
|
var import_design_system_foundation49 = require("@boostdev/design-system-foundation");
|
|
2784
|
+
|
|
2785
|
+
// src/components/layout/Grid/masonry.ts
|
|
2786
|
+
var import_react25 = require("react");
|
|
2787
|
+
var ROW_UNIT_PX = 1;
|
|
2788
|
+
function supportsNativeMasonry() {
|
|
2789
|
+
if (typeof CSS === "undefined" || typeof CSS.supports !== "function") return false;
|
|
2790
|
+
return CSS.supports("display", "grid-lanes") || CSS.supports("grid-template-rows", "masonry");
|
|
2791
|
+
}
|
|
2792
|
+
function applyMasonryLayout(container, rawChildren) {
|
|
2793
|
+
const cs = window.getComputedStyle(container);
|
|
2794
|
+
const targetGap = parseFloat(cs.columnGap) || 0;
|
|
2795
|
+
container.style.gridAutoRows = `${ROW_UNIT_PX}px`;
|
|
2796
|
+
container.style.rowGap = "0px";
|
|
2797
|
+
container.style.gridAutoFlow = "dense";
|
|
2798
|
+
const children = rawChildren.filter(
|
|
2799
|
+
(el) => el.nodeType === 1 && window.getComputedStyle(el).display !== "none"
|
|
2800
|
+
);
|
|
2801
|
+
for (const child of children) {
|
|
2802
|
+
child.style.gridRow = "";
|
|
2803
|
+
child.style.gridRowStart = "";
|
|
2804
|
+
child.style.gridRowEnd = "";
|
|
2805
|
+
}
|
|
2806
|
+
const heights = children.map((child) => child.offsetHeight);
|
|
2807
|
+
for (let i = 0; i < children.length; i++) {
|
|
2808
|
+
const span = Math.max(1, Math.ceil(heights[i] + targetGap));
|
|
2809
|
+
children[i].style.gridRowEnd = `span ${span}`;
|
|
2810
|
+
}
|
|
2811
|
+
}
|
|
2812
|
+
function clearMasonryLayout(container, rawChildren) {
|
|
2813
|
+
container.style.gridAutoRows = "";
|
|
2814
|
+
container.style.gridAutoFlow = "";
|
|
2815
|
+
container.style.rowGap = "";
|
|
2816
|
+
for (const child of rawChildren) {
|
|
2817
|
+
if (child.nodeType !== 1) continue;
|
|
2818
|
+
child.style.gridRow = "";
|
|
2819
|
+
child.style.gridRowStart = "";
|
|
2820
|
+
child.style.gridRowEnd = "";
|
|
2821
|
+
}
|
|
2822
|
+
}
|
|
2823
|
+
function useMasonry(ref, enabled) {
|
|
2824
|
+
(0, import_react25.useLayoutEffect)(() => {
|
|
2825
|
+
const container = ref.current;
|
|
2826
|
+
if (!container || !enabled) return;
|
|
2827
|
+
if (supportsNativeMasonry()) return;
|
|
2828
|
+
let frame = 0;
|
|
2829
|
+
const schedule = () => {
|
|
2830
|
+
cancelAnimationFrame(frame);
|
|
2831
|
+
frame = requestAnimationFrame(() => {
|
|
2832
|
+
applyMasonryLayout(container, Array.from(container.children));
|
|
2833
|
+
});
|
|
2834
|
+
};
|
|
2835
|
+
schedule();
|
|
2836
|
+
const ro = typeof ResizeObserver !== "undefined" ? new ResizeObserver(schedule) : null;
|
|
2837
|
+
if (ro) {
|
|
2838
|
+
for (const child of Array.from(container.children)) ro.observe(child);
|
|
2839
|
+
}
|
|
2840
|
+
const mo = typeof MutationObserver !== "undefined" ? new MutationObserver(() => {
|
|
2841
|
+
if (ro) for (const child of Array.from(container.children)) ro.observe(child);
|
|
2842
|
+
schedule();
|
|
2843
|
+
}) : null;
|
|
2844
|
+
mo?.observe(container, { childList: true });
|
|
2845
|
+
return () => {
|
|
2846
|
+
cancelAnimationFrame(frame);
|
|
2847
|
+
ro?.disconnect();
|
|
2848
|
+
mo?.disconnect();
|
|
2849
|
+
clearMasonryLayout(container, Array.from(container.children));
|
|
2850
|
+
};
|
|
2851
|
+
}, [ref, enabled]);
|
|
2852
|
+
}
|
|
2853
|
+
|
|
2854
|
+
// src/components/layout/Grid/Grid.tsx
|
|
2778
2855
|
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
2856
|
+
var GridContext = (0, import_react26.createContext)({
|
|
2857
|
+
autoSpanMedia: false
|
|
2858
|
+
});
|
|
2859
|
+
function Grid({
|
|
2860
|
+
children,
|
|
2861
|
+
className,
|
|
2862
|
+
variant = "main",
|
|
2863
|
+
columns,
|
|
2864
|
+
isCentered = false,
|
|
2865
|
+
isMasonry = false,
|
|
2866
|
+
autoSpanMedia = false,
|
|
2867
|
+
as,
|
|
2868
|
+
style,
|
|
2869
|
+
...rest
|
|
2870
|
+
}) {
|
|
2871
|
+
const ref = (0, import_react26.useRef)(null);
|
|
2872
|
+
useMasonry(ref, isMasonry);
|
|
2873
|
+
const classNames = (0, import_design_system_foundation49.cn)(
|
|
2874
|
+
Grid_default.grid,
|
|
2875
|
+
Grid_default[`--${variant}`],
|
|
2876
|
+
isCentered && Grid_default["--centered"],
|
|
2877
|
+
isMasonry && Grid_default["--masonry"],
|
|
2878
|
+
className
|
|
2879
|
+
);
|
|
2880
|
+
const composedStyle = variant === "custom" && columns !== void 0 ? { ...style, ["--grid_columns"]: columns } : style;
|
|
2881
|
+
const Component = as ?? "div";
|
|
2882
|
+
const ctx = (0, import_react26.useMemo)(() => ({ autoSpanMedia }), [autoSpanMedia]);
|
|
2883
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Component, { ref, ...rest, className: classNames, style: composedStyle, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(GridContext.Provider, { value: ctx, children }) });
|
|
2884
|
+
}
|
|
2885
|
+
|
|
2886
|
+
// src/components/layout/Grid/GridItem.tsx
|
|
2887
|
+
var import_react27 = require("react");
|
|
2888
|
+
var import_design_system_foundation50 = require("@boostdev/design-system-foundation");
|
|
2889
|
+
|
|
2890
|
+
// src/components/layout/Grid/autoSpan.ts
|
|
2891
|
+
function aspectToColumnSpan(ratio) {
|
|
2892
|
+
if (!Number.isFinite(ratio) || ratio <= 0) return "one-quarter";
|
|
2893
|
+
if (ratio > 3.5) return "full";
|
|
2894
|
+
if (ratio > 2.2) return "three-quarters";
|
|
2895
|
+
if (ratio > 1.5) return "half";
|
|
2896
|
+
return "one-quarter";
|
|
2897
|
+
}
|
|
2898
|
+
function findMediaChild(root) {
|
|
2899
|
+
return root.querySelector("img, video");
|
|
2900
|
+
}
|
|
2901
|
+
function readMediaAspect(media) {
|
|
2902
|
+
if (media instanceof HTMLImageElement) {
|
|
2903
|
+
if (media.naturalWidth > 0 && media.naturalHeight > 0) {
|
|
2904
|
+
return media.naturalWidth / media.naturalHeight;
|
|
2905
|
+
}
|
|
2906
|
+
return null;
|
|
2907
|
+
}
|
|
2908
|
+
if (media.videoWidth > 0 && media.videoHeight > 0) {
|
|
2909
|
+
return media.videoWidth / media.videoHeight;
|
|
2910
|
+
}
|
|
2911
|
+
return null;
|
|
2912
|
+
}
|
|
2913
|
+
function mediaReadyEvent(media) {
|
|
2914
|
+
if (media instanceof HTMLImageElement) return media.complete ? null : "load";
|
|
2915
|
+
if (media.readyState < 1) return "loadedmetadata";
|
|
2916
|
+
return null;
|
|
2917
|
+
}
|
|
2918
|
+
|
|
2919
|
+
// src/components/layout/Grid/GridItem.tsx
|
|
2920
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
2921
|
+
var GridItemSpan = {
|
|
2922
|
+
full: "full",
|
|
2923
|
+
threeQuarters: "three-quarters",
|
|
2924
|
+
twoThirds: "two-thirds",
|
|
2925
|
+
half: "half",
|
|
2926
|
+
oneThird: "one-third",
|
|
2927
|
+
oneQuarter: "one-quarter",
|
|
2928
|
+
auto: "auto"
|
|
2929
|
+
};
|
|
2930
|
+
var SPAN_VAR = {
|
|
2931
|
+
full: "var(--bds-grid_span-100)",
|
|
2932
|
+
"three-quarters": "span var(--bds-grid_columns-75)",
|
|
2933
|
+
"two-thirds": "span var(--bds-grid_columns-66)",
|
|
2934
|
+
half: "span var(--bds-grid_columns-50)",
|
|
2935
|
+
"one-third": "span var(--bds-grid_columns-33)",
|
|
2936
|
+
"one-quarter": "span var(--bds-grid_columns-25)"
|
|
2937
|
+
};
|
|
2938
|
+
function resolveSpan(value) {
|
|
2939
|
+
if (typeof value === "number") return `span ${value}`;
|
|
2940
|
+
return SPAN_VAR[value];
|
|
2941
|
+
}
|
|
2942
|
+
function GridItem({
|
|
2943
|
+
children,
|
|
2944
|
+
className,
|
|
2945
|
+
columnSpan,
|
|
2946
|
+
rowSpan,
|
|
2947
|
+
startColumn,
|
|
2948
|
+
endColumn,
|
|
2949
|
+
as,
|
|
2950
|
+
style,
|
|
2951
|
+
...rest
|
|
2952
|
+
}) {
|
|
2953
|
+
const { autoSpanMedia } = (0, import_react27.useContext)(GridContext);
|
|
2954
|
+
const effectiveSpan = columnSpan ?? (autoSpanMedia ? "auto" : "full");
|
|
2955
|
+
const ref = (0, import_react27.useRef)(null);
|
|
2956
|
+
const [autoSpan, setAutoSpan] = (0, import_react27.useState)("one-quarter");
|
|
2957
|
+
(0, import_react27.useLayoutEffect)(() => {
|
|
2958
|
+
if (effectiveSpan !== "auto") return;
|
|
2959
|
+
const el = ref.current;
|
|
2960
|
+
if (!el) return;
|
|
2961
|
+
let cancelled = false;
|
|
2962
|
+
let cleanup;
|
|
2963
|
+
const resolve = () => {
|
|
2964
|
+
if (cancelled) return;
|
|
2965
|
+
const media = findMediaChild(el);
|
|
2966
|
+
if (!media) {
|
|
2967
|
+
setAutoSpan("one-quarter");
|
|
2968
|
+
return;
|
|
2969
|
+
}
|
|
2970
|
+
const aspect = readMediaAspect(media);
|
|
2971
|
+
if (aspect !== null) {
|
|
2972
|
+
setAutoSpan(aspectToColumnSpan(aspect));
|
|
2973
|
+
return;
|
|
2974
|
+
}
|
|
2975
|
+
const event = mediaReadyEvent(media);
|
|
2976
|
+
if (!event) {
|
|
2977
|
+
setAutoSpan("one-quarter");
|
|
2978
|
+
return;
|
|
2979
|
+
}
|
|
2980
|
+
const handler = () => {
|
|
2981
|
+
const a = readMediaAspect(media);
|
|
2982
|
+
if (a !== null) setAutoSpan(aspectToColumnSpan(a));
|
|
2983
|
+
};
|
|
2984
|
+
media.addEventListener(event, handler, { once: true });
|
|
2985
|
+
cleanup = () => media.removeEventListener(event, handler);
|
|
2986
|
+
};
|
|
2987
|
+
resolve();
|
|
2988
|
+
return () => {
|
|
2989
|
+
cancelled = true;
|
|
2990
|
+
cleanup?.();
|
|
2991
|
+
};
|
|
2992
|
+
}, [effectiveSpan, children]);
|
|
2993
|
+
const hasExplicitRange = startColumn !== void 0 || endColumn !== void 0;
|
|
2994
|
+
const gridColumn = hasExplicitRange ? `${startColumn ?? "auto"} / ${endColumn ?? "auto"}` : resolveSpan(effectiveSpan === "auto" ? autoSpan : effectiveSpan);
|
|
2995
|
+
const composedStyle = {
|
|
2996
|
+
...style,
|
|
2997
|
+
gridColumn,
|
|
2998
|
+
...rowSpan !== void 0 ? { gridRow: `span ${rowSpan}` } : {}
|
|
2999
|
+
};
|
|
3000
|
+
const Component = as ?? "div";
|
|
3001
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
3002
|
+
Component,
|
|
3003
|
+
{
|
|
3004
|
+
ref,
|
|
3005
|
+
...rest,
|
|
3006
|
+
className: (0, import_design_system_foundation50.cn)(Grid_default.item, className),
|
|
3007
|
+
style: composedStyle,
|
|
3008
|
+
children
|
|
3009
|
+
}
|
|
3010
|
+
);
|
|
3011
|
+
}
|
|
3012
|
+
|
|
3013
|
+
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
3014
|
+
var SectionHeader_default = {"component":"bds220SectionHeader-component","sectionHeader":"bds220SectionHeader-sectionHeader","title":"bds220SectionHeader-title","subtitle":"bds220SectionHeader-subtitle","--start":"bds220SectionHeader---start","--center":"bds220SectionHeader---center","--end":"bds220SectionHeader---end","--medium":"bds220SectionHeader---medium","--xs":"bds220SectionHeader---xs","--small":"bds220SectionHeader---small","--large":"bds220SectionHeader---large"};
|
|
3015
|
+
|
|
3016
|
+
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
3017
|
+
var import_design_system_foundation51 = require("@boostdev/design-system-foundation");
|
|
3018
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
2779
3019
|
function SectionHeader({
|
|
2780
3020
|
title,
|
|
2781
3021
|
subtitle,
|
|
@@ -2786,24 +3026,24 @@ function SectionHeader({
|
|
|
2786
3026
|
...rest
|
|
2787
3027
|
}) {
|
|
2788
3028
|
const Title = titleAs;
|
|
2789
|
-
return /* @__PURE__ */ (0,
|
|
2790
|
-
/* @__PURE__ */ (0,
|
|
2791
|
-
subtitle && /* @__PURE__ */ (0,
|
|
3029
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { ...rest, className: (0, import_design_system_foundation51.cn)(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
3030
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Title, { className: SectionHeader_default.title, children: title }),
|
|
3031
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
2792
3032
|
] });
|
|
2793
3033
|
}
|
|
2794
3034
|
|
|
2795
3035
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2796
|
-
var IconWrapper_default = {"component":"
|
|
3036
|
+
var IconWrapper_default = {"component":"bds220IconWrapper-component","wrapper":"bds220IconWrapper-wrapper"};
|
|
2797
3037
|
|
|
2798
3038
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2799
|
-
var
|
|
2800
|
-
var
|
|
3039
|
+
var import_design_system_foundation52 = require("@boostdev/design-system-foundation");
|
|
3040
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
2801
3041
|
function IconWrapper({ children, className, ...rest }) {
|
|
2802
|
-
return /* @__PURE__ */ (0,
|
|
3042
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { ...rest, className: (0, import_design_system_foundation52.cn)(className, IconWrapper_default.wrapper), children });
|
|
2803
3043
|
}
|
|
2804
3044
|
|
|
2805
3045
|
// src/index.ts
|
|
2806
|
-
var
|
|
3046
|
+
var import_design_system_foundation53 = require("@boostdev/design-system-foundation");
|
|
2807
3047
|
// Annotate the CommonJS export names for ESM import in node:
|
|
2808
3048
|
0 && (module.exports = {
|
|
2809
3049
|
Accordion,
|
|
@@ -2828,6 +3068,9 @@ var import_design_system_foundation51 = require("@boostdev/design-system-foundat
|
|
|
2828
3068
|
DropdownMenu,
|
|
2829
3069
|
FileInput,
|
|
2830
3070
|
FormInput,
|
|
3071
|
+
Grid,
|
|
3072
|
+
GridItem,
|
|
3073
|
+
GridItemSpan,
|
|
2831
3074
|
IconWrapper,
|
|
2832
3075
|
Link,
|
|
2833
3076
|
Loading,
|