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