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