@boostdev/design-system-components 0.1.14 → 0.1.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client.cjs +401 -361
- package/dist/client.css +480 -415
- package/dist/client.d.cts +22 -2
- package/dist/client.d.ts +22 -2
- package/dist/client.js +400 -361
- package/dist/index.cjs +401 -361
- package/dist/index.css +480 -415
- package/dist/index.d.cts +22 -2
- package/dist/index.d.ts +22 -2
- package/dist/index.js +400 -361
- package/package.json +1 -1
- package/src/components/ui/Collapsible/Collapsible.mdx +59 -0
- package/src/components/ui/Collapsible/Collapsible.module.css +76 -0
- package/src/components/ui/Collapsible/Collapsible.spec.tsx +75 -0
- package/src/components/ui/Collapsible/Collapsible.stories.tsx +57 -0
- package/src/components/ui/Collapsible/Collapsible.tsx +55 -0
- package/src/components/ui/Collapsible/index.ts +2 -0
- package/src/index.ts +2 -0
- package/src/stories/Introduction.mdx +2 -2
package/dist/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { useId, useState } from "react";
|
|
3
3
|
|
|
4
4
|
// src/components/ui/Accordion/Accordion.module.css
|
|
5
|
-
var Accordion_default = {"accordion":"
|
|
5
|
+
var Accordion_default = {"accordion":"bds0115Accordion-accordion","item":"bds0115Accordion-item","heading":"bds0115Accordion-heading","trigger":"bds0115Accordion-trigger","triggerLabel":"bds0115Accordion-triggerLabel","chevron":"bds0115Accordion-chevron","--open":"bds0115Accordion---open","panel":"bds0115Accordion-panel","panelContent":"bds0115Accordion-panelContent"};
|
|
6
6
|
|
|
7
7
|
// src/components/ui/Accordion/Accordion.tsx
|
|
8
8
|
import { cn } from "@boostdev/design-system-foundation";
|
|
@@ -70,7 +70,7 @@ function Accordion({
|
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
// src/components/ui/Alert/Alert.module.css
|
|
73
|
-
var Alert_default = {"alert":"
|
|
73
|
+
var Alert_default = {"alert":"bds0115Alert-alert","--variant_info":"bds0115Alert---variant_info","--variant_success":"bds0115Alert---variant_success","--variant_warning":"bds0115Alert---variant_warning","--variant_error":"bds0115Alert---variant_error","icon":"bds0115Alert-icon","content":"bds0115Alert-content","title":"bds0115Alert-title","dismiss":"bds0115Alert-dismiss"};
|
|
74
74
|
|
|
75
75
|
// src/components/ui/Alert/Alert.tsx
|
|
76
76
|
import { cn as cn2 } from "@boostdev/design-system-foundation";
|
|
@@ -113,7 +113,7 @@ function Alert({
|
|
|
113
113
|
}
|
|
114
114
|
|
|
115
115
|
// src/components/ui/Avatar/Avatar.module.css
|
|
116
|
-
var Avatar_default = {"avatar":"
|
|
116
|
+
var Avatar_default = {"avatar":"bds0115Avatar-avatar","--fallback":"bds0115Avatar---fallback","--size_small":"bds0115Avatar---size_small","--size_medium":"bds0115Avatar---size_medium","--size_large":"bds0115Avatar---size_large","image":"bds0115Avatar-image","initials":"bds0115Avatar-initials"};
|
|
117
117
|
|
|
118
118
|
// src/components/ui/Avatar/Avatar.tsx
|
|
119
119
|
import { cn as cn3 } from "@boostdev/design-system-foundation";
|
|
@@ -139,7 +139,7 @@ function Avatar({ src, alt, name, size = "medium", className }) {
|
|
|
139
139
|
}
|
|
140
140
|
|
|
141
141
|
// src/components/ui/Badge/Badge.module.css
|
|
142
|
-
var Badge_default = {"badge":"
|
|
142
|
+
var Badge_default = {"badge":"bds0115Badge-badge","--variant_primary":"bds0115Badge---variant_primary","--variant_secondary":"bds0115Badge---variant_secondary","--variant_success":"bds0115Badge---variant_success","--variant_error":"bds0115Badge---variant_error","--variant_warning":"bds0115Badge---variant_warning"};
|
|
143
143
|
|
|
144
144
|
// src/components/ui/Badge/Badge.tsx
|
|
145
145
|
import { cn as cn4 } from "@boostdev/design-system-foundation";
|
|
@@ -149,7 +149,7 @@ function Badge({ children, variant = "primary", className }) {
|
|
|
149
149
|
}
|
|
150
150
|
|
|
151
151
|
// src/components/ui/Breadcrumb/Breadcrumb.module.css
|
|
152
|
-
var Breadcrumb_default = {"breadcrumb":"
|
|
152
|
+
var Breadcrumb_default = {"breadcrumb":"bds0115Breadcrumb-breadcrumb","list":"bds0115Breadcrumb-list","item":"bds0115Breadcrumb-item","link":"bds0115Breadcrumb-link","separator":"bds0115Breadcrumb-separator","current":"bds0115Breadcrumb-current"};
|
|
153
153
|
|
|
154
154
|
// src/components/ui/Breadcrumb/Breadcrumb.tsx
|
|
155
155
|
import { cn as cn5 } from "@boostdev/design-system-foundation";
|
|
@@ -164,15 +164,53 @@ function Breadcrumb({ items, className }) {
|
|
|
164
164
|
}) }) });
|
|
165
165
|
}
|
|
166
166
|
|
|
167
|
+
// src/components/ui/Collapsible/Collapsible.module.css
|
|
168
|
+
var Collapsible_default = {"collapsible":"bds0115Collapsible-collapsible","summary":"bds0115Collapsible-summary","summaryContent":"bds0115Collapsible-summaryContent","icon":"bds0115Collapsible-icon","content":"bds0115Collapsible-content"};
|
|
169
|
+
|
|
170
|
+
// src/components/ui/Collapsible/Collapsible.tsx
|
|
171
|
+
import { cn as cn6 } from "@boostdev/design-system-foundation";
|
|
172
|
+
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
173
|
+
function Collapsible({
|
|
174
|
+
summary,
|
|
175
|
+
children,
|
|
176
|
+
open,
|
|
177
|
+
defaultOpen,
|
|
178
|
+
onToggle,
|
|
179
|
+
name,
|
|
180
|
+
className,
|
|
181
|
+
...rest
|
|
182
|
+
}) {
|
|
183
|
+
const handleToggle = (e) => {
|
|
184
|
+
onToggle?.(e.currentTarget.open);
|
|
185
|
+
};
|
|
186
|
+
return /* @__PURE__ */ jsxs4(
|
|
187
|
+
"details",
|
|
188
|
+
{
|
|
189
|
+
className: cn6(Collapsible_default.collapsible, className),
|
|
190
|
+
open: open ?? defaultOpen,
|
|
191
|
+
name,
|
|
192
|
+
onToggle: handleToggle,
|
|
193
|
+
...rest,
|
|
194
|
+
children: [
|
|
195
|
+
/* @__PURE__ */ jsxs4("summary", { className: Collapsible_default.summary, children: [
|
|
196
|
+
/* @__PURE__ */ jsx6("span", { className: Collapsible_default.summaryContent, children: summary }),
|
|
197
|
+
/* @__PURE__ */ jsx6("span", { className: Collapsible_default.icon, "aria-hidden": "true" })
|
|
198
|
+
] }),
|
|
199
|
+
/* @__PURE__ */ jsx6("div", { className: Collapsible_default.content, children })
|
|
200
|
+
]
|
|
201
|
+
}
|
|
202
|
+
);
|
|
203
|
+
}
|
|
204
|
+
|
|
167
205
|
// src/components/ui/Calendar/Calendar.tsx
|
|
168
206
|
import { useState as useState2, useId as useId2 } from "react";
|
|
169
207
|
|
|
170
208
|
// src/components/ui/Calendar/Calendar.module.css
|
|
171
|
-
var Calendar_default = {"calendar":"
|
|
209
|
+
var Calendar_default = {"calendar":"bds0115Calendar-calendar","header":"bds0115Calendar-header","monthYear":"bds0115Calendar-monthYear","navBtn":"bds0115Calendar-navBtn","grid":"bds0115Calendar-grid","weekday":"bds0115Calendar-weekday","empty":"bds0115Calendar-empty","day":"bds0115Calendar-day","disabled":"bds0115Calendar-disabled","selected":"bds0115Calendar-selected","today":"bds0115Calendar-today"};
|
|
172
210
|
|
|
173
211
|
// src/components/ui/Calendar/Calendar.tsx
|
|
174
|
-
import { cn as
|
|
175
|
-
import { jsx as
|
|
212
|
+
import { cn as cn7 } from "@boostdev/design-system-foundation";
|
|
213
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
176
214
|
var DAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
|
|
177
215
|
var MONTHS = [
|
|
178
216
|
"January",
|
|
@@ -259,54 +297,54 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
259
297
|
...Array.from({ length: daysInMonth }, (_, i) => ({ day: i + 1 }))
|
|
260
298
|
];
|
|
261
299
|
while (cells.length % 7 !== 0) cells.push(null);
|
|
262
|
-
return /* @__PURE__ */
|
|
263
|
-
/* @__PURE__ */
|
|
264
|
-
/* @__PURE__ */
|
|
300
|
+
return /* @__PURE__ */ jsxs5("div", { className: cn7(Calendar_default.calendar, className), role: "group", "aria-labelledby": titleId, children: [
|
|
301
|
+
/* @__PURE__ */ jsxs5("div", { className: Calendar_default.header, children: [
|
|
302
|
+
/* @__PURE__ */ jsx7(
|
|
265
303
|
"button",
|
|
266
304
|
{
|
|
267
305
|
type: "button",
|
|
268
306
|
className: Calendar_default.navBtn,
|
|
269
307
|
"aria-label": "Previous month",
|
|
270
308
|
onClick: () => navigate(-1),
|
|
271
|
-
children: /* @__PURE__ */
|
|
309
|
+
children: /* @__PURE__ */ jsx7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx7("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19l-7-7 7-7" }) })
|
|
272
310
|
}
|
|
273
311
|
),
|
|
274
|
-
/* @__PURE__ */
|
|
312
|
+
/* @__PURE__ */ jsxs5("span", { id: titleId, className: Calendar_default.monthYear, "aria-live": "polite", children: [
|
|
275
313
|
MONTHS[viewMonth],
|
|
276
314
|
" ",
|
|
277
315
|
viewYear
|
|
278
316
|
] }),
|
|
279
|
-
/* @__PURE__ */
|
|
317
|
+
/* @__PURE__ */ jsx7(
|
|
280
318
|
"button",
|
|
281
319
|
{
|
|
282
320
|
type: "button",
|
|
283
321
|
className: Calendar_default.navBtn,
|
|
284
322
|
"aria-label": "Next month",
|
|
285
323
|
onClick: () => navigate(1),
|
|
286
|
-
children: /* @__PURE__ */
|
|
324
|
+
children: /* @__PURE__ */ jsx7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx7("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) })
|
|
287
325
|
}
|
|
288
326
|
)
|
|
289
327
|
] }),
|
|
290
|
-
/* @__PURE__ */
|
|
328
|
+
/* @__PURE__ */ jsxs5(
|
|
291
329
|
"table",
|
|
292
330
|
{
|
|
293
331
|
className: Calendar_default.grid,
|
|
294
332
|
role: "grid",
|
|
295
333
|
"aria-labelledby": titleId,
|
|
296
334
|
children: [
|
|
297
|
-
/* @__PURE__ */
|
|
298
|
-
/* @__PURE__ */
|
|
299
|
-
if (!cell) return /* @__PURE__ */
|
|
335
|
+
/* @__PURE__ */ jsx7("thead", { children: /* @__PURE__ */ jsx7("tr", { children: DAYS.map((d) => /* @__PURE__ */ jsx7("th", { scope: "col", abbr: d, className: Calendar_default.weekday, children: d }, d)) }) }),
|
|
336
|
+
/* @__PURE__ */ jsx7("tbody", { children: Array.from({ length: cells.length / 7 }, (_, row) => /* @__PURE__ */ jsx7("tr", { children: cells.slice(row * 7, row * 7 + 7).map((cell, col) => {
|
|
337
|
+
if (!cell) return /* @__PURE__ */ jsx7("td", { className: Calendar_default.empty, "aria-hidden": "true" }, col);
|
|
300
338
|
const date = new Date(viewYear, viewMonth, cell.day);
|
|
301
339
|
const isSelected = selected ? isSameDay(date, selected) : false;
|
|
302
340
|
const isToday = isSameDay(date, today);
|
|
303
341
|
const disabled = isOutOfRange(date, min, max);
|
|
304
342
|
const isFocused = focusedDay === cell.day;
|
|
305
|
-
return /* @__PURE__ */
|
|
343
|
+
return /* @__PURE__ */ jsx7("td", { role: "gridcell", children: /* @__PURE__ */ jsx7(
|
|
306
344
|
"button",
|
|
307
345
|
{
|
|
308
346
|
type: "button",
|
|
309
|
-
className:
|
|
347
|
+
className: cn7(
|
|
310
348
|
Calendar_default.day,
|
|
311
349
|
isSelected && Calendar_default.selected,
|
|
312
350
|
isToday && !isSelected && Calendar_default.today,
|
|
@@ -334,11 +372,11 @@ function Calendar({ value, defaultValue, min, max, onChange, className }) {
|
|
|
334
372
|
import { useRef, useId as useId3 } from "react";
|
|
335
373
|
|
|
336
374
|
// src/components/ui/Carousel/Carousel.module.css
|
|
337
|
-
var Carousel_default = {"carousel":"
|
|
375
|
+
var Carousel_default = {"carousel":"bds0115Carousel-carousel","track":"bds0115Carousel-track","slide":"bds0115Carousel-slide","navBtn":"bds0115Carousel-navBtn"};
|
|
338
376
|
|
|
339
377
|
// src/components/ui/Carousel/Carousel.tsx
|
|
340
|
-
import { cn as
|
|
341
|
-
import { jsx as
|
|
378
|
+
import { cn as cn8 } from "@boostdev/design-system-foundation";
|
|
379
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
342
380
|
function Carousel({ items, label, className }) {
|
|
343
381
|
const trackRef = useRef(null);
|
|
344
382
|
const listId = useId3();
|
|
@@ -350,61 +388,61 @@ function Carousel({ items, label, className }) {
|
|
|
350
388
|
behavior: "smooth"
|
|
351
389
|
});
|
|
352
390
|
};
|
|
353
|
-
return /* @__PURE__ */
|
|
354
|
-
/* @__PURE__ */
|
|
391
|
+
return /* @__PURE__ */ jsxs6("section", { "aria-label": label, className: cn8(Carousel_default.carousel, className), children: [
|
|
392
|
+
/* @__PURE__ */ jsx8(
|
|
355
393
|
"button",
|
|
356
394
|
{
|
|
357
395
|
type: "button",
|
|
358
|
-
className:
|
|
396
|
+
className: cn8(Carousel_default.navBtn, Carousel_default["--prev"]),
|
|
359
397
|
"aria-label": "Previous",
|
|
360
398
|
"aria-controls": listId,
|
|
361
399
|
onClick: () => scroll("prev"),
|
|
362
|
-
children: /* @__PURE__ */
|
|
400
|
+
children: /* @__PURE__ */ jsx8("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19l-7-7 7-7" }) })
|
|
363
401
|
}
|
|
364
402
|
),
|
|
365
|
-
/* @__PURE__ */
|
|
403
|
+
/* @__PURE__ */ jsx8(
|
|
366
404
|
"div",
|
|
367
405
|
{
|
|
368
406
|
ref: trackRef,
|
|
369
407
|
id: listId,
|
|
370
408
|
role: "list",
|
|
371
409
|
className: Carousel_default.track,
|
|
372
|
-
children: items.map((item, i) => /* @__PURE__ */
|
|
410
|
+
children: items.map((item, i) => /* @__PURE__ */ jsx8("div", { role: "listitem", className: Carousel_default.slide, children: item }, i))
|
|
373
411
|
}
|
|
374
412
|
),
|
|
375
|
-
/* @__PURE__ */
|
|
413
|
+
/* @__PURE__ */ jsx8(
|
|
376
414
|
"button",
|
|
377
415
|
{
|
|
378
416
|
type: "button",
|
|
379
|
-
className:
|
|
417
|
+
className: cn8(Carousel_default.navBtn, Carousel_default["--next"]),
|
|
380
418
|
"aria-label": "Next",
|
|
381
419
|
"aria-controls": listId,
|
|
382
420
|
onClick: () => scroll("next"),
|
|
383
|
-
children: /* @__PURE__ */
|
|
421
|
+
children: /* @__PURE__ */ jsx8("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) })
|
|
384
422
|
}
|
|
385
423
|
)
|
|
386
424
|
] });
|
|
387
425
|
}
|
|
388
426
|
|
|
389
427
|
// src/components/ui/DescriptionList/DescriptionList.module.css
|
|
390
|
-
var DescriptionList_default = {"list":"
|
|
428
|
+
var DescriptionList_default = {"list":"bds0115DescriptionList-list","group":"bds0115DescriptionList-group","term":"bds0115DescriptionList-term","details":"bds0115DescriptionList-details","--layout_inline":"bds0115DescriptionList---layout_inline"};
|
|
391
429
|
|
|
392
430
|
// src/components/ui/DescriptionList/DescriptionList.tsx
|
|
393
|
-
import { cn as
|
|
394
|
-
import { jsx as
|
|
431
|
+
import { cn as cn9 } from "@boostdev/design-system-foundation";
|
|
432
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
395
433
|
function DescriptionList({ items, layout = "stacked", className }) {
|
|
396
|
-
return /* @__PURE__ */
|
|
397
|
-
/* @__PURE__ */
|
|
398
|
-
Array.isArray(item.details) ? item.details.map((d, j) => /* @__PURE__ */
|
|
434
|
+
return /* @__PURE__ */ jsx9("dl", { className: cn9(DescriptionList_default.list, DescriptionList_default[`--layout_${layout}`], className), children: items.map((item, i) => /* @__PURE__ */ jsxs7("div", { className: DescriptionList_default.group, children: [
|
|
435
|
+
/* @__PURE__ */ jsx9("dt", { className: DescriptionList_default.term, children: item.term }),
|
|
436
|
+
Array.isArray(item.details) ? item.details.map((d, j) => /* @__PURE__ */ jsx9("dd", { className: DescriptionList_default.details, children: d }, j)) : /* @__PURE__ */ jsx9("dd", { className: DescriptionList_default.details, children: item.details })
|
|
399
437
|
] }, i)) });
|
|
400
438
|
}
|
|
401
439
|
|
|
402
440
|
// src/components/ui/Link/Link.module.css
|
|
403
|
-
var Link_default = {"link":"
|
|
441
|
+
var Link_default = {"link":"bds0115Link-link","--variant_default":"bds0115Link---variant_default","--variant_subtle":"bds0115Link---variant_subtle","--variant_standalone":"bds0115Link---variant_standalone","externalLabel":"bds0115Link-externalLabel"};
|
|
404
442
|
|
|
405
443
|
// src/components/ui/Link/Link.tsx
|
|
406
|
-
import { cn as
|
|
407
|
-
import { jsx as
|
|
444
|
+
import { cn as cn10 } from "@boostdev/design-system-foundation";
|
|
445
|
+
import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
408
446
|
function Link({
|
|
409
447
|
as,
|
|
410
448
|
children,
|
|
@@ -416,36 +454,36 @@ function Link({
|
|
|
416
454
|
}) {
|
|
417
455
|
const Component = as ?? "a";
|
|
418
456
|
const externalProps = external ? { target: "_blank", rel: "noreferrer noopener" } : {};
|
|
419
|
-
return /* @__PURE__ */
|
|
457
|
+
return /* @__PURE__ */ jsxs8(
|
|
420
458
|
Component,
|
|
421
459
|
{
|
|
422
|
-
className:
|
|
460
|
+
className: cn10(Link_default.link, Link_default[`--variant_${variant}`], className),
|
|
423
461
|
...externalProps,
|
|
424
462
|
...props,
|
|
425
463
|
children: [
|
|
426
464
|
children,
|
|
427
|
-
external && /* @__PURE__ */
|
|
465
|
+
external && /* @__PURE__ */ jsx10("span", { className: Link_default.externalLabel, children: externalLabel })
|
|
428
466
|
]
|
|
429
467
|
}
|
|
430
468
|
);
|
|
431
469
|
}
|
|
432
470
|
|
|
433
471
|
// src/components/ui/Loading/Loading.module.css
|
|
434
|
-
var Loading_default = {"loading":"
|
|
472
|
+
var Loading_default = {"loading":"bds0115Loading-loading","spinner":"bds0115Loading-spinner","--size_small":"bds0115Loading---size_small","--size_large":"bds0115Loading---size_large"};
|
|
435
473
|
|
|
436
474
|
// src/components/ui/Loading/Loading.tsx
|
|
437
|
-
import { cn as
|
|
438
|
-
import { jsx as
|
|
475
|
+
import { cn as cn11 } from "@boostdev/design-system-foundation";
|
|
476
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
439
477
|
function Loading({ size = "medium", className }) {
|
|
440
|
-
return /* @__PURE__ */
|
|
478
|
+
return /* @__PURE__ */ jsx11("div", { className: cn11(Loading_default.loading, Loading_default[`--size_${size}`], className), children: /* @__PURE__ */ jsx11("div", { className: Loading_default.spinner, role: "status", "aria-label": "Loading" }) });
|
|
441
479
|
}
|
|
442
480
|
|
|
443
481
|
// src/components/ui/NotificationBanner/NotificationBanner.module.css
|
|
444
|
-
var NotificationBanner_default = {"banner":"
|
|
482
|
+
var NotificationBanner_default = {"banner":"bds0115NotificationBanner-banner","--variant_info":"bds0115NotificationBanner---variant_info","--variant_success":"bds0115NotificationBanner---variant_success","--variant_warning":"bds0115NotificationBanner---variant_warning","--variant_error":"bds0115NotificationBanner---variant_error","content":"bds0115NotificationBanner-content","action":"bds0115NotificationBanner-action","dismiss":"bds0115NotificationBanner-dismiss"};
|
|
445
483
|
|
|
446
484
|
// src/components/ui/NotificationBanner/NotificationBanner.tsx
|
|
447
|
-
import { cn as
|
|
448
|
-
import { jsx as
|
|
485
|
+
import { cn as cn12 } from "@boostdev/design-system-foundation";
|
|
486
|
+
import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
449
487
|
function NotificationBanner({
|
|
450
488
|
variant = "info",
|
|
451
489
|
children,
|
|
@@ -454,24 +492,24 @@ function NotificationBanner({
|
|
|
454
492
|
className
|
|
455
493
|
}) {
|
|
456
494
|
const isUrgent = variant === "error" || variant === "warning";
|
|
457
|
-
return /* @__PURE__ */
|
|
495
|
+
return /* @__PURE__ */ jsxs9(
|
|
458
496
|
"div",
|
|
459
497
|
{
|
|
460
498
|
role: isUrgent ? "alert" : "status",
|
|
461
499
|
"aria-live": isUrgent ? "assertive" : "polite",
|
|
462
500
|
"aria-atomic": "true",
|
|
463
|
-
className:
|
|
501
|
+
className: cn12(NotificationBanner_default.banner, NotificationBanner_default[`--variant_${variant}`], className),
|
|
464
502
|
children: [
|
|
465
|
-
/* @__PURE__ */
|
|
466
|
-
action && /* @__PURE__ */
|
|
467
|
-
onDismiss && /* @__PURE__ */
|
|
503
|
+
/* @__PURE__ */ jsx12("div", { className: NotificationBanner_default.content, children }),
|
|
504
|
+
action && /* @__PURE__ */ jsx12("div", { className: NotificationBanner_default.action, children: action }),
|
|
505
|
+
onDismiss && /* @__PURE__ */ jsx12(
|
|
468
506
|
"button",
|
|
469
507
|
{
|
|
470
508
|
type: "button",
|
|
471
509
|
className: NotificationBanner_default.dismiss,
|
|
472
510
|
onClick: onDismiss,
|
|
473
511
|
"aria-label": "Dismiss notification",
|
|
474
|
-
children: /* @__PURE__ */
|
|
512
|
+
children: /* @__PURE__ */ jsx12("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6L6 18M6 6l12 12" }) })
|
|
475
513
|
}
|
|
476
514
|
)
|
|
477
515
|
]
|
|
@@ -480,11 +518,11 @@ function NotificationBanner({
|
|
|
480
518
|
}
|
|
481
519
|
|
|
482
520
|
// src/components/ui/Pagination/Pagination.module.css
|
|
483
|
-
var Pagination_default = {"pagination":"
|
|
521
|
+
var Pagination_default = {"pagination":"bds0115Pagination-pagination","list":"bds0115Pagination-list","button":"bds0115Pagination-button","--active":"bds0115Pagination---active","--nav":"bds0115Pagination---nav","ellipsis":"bds0115Pagination-ellipsis"};
|
|
484
522
|
|
|
485
523
|
// src/components/ui/Pagination/Pagination.tsx
|
|
486
|
-
import { cn as
|
|
487
|
-
import { jsx as
|
|
524
|
+
import { cn as cn13 } from "@boostdev/design-system-foundation";
|
|
525
|
+
import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
488
526
|
function getPageRange(current, total) {
|
|
489
527
|
const delta = 1;
|
|
490
528
|
const range = [];
|
|
@@ -504,24 +542,24 @@ function Pagination({
|
|
|
504
542
|
className
|
|
505
543
|
}) {
|
|
506
544
|
const pages = getPageRange(currentPage, totalPages);
|
|
507
|
-
return /* @__PURE__ */
|
|
508
|
-
/* @__PURE__ */
|
|
545
|
+
return /* @__PURE__ */ jsx13("nav", { "aria-label": "Pagination", className: cn13(Pagination_default.pagination, className), children: /* @__PURE__ */ jsxs10("ul", { className: Pagination_default.list, children: [
|
|
546
|
+
/* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(
|
|
509
547
|
"button",
|
|
510
548
|
{
|
|
511
549
|
type: "button",
|
|
512
|
-
className:
|
|
550
|
+
className: cn13(Pagination_default.button, Pagination_default["--nav"]),
|
|
513
551
|
onClick: () => onPageChange(currentPage - 1),
|
|
514
552
|
disabled: currentPage <= 1,
|
|
515
553
|
"aria-label": "Previous page",
|
|
516
|
-
children: /* @__PURE__ */
|
|
554
|
+
children: /* @__PURE__ */ jsx13("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx13("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19l-7-7 7-7" }) })
|
|
517
555
|
}
|
|
518
556
|
) }),
|
|
519
557
|
pages.map(
|
|
520
|
-
(page, index) => page === "..." ? /* @__PURE__ */
|
|
558
|
+
(page, index) => page === "..." ? /* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13("span", { className: Pagination_default.ellipsis, "aria-hidden": "true", children: "\u2026" }) }, `ellipsis-${index}`) : /* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(
|
|
521
559
|
"button",
|
|
522
560
|
{
|
|
523
561
|
type: "button",
|
|
524
|
-
className:
|
|
562
|
+
className: cn13(Pagination_default.button, currentPage === page ? Pagination_default["--active"] : void 0),
|
|
525
563
|
onClick: () => onPageChange(page),
|
|
526
564
|
"aria-label": `Page ${page}`,
|
|
527
565
|
"aria-current": currentPage === page ? "page" : void 0,
|
|
@@ -529,26 +567,26 @@ function Pagination({
|
|
|
529
567
|
}
|
|
530
568
|
) }, page)
|
|
531
569
|
),
|
|
532
|
-
/* @__PURE__ */
|
|
570
|
+
/* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(
|
|
533
571
|
"button",
|
|
534
572
|
{
|
|
535
573
|
type: "button",
|
|
536
|
-
className:
|
|
574
|
+
className: cn13(Pagination_default.button, Pagination_default["--nav"]),
|
|
537
575
|
onClick: () => onPageChange(currentPage + 1),
|
|
538
576
|
disabled: currentPage >= totalPages,
|
|
539
577
|
"aria-label": "Next page",
|
|
540
|
-
children: /* @__PURE__ */
|
|
578
|
+
children: /* @__PURE__ */ jsx13("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx13("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) })
|
|
541
579
|
}
|
|
542
580
|
) })
|
|
543
581
|
] }) });
|
|
544
582
|
}
|
|
545
583
|
|
|
546
584
|
// src/components/ui/Progress/Progress.module.css
|
|
547
|
-
var Progress_default = {"container":"
|
|
585
|
+
var Progress_default = {"container":"bds0115Progress-container","labelRow":"bds0115Progress-labelRow","label":"bds0115Progress-label","value":"bds0115Progress-value","track":"bds0115Progress-track","--size_small":"bds0115Progress---size_small","--size_medium":"bds0115Progress---size_medium","--size_large":"bds0115Progress---size_large","fill":"bds0115Progress-fill"};
|
|
548
586
|
|
|
549
587
|
// src/components/ui/Progress/Progress.tsx
|
|
550
|
-
import { cn as
|
|
551
|
-
import { jsx as
|
|
588
|
+
import { cn as cn14 } from "@boostdev/design-system-foundation";
|
|
589
|
+
import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
552
590
|
function Progress({
|
|
553
591
|
value,
|
|
554
592
|
max = 100,
|
|
@@ -558,15 +596,15 @@ function Progress({
|
|
|
558
596
|
className
|
|
559
597
|
}) {
|
|
560
598
|
const percentage = Math.min(100, Math.max(0, value / max * 100));
|
|
561
|
-
return /* @__PURE__ */
|
|
562
|
-
showLabel && /* @__PURE__ */
|
|
563
|
-
/* @__PURE__ */
|
|
564
|
-
/* @__PURE__ */
|
|
599
|
+
return /* @__PURE__ */ jsxs11("div", { className: cn14(Progress_default.container, className), children: [
|
|
600
|
+
showLabel && /* @__PURE__ */ jsxs11("div", { className: Progress_default.labelRow, children: [
|
|
601
|
+
/* @__PURE__ */ jsx14("span", { className: Progress_default.label, children: label }),
|
|
602
|
+
/* @__PURE__ */ jsxs11("span", { className: Progress_default.value, children: [
|
|
565
603
|
Math.round(percentage),
|
|
566
604
|
"%"
|
|
567
605
|
] })
|
|
568
606
|
] }),
|
|
569
|
-
/* @__PURE__ */
|
|
607
|
+
/* @__PURE__ */ jsx14(
|
|
570
608
|
"div",
|
|
571
609
|
{
|
|
572
610
|
role: "progressbar",
|
|
@@ -574,19 +612,19 @@ function Progress({
|
|
|
574
612
|
"aria-valuenow": value,
|
|
575
613
|
"aria-valuemin": 0,
|
|
576
614
|
"aria-valuemax": max,
|
|
577
|
-
className:
|
|
578
|
-
children: /* @__PURE__ */
|
|
615
|
+
className: cn14(Progress_default.track, Progress_default[`--size_${size}`]),
|
|
616
|
+
children: /* @__PURE__ */ jsx14("div", { className: Progress_default.fill, style: { width: `${percentage}%` } })
|
|
579
617
|
}
|
|
580
618
|
)
|
|
581
619
|
] });
|
|
582
620
|
}
|
|
583
621
|
|
|
584
622
|
// src/components/ui/ProgressCircle/ProgressCircle.module.css
|
|
585
|
-
var ProgressCircle_default = {"wrapper":"
|
|
623
|
+
var ProgressCircle_default = {"wrapper":"bds0115ProgressCircle-wrapper","svg":"bds0115ProgressCircle-svg","track":"bds0115ProgressCircle-track","fill":"bds0115ProgressCircle-fill","value":"bds0115ProgressCircle-value","--size_small":"bds0115ProgressCircle---size_small","--size_medium":"bds0115ProgressCircle---size_medium","--size_large":"bds0115ProgressCircle---size_large"};
|
|
586
624
|
|
|
587
625
|
// src/components/ui/ProgressCircle/ProgressCircle.tsx
|
|
588
|
-
import { cn as
|
|
589
|
-
import { jsx as
|
|
626
|
+
import { cn as cn15 } from "@boostdev/design-system-foundation";
|
|
627
|
+
import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
590
628
|
var SIZE_PX = { small: 40, medium: 64, large: 96 };
|
|
591
629
|
var STROKE_WIDTH = 4;
|
|
592
630
|
function ProgressCircle({
|
|
@@ -603,7 +641,7 @@ function ProgressCircle({
|
|
|
603
641
|
const circumference = 2 * Math.PI * radius;
|
|
604
642
|
const offset = circumference - percentage / 100 * circumference;
|
|
605
643
|
const cx = px / 2;
|
|
606
|
-
return /* @__PURE__ */
|
|
644
|
+
return /* @__PURE__ */ jsxs12(
|
|
607
645
|
"div",
|
|
608
646
|
{
|
|
609
647
|
role: "progressbar",
|
|
@@ -611,9 +649,9 @@ function ProgressCircle({
|
|
|
611
649
|
"aria-valuenow": value,
|
|
612
650
|
"aria-valuemin": 0,
|
|
613
651
|
"aria-valuemax": max,
|
|
614
|
-
className:
|
|
652
|
+
className: cn15(ProgressCircle_default.wrapper, ProgressCircle_default[`--size_${size}`], className),
|
|
615
653
|
children: [
|
|
616
|
-
/* @__PURE__ */
|
|
654
|
+
/* @__PURE__ */ jsxs12(
|
|
617
655
|
"svg",
|
|
618
656
|
{
|
|
619
657
|
width: px,
|
|
@@ -622,7 +660,7 @@ function ProgressCircle({
|
|
|
622
660
|
"aria-hidden": "true",
|
|
623
661
|
className: ProgressCircle_default.svg,
|
|
624
662
|
children: [
|
|
625
|
-
/* @__PURE__ */
|
|
663
|
+
/* @__PURE__ */ jsx15(
|
|
626
664
|
"circle",
|
|
627
665
|
{
|
|
628
666
|
className: ProgressCircle_default.track,
|
|
@@ -633,7 +671,7 @@ function ProgressCircle({
|
|
|
633
671
|
fill: "none"
|
|
634
672
|
}
|
|
635
673
|
),
|
|
636
|
-
/* @__PURE__ */
|
|
674
|
+
/* @__PURE__ */ jsx15(
|
|
637
675
|
"circle",
|
|
638
676
|
{
|
|
639
677
|
className: ProgressCircle_default.fill,
|
|
@@ -651,7 +689,7 @@ function ProgressCircle({
|
|
|
651
689
|
]
|
|
652
690
|
}
|
|
653
691
|
),
|
|
654
|
-
showValue && /* @__PURE__ */
|
|
692
|
+
showValue && /* @__PURE__ */ jsxs12("span", { className: ProgressCircle_default.value, "aria-hidden": "true", children: [
|
|
655
693
|
Math.round(percentage),
|
|
656
694
|
"%"
|
|
657
695
|
] })
|
|
@@ -661,52 +699,52 @@ function ProgressCircle({
|
|
|
661
699
|
}
|
|
662
700
|
|
|
663
701
|
// src/components/ui/Separator/Separator.module.css
|
|
664
|
-
var Separator_default = {"separator":"
|
|
702
|
+
var Separator_default = {"separator":"bds0115Separator-separator","--horizontal":"bds0115Separator---horizontal","--vertical":"bds0115Separator---vertical"};
|
|
665
703
|
|
|
666
704
|
// src/components/ui/Separator/Separator.tsx
|
|
667
|
-
import { cn as
|
|
668
|
-
import { jsx as
|
|
705
|
+
import { cn as cn16 } from "@boostdev/design-system-foundation";
|
|
706
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
669
707
|
function Separator({ orientation = "horizontal", className }) {
|
|
670
708
|
if (orientation === "vertical") {
|
|
671
|
-
return /* @__PURE__ */
|
|
709
|
+
return /* @__PURE__ */ jsx16(
|
|
672
710
|
"div",
|
|
673
711
|
{
|
|
674
712
|
role: "separator",
|
|
675
713
|
"aria-orientation": "vertical",
|
|
676
|
-
className:
|
|
714
|
+
className: cn16(Separator_default.separator, Separator_default["--vertical"], className)
|
|
677
715
|
}
|
|
678
716
|
);
|
|
679
717
|
}
|
|
680
|
-
return /* @__PURE__ */
|
|
718
|
+
return /* @__PURE__ */ jsx16("hr", { className: cn16(Separator_default.separator, Separator_default["--horizontal"], className) });
|
|
681
719
|
}
|
|
682
720
|
|
|
683
721
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
684
|
-
import { cn as
|
|
722
|
+
import { cn as cn17 } from "@boostdev/design-system-foundation";
|
|
685
723
|
|
|
686
724
|
// src/components/ui/Skeleton/Skeleton.module.css
|
|
687
|
-
var Skeleton_default = {"skeleton":"
|
|
725
|
+
var Skeleton_default = {"skeleton":"bds0115Skeleton-skeleton"};
|
|
688
726
|
|
|
689
727
|
// src/components/ui/Skeleton/Skeleton.tsx
|
|
690
|
-
import { jsx as
|
|
728
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
691
729
|
function Skeleton({ className }) {
|
|
692
|
-
return /* @__PURE__ */
|
|
730
|
+
return /* @__PURE__ */ jsx17("div", { "aria-hidden": "true", className: cn17(Skeleton_default.skeleton, className) });
|
|
693
731
|
}
|
|
694
732
|
|
|
695
733
|
// src/components/ui/SkipLink/SkipLink.module.css
|
|
696
|
-
var SkipLink_default = {"skipLink":"
|
|
734
|
+
var SkipLink_default = {"skipLink":"bds0115SkipLink-skipLink"};
|
|
697
735
|
|
|
698
736
|
// src/components/ui/SkipLink/SkipLink.tsx
|
|
699
|
-
import { jsx as
|
|
737
|
+
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
700
738
|
function SkipLink({ href = "#main", children = "Skip to main content" }) {
|
|
701
|
-
return /* @__PURE__ */
|
|
739
|
+
return /* @__PURE__ */ jsx18("a", { href, className: SkipLink_default.skipLink, children });
|
|
702
740
|
}
|
|
703
741
|
|
|
704
742
|
// src/components/ui/Table/Table.module.css
|
|
705
|
-
var Table_default = {"wrapper":"
|
|
743
|
+
var Table_default = {"wrapper":"bds0115Table-wrapper","table":"bds0115Table-table","caption":"bds0115Table-caption","thead":"bds0115Table-thead","th":"bds0115Table-th","--sortable":"bds0115Table---sortable","sortButton":"bds0115Table-sortButton","sortIcon":"bds0115Table-sortIcon","--sort-active":"bds0115Table---sort-active","--sort-desc":"bds0115Table---sort-desc","tbody":"bds0115Table-tbody","tr":"bds0115Table-tr","td":"bds0115Table-td"};
|
|
706
744
|
|
|
707
745
|
// src/components/ui/Table/Table.tsx
|
|
708
|
-
import { cn as
|
|
709
|
-
import { jsx as
|
|
746
|
+
import { cn as cn18 } from "@boostdev/design-system-foundation";
|
|
747
|
+
import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
710
748
|
function Table({
|
|
711
749
|
columns,
|
|
712
750
|
rows,
|
|
@@ -725,15 +763,15 @@ function Table({
|
|
|
725
763
|
if (sortKey !== key) return "none";
|
|
726
764
|
return sortDirection === "asc" ? "ascending" : "descending";
|
|
727
765
|
};
|
|
728
|
-
return /* @__PURE__ */
|
|
729
|
-
caption && /* @__PURE__ */
|
|
730
|
-
/* @__PURE__ */
|
|
766
|
+
return /* @__PURE__ */ jsx19("div", { className: cn18(Table_default.wrapper, className), children: /* @__PURE__ */ jsxs13("table", { className: Table_default.table, children: [
|
|
767
|
+
caption && /* @__PURE__ */ jsx19("caption", { className: Table_default.caption, children: caption }),
|
|
768
|
+
/* @__PURE__ */ jsx19("thead", { className: Table_default.thead, children: /* @__PURE__ */ jsx19("tr", { children: columns.map((col) => /* @__PURE__ */ jsx19(
|
|
731
769
|
"th",
|
|
732
770
|
{
|
|
733
771
|
scope: "col",
|
|
734
772
|
"aria-sort": col.sortable ? getAriaSort(col.key) : void 0,
|
|
735
|
-
className:
|
|
736
|
-
children: col.sortable ? /* @__PURE__ */
|
|
773
|
+
className: cn18(Table_default.th, col.sortable ? Table_default["--sortable"] : void 0),
|
|
774
|
+
children: col.sortable ? /* @__PURE__ */ jsxs13(
|
|
737
775
|
"button",
|
|
738
776
|
{
|
|
739
777
|
type: "button",
|
|
@@ -741,11 +779,11 @@ function Table({
|
|
|
741
779
|
onClick: () => handleSort(col.key),
|
|
742
780
|
children: [
|
|
743
781
|
col.header,
|
|
744
|
-
/* @__PURE__ */
|
|
782
|
+
/* @__PURE__ */ jsx19(
|
|
745
783
|
"svg",
|
|
746
784
|
{
|
|
747
785
|
"aria-hidden": "true",
|
|
748
|
-
className:
|
|
786
|
+
className: cn18(
|
|
749
787
|
Table_default.sortIcon,
|
|
750
788
|
sortKey === col.key ? Table_default["--sort-active"] : void 0,
|
|
751
789
|
sortKey === col.key && sortDirection === "desc" ? Table_default["--sort-desc"] : void 0
|
|
@@ -754,7 +792,7 @@ function Table({
|
|
|
754
792
|
fill: "none",
|
|
755
793
|
stroke: "currentColor",
|
|
756
794
|
strokeWidth: "2",
|
|
757
|
-
children: /* @__PURE__ */
|
|
795
|
+
children: /* @__PURE__ */ jsx19("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 9l6 6 6-6" })
|
|
758
796
|
}
|
|
759
797
|
)
|
|
760
798
|
]
|
|
@@ -763,7 +801,7 @@ function Table({
|
|
|
763
801
|
},
|
|
764
802
|
col.key
|
|
765
803
|
)) }) }),
|
|
766
|
-
/* @__PURE__ */
|
|
804
|
+
/* @__PURE__ */ jsx19("tbody", { className: Table_default.tbody, children: rows.map((row, rowIndex) => /* @__PURE__ */ jsx19("tr", { className: Table_default.tr, children: columns.map((col) => /* @__PURE__ */ jsx19("td", { className: Table_default.td, children: col.render ? col.render(row) : String(row[col.key] ?? "") }, col.key)) }, rowIndex)) })
|
|
767
805
|
] }) });
|
|
768
806
|
}
|
|
769
807
|
|
|
@@ -771,11 +809,11 @@ function Table({
|
|
|
771
809
|
import { useId as useId4, useRef as useRef2, useState as useState3 } from "react";
|
|
772
810
|
|
|
773
811
|
// src/components/ui/Tabs/Tabs.module.css
|
|
774
|
-
var Tabs_default = {"tabs":"
|
|
812
|
+
var Tabs_default = {"tabs":"bds0115Tabs-tabs","tabList":"bds0115Tabs-tabList","tab":"bds0115Tabs-tab","--active":"bds0115Tabs---active","panel":"bds0115Tabs-panel"};
|
|
775
813
|
|
|
776
814
|
// src/components/ui/Tabs/Tabs.tsx
|
|
777
|
-
import { cn as
|
|
778
|
-
import { jsx as
|
|
815
|
+
import { cn as cn19 } from "@boostdev/design-system-foundation";
|
|
816
|
+
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
779
817
|
function Tabs({ tabs, defaultTab, className }) {
|
|
780
818
|
const baseId = useId4();
|
|
781
819
|
const [activeTab, setActiveTab] = useState3(defaultTab ?? tabs[0]?.id);
|
|
@@ -801,12 +839,12 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
801
839
|
focusAt(enabledIndexes[enabledIndexes.length - 1]);
|
|
802
840
|
}
|
|
803
841
|
};
|
|
804
|
-
return /* @__PURE__ */
|
|
805
|
-
/* @__PURE__ */
|
|
842
|
+
return /* @__PURE__ */ jsxs14("div", { className: cn19(Tabs_default.tabs, className), children: [
|
|
843
|
+
/* @__PURE__ */ jsx20("div", { role: "tablist", className: Tabs_default.tabList, children: tabs.map((tab, i) => {
|
|
806
844
|
const tabId = `${baseId}-tab-${tab.id}`;
|
|
807
845
|
const panelId = `${baseId}-panel-${tab.id}`;
|
|
808
846
|
const isActive = activeTab === tab.id;
|
|
809
|
-
return /* @__PURE__ */
|
|
847
|
+
return /* @__PURE__ */ jsx20(
|
|
810
848
|
"button",
|
|
811
849
|
{
|
|
812
850
|
ref: (el) => {
|
|
@@ -819,7 +857,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
819
857
|
"aria-controls": panelId,
|
|
820
858
|
tabIndex: isActive ? 0 : -1,
|
|
821
859
|
disabled: tab.disabled,
|
|
822
|
-
className:
|
|
860
|
+
className: cn19(Tabs_default.tab, isActive ? Tabs_default["--active"] : void 0),
|
|
823
861
|
onClick: () => setActiveTab(tab.id),
|
|
824
862
|
onKeyDown: (e) => handleKeyDown(e, i),
|
|
825
863
|
children: tab.label
|
|
@@ -831,7 +869,7 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
831
869
|
const tabId = `${baseId}-tab-${tab.id}`;
|
|
832
870
|
const panelId = `${baseId}-panel-${tab.id}`;
|
|
833
871
|
const isActive = activeTab === tab.id;
|
|
834
|
-
return /* @__PURE__ */
|
|
872
|
+
return /* @__PURE__ */ jsx20(
|
|
835
873
|
"div",
|
|
836
874
|
{
|
|
837
875
|
id: panelId,
|
|
@@ -852,11 +890,11 @@ function Tabs({ tabs, defaultTab, className }) {
|
|
|
852
890
|
import { cloneElement, isValidElement, useId as useId5 } from "react";
|
|
853
891
|
|
|
854
892
|
// src/components/ui/Tooltip/Tooltip.module.css
|
|
855
|
-
var Tooltip_default = {"wrapper":"
|
|
893
|
+
var Tooltip_default = {"wrapper":"bds0115Tooltip-wrapper","tooltip":"bds0115Tooltip-tooltip","--placement_top":"bds0115Tooltip---placement_top","--placement_bottom":"bds0115Tooltip---placement_bottom","--placement_left":"bds0115Tooltip---placement_left","--placement_right":"bds0115Tooltip---placement_right"};
|
|
856
894
|
|
|
857
895
|
// src/components/ui/Tooltip/Tooltip.tsx
|
|
858
|
-
import { cn as
|
|
859
|
-
import { jsx as
|
|
896
|
+
import { cn as cn20 } from "@boostdev/design-system-foundation";
|
|
897
|
+
import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
860
898
|
function Tooltip({
|
|
861
899
|
content,
|
|
862
900
|
placement = "top",
|
|
@@ -867,14 +905,14 @@ function Tooltip({
|
|
|
867
905
|
const trigger = isValidElement(children) ? cloneElement(children, {
|
|
868
906
|
"aria-describedby": tooltipId
|
|
869
907
|
}) : children;
|
|
870
|
-
return /* @__PURE__ */
|
|
908
|
+
return /* @__PURE__ */ jsxs15("span", { className: cn20(Tooltip_default.wrapper, className), children: [
|
|
871
909
|
trigger,
|
|
872
|
-
/* @__PURE__ */
|
|
910
|
+
/* @__PURE__ */ jsx21(
|
|
873
911
|
"span",
|
|
874
912
|
{
|
|
875
913
|
id: tooltipId,
|
|
876
914
|
role: "tooltip",
|
|
877
|
-
className:
|
|
915
|
+
className: cn20(Tooltip_default.tooltip, Tooltip_default[`--placement_${placement}`]),
|
|
878
916
|
children: content
|
|
879
917
|
}
|
|
880
918
|
)
|
|
@@ -882,11 +920,11 @@ function Tooltip({
|
|
|
882
920
|
}
|
|
883
921
|
|
|
884
922
|
// src/components/ui/Typography/Typography.module.css
|
|
885
|
-
var Typography_default = {"typography":"
|
|
923
|
+
var Typography_default = {"typography":"bds0115Typography-typography","--h1":"bds0115Typography---h1","--h2":"bds0115Typography---h2","--h3":"bds0115Typography---h3","--body":"bds0115Typography---body","--body_s":"bds0115Typography---body_s"};
|
|
886
924
|
|
|
887
925
|
// src/components/ui/Typography/Typography.tsx
|
|
888
|
-
import { cn as
|
|
889
|
-
import { jsx as
|
|
926
|
+
import { cn as cn21 } from "@boostdev/design-system-foundation";
|
|
927
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
890
928
|
var variantToElement = {
|
|
891
929
|
h1: "h1",
|
|
892
930
|
h2: "h2",
|
|
@@ -896,15 +934,15 @@ var variantToElement = {
|
|
|
896
934
|
};
|
|
897
935
|
function Typography({ variant = "body", component, children, className }) {
|
|
898
936
|
const Component = component || variantToElement[variant];
|
|
899
|
-
return /* @__PURE__ */
|
|
937
|
+
return /* @__PURE__ */ jsx22(Component, { className: cn21(Typography_default.typography, Typography_default[`--${variant}`], className), children });
|
|
900
938
|
}
|
|
901
939
|
|
|
902
940
|
// src/components/interaction/Button/Button.module.css
|
|
903
|
-
var Button_default = {"button":"
|
|
941
|
+
var Button_default = {"button":"bds0115Button-button","--primary":"bds0115Button---primary","--secondary":"bds0115Button---secondary","--size_small":"bds0115Button---size_small","--size_medium":"bds0115Button---size_medium","--size_large":"bds0115Button---size_large","--hasPulse":"bds0115Button---hasPulse","prefix":"bds0115Button-prefix","suffix":"bds0115Button-suffix"};
|
|
904
942
|
|
|
905
943
|
// src/components/interaction/Button/Button.tsx
|
|
906
|
-
import { cn as
|
|
907
|
-
import { Fragment as Fragment2, jsx as
|
|
944
|
+
import { cn as cn22 } from "@boostdev/design-system-foundation";
|
|
945
|
+
import { Fragment as Fragment2, jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
908
946
|
function Button({
|
|
909
947
|
children,
|
|
910
948
|
className,
|
|
@@ -921,7 +959,7 @@ function Button({
|
|
|
921
959
|
onClick,
|
|
922
960
|
...rest
|
|
923
961
|
}) {
|
|
924
|
-
const classNames =
|
|
962
|
+
const classNames = cn22(
|
|
925
963
|
Button_default.button,
|
|
926
964
|
Button_default[`--${variant}`],
|
|
927
965
|
Button_default[`--size_${size}`],
|
|
@@ -938,13 +976,13 @@ function Button({
|
|
|
938
976
|
const handleButtonClick = (e) => {
|
|
939
977
|
onClick?.(e);
|
|
940
978
|
};
|
|
941
|
-
const content = /* @__PURE__ */
|
|
942
|
-
Boolean(iconStart) && /* @__PURE__ */
|
|
979
|
+
const content = /* @__PURE__ */ jsxs16(Fragment2, { children: [
|
|
980
|
+
Boolean(iconStart) && /* @__PURE__ */ jsx23("span", { className: Button_default.prefix, children: iconStart }),
|
|
943
981
|
children,
|
|
944
|
-
Boolean(iconEnd) && /* @__PURE__ */
|
|
982
|
+
Boolean(iconEnd) && /* @__PURE__ */ jsx23("span", { className: Button_default.suffix, children: iconEnd })
|
|
945
983
|
] });
|
|
946
984
|
if (href) {
|
|
947
|
-
return /* @__PURE__ */
|
|
985
|
+
return /* @__PURE__ */ jsx23(
|
|
948
986
|
"a",
|
|
949
987
|
{
|
|
950
988
|
className: classNames,
|
|
@@ -959,7 +997,7 @@ function Button({
|
|
|
959
997
|
}
|
|
960
998
|
);
|
|
961
999
|
}
|
|
962
|
-
return /* @__PURE__ */
|
|
1000
|
+
return /* @__PURE__ */ jsx23(
|
|
963
1001
|
"button",
|
|
964
1002
|
{
|
|
965
1003
|
type,
|
|
@@ -976,11 +1014,11 @@ function Button({
|
|
|
976
1014
|
import { useState as useState4, useEffect, useRef as useRef3, useId as useId6, useMemo } from "react";
|
|
977
1015
|
|
|
978
1016
|
// src/components/interaction/Command/Command.module.css
|
|
979
|
-
var Command_default = {"dialog":"
|
|
1017
|
+
var Command_default = {"dialog":"bds0115Command-dialog","palette":"bds0115Command-palette","searchRow":"bds0115Command-searchRow","searchIcon":"bds0115Command-searchIcon","search":"bds0115Command-search","escHint":"bds0115Command-escHint","list":"bds0115Command-list","groupList":"bds0115Command-groupList","group":"bds0115Command-group","item":"bds0115Command-item","itemActive":"bds0115Command-itemActive","itemLabel":"bds0115Command-itemLabel","itemDesc":"bds0115Command-itemDesc","shortcut":"bds0115Command-shortcut","empty":"bds0115Command-empty"};
|
|
980
1018
|
|
|
981
1019
|
// src/components/interaction/Command/Command.tsx
|
|
982
|
-
import { cn as
|
|
983
|
-
import { jsx as
|
|
1020
|
+
import { cn as cn23 } from "@boostdev/design-system-foundation";
|
|
1021
|
+
import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
984
1022
|
function Command({
|
|
985
1023
|
isOpen,
|
|
986
1024
|
onClose,
|
|
@@ -1047,20 +1085,20 @@ function Command({
|
|
|
1047
1085
|
item.onSelect();
|
|
1048
1086
|
onClose();
|
|
1049
1087
|
};
|
|
1050
|
-
return /* @__PURE__ */
|
|
1088
|
+
return /* @__PURE__ */ jsx24(
|
|
1051
1089
|
"dialog",
|
|
1052
1090
|
{
|
|
1053
1091
|
ref: dialogRef,
|
|
1054
|
-
className:
|
|
1092
|
+
className: cn23(Command_default.dialog, className),
|
|
1055
1093
|
"aria-label": "Command palette",
|
|
1056
1094
|
onCancel: handleCancel,
|
|
1057
|
-
children: /* @__PURE__ */
|
|
1058
|
-
/* @__PURE__ */
|
|
1059
|
-
/* @__PURE__ */
|
|
1060
|
-
/* @__PURE__ */
|
|
1061
|
-
/* @__PURE__ */
|
|
1095
|
+
children: /* @__PURE__ */ jsxs17("div", { className: Command_default.palette, onKeyDown: handleKeyDown, children: [
|
|
1096
|
+
/* @__PURE__ */ jsxs17("div", { className: Command_default.searchRow, children: [
|
|
1097
|
+
/* @__PURE__ */ jsxs17("svg", { "aria-hidden": "true", className: Command_default.searchIcon, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
1098
|
+
/* @__PURE__ */ jsx24("circle", { cx: "11", cy: "11", r: "8" }),
|
|
1099
|
+
/* @__PURE__ */ jsx24("path", { strokeLinecap: "round", d: "M21 21l-4.35-4.35" })
|
|
1062
1100
|
] }),
|
|
1063
|
-
/* @__PURE__ */
|
|
1101
|
+
/* @__PURE__ */ jsx24(
|
|
1064
1102
|
"input",
|
|
1065
1103
|
{
|
|
1066
1104
|
ref: inputRef,
|
|
@@ -1076,32 +1114,32 @@ function Command({
|
|
|
1076
1114
|
onChange: (e) => setQuery(e.target.value)
|
|
1077
1115
|
}
|
|
1078
1116
|
),
|
|
1079
|
-
/* @__PURE__ */
|
|
1117
|
+
/* @__PURE__ */ jsx24("kbd", { className: Command_default.escHint, children: "Esc" })
|
|
1080
1118
|
] }),
|
|
1081
|
-
filtered.length > 0 ? /* @__PURE__ */
|
|
1082
|
-
group && /* @__PURE__ */
|
|
1083
|
-
/* @__PURE__ */
|
|
1119
|
+
filtered.length > 0 ? /* @__PURE__ */ jsx24("ul", { id: listboxId, role: "listbox", className: Command_default.list, "aria-label": "Commands", children: Array.from(groups.entries()).map(([group, groupItems]) => /* @__PURE__ */ jsxs17("li", { role: "presentation", children: [
|
|
1120
|
+
group && /* @__PURE__ */ jsx24("div", { className: Command_default.group, role: "presentation", children: group }),
|
|
1121
|
+
/* @__PURE__ */ jsx24("ul", { role: "group", "aria-label": group || void 0, className: Command_default.groupList, children: groupItems.map((item) => {
|
|
1084
1122
|
const flatIndex = filtered.indexOf(item);
|
|
1085
1123
|
const isActive = flatIndex === activeIndex;
|
|
1086
|
-
return /* @__PURE__ */
|
|
1124
|
+
return /* @__PURE__ */ jsxs17(
|
|
1087
1125
|
"li",
|
|
1088
1126
|
{
|
|
1089
1127
|
id: `cmd-${item.id}`,
|
|
1090
1128
|
role: "option",
|
|
1091
1129
|
"aria-selected": isActive,
|
|
1092
|
-
className:
|
|
1130
|
+
className: cn23(Command_default.item, isActive && Command_default.itemActive),
|
|
1093
1131
|
onPointerDown: (e) => e.preventDefault(),
|
|
1094
1132
|
onClick: () => selectItem(item),
|
|
1095
1133
|
children: [
|
|
1096
|
-
/* @__PURE__ */
|
|
1097
|
-
item.description && /* @__PURE__ */
|
|
1098
|
-
item.shortcut && /* @__PURE__ */
|
|
1134
|
+
/* @__PURE__ */ jsx24("span", { className: Command_default.itemLabel, children: item.label }),
|
|
1135
|
+
item.description && /* @__PURE__ */ jsx24("span", { className: Command_default.itemDesc, children: item.description }),
|
|
1136
|
+
item.shortcut && /* @__PURE__ */ jsx24("kbd", { className: Command_default.shortcut, children: item.shortcut })
|
|
1099
1137
|
]
|
|
1100
1138
|
},
|
|
1101
1139
|
item.id
|
|
1102
1140
|
);
|
|
1103
1141
|
}) })
|
|
1104
|
-
] }, group)) }) : /* @__PURE__ */
|
|
1142
|
+
] }, group)) }) : /* @__PURE__ */ jsxs17("div", { className: Command_default.empty, "aria-live": "polite", children: [
|
|
1105
1143
|
"No results for \u201C",
|
|
1106
1144
|
query,
|
|
1107
1145
|
"\u201D"
|
|
@@ -1115,11 +1153,11 @@ function Command({
|
|
|
1115
1153
|
import { useEffect as useEffect2, useRef as useRef4 } from "react";
|
|
1116
1154
|
|
|
1117
1155
|
// src/components/interaction/Dialog/Dialog.module.css
|
|
1118
|
-
var Dialog_default = {"dialog":"
|
|
1156
|
+
var Dialog_default = {"dialog":"bds0115Dialog-dialog","dialogContent":"bds0115Dialog-dialogContent","closeForm":"bds0115Dialog-closeForm","closeButton":"bds0115Dialog-closeButton"};
|
|
1119
1157
|
|
|
1120
1158
|
// src/components/interaction/Dialog/Dialog.tsx
|
|
1121
|
-
import { cn as
|
|
1122
|
-
import { jsx as
|
|
1159
|
+
import { cn as cn24 } from "@boostdev/design-system-foundation";
|
|
1160
|
+
import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1123
1161
|
function Dialog({ children, isOpen = false, className, onClose }) {
|
|
1124
1162
|
const dialogRef = useRef4(null);
|
|
1125
1163
|
useEffect2(() => {
|
|
@@ -1143,25 +1181,25 @@ function Dialog({ children, isOpen = false, className, onClose }) {
|
|
|
1143
1181
|
e.preventDefault();
|
|
1144
1182
|
onClose?.();
|
|
1145
1183
|
};
|
|
1146
|
-
return /* @__PURE__ */
|
|
1184
|
+
return /* @__PURE__ */ jsxs18(
|
|
1147
1185
|
"dialog",
|
|
1148
1186
|
{
|
|
1149
1187
|
ref: dialogRef,
|
|
1150
|
-
className:
|
|
1188
|
+
className: cn24(className, Dialog_default.dialog),
|
|
1151
1189
|
onClick: handleBackdropClick,
|
|
1152
1190
|
onCancel: handleCancel,
|
|
1153
1191
|
children: [
|
|
1154
|
-
/* @__PURE__ */
|
|
1192
|
+
/* @__PURE__ */ jsx25("form", { method: "dialog", className: Dialog_default.closeForm, children: /* @__PURE__ */ jsx25(
|
|
1155
1193
|
"button",
|
|
1156
1194
|
{
|
|
1157
1195
|
type: "submit",
|
|
1158
1196
|
className: Dialog_default.closeButton,
|
|
1159
1197
|
onClick: onClose,
|
|
1160
1198
|
"aria-label": "Close dialog",
|
|
1161
|
-
children: /* @__PURE__ */
|
|
1199
|
+
children: /* @__PURE__ */ jsx25("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx25("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6L6 18M6 6l12 12" }) })
|
|
1162
1200
|
}
|
|
1163
1201
|
) }),
|
|
1164
|
-
/* @__PURE__ */
|
|
1202
|
+
/* @__PURE__ */ jsx25("div", { className: Dialog_default.dialogContent, children })
|
|
1165
1203
|
]
|
|
1166
1204
|
}
|
|
1167
1205
|
);
|
|
@@ -1171,11 +1209,11 @@ function Dialog({ children, isOpen = false, className, onClose }) {
|
|
|
1171
1209
|
import { useEffect as useEffect3, useRef as useRef5 } from "react";
|
|
1172
1210
|
|
|
1173
1211
|
// src/components/interaction/Drawer/Drawer.module.css
|
|
1174
|
-
var Drawer_default = {"drawer":"
|
|
1212
|
+
var Drawer_default = {"drawer":"bds0115Drawer-drawer","panel":"bds0115Drawer-panel","--side_right":"bds0115Drawer---side_right","--side_left":"bds0115Drawer---side_left","header":"bds0115Drawer-header","closeButton":"bds0115Drawer-closeButton","body":"bds0115Drawer-body"};
|
|
1175
1213
|
|
|
1176
1214
|
// src/components/interaction/Drawer/Drawer.tsx
|
|
1177
|
-
import { cn as
|
|
1178
|
-
import { jsx as
|
|
1215
|
+
import { cn as cn25 } from "@boostdev/design-system-foundation";
|
|
1216
|
+
import { jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1179
1217
|
function Drawer({
|
|
1180
1218
|
isOpen,
|
|
1181
1219
|
onClose,
|
|
@@ -1202,29 +1240,29 @@ function Drawer({
|
|
|
1202
1240
|
e.preventDefault();
|
|
1203
1241
|
onClose();
|
|
1204
1242
|
};
|
|
1205
|
-
return /* @__PURE__ */
|
|
1243
|
+
return /* @__PURE__ */ jsx26(
|
|
1206
1244
|
"dialog",
|
|
1207
1245
|
{
|
|
1208
1246
|
ref: dialogRef,
|
|
1209
|
-
className:
|
|
1247
|
+
className: cn25(Drawer_default.drawer, Drawer_default[`--side_${side}`], className),
|
|
1210
1248
|
"aria-label": arialLabel,
|
|
1211
1249
|
onClick: handleClick,
|
|
1212
1250
|
onCancel: handleCancel,
|
|
1213
|
-
children: /* @__PURE__ */
|
|
1214
|
-
/* @__PURE__ */
|
|
1251
|
+
children: /* @__PURE__ */ jsxs19("div", { className: Drawer_default.panel, children: [
|
|
1252
|
+
/* @__PURE__ */ jsxs19("div", { className: Drawer_default.header, children: [
|
|
1215
1253
|
!!title && title,
|
|
1216
|
-
/* @__PURE__ */
|
|
1254
|
+
/* @__PURE__ */ jsx26(
|
|
1217
1255
|
"button",
|
|
1218
1256
|
{
|
|
1219
1257
|
type: "button",
|
|
1220
1258
|
className: Drawer_default.closeButton,
|
|
1221
1259
|
onClick: onClose,
|
|
1222
1260
|
"aria-label": "Close drawer",
|
|
1223
|
-
children: /* @__PURE__ */
|
|
1261
|
+
children: /* @__PURE__ */ jsx26("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx26("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6L6 18M6 6l12 12" }) })
|
|
1224
1262
|
}
|
|
1225
1263
|
)
|
|
1226
1264
|
] }),
|
|
1227
|
-
/* @__PURE__ */
|
|
1265
|
+
/* @__PURE__ */ jsx26("div", { className: Drawer_default.body, children })
|
|
1228
1266
|
] })
|
|
1229
1267
|
}
|
|
1230
1268
|
);
|
|
@@ -1241,11 +1279,11 @@ import {
|
|
|
1241
1279
|
} from "react";
|
|
1242
1280
|
|
|
1243
1281
|
// src/components/interaction/DropdownMenu/DropdownMenu.module.css
|
|
1244
|
-
var DropdownMenu_default = {"wrapper":"
|
|
1282
|
+
var DropdownMenu_default = {"wrapper":"bds0115DropdownMenu-wrapper","menu":"bds0115DropdownMenu-menu","--placement_bottom-start":"bds0115DropdownMenu---placement_bottom-start","--placement_bottom-end":"bds0115DropdownMenu---placement_bottom-end","separator":"bds0115DropdownMenu-separator","item":"bds0115DropdownMenu-item","icon":"bds0115DropdownMenu-icon"};
|
|
1245
1283
|
|
|
1246
1284
|
// src/components/interaction/DropdownMenu/DropdownMenu.tsx
|
|
1247
|
-
import { cn as
|
|
1248
|
-
import { jsx as
|
|
1285
|
+
import { cn as cn26 } from "@boostdev/design-system-foundation";
|
|
1286
|
+
import { jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1249
1287
|
function DropdownMenu({
|
|
1250
1288
|
trigger,
|
|
1251
1289
|
items,
|
|
@@ -1313,17 +1351,17 @@ function DropdownMenu({
|
|
|
1313
1351
|
if (typeof existingOnClick === "function") existingOnClick(e);
|
|
1314
1352
|
}
|
|
1315
1353
|
}) : trigger;
|
|
1316
|
-
return /* @__PURE__ */
|
|
1354
|
+
return /* @__PURE__ */ jsxs20("div", { ref: containerRef, className: cn26(DropdownMenu_default.wrapper, className), children: [
|
|
1317
1355
|
triggerEl,
|
|
1318
|
-
isOpen && /* @__PURE__ */
|
|
1356
|
+
isOpen && /* @__PURE__ */ jsx27(
|
|
1319
1357
|
"ul",
|
|
1320
1358
|
{
|
|
1321
1359
|
id: menuId,
|
|
1322
1360
|
role: "menu",
|
|
1323
|
-
className:
|
|
1324
|
-
children: items.map((item, index) => /* @__PURE__ */
|
|
1325
|
-
item.separator && /* @__PURE__ */
|
|
1326
|
-
/* @__PURE__ */
|
|
1361
|
+
className: cn26(DropdownMenu_default.menu, DropdownMenu_default[`--placement_${placement}`]),
|
|
1362
|
+
children: items.map((item, index) => /* @__PURE__ */ jsxs20("li", { role: "presentation", children: [
|
|
1363
|
+
item.separator && /* @__PURE__ */ jsx27("hr", { className: DropdownMenu_default.separator, role: "separator" }),
|
|
1364
|
+
/* @__PURE__ */ jsxs20(
|
|
1327
1365
|
"button",
|
|
1328
1366
|
{
|
|
1329
1367
|
ref: (el) => {
|
|
@@ -1339,7 +1377,7 @@ function DropdownMenu({
|
|
|
1339
1377
|
},
|
|
1340
1378
|
onKeyDown: (e) => handleItemKeyDown(e, index),
|
|
1341
1379
|
children: [
|
|
1342
|
-
item.icon && /* @__PURE__ */
|
|
1380
|
+
item.icon && /* @__PURE__ */ jsx27("span", { className: DropdownMenu_default.icon, "aria-hidden": "true", children: item.icon }),
|
|
1343
1381
|
item.label
|
|
1344
1382
|
]
|
|
1345
1383
|
}
|
|
@@ -1361,11 +1399,11 @@ import {
|
|
|
1361
1399
|
} from "react";
|
|
1362
1400
|
|
|
1363
1401
|
// src/components/interaction/Popover/Popover.module.css
|
|
1364
|
-
var Popover_default = {"wrapper":"
|
|
1402
|
+
var Popover_default = {"wrapper":"bds0115Popover-wrapper","panel":"bds0115Popover-panel","--placement_bottom":"bds0115Popover---placement_bottom","--placement_top":"bds0115Popover---placement_top","--placement_right":"bds0115Popover---placement_right","--placement_left":"bds0115Popover---placement_left"};
|
|
1365
1403
|
|
|
1366
1404
|
// src/components/interaction/Popover/Popover.tsx
|
|
1367
|
-
import { cn as
|
|
1368
|
-
import { jsx as
|
|
1405
|
+
import { cn as cn27 } from "@boostdev/design-system-foundation";
|
|
1406
|
+
import { jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
1369
1407
|
function Popover({
|
|
1370
1408
|
children,
|
|
1371
1409
|
content,
|
|
@@ -1401,15 +1439,15 @@ function Popover({
|
|
|
1401
1439
|
if (typeof existingOnClick === "function") existingOnClick(e);
|
|
1402
1440
|
}
|
|
1403
1441
|
}) : children;
|
|
1404
|
-
return /* @__PURE__ */
|
|
1442
|
+
return /* @__PURE__ */ jsxs21("span", { ref: containerRef, className: cn27(Popover_default.wrapper, className), children: [
|
|
1405
1443
|
trigger,
|
|
1406
|
-
isOpen && /* @__PURE__ */
|
|
1444
|
+
isOpen && /* @__PURE__ */ jsx28(
|
|
1407
1445
|
"div",
|
|
1408
1446
|
{
|
|
1409
1447
|
id: panelId,
|
|
1410
1448
|
role: "dialog",
|
|
1411
1449
|
"aria-modal": "false",
|
|
1412
|
-
className:
|
|
1450
|
+
className: cn27(Popover_default.panel, Popover_default[`--placement_${placement}`]),
|
|
1413
1451
|
children: content
|
|
1414
1452
|
}
|
|
1415
1453
|
)
|
|
@@ -1417,26 +1455,26 @@ function Popover({
|
|
|
1417
1455
|
}
|
|
1418
1456
|
|
|
1419
1457
|
// src/components/interaction/Rating/Rating.module.css
|
|
1420
|
-
var Rating_default = {"rating":"
|
|
1458
|
+
var Rating_default = {"rating":"bds0115Rating-rating","star":"bds0115Rating-star","--filled":"bds0115Rating---filled"};
|
|
1421
1459
|
|
|
1422
1460
|
// src/components/interaction/Rating/Rating.tsx
|
|
1423
|
-
import { cn as
|
|
1424
|
-
import { jsx as
|
|
1461
|
+
import { cn as cn28 } from "@boostdev/design-system-foundation";
|
|
1462
|
+
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
1425
1463
|
function Rating({ value, max = 5, className }) {
|
|
1426
|
-
return /* @__PURE__ */
|
|
1464
|
+
return /* @__PURE__ */ jsx29(
|
|
1427
1465
|
"div",
|
|
1428
1466
|
{
|
|
1429
|
-
className:
|
|
1467
|
+
className: cn28(Rating_default.rating, className),
|
|
1430
1468
|
role: "img",
|
|
1431
1469
|
"aria-label": `${value} out of ${max} stars`,
|
|
1432
|
-
children: Array.from({ length: max }).map((_, i) => /* @__PURE__ */
|
|
1470
|
+
children: Array.from({ length: max }).map((_, i) => /* @__PURE__ */ jsx29(
|
|
1433
1471
|
"svg",
|
|
1434
1472
|
{
|
|
1435
1473
|
"aria-hidden": "true",
|
|
1436
|
-
className:
|
|
1474
|
+
className: cn28(Rating_default.star, i < value && Rating_default["--filled"]),
|
|
1437
1475
|
fill: "currentColor",
|
|
1438
1476
|
viewBox: "0 0 24 24",
|
|
1439
|
-
children: /* @__PURE__ */
|
|
1477
|
+
children: /* @__PURE__ */ jsx29("path", { d: "M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" })
|
|
1440
1478
|
},
|
|
1441
1479
|
i
|
|
1442
1480
|
))
|
|
@@ -1448,11 +1486,11 @@ function Rating({ value, max = 5, className }) {
|
|
|
1448
1486
|
import { useState as useState7, useEffect as useEffect6, createContext, useContext, useCallback, useMemo as useMemo2 } from "react";
|
|
1449
1487
|
|
|
1450
1488
|
// src/components/interaction/Toast/Toast.module.css
|
|
1451
|
-
var Toast_default = {"toastContainer":"
|
|
1489
|
+
var Toast_default = {"toastContainer":"bds0115Toast-toastContainer","toast":"bds0115Toast-toast","--variant_success":"bds0115Toast---variant_success","--variant_warning":"bds0115Toast---variant_warning","--variant_info":"bds0115Toast---variant_info","--variant_error":"bds0115Toast---variant_error","message":"bds0115Toast-message","closeButton":"bds0115Toast-closeButton"};
|
|
1452
1490
|
|
|
1453
1491
|
// src/components/interaction/Toast/Toast.tsx
|
|
1454
|
-
import { cn as
|
|
1455
|
-
import { jsx as
|
|
1492
|
+
import { cn as cn29 } from "@boostdev/design-system-foundation";
|
|
1493
|
+
import { jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
1456
1494
|
var ToastContext = createContext(void 0);
|
|
1457
1495
|
function ToastProvider({ children }) {
|
|
1458
1496
|
const [toasts, setToasts] = useState7([]);
|
|
@@ -1464,9 +1502,9 @@ function ToastProvider({ children }) {
|
|
|
1464
1502
|
setToasts((prev) => prev.filter((toast) => toast.id !== id));
|
|
1465
1503
|
}, []);
|
|
1466
1504
|
const value = useMemo2(() => ({ showToast }), [showToast]);
|
|
1467
|
-
return /* @__PURE__ */
|
|
1505
|
+
return /* @__PURE__ */ jsxs22(ToastContext.Provider, { value, children: [
|
|
1468
1506
|
children,
|
|
1469
|
-
/* @__PURE__ */
|
|
1507
|
+
/* @__PURE__ */ jsx30("div", { className: Toast_default.toastContainer, children: toasts.map((toast) => /* @__PURE__ */ jsx30(
|
|
1470
1508
|
ToastItem,
|
|
1471
1509
|
{
|
|
1472
1510
|
toast,
|
|
@@ -1481,9 +1519,9 @@ function ToastItem({ toast, onRemove }) {
|
|
|
1481
1519
|
const timer = setTimeout(onRemove, 5e3);
|
|
1482
1520
|
return () => clearTimeout(timer);
|
|
1483
1521
|
}, [onRemove]);
|
|
1484
|
-
return /* @__PURE__ */
|
|
1485
|
-
/* @__PURE__ */
|
|
1486
|
-
/* @__PURE__ */
|
|
1522
|
+
return /* @__PURE__ */ jsxs22("div", { className: cn29(Toast_default.toast, Toast_default[`--variant_${toast.variant}`]), role: "status", children: [
|
|
1523
|
+
/* @__PURE__ */ jsx30("span", { className: Toast_default.message, children: toast.message }),
|
|
1524
|
+
/* @__PURE__ */ jsx30("button", { type: "button", className: Toast_default.closeButton, onClick: onRemove, "aria-label": "Dismiss", children: /* @__PURE__ */ jsx30("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx30("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6L6 18M6 6l12 12" }) }) })
|
|
1487
1525
|
] });
|
|
1488
1526
|
}
|
|
1489
1527
|
function useToast() {
|
|
@@ -1498,50 +1536,50 @@ function useToast() {
|
|
|
1498
1536
|
import { useId as useId9 } from "react";
|
|
1499
1537
|
|
|
1500
1538
|
// src/components/interaction/form/Checkbox/Checkbox.module.css
|
|
1501
|
-
var Checkbox_default = {"checkboxGroup":"
|
|
1539
|
+
var Checkbox_default = {"checkboxGroup":"bds0115Checkbox-checkboxGroup","inputWrapper":"bds0115Checkbox-inputWrapper","checkbox":"bds0115Checkbox-checkbox","checkboxError":"bds0115Checkbox-checkboxError"};
|
|
1502
1540
|
|
|
1503
1541
|
// src/components/interaction/form/atoms/Message.module.css
|
|
1504
|
-
var Message_default = {"error":"
|
|
1542
|
+
var Message_default = {"error":"bds0115Message-error","hint":"bds0115Message-hint"};
|
|
1505
1543
|
|
|
1506
1544
|
// src/components/interaction/form/atoms/Message.tsx
|
|
1507
|
-
import { jsx as
|
|
1545
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
1508
1546
|
var Message = ({ message, type, inputId }) => {
|
|
1509
1547
|
if (!message) return null;
|
|
1510
|
-
return /* @__PURE__ */
|
|
1548
|
+
return /* @__PURE__ */ jsx31("p", { id: inputId + type, className: Message_default[type], children: message });
|
|
1511
1549
|
};
|
|
1512
1550
|
|
|
1513
1551
|
// src/components/interaction/form/atoms/Label.module.css
|
|
1514
|
-
var Label_default = {"label":"
|
|
1552
|
+
var Label_default = {"label":"bds0115Label-label"};
|
|
1515
1553
|
|
|
1516
1554
|
// src/components/interaction/form/atoms/Label.tsx
|
|
1517
|
-
import { jsx as
|
|
1555
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
1518
1556
|
var Label = ({ label, id }) => {
|
|
1519
|
-
return /* @__PURE__ */
|
|
1557
|
+
return /* @__PURE__ */ jsx32("label", { htmlFor: id, className: Label_default.label, children: label });
|
|
1520
1558
|
};
|
|
1521
1559
|
|
|
1522
1560
|
// src/components/interaction/form/Checkbox/Checkbox.tsx
|
|
1523
|
-
import { cn as
|
|
1561
|
+
import { cn as cn31 } from "@boostdev/design-system-foundation";
|
|
1524
1562
|
|
|
1525
1563
|
// src/components/interaction/form/atoms/InputContainer.module.css
|
|
1526
|
-
var InputContainer_default = {"container":"
|
|
1564
|
+
var InputContainer_default = {"container":"bds0115InputContainer-container"};
|
|
1527
1565
|
|
|
1528
1566
|
// src/components/interaction/form/atoms/InputContainer.tsx
|
|
1529
|
-
import { cn as
|
|
1530
|
-
import { jsx as
|
|
1567
|
+
import { cn as cn30 } from "@boostdev/design-system-foundation";
|
|
1568
|
+
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
1531
1569
|
var InputContainer = ({ children, className }) => {
|
|
1532
|
-
return /* @__PURE__ */
|
|
1570
|
+
return /* @__PURE__ */ jsx33("div", { className: cn30(InputContainer_default.container, className), children });
|
|
1533
1571
|
};
|
|
1534
1572
|
|
|
1535
1573
|
// src/components/interaction/form/Checkbox/Checkbox.tsx
|
|
1536
|
-
import { jsx as
|
|
1574
|
+
import { jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
1537
1575
|
function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
1538
1576
|
const id = name + useId9();
|
|
1539
1577
|
const hintId = id + "hint";
|
|
1540
1578
|
const errorId = id + "error";
|
|
1541
1579
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1542
|
-
return /* @__PURE__ */
|
|
1543
|
-
/* @__PURE__ */
|
|
1544
|
-
/* @__PURE__ */
|
|
1580
|
+
return /* @__PURE__ */ jsxs23(InputContainer, { className: cn31(Checkbox_default.checkboxGroup, className), children: [
|
|
1581
|
+
/* @__PURE__ */ jsxs23("div", { className: Checkbox_default.inputWrapper, children: [
|
|
1582
|
+
/* @__PURE__ */ jsx34(
|
|
1545
1583
|
"input",
|
|
1546
1584
|
{
|
|
1547
1585
|
"aria-describedby": describedBy,
|
|
@@ -1549,14 +1587,14 @@ function Checkbox({ label, name, error, hint, className, ...props }) {
|
|
|
1549
1587
|
type: "checkbox",
|
|
1550
1588
|
id,
|
|
1551
1589
|
name,
|
|
1552
|
-
className:
|
|
1590
|
+
className: cn31(Checkbox_default.checkbox, error && Checkbox_default.checkboxError),
|
|
1553
1591
|
...props
|
|
1554
1592
|
}
|
|
1555
1593
|
),
|
|
1556
|
-
/* @__PURE__ */
|
|
1594
|
+
/* @__PURE__ */ jsx34(Label, { id, label })
|
|
1557
1595
|
] }),
|
|
1558
|
-
/* @__PURE__ */
|
|
1559
|
-
/* @__PURE__ */
|
|
1596
|
+
/* @__PURE__ */ jsx34(Message, { inputId: id, type: "error", message: error }),
|
|
1597
|
+
/* @__PURE__ */ jsx34(Message, { inputId: id, type: "hint", message: hint })
|
|
1560
1598
|
] });
|
|
1561
1599
|
}
|
|
1562
1600
|
|
|
@@ -1570,11 +1608,11 @@ import {
|
|
|
1570
1608
|
} from "react";
|
|
1571
1609
|
|
|
1572
1610
|
// src/components/interaction/form/Combobox/Combobox.module.css
|
|
1573
|
-
var Combobox_default = {"formGroup":"
|
|
1611
|
+
var Combobox_default = {"formGroup":"bds0115Combobox-formGroup","inputWrapper":"bds0115Combobox-inputWrapper","input":"bds0115Combobox-input","inputError":"bds0115Combobox-inputError","chevron":"bds0115Combobox-chevron","listbox":"bds0115Combobox-listbox","option":"bds0115Combobox-option","--highlighted":"bds0115Combobox---highlighted","--selected":"bds0115Combobox---selected","--disabled":"bds0115Combobox---disabled"};
|
|
1574
1612
|
|
|
1575
1613
|
// src/components/interaction/form/Combobox/Combobox.tsx
|
|
1576
|
-
import { cn as
|
|
1577
|
-
import { jsx as
|
|
1614
|
+
import { cn as cn32 } from "@boostdev/design-system-foundation";
|
|
1615
|
+
import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
1578
1616
|
function Combobox({
|
|
1579
1617
|
label,
|
|
1580
1618
|
name,
|
|
@@ -1652,10 +1690,10 @@ function Combobox({
|
|
|
1652
1690
|
setIsOpen(false);
|
|
1653
1691
|
}
|
|
1654
1692
|
};
|
|
1655
|
-
return /* @__PURE__ */
|
|
1656
|
-
/* @__PURE__ */
|
|
1657
|
-
/* @__PURE__ */
|
|
1658
|
-
/* @__PURE__ */
|
|
1693
|
+
return /* @__PURE__ */ jsxs24(InputContainer, { className: cn32(Combobox_default.formGroup, className), children: [
|
|
1694
|
+
/* @__PURE__ */ jsx35(Label, { id, label }),
|
|
1695
|
+
/* @__PURE__ */ jsxs24("div", { ref: containerRef, className: Combobox_default.inputWrapper, children: [
|
|
1696
|
+
/* @__PURE__ */ jsx35(
|
|
1659
1697
|
"input",
|
|
1660
1698
|
{
|
|
1661
1699
|
ref: inputRef,
|
|
@@ -1674,28 +1712,28 @@ function Combobox({
|
|
|
1674
1712
|
placeholder,
|
|
1675
1713
|
value: inputValue,
|
|
1676
1714
|
disabled,
|
|
1677
|
-
className:
|
|
1715
|
+
className: cn32(Combobox_default.input, error ? Combobox_default.inputError : void 0),
|
|
1678
1716
|
onChange: handleInputChange,
|
|
1679
1717
|
onKeyDown: handleKeyDown,
|
|
1680
1718
|
onFocus: () => setIsOpen(true)
|
|
1681
1719
|
}
|
|
1682
1720
|
),
|
|
1683
|
-
/* @__PURE__ */
|
|
1684
|
-
isOpen && filtered.length > 0 && /* @__PURE__ */
|
|
1721
|
+
/* @__PURE__ */ jsx35("span", { className: Combobox_default.chevron, "aria-hidden": "true", children: /* @__PURE__ */ jsx35("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx35("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 9l6 6 6-6" }) }) }),
|
|
1722
|
+
isOpen && filtered.length > 0 && /* @__PURE__ */ jsx35(
|
|
1685
1723
|
"ul",
|
|
1686
1724
|
{
|
|
1687
1725
|
id: listboxId,
|
|
1688
1726
|
role: "listbox",
|
|
1689
1727
|
"aria-label": String(label),
|
|
1690
1728
|
className: Combobox_default.listbox,
|
|
1691
|
-
children: filtered.map((option, index) => /* @__PURE__ */
|
|
1729
|
+
children: filtered.map((option, index) => /* @__PURE__ */ jsx35(
|
|
1692
1730
|
"li",
|
|
1693
1731
|
{
|
|
1694
1732
|
id: getOptionId(index),
|
|
1695
1733
|
role: "option",
|
|
1696
1734
|
"aria-selected": option.value === value,
|
|
1697
1735
|
"aria-disabled": option.disabled,
|
|
1698
|
-
className:
|
|
1736
|
+
className: cn32(
|
|
1699
1737
|
Combobox_default.option,
|
|
1700
1738
|
index === highlightedIndex ? Combobox_default["--highlighted"] : void 0,
|
|
1701
1739
|
option.value === value ? Combobox_default["--selected"] : void 0,
|
|
@@ -1712,8 +1750,8 @@ function Combobox({
|
|
|
1712
1750
|
}
|
|
1713
1751
|
)
|
|
1714
1752
|
] }),
|
|
1715
|
-
/* @__PURE__ */
|
|
1716
|
-
/* @__PURE__ */
|
|
1753
|
+
/* @__PURE__ */ jsx35(Message, { inputId: id, type: "error", message: error }),
|
|
1754
|
+
/* @__PURE__ */ jsx35(Message, { inputId: id, type: "hint", message: hint })
|
|
1717
1755
|
] });
|
|
1718
1756
|
}
|
|
1719
1757
|
|
|
@@ -1721,11 +1759,11 @@ function Combobox({
|
|
|
1721
1759
|
import { useId as useId11, useRef as useRef9, useState as useState9 } from "react";
|
|
1722
1760
|
|
|
1723
1761
|
// src/components/interaction/form/FileInput/FileInput.module.css
|
|
1724
|
-
var FileInput_default = {"formGroup":"
|
|
1762
|
+
var FileInput_default = {"formGroup":"bds0115FileInput-formGroup","dropZone":"bds0115FileInput-dropZone","isDragging":"bds0115FileInput-isDragging","hasError":"bds0115FileInput-hasError","isDisabled":"bds0115FileInput-isDisabled","icon":"bds0115FileInput-icon","prompt":"bds0115FileInput-prompt","acceptHint":"bds0115FileInput-acceptHint","hiddenInput":"bds0115FileInput-hiddenInput"};
|
|
1725
1763
|
|
|
1726
1764
|
// src/components/interaction/form/FileInput/FileInput.tsx
|
|
1727
|
-
import { cn as
|
|
1728
|
-
import { Fragment as Fragment3, jsx as
|
|
1765
|
+
import { cn as cn33 } from "@boostdev/design-system-foundation";
|
|
1766
|
+
import { Fragment as Fragment3, jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
1729
1767
|
function FileInput({
|
|
1730
1768
|
label,
|
|
1731
1769
|
name,
|
|
@@ -1773,24 +1811,24 @@ function FileInput({
|
|
|
1773
1811
|
if (!disabled) setIsDragging(true);
|
|
1774
1812
|
};
|
|
1775
1813
|
const handleDragLeave = () => setIsDragging(false);
|
|
1776
|
-
return /* @__PURE__ */
|
|
1777
|
-
/* @__PURE__ */
|
|
1778
|
-
/* @__PURE__ */
|
|
1814
|
+
return /* @__PURE__ */ jsxs25(InputContainer, { className: cn33(FileInput_default.formGroup, className), children: [
|
|
1815
|
+
/* @__PURE__ */ jsx36(Label, { id: uid, label }),
|
|
1816
|
+
/* @__PURE__ */ jsxs25(
|
|
1779
1817
|
"label",
|
|
1780
1818
|
{
|
|
1781
1819
|
htmlFor: uid,
|
|
1782
|
-
className:
|
|
1820
|
+
className: cn33(FileInput_default.dropZone, isDragging && FileInput_default.isDragging, error && FileInput_default.hasError, disabled && FileInput_default.isDisabled),
|
|
1783
1821
|
onDrop: handleDrop,
|
|
1784
1822
|
onDragOver: handleDragOver,
|
|
1785
1823
|
onDragLeave: handleDragLeave,
|
|
1786
1824
|
children: [
|
|
1787
|
-
/* @__PURE__ */
|
|
1788
|
-
/* @__PURE__ */
|
|
1789
|
-
/* @__PURE__ */
|
|
1825
|
+
/* @__PURE__ */ jsx36("svg", { "aria-hidden": "true", className: FileInput_default.icon, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx36("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" }) }),
|
|
1826
|
+
/* @__PURE__ */ jsx36("span", { className: FileInput_default.prompt, children: fileNames.length > 0 ? fileNames.join(", ") : /* @__PURE__ */ jsxs25(Fragment3, { children: [
|
|
1827
|
+
/* @__PURE__ */ jsx36("strong", { children: "Click to upload" }),
|
|
1790
1828
|
" or drag and drop"
|
|
1791
1829
|
] }) }),
|
|
1792
|
-
accept && /* @__PURE__ */
|
|
1793
|
-
/* @__PURE__ */
|
|
1830
|
+
accept && /* @__PURE__ */ jsx36("span", { className: FileInput_default.acceptHint, children: accept }),
|
|
1831
|
+
/* @__PURE__ */ jsx36(
|
|
1794
1832
|
"input",
|
|
1795
1833
|
{
|
|
1796
1834
|
ref: inputRef,
|
|
@@ -1809,8 +1847,8 @@ function FileInput({
|
|
|
1809
1847
|
]
|
|
1810
1848
|
}
|
|
1811
1849
|
),
|
|
1812
|
-
/* @__PURE__ */
|
|
1813
|
-
/* @__PURE__ */
|
|
1850
|
+
/* @__PURE__ */ jsx36(Message, { inputId: uid, type: "error", message: error }),
|
|
1851
|
+
/* @__PURE__ */ jsx36(Message, { inputId: uid, type: "hint", message: hint })
|
|
1814
1852
|
] });
|
|
1815
1853
|
}
|
|
1816
1854
|
|
|
@@ -1818,11 +1856,11 @@ function FileInput({
|
|
|
1818
1856
|
import { useId as useId12 } from "react";
|
|
1819
1857
|
|
|
1820
1858
|
// src/components/interaction/form/FormInput/FormInput.module.css
|
|
1821
|
-
var FormInput_default = {"formGroup":"
|
|
1859
|
+
var FormInput_default = {"formGroup":"bds0115FormInput-formGroup","input":"bds0115FormInput-input","inputError":"bds0115FormInput-inputError"};
|
|
1822
1860
|
|
|
1823
1861
|
// src/components/interaction/form/FormInput/FormInput.tsx
|
|
1824
|
-
import { cn as
|
|
1825
|
-
import { jsx as
|
|
1862
|
+
import { cn as cn34 } from "@boostdev/design-system-foundation";
|
|
1863
|
+
import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
1826
1864
|
function FormInput({
|
|
1827
1865
|
label,
|
|
1828
1866
|
name,
|
|
@@ -1836,9 +1874,9 @@ function FormInput({
|
|
|
1836
1874
|
const hintId = id + "hint";
|
|
1837
1875
|
const errorId = id + "error";
|
|
1838
1876
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1839
|
-
return /* @__PURE__ */
|
|
1840
|
-
/* @__PURE__ */
|
|
1841
|
-
/* @__PURE__ */
|
|
1877
|
+
return /* @__PURE__ */ jsxs26(InputContainer, { className: cn34(FormInput_default.formGroup, className), children: [
|
|
1878
|
+
/* @__PURE__ */ jsx37(Label, { id, label }),
|
|
1879
|
+
/* @__PURE__ */ jsx37(
|
|
1842
1880
|
"input",
|
|
1843
1881
|
{
|
|
1844
1882
|
"aria-invalid": !!error,
|
|
@@ -1846,12 +1884,12 @@ function FormInput({
|
|
|
1846
1884
|
"aria-label": ariaLabel,
|
|
1847
1885
|
id,
|
|
1848
1886
|
name,
|
|
1849
|
-
className:
|
|
1887
|
+
className: cn34(FormInput_default.input, error && FormInput_default.inputError),
|
|
1850
1888
|
...props
|
|
1851
1889
|
}
|
|
1852
1890
|
),
|
|
1853
|
-
/* @__PURE__ */
|
|
1854
|
-
/* @__PURE__ */
|
|
1891
|
+
/* @__PURE__ */ jsx37(Message, { inputId: id, type: "error", message: error }),
|
|
1892
|
+
/* @__PURE__ */ jsx37(Message, { inputId: id, type: "hint", message: hint })
|
|
1855
1893
|
] });
|
|
1856
1894
|
}
|
|
1857
1895
|
|
|
@@ -1859,11 +1897,11 @@ function FormInput({
|
|
|
1859
1897
|
import { useId as useId13, useRef as useRef10, useState as useState10 } from "react";
|
|
1860
1898
|
|
|
1861
1899
|
// src/components/interaction/form/NumberInput/NumberInput.module.css
|
|
1862
|
-
var NumberInput_default = {"formGroup":"
|
|
1900
|
+
var NumberInput_default = {"formGroup":"bds0115NumberInput-formGroup","inputRow":"bds0115NumberInput-inputRow","input":"bds0115NumberInput-input","inputError":"bds0115NumberInput-inputError","stepper":"bds0115NumberInput-stepper"};
|
|
1863
1901
|
|
|
1864
1902
|
// src/components/interaction/form/NumberInput/NumberInput.tsx
|
|
1865
|
-
import { cn as
|
|
1866
|
-
import { jsx as
|
|
1903
|
+
import { cn as cn35 } from "@boostdev/design-system-foundation";
|
|
1904
|
+
import { jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
1867
1905
|
function NumberInput({
|
|
1868
1906
|
label,
|
|
1869
1907
|
name,
|
|
@@ -1895,10 +1933,10 @@ function NumberInput({
|
|
|
1895
1933
|
if (!isControlled) setInternalValue(next);
|
|
1896
1934
|
onChange?.(next);
|
|
1897
1935
|
};
|
|
1898
|
-
return /* @__PURE__ */
|
|
1899
|
-
/* @__PURE__ */
|
|
1900
|
-
/* @__PURE__ */
|
|
1901
|
-
/* @__PURE__ */
|
|
1936
|
+
return /* @__PURE__ */ jsxs27(InputContainer, { className: cn35(NumberInput_default.formGroup, className), children: [
|
|
1937
|
+
/* @__PURE__ */ jsx38(Label, { id: uid, label }),
|
|
1938
|
+
/* @__PURE__ */ jsxs27("div", { className: NumberInput_default.inputRow, children: [
|
|
1939
|
+
/* @__PURE__ */ jsx38(
|
|
1902
1940
|
"button",
|
|
1903
1941
|
{
|
|
1904
1942
|
type: "button",
|
|
@@ -1907,10 +1945,10 @@ function NumberInput({
|
|
|
1907
1945
|
disabled: disabled || min !== void 0 && currentValue <= min,
|
|
1908
1946
|
onClick: () => adjust(-step),
|
|
1909
1947
|
tabIndex: -1,
|
|
1910
|
-
children: /* @__PURE__ */
|
|
1948
|
+
children: /* @__PURE__ */ jsx38("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx38("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 12h14" }) })
|
|
1911
1949
|
}
|
|
1912
1950
|
),
|
|
1913
|
-
/* @__PURE__ */
|
|
1951
|
+
/* @__PURE__ */ jsx38(
|
|
1914
1952
|
"input",
|
|
1915
1953
|
{
|
|
1916
1954
|
ref: inputRef,
|
|
@@ -1924,7 +1962,7 @@ function NumberInput({
|
|
|
1924
1962
|
disabled,
|
|
1925
1963
|
"aria-invalid": !!error,
|
|
1926
1964
|
"aria-describedby": describedBy,
|
|
1927
|
-
className:
|
|
1965
|
+
className: cn35(NumberInput_default.input, error ? NumberInput_default.inputError : void 0),
|
|
1928
1966
|
onChange: (e) => {
|
|
1929
1967
|
const v = parseFloat(e.target.value);
|
|
1930
1968
|
if (!isControlled) setInternalValue(isNaN(v) ? 0 : v);
|
|
@@ -1932,7 +1970,7 @@ function NumberInput({
|
|
|
1932
1970
|
}
|
|
1933
1971
|
}
|
|
1934
1972
|
),
|
|
1935
|
-
/* @__PURE__ */
|
|
1973
|
+
/* @__PURE__ */ jsx38(
|
|
1936
1974
|
"button",
|
|
1937
1975
|
{
|
|
1938
1976
|
type: "button",
|
|
@@ -1941,12 +1979,12 @@ function NumberInput({
|
|
|
1941
1979
|
disabled: disabled || max !== void 0 && currentValue >= max,
|
|
1942
1980
|
onClick: () => adjust(step),
|
|
1943
1981
|
tabIndex: -1,
|
|
1944
|
-
children: /* @__PURE__ */
|
|
1982
|
+
children: /* @__PURE__ */ jsx38("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx38("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 5v14M5 12h14" }) })
|
|
1945
1983
|
}
|
|
1946
1984
|
)
|
|
1947
1985
|
] }),
|
|
1948
|
-
/* @__PURE__ */
|
|
1949
|
-
/* @__PURE__ */
|
|
1986
|
+
/* @__PURE__ */ jsx38(Message, { inputId: uid, type: "error", message: error }),
|
|
1987
|
+
/* @__PURE__ */ jsx38(Message, { inputId: uid, type: "hint", message: hint })
|
|
1950
1988
|
] });
|
|
1951
1989
|
}
|
|
1952
1990
|
|
|
@@ -1954,19 +1992,19 @@ function NumberInput({
|
|
|
1954
1992
|
import { useId as useId14 } from "react";
|
|
1955
1993
|
|
|
1956
1994
|
// src/components/interaction/form/Radio/Radio.module.css
|
|
1957
|
-
var Radio_default = {"radioGroup":"
|
|
1995
|
+
var Radio_default = {"radioGroup":"bds0115Radio-radioGroup","inputWrapper":"bds0115Radio-inputWrapper","textWrapper":"bds0115Radio-textWrapper","description":"bds0115Radio-description","radio":"bds0115Radio-radio","radioError":"bds0115Radio-radioError"};
|
|
1958
1996
|
|
|
1959
1997
|
// src/components/interaction/form/Radio/Radio.tsx
|
|
1960
|
-
import { cn as
|
|
1961
|
-
import { jsx as
|
|
1998
|
+
import { cn as cn36 } from "@boostdev/design-system-foundation";
|
|
1999
|
+
import { jsx as jsx39, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
1962
2000
|
function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
1963
2001
|
const id = name + useId14();
|
|
1964
2002
|
const hintId = id + "hint";
|
|
1965
2003
|
const errorId = id + "error";
|
|
1966
2004
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
1967
|
-
return /* @__PURE__ */
|
|
1968
|
-
/* @__PURE__ */
|
|
1969
|
-
/* @__PURE__ */
|
|
2005
|
+
return /* @__PURE__ */ jsxs28(InputContainer, { className: cn36(Radio_default.radioGroup, className), children: [
|
|
2006
|
+
/* @__PURE__ */ jsxs28("div", { className: Radio_default.inputWrapper, children: [
|
|
2007
|
+
/* @__PURE__ */ jsx39(
|
|
1970
2008
|
"input",
|
|
1971
2009
|
{
|
|
1972
2010
|
"aria-describedby": describedBy,
|
|
@@ -1974,17 +2012,17 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
1974
2012
|
type: "radio",
|
|
1975
2013
|
id,
|
|
1976
2014
|
name,
|
|
1977
|
-
className:
|
|
2015
|
+
className: cn36(Radio_default.radio, error && Radio_default.radioError),
|
|
1978
2016
|
...props
|
|
1979
2017
|
}
|
|
1980
2018
|
),
|
|
1981
|
-
/* @__PURE__ */
|
|
1982
|
-
/* @__PURE__ */
|
|
1983
|
-
description && /* @__PURE__ */
|
|
2019
|
+
/* @__PURE__ */ jsxs28("div", { className: Radio_default.textWrapper, children: [
|
|
2020
|
+
/* @__PURE__ */ jsx39(Label, { id, label }),
|
|
2021
|
+
description && /* @__PURE__ */ jsx39("span", { className: Radio_default.description, children: description })
|
|
1984
2022
|
] })
|
|
1985
2023
|
] }),
|
|
1986
|
-
/* @__PURE__ */
|
|
1987
|
-
/* @__PURE__ */
|
|
2024
|
+
/* @__PURE__ */ jsx39(Message, { inputId: id, type: "error", message: error }),
|
|
2025
|
+
/* @__PURE__ */ jsx39(Message, { inputId: id, type: "hint", message: hint })
|
|
1988
2026
|
] });
|
|
1989
2027
|
}
|
|
1990
2028
|
|
|
@@ -1992,11 +2030,11 @@ function Radio({ label, name, description, error, hint, className, ...props }) {
|
|
|
1992
2030
|
import { useId as useId15 } from "react";
|
|
1993
2031
|
|
|
1994
2032
|
// src/components/interaction/form/Select/Select.module.css
|
|
1995
|
-
var Select_default = {"formGroup":"
|
|
2033
|
+
var Select_default = {"formGroup":"bds0115Select-formGroup","selectWrapper":"bds0115Select-selectWrapper","select":"bds0115Select-select","selectError":"bds0115Select-selectError","chevron":"bds0115Select-chevron"};
|
|
1996
2034
|
|
|
1997
2035
|
// src/components/interaction/form/Select/Select.tsx
|
|
1998
|
-
import { cn as
|
|
1999
|
-
import { jsx as
|
|
2036
|
+
import { cn as cn37 } from "@boostdev/design-system-foundation";
|
|
2037
|
+
import { jsx as jsx40, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
2000
2038
|
function Select({
|
|
2001
2039
|
label,
|
|
2002
2040
|
name,
|
|
@@ -2011,28 +2049,28 @@ function Select({
|
|
|
2011
2049
|
const hintId = id + "hint";
|
|
2012
2050
|
const errorId = id + "error";
|
|
2013
2051
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2014
|
-
return /* @__PURE__ */
|
|
2015
|
-
/* @__PURE__ */
|
|
2016
|
-
/* @__PURE__ */
|
|
2017
|
-
/* @__PURE__ */
|
|
2052
|
+
return /* @__PURE__ */ jsxs29(InputContainer, { className: cn37(Select_default.formGroup, className), children: [
|
|
2053
|
+
/* @__PURE__ */ jsx40(Label, { id, label }),
|
|
2054
|
+
/* @__PURE__ */ jsxs29("div", { className: Select_default.selectWrapper, children: [
|
|
2055
|
+
/* @__PURE__ */ jsxs29(
|
|
2018
2056
|
"select",
|
|
2019
2057
|
{
|
|
2020
2058
|
id,
|
|
2021
2059
|
name,
|
|
2022
2060
|
"aria-invalid": !!error,
|
|
2023
2061
|
"aria-describedby": describedBy,
|
|
2024
|
-
className:
|
|
2062
|
+
className: cn37(Select_default.select, error ? Select_default.selectError : void 0),
|
|
2025
2063
|
...props,
|
|
2026
2064
|
children: [
|
|
2027
|
-
placeholder && /* @__PURE__ */
|
|
2028
|
-
options.map(({ value, label: optLabel, disabled }) => /* @__PURE__ */
|
|
2065
|
+
placeholder && /* @__PURE__ */ jsx40("option", { value: "", disabled: true, hidden: true, children: placeholder }),
|
|
2066
|
+
options.map(({ value, label: optLabel, disabled }) => /* @__PURE__ */ jsx40("option", { value, disabled, children: optLabel }, value))
|
|
2029
2067
|
]
|
|
2030
2068
|
}
|
|
2031
2069
|
),
|
|
2032
|
-
/* @__PURE__ */
|
|
2070
|
+
/* @__PURE__ */ jsx40("span", { className: Select_default.chevron, "aria-hidden": "true", children: /* @__PURE__ */ jsx40("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx40("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 9l6 6 6-6" }) }) })
|
|
2033
2071
|
] }),
|
|
2034
|
-
/* @__PURE__ */
|
|
2035
|
-
/* @__PURE__ */
|
|
2072
|
+
/* @__PURE__ */ jsx40(Message, { inputId: id, type: "error", message: error }),
|
|
2073
|
+
/* @__PURE__ */ jsx40(Message, { inputId: id, type: "hint", message: hint })
|
|
2036
2074
|
] });
|
|
2037
2075
|
}
|
|
2038
2076
|
|
|
@@ -2040,11 +2078,11 @@ function Select({
|
|
|
2040
2078
|
import { useId as useId16, useState as useState11 } from "react";
|
|
2041
2079
|
|
|
2042
2080
|
// src/components/interaction/form/Slider/Slider.module.css
|
|
2043
|
-
var Slider_default = {"formGroup":"
|
|
2081
|
+
var Slider_default = {"formGroup":"bds0115Slider-formGroup","labelRow":"bds0115Slider-labelRow","value":"bds0115Slider-value","slider":"bds0115Slider-slider","sliderError":"bds0115Slider-sliderError"};
|
|
2044
2082
|
|
|
2045
2083
|
// src/components/interaction/form/Slider/Slider.tsx
|
|
2046
|
-
import { cn as
|
|
2047
|
-
import { jsx as
|
|
2084
|
+
import { cn as cn38 } from "@boostdev/design-system-foundation";
|
|
2085
|
+
import { jsx as jsx41, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
2048
2086
|
function Slider({
|
|
2049
2087
|
label,
|
|
2050
2088
|
name,
|
|
@@ -2069,12 +2107,12 @@ function Slider({
|
|
|
2069
2107
|
if (!isControlled) setInternalValue(Number(e.target.value));
|
|
2070
2108
|
onChange?.(e);
|
|
2071
2109
|
};
|
|
2072
|
-
return /* @__PURE__ */
|
|
2073
|
-
/* @__PURE__ */
|
|
2074
|
-
/* @__PURE__ */
|
|
2075
|
-
showValue && /* @__PURE__ */
|
|
2110
|
+
return /* @__PURE__ */ jsxs30(InputContainer, { className: cn38(Slider_default.formGroup, className), children: [
|
|
2111
|
+
/* @__PURE__ */ jsxs30("div", { className: Slider_default.labelRow, children: [
|
|
2112
|
+
/* @__PURE__ */ jsx41(Label, { id, label }),
|
|
2113
|
+
showValue && /* @__PURE__ */ jsx41("span", { className: Slider_default.value, children: currentValue })
|
|
2076
2114
|
] }),
|
|
2077
|
-
/* @__PURE__ */
|
|
2115
|
+
/* @__PURE__ */ jsx41(
|
|
2078
2116
|
"input",
|
|
2079
2117
|
{
|
|
2080
2118
|
type: "range",
|
|
@@ -2086,14 +2124,14 @@ function Slider({
|
|
|
2086
2124
|
"aria-valuemin": min,
|
|
2087
2125
|
"aria-valuemax": max,
|
|
2088
2126
|
"aria-valuenow": currentValue,
|
|
2089
|
-
className:
|
|
2127
|
+
className: cn38(Slider_default.slider, error ? Slider_default.sliderError : void 0),
|
|
2090
2128
|
style: { "--slider_fill": `${fillPct}%` },
|
|
2091
2129
|
onChange: handleChange,
|
|
2092
2130
|
...props
|
|
2093
2131
|
}
|
|
2094
2132
|
),
|
|
2095
|
-
/* @__PURE__ */
|
|
2096
|
-
/* @__PURE__ */
|
|
2133
|
+
/* @__PURE__ */ jsx41(Message, { inputId: id, type: "error", message: error }),
|
|
2134
|
+
/* @__PURE__ */ jsx41(Message, { inputId: id, type: "hint", message: hint })
|
|
2097
2135
|
] });
|
|
2098
2136
|
}
|
|
2099
2137
|
|
|
@@ -2101,11 +2139,11 @@ function Slider({
|
|
|
2101
2139
|
import { useId as useId17 } from "react";
|
|
2102
2140
|
|
|
2103
2141
|
// src/components/interaction/form/Switch/Switch.module.css
|
|
2104
|
-
var Switch_default = {"switchGroup":"
|
|
2142
|
+
var Switch_default = {"switchGroup":"bds0115Switch-switchGroup","--size_small":"bds0115Switch---size_small","--size_medium":"bds0115Switch---size_medium","--size_large":"bds0115Switch---size_large","inputWrapper":"bds0115Switch-inputWrapper","trackWrapper":"bds0115Switch-trackWrapper","switch":"bds0115Switch-switch","track":"bds0115Switch-track","thumb":"bds0115Switch-thumb","switchError":"bds0115Switch-switchError"};
|
|
2105
2143
|
|
|
2106
2144
|
// src/components/interaction/form/Switch/Switch.tsx
|
|
2107
|
-
import { cn as
|
|
2108
|
-
import { jsx as
|
|
2145
|
+
import { cn as cn39 } from "@boostdev/design-system-foundation";
|
|
2146
|
+
import { jsx as jsx42, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
2109
2147
|
function Switch({
|
|
2110
2148
|
label,
|
|
2111
2149
|
name,
|
|
@@ -2119,10 +2157,10 @@ function Switch({
|
|
|
2119
2157
|
const hintId = id + "hint";
|
|
2120
2158
|
const errorId = id + "error";
|
|
2121
2159
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2122
|
-
return /* @__PURE__ */
|
|
2123
|
-
/* @__PURE__ */
|
|
2124
|
-
/* @__PURE__ */
|
|
2125
|
-
/* @__PURE__ */
|
|
2160
|
+
return /* @__PURE__ */ jsxs31(InputContainer, { className: cn39(Switch_default.switchGroup, Switch_default[`--size_${size}`], className), children: [
|
|
2161
|
+
/* @__PURE__ */ jsxs31("div", { className: Switch_default.inputWrapper, children: [
|
|
2162
|
+
/* @__PURE__ */ jsxs31("div", { className: Switch_default.trackWrapper, children: [
|
|
2163
|
+
/* @__PURE__ */ jsx42(
|
|
2126
2164
|
"input",
|
|
2127
2165
|
{
|
|
2128
2166
|
type: "checkbox",
|
|
@@ -2130,16 +2168,16 @@ function Switch({
|
|
|
2130
2168
|
id,
|
|
2131
2169
|
name,
|
|
2132
2170
|
"aria-describedby": describedBy,
|
|
2133
|
-
className:
|
|
2171
|
+
className: cn39(Switch_default.switch, error ? Switch_default.switchError : void 0),
|
|
2134
2172
|
...props
|
|
2135
2173
|
}
|
|
2136
2174
|
),
|
|
2137
|
-
/* @__PURE__ */
|
|
2175
|
+
/* @__PURE__ */ jsx42("span", { className: Switch_default.track, "aria-hidden": "true", children: /* @__PURE__ */ jsx42("span", { className: Switch_default.thumb }) })
|
|
2138
2176
|
] }),
|
|
2139
|
-
/* @__PURE__ */
|
|
2177
|
+
/* @__PURE__ */ jsx42(Label, { id, label })
|
|
2140
2178
|
] }),
|
|
2141
|
-
/* @__PURE__ */
|
|
2142
|
-
/* @__PURE__ */
|
|
2179
|
+
/* @__PURE__ */ jsx42(Message, { inputId: id, type: "error", message: error }),
|
|
2180
|
+
/* @__PURE__ */ jsx42(Message, { inputId: id, type: "hint", message: hint })
|
|
2143
2181
|
] });
|
|
2144
2182
|
}
|
|
2145
2183
|
|
|
@@ -2147,11 +2185,11 @@ function Switch({
|
|
|
2147
2185
|
import { useId as useId18 } from "react";
|
|
2148
2186
|
|
|
2149
2187
|
// src/components/interaction/form/Textarea/Textarea.module.css
|
|
2150
|
-
var Textarea_default = {"formGroup":"
|
|
2188
|
+
var Textarea_default = {"formGroup":"bds0115Textarea-formGroup","textarea":"bds0115Textarea-textarea","textareaError":"bds0115Textarea-textareaError"};
|
|
2151
2189
|
|
|
2152
2190
|
// src/components/interaction/form/Textarea/Textarea.tsx
|
|
2153
|
-
import { cn as
|
|
2154
|
-
import { jsx as
|
|
2191
|
+
import { cn as cn40 } from "@boostdev/design-system-foundation";
|
|
2192
|
+
import { jsx as jsx43, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
2155
2193
|
function Textarea({
|
|
2156
2194
|
label,
|
|
2157
2195
|
name,
|
|
@@ -2164,40 +2202,40 @@ function Textarea({
|
|
|
2164
2202
|
const hintId = id + "hint";
|
|
2165
2203
|
const errorId = id + "error";
|
|
2166
2204
|
const describedBy = [error && errorId, hint && hintId].filter(Boolean).join(" ") || void 0;
|
|
2167
|
-
return /* @__PURE__ */
|
|
2168
|
-
/* @__PURE__ */
|
|
2169
|
-
/* @__PURE__ */
|
|
2205
|
+
return /* @__PURE__ */ jsxs32(InputContainer, { className: cn40(Textarea_default.formGroup, className), children: [
|
|
2206
|
+
/* @__PURE__ */ jsx43(Label, { id, label }),
|
|
2207
|
+
/* @__PURE__ */ jsx43(
|
|
2170
2208
|
"textarea",
|
|
2171
2209
|
{
|
|
2172
2210
|
id,
|
|
2173
2211
|
name,
|
|
2174
2212
|
"aria-invalid": !!error,
|
|
2175
2213
|
"aria-describedby": describedBy,
|
|
2176
|
-
className:
|
|
2214
|
+
className: cn40(Textarea_default.textarea, error ? Textarea_default.textareaError : void 0),
|
|
2177
2215
|
...props
|
|
2178
2216
|
}
|
|
2179
2217
|
),
|
|
2180
|
-
/* @__PURE__ */
|
|
2181
|
-
/* @__PURE__ */
|
|
2218
|
+
/* @__PURE__ */ jsx43(Message, { inputId: id, type: "error", message: error }),
|
|
2219
|
+
/* @__PURE__ */ jsx43(Message, { inputId: id, type: "hint", message: hint })
|
|
2182
2220
|
] });
|
|
2183
2221
|
}
|
|
2184
2222
|
|
|
2185
2223
|
// src/components/layout/ButtonGroup/ButtonGroup.module.css
|
|
2186
|
-
var ButtonGroup_default = {"buttonGroup":"
|
|
2224
|
+
var ButtonGroup_default = {"buttonGroup":"bds0115ButtonGroup-buttonGroup","container":"bds0115ButtonGroup-container","--variant_card":"bds0115ButtonGroup---variant_card","--variant_flow":"bds0115ButtonGroup---variant_flow","--variant_modal":"bds0115ButtonGroup---variant_modal","--variant_content":"bds0115ButtonGroup---variant_content","--variant_grid":"bds0115ButtonGroup---variant_grid"};
|
|
2187
2225
|
|
|
2188
2226
|
// src/components/layout/ButtonGroup/ButtonGroup.tsx
|
|
2189
|
-
import { cn as
|
|
2190
|
-
import { jsx as
|
|
2227
|
+
import { cn as cn41 } from "@boostdev/design-system-foundation";
|
|
2228
|
+
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
2191
2229
|
function ButtonGroup({ children, className, variant }) {
|
|
2192
|
-
return /* @__PURE__ */
|
|
2230
|
+
return /* @__PURE__ */ jsx44("div", { className: cn41(ButtonGroup_default.buttonGroup, className, variant && ButtonGroup_default[`--variant_${variant}`]), children: /* @__PURE__ */ jsx44("div", { className: ButtonGroup_default.container, children }) });
|
|
2193
2231
|
}
|
|
2194
2232
|
|
|
2195
2233
|
// src/components/layout/Card/Card.module.css
|
|
2196
|
-
var Card_default = {"card":"
|
|
2234
|
+
var Card_default = {"card":"bds0115Card-card","--default":"bds0115Card---default","--elevated":"bds0115Card---elevated","--outlined":"bds0115Card---outlined","--clickable":"bds0115Card---clickable","--padding-none":"bds0115Card---padding-none","--padding-small":"bds0115Card---padding-small","--padding-medium":"bds0115Card---padding-medium","--padding-large":"bds0115Card---padding-large","--text-start":"bds0115Card---text-start","--text-center":"bds0115Card---text-center","--text-end":"bds0115Card---text-end"};
|
|
2197
2235
|
|
|
2198
2236
|
// src/components/layout/Card/Card.tsx
|
|
2199
|
-
import { cn as
|
|
2200
|
-
import { jsx as
|
|
2237
|
+
import { cn as cn42 } from "@boostdev/design-system-foundation";
|
|
2238
|
+
import { jsx as jsx45 } from "react/jsx-runtime";
|
|
2201
2239
|
function Card({
|
|
2202
2240
|
children,
|
|
2203
2241
|
className,
|
|
@@ -2208,7 +2246,7 @@ function Card({
|
|
|
2208
2246
|
onClick,
|
|
2209
2247
|
"aria-label": ariaLabel
|
|
2210
2248
|
}) {
|
|
2211
|
-
const classNames =
|
|
2249
|
+
const classNames = cn42(
|
|
2212
2250
|
Card_default.card,
|
|
2213
2251
|
Card_default[`--${variant}`],
|
|
2214
2252
|
Card_default[`--padding-${padding}`],
|
|
@@ -2217,7 +2255,7 @@ function Card({
|
|
|
2217
2255
|
className
|
|
2218
2256
|
);
|
|
2219
2257
|
const Component = onClick ? "button" : "div";
|
|
2220
|
-
return /* @__PURE__ */
|
|
2258
|
+
return /* @__PURE__ */ jsx45(
|
|
2221
2259
|
Component,
|
|
2222
2260
|
{
|
|
2223
2261
|
className: classNames,
|
|
@@ -2231,11 +2269,11 @@ function Card({
|
|
|
2231
2269
|
}
|
|
2232
2270
|
|
|
2233
2271
|
// src/components/layout/SectionHeader/SectionHeader.module.css
|
|
2234
|
-
var SectionHeader_default = {"sectionHeader":"
|
|
2272
|
+
var SectionHeader_default = {"sectionHeader":"bds0115SectionHeader-sectionHeader","title":"bds0115SectionHeader-title","subtitle":"bds0115SectionHeader-subtitle","--start":"bds0115SectionHeader---start","--center":"bds0115SectionHeader---center","--end":"bds0115SectionHeader---end","--small":"bds0115SectionHeader---small","--medium":"bds0115SectionHeader---medium","--large":"bds0115SectionHeader---large"};
|
|
2235
2273
|
|
|
2236
2274
|
// src/components/layout/SectionHeader/SectionHeader.tsx
|
|
2237
|
-
import { cn as
|
|
2238
|
-
import { jsx as
|
|
2275
|
+
import { cn as cn43 } from "@boostdev/design-system-foundation";
|
|
2276
|
+
import { jsx as jsx46, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
2239
2277
|
function SectionHeader({
|
|
2240
2278
|
title,
|
|
2241
2279
|
subtitle,
|
|
@@ -2245,24 +2283,24 @@ function SectionHeader({
|
|
|
2245
2283
|
titleAs = "h2"
|
|
2246
2284
|
}) {
|
|
2247
2285
|
const Title = titleAs;
|
|
2248
|
-
return /* @__PURE__ */
|
|
2249
|
-
/* @__PURE__ */
|
|
2250
|
-
subtitle && /* @__PURE__ */
|
|
2286
|
+
return /* @__PURE__ */ jsxs33("header", { className: cn43(SectionHeader_default.sectionHeader, SectionHeader_default[`--${alignment}`], SectionHeader_default[`--${size}`], className), children: [
|
|
2287
|
+
/* @__PURE__ */ jsx46(Title, { className: SectionHeader_default.title, children: title }),
|
|
2288
|
+
subtitle && /* @__PURE__ */ jsx46("p", { className: SectionHeader_default.subtitle, children: subtitle })
|
|
2251
2289
|
] });
|
|
2252
2290
|
}
|
|
2253
2291
|
|
|
2254
2292
|
// src/components/layout/IconWrapper/IconWrapper.module.css
|
|
2255
|
-
var IconWrapper_default = {"wrapper":"
|
|
2293
|
+
var IconWrapper_default = {"wrapper":"bds0115IconWrapper-wrapper"};
|
|
2256
2294
|
|
|
2257
2295
|
// src/components/layout/IconWrapper/IconWrapper.tsx
|
|
2258
|
-
import { cn as
|
|
2259
|
-
import { jsx as
|
|
2296
|
+
import { cn as cn44 } from "@boostdev/design-system-foundation";
|
|
2297
|
+
import { jsx as jsx47 } from "react/jsx-runtime";
|
|
2260
2298
|
function IconWrapper({ children, className }) {
|
|
2261
|
-
return /* @__PURE__ */
|
|
2299
|
+
return /* @__PURE__ */ jsx47("div", { className: cn44(className, IconWrapper_default.wrapper), children });
|
|
2262
2300
|
}
|
|
2263
2301
|
|
|
2264
2302
|
// src/index.ts
|
|
2265
|
-
import { cn as
|
|
2303
|
+
import { cn as cn45 } from "@boostdev/design-system-foundation";
|
|
2266
2304
|
export {
|
|
2267
2305
|
Accordion,
|
|
2268
2306
|
Alert,
|
|
@@ -2275,6 +2313,7 @@ export {
|
|
|
2275
2313
|
Card,
|
|
2276
2314
|
Carousel,
|
|
2277
2315
|
Checkbox,
|
|
2316
|
+
Collapsible,
|
|
2278
2317
|
Combobox,
|
|
2279
2318
|
Command,
|
|
2280
2319
|
DescriptionList,
|
|
@@ -2307,6 +2346,6 @@ export {
|
|
|
2307
2346
|
ToastProvider,
|
|
2308
2347
|
Tooltip,
|
|
2309
2348
|
Typography,
|
|
2310
|
-
|
|
2349
|
+
cn45 as cn,
|
|
2311
2350
|
useToast
|
|
2312
2351
|
};
|