@doneisbetter/gds-core 2.6.1 → 2.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-SI66GK77.mjs → chunk-E3QXLNZO.mjs} +15 -4
- package/dist/{chunk-6B42ANK7.mjs → chunk-QEPN7PSA.mjs} +347 -285
- package/dist/client.d.mts +3 -2
- package/dist/client.d.ts +3 -2
- package/dist/client.js +520 -445
- package/dist/client.mjs +8 -2
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +520 -445
- package/dist/index.mjs +8 -2
- package/dist/server.d.mts +785 -3
- package/dist/server.d.ts +785 -3
- package/dist/server.js +486 -421
- package/dist/server.mjs +7 -1
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -26,6 +26,7 @@ __export(index_exports, {
|
|
|
26
26
|
ArticleShell: () => ArticleShell,
|
|
27
27
|
AuthShell: () => AuthShell,
|
|
28
28
|
BrowseSurface: () => BrowseSurface,
|
|
29
|
+
ChoiceChip: () => ChoiceChip,
|
|
29
30
|
ConfirmDialog: () => ConfirmDialog,
|
|
30
31
|
ConsumerDashboardGrid: () => ConsumerDashboardGrid,
|
|
31
32
|
ConsumerSection: () => ConsumerSection,
|
|
@@ -69,6 +70,8 @@ __export(index_exports, {
|
|
|
69
70
|
fr: () => fr,
|
|
70
71
|
gdsLocales: () => gdsLocales,
|
|
71
72
|
getGdsMessages: () => getGdsMessages,
|
|
73
|
+
getSemanticActionConfig: () => getSemanticActionConfig,
|
|
74
|
+
getSemanticActionLabel: () => getSemanticActionLabel,
|
|
72
75
|
he: () => he,
|
|
73
76
|
hu: () => hu,
|
|
74
77
|
it: () => it,
|
|
@@ -315,13 +318,26 @@ var GdsVocabulary = {
|
|
|
315
318
|
refer: { id: "gds.action.refer", defaultMessage: "Refer", icon: GdsIcons.Refer, feedback: { icon: GdsIcons.Refer, color: "teal", messageId: "gds.feedback.referred" } },
|
|
316
319
|
evidence: { id: "gds.action.evidence", defaultMessage: "Evidence", icon: GdsIcons.Evidence, feedback: { icon: GdsIcons.Evidence, color: "teal", messageId: "gds.feedback.added" } }
|
|
317
320
|
};
|
|
321
|
+
function getSemanticActionConfig(action) {
|
|
322
|
+
return GdsVocabulary[action];
|
|
323
|
+
}
|
|
324
|
+
function getSemanticActionLabel(action, translate) {
|
|
325
|
+
const config = getSemanticActionConfig(action);
|
|
326
|
+
return translate ? translate(config.id, config.defaultMessage) : config.defaultMessage;
|
|
327
|
+
}
|
|
318
328
|
|
|
319
329
|
// src/SemanticButton.tsx
|
|
320
330
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
321
|
-
function SemanticButton({ action, loading, feedbackState, feedbackText, ...props }) {
|
|
331
|
+
function SemanticButton({ action, loading, feedbackState, feedbackText, prerenderLabelOnly = true, ...props }) {
|
|
322
332
|
const { t } = (0, import_gds_theme.useGdsTranslation)();
|
|
323
333
|
const config = GdsVocabulary[action];
|
|
334
|
+
const [mounted, setMounted] = (0, import_react.useState)(!prerenderLabelOnly);
|
|
324
335
|
const [internalFeedback, setInternalFeedback] = (0, import_react.useState)(null);
|
|
336
|
+
(0, import_react.useEffect)(() => {
|
|
337
|
+
if (prerenderLabelOnly) {
|
|
338
|
+
setMounted(true);
|
|
339
|
+
}
|
|
340
|
+
}, [prerenderLabelOnly]);
|
|
325
341
|
(0, import_react.useEffect)(() => {
|
|
326
342
|
if (feedbackState) {
|
|
327
343
|
setInternalFeedback(feedbackState);
|
|
@@ -330,8 +346,12 @@ function SemanticButton({ action, loading, feedbackState, feedbackText, ...props
|
|
|
330
346
|
}
|
|
331
347
|
}, [feedbackState]);
|
|
332
348
|
let Icon = config.icon;
|
|
333
|
-
let label =
|
|
349
|
+
let label = getSemanticActionLabel(action, t);
|
|
334
350
|
let color = props.color;
|
|
351
|
+
if (!mounted) {
|
|
352
|
+
const { leftSection, ...buttonProps } = props;
|
|
353
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Button, { loading, color, ...buttonProps, children: getSemanticActionLabel(action) });
|
|
354
|
+
}
|
|
335
355
|
if (internalFeedback === "success") {
|
|
336
356
|
const defaultFeedback = "feedback" in config && config.feedback ? config.feedback : { icon: import_icons_react2.IconCheck, color: "teal", messageId: "gds.feedback.saved" };
|
|
337
357
|
Icon = defaultFeedback.icon;
|
|
@@ -400,34 +420,81 @@ function ThemeToggle({ size = "md" }) {
|
|
|
400
420
|
);
|
|
401
421
|
}
|
|
402
422
|
|
|
403
|
-
// src/
|
|
423
|
+
// src/ChoiceChip.tsx
|
|
404
424
|
var import_core6 = require("@mantine/core");
|
|
405
425
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
426
|
+
function ChoiceChip({
|
|
427
|
+
label,
|
|
428
|
+
active = false,
|
|
429
|
+
href,
|
|
430
|
+
onClick,
|
|
431
|
+
component,
|
|
432
|
+
...props
|
|
433
|
+
}) {
|
|
434
|
+
const sharedProps = {
|
|
435
|
+
variant: active ? "filled" : "light",
|
|
436
|
+
size: "sm",
|
|
437
|
+
radius: "xl",
|
|
438
|
+
...props
|
|
439
|
+
};
|
|
440
|
+
if (href) {
|
|
441
|
+
const LinkComponent = component || "a";
|
|
442
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
443
|
+
import_core6.Badge,
|
|
444
|
+
{
|
|
445
|
+
component: LinkComponent,
|
|
446
|
+
href,
|
|
447
|
+
"aria-current": active ? "page" : void 0,
|
|
448
|
+
...sharedProps,
|
|
449
|
+
children: label
|
|
450
|
+
}
|
|
451
|
+
);
|
|
452
|
+
}
|
|
453
|
+
if (onClick || component) {
|
|
454
|
+
const ButtonComponent = component || "button";
|
|
455
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
456
|
+
import_core6.Badge,
|
|
457
|
+
{
|
|
458
|
+
component: ButtonComponent,
|
|
459
|
+
type: component ? void 0 : "button",
|
|
460
|
+
onClick,
|
|
461
|
+
"aria-pressed": onClick ? active : void 0,
|
|
462
|
+
...sharedProps,
|
|
463
|
+
children: label
|
|
464
|
+
}
|
|
465
|
+
);
|
|
466
|
+
}
|
|
467
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Badge, { ...sharedProps, children: label });
|
|
468
|
+
}
|
|
469
|
+
|
|
470
|
+
// src/MetricCard.tsx
|
|
471
|
+
var import_core7 = require("@mantine/core");
|
|
472
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
406
473
|
var trendColors = {
|
|
407
474
|
positive: "teal",
|
|
408
475
|
negative: "red",
|
|
409
476
|
neutral: "gray"
|
|
410
477
|
};
|
|
411
478
|
function MetricCard({ label, value, description, trend, icon, footer }) {
|
|
412
|
-
return /* @__PURE__ */ (0,
|
|
413
|
-
/* @__PURE__ */ (0,
|
|
414
|
-
/* @__PURE__ */ (0,
|
|
415
|
-
/* @__PURE__ */ (0,
|
|
416
|
-
/* @__PURE__ */ (0,
|
|
479
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Stack, { gap: "md", children: [
|
|
480
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
481
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Stack, { gap: 4, children: [
|
|
482
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Text, { size: "sm", c: "dimmed", fw: 600, children: label }),
|
|
483
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Title, { order: 3, children: value })
|
|
417
484
|
] }),
|
|
418
|
-
icon ? /* @__PURE__ */ (0,
|
|
485
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.ThemeIcon, { variant: "light", size: "xl", radius: "xl", "aria-hidden": true, children: icon }) : null
|
|
419
486
|
] }),
|
|
420
|
-
description || trend ? /* @__PURE__ */ (0,
|
|
421
|
-
description ? /* @__PURE__ */ (0,
|
|
422
|
-
trend ? /* @__PURE__ */ (0,
|
|
487
|
+
description || trend ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Group, { justify: "space-between", align: "center", gap: "sm", children: [
|
|
488
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Text, { size: "sm", c: "dimmed", flex: 1, children: description }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", {}),
|
|
489
|
+
trend ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Badge, { color: trendColors[trend.tone ?? "neutral"], variant: "light", children: trend.label }) : null
|
|
423
490
|
] }) : null,
|
|
424
491
|
footer
|
|
425
492
|
] }) });
|
|
426
493
|
}
|
|
427
494
|
|
|
428
495
|
// src/ProgressCard.tsx
|
|
429
|
-
var
|
|
430
|
-
var
|
|
496
|
+
var import_core8 = require("@mantine/core");
|
|
497
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
431
498
|
function ProgressCard({
|
|
432
499
|
label,
|
|
433
500
|
value,
|
|
@@ -436,31 +503,31 @@ function ProgressCard({
|
|
|
436
503
|
description,
|
|
437
504
|
action
|
|
438
505
|
}) {
|
|
439
|
-
return /* @__PURE__ */ (0,
|
|
440
|
-
/* @__PURE__ */ (0,
|
|
441
|
-
/* @__PURE__ */ (0,
|
|
442
|
-
/* @__PURE__ */ (0,
|
|
443
|
-
/* @__PURE__ */ (0,
|
|
506
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Stack, { gap: "md", children: [
|
|
507
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Group, { justify: "space-between", align: "flex-start", children: [
|
|
508
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Stack, { gap: 4, children: [
|
|
509
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Text, { size: "sm", c: "dimmed", fw: 600, children: label }),
|
|
510
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Title, { order: 3, children: value })
|
|
444
511
|
] }),
|
|
445
512
|
action
|
|
446
513
|
] }),
|
|
447
|
-
description ? /* @__PURE__ */ (0,
|
|
448
|
-
/* @__PURE__ */ (0,
|
|
449
|
-
/* @__PURE__ */ (0,
|
|
450
|
-
/* @__PURE__ */ (0,
|
|
451
|
-
/* @__PURE__ */ (0,
|
|
514
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
515
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Stack, { gap: 6, children: [
|
|
516
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Group, { justify: "space-between", gap: "sm", children: [
|
|
517
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Text, { size: "sm", fw: 500, children: progressLabel ?? "Progress" }),
|
|
518
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Text, { size: "sm", c: "dimmed", children: [
|
|
452
519
|
Math.round(progress),
|
|
453
520
|
"%"
|
|
454
521
|
] })
|
|
455
522
|
] }),
|
|
456
|
-
/* @__PURE__ */ (0,
|
|
523
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Progress, { value: progress, radius: "xl", size: "md" })
|
|
457
524
|
] })
|
|
458
525
|
] }) });
|
|
459
526
|
}
|
|
460
527
|
|
|
461
528
|
// src/SectionPanel.tsx
|
|
462
|
-
var
|
|
463
|
-
var
|
|
529
|
+
var import_core9 = require("@mantine/core");
|
|
530
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
464
531
|
var toneBackgrounds = {
|
|
465
532
|
default: "var(--mantine-color-body)",
|
|
466
533
|
supporting: "light-dark(var(--mantine-color-gray-0), color-mix(in srgb, var(--mantine-color-dark-7) 92%, black))",
|
|
@@ -476,23 +543,23 @@ function SectionPanel({
|
|
|
476
543
|
id,
|
|
477
544
|
divided = true
|
|
478
545
|
}) {
|
|
479
|
-
return /* @__PURE__ */ (0,
|
|
480
|
-
title || description || action ? /* @__PURE__ */ (0,
|
|
481
|
-
/* @__PURE__ */ (0,
|
|
482
|
-
title || description ? /* @__PURE__ */ (0,
|
|
483
|
-
title ? /* @__PURE__ */ (0,
|
|
484
|
-
description ? /* @__PURE__ */ (0,
|
|
546
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Paper, { id, withBorder: true, radius: "xl", p: "lg", style: { background: toneBackgrounds[tone] }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Stack, { gap: "md", children: [
|
|
547
|
+
title || description || action ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
|
|
548
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
|
|
549
|
+
title || description ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Stack, { gap: 4, children: [
|
|
550
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Title, { order: 3, children: title }) : null,
|
|
551
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Text, { size: "sm", c: "dimmed", children: description }) : null
|
|
485
552
|
] }) : null,
|
|
486
553
|
action
|
|
487
554
|
] }),
|
|
488
|
-
divided ? /* @__PURE__ */ (0,
|
|
555
|
+
divided ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Divider, {}) : null
|
|
489
556
|
] }) : null,
|
|
490
557
|
children
|
|
491
558
|
] }) });
|
|
492
559
|
}
|
|
493
560
|
|
|
494
561
|
// src/ConsumerSection.tsx
|
|
495
|
-
var
|
|
562
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
496
563
|
function ConsumerSection({
|
|
497
564
|
title,
|
|
498
565
|
description,
|
|
@@ -500,23 +567,23 @@ function ConsumerSection({
|
|
|
500
567
|
children,
|
|
501
568
|
tone = "default"
|
|
502
569
|
}) {
|
|
503
|
-
return /* @__PURE__ */ (0,
|
|
570
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SectionPanel, { title, description, action, tone, children });
|
|
504
571
|
}
|
|
505
572
|
|
|
506
573
|
// src/ConsumerDashboardGrid.tsx
|
|
507
|
-
var
|
|
508
|
-
var
|
|
574
|
+
var import_core10 = require("@mantine/core");
|
|
575
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
509
576
|
function ConsumerDashboardGrid({
|
|
510
577
|
children,
|
|
511
578
|
columns = 3
|
|
512
579
|
}) {
|
|
513
|
-
return /* @__PURE__ */ (0,
|
|
580
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children });
|
|
514
581
|
}
|
|
515
582
|
|
|
516
583
|
// src/GameBoardTile.tsx
|
|
517
|
-
var
|
|
584
|
+
var import_core11 = require("@mantine/core");
|
|
518
585
|
var import_hooks = require("@mantine/hooks");
|
|
519
|
-
var
|
|
586
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
520
587
|
function GameBoardTile({
|
|
521
588
|
face,
|
|
522
589
|
revealed,
|
|
@@ -525,12 +592,12 @@ function GameBoardTile({
|
|
|
525
592
|
onPress,
|
|
526
593
|
highlightColor
|
|
527
594
|
}) {
|
|
528
|
-
const theme = (0,
|
|
595
|
+
const theme = (0, import_core11.useMantineTheme)();
|
|
529
596
|
const reduceMotion = (0, import_hooks.useMediaQuery)("(prefers-reduced-motion: reduce)");
|
|
530
597
|
const highlighted = revealed && !matched;
|
|
531
598
|
const revealBg = highlightColor ?? (typeof theme.primaryColor === "string" ? `${theme.primaryColor}.5` : "violet.5");
|
|
532
|
-
return /* @__PURE__ */ (0,
|
|
533
|
-
|
|
599
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.UnstyledButton, { w: "100%", disabled, onClick: onPress, "aria-pressed": revealed, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
600
|
+
import_core11.Paper,
|
|
534
601
|
{
|
|
535
602
|
withBorder: true,
|
|
536
603
|
radius: "md",
|
|
@@ -545,14 +612,14 @@ function GameBoardTile({
|
|
|
545
612
|
transform: reduceMotion || !highlighted ? "scale(1)" : "scale(1.02)"
|
|
546
613
|
}
|
|
547
614
|
},
|
|
548
|
-
children: /* @__PURE__ */ (0,
|
|
615
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Center, { h: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Text, { size: "xl", fw: 700, children: face }) })
|
|
549
616
|
}
|
|
550
617
|
) });
|
|
551
618
|
}
|
|
552
619
|
|
|
553
620
|
// src/EditorialCard.tsx
|
|
554
|
-
var
|
|
555
|
-
var
|
|
621
|
+
var import_core12 = require("@mantine/core");
|
|
622
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
556
623
|
var tonePalette = {
|
|
557
624
|
default: {
|
|
558
625
|
accent: "violet",
|
|
@@ -572,8 +639,8 @@ var tonePalette = {
|
|
|
572
639
|
}
|
|
573
640
|
};
|
|
574
641
|
function EditorialMediaFallback({ compact }) {
|
|
575
|
-
return /* @__PURE__ */ (0,
|
|
576
|
-
|
|
642
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.AspectRatio, { ratio: compact ? 16 / 10 : 4 / 3, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
643
|
+
import_core12.Box,
|
|
577
644
|
{
|
|
578
645
|
style: {
|
|
579
646
|
display: "grid",
|
|
@@ -583,7 +650,7 @@ function EditorialMediaFallback({ compact }) {
|
|
|
583
650
|
background: "var(--mantine-color-gray-0)",
|
|
584
651
|
borderRadius: "var(--mantine-radius-md)"
|
|
585
652
|
},
|
|
586
|
-
children: /* @__PURE__ */ (0,
|
|
653
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Gallery, { size: compact ? "1.5rem" : "2rem" })
|
|
587
654
|
}
|
|
588
655
|
) });
|
|
589
656
|
}
|
|
@@ -606,8 +673,8 @@ function EditorialCard({
|
|
|
606
673
|
const featured = variant === "featured";
|
|
607
674
|
const palette = tonePalette[tone];
|
|
608
675
|
const interactiveProps = href ? { component: "a", href } : onClick ? { component: "button", onClick, type: "button" } : {};
|
|
609
|
-
return /* @__PURE__ */ (0,
|
|
610
|
-
|
|
676
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
677
|
+
import_core12.Card,
|
|
611
678
|
{
|
|
612
679
|
className: classNames?.root,
|
|
613
680
|
withBorder: true,
|
|
@@ -621,21 +688,21 @@ function EditorialCard({
|
|
|
621
688
|
cursor: href || onClick ? "pointer" : "default"
|
|
622
689
|
},
|
|
623
690
|
children: [
|
|
624
|
-
/* @__PURE__ */ (0,
|
|
625
|
-
/* @__PURE__ */ (0,
|
|
626
|
-
/* @__PURE__ */ (0,
|
|
627
|
-
/* @__PURE__ */ (0,
|
|
628
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
629
|
-
/* @__PURE__ */ (0,
|
|
691
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Card.Section, { className: classNames?.media, children: media ?? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(EditorialMediaFallback, { compact }) }),
|
|
692
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core12.Stack, { gap: "md", p: compact ? "md" : "lg", className: classNames?.body, children: [
|
|
693
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core12.Group, { justify: "space-between", align: "flex-start", gap: "sm", wrap: "wrap", children: [
|
|
694
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core12.Stack, { gap: 4, flex: 1, children: [
|
|
695
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Text, { size: "xs", fw: 700, c: "dimmed", children: eyebrow }) : null,
|
|
696
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Title, { order: compact ? 4 : 3, className: classNames?.title, children: title })
|
|
630
697
|
] }),
|
|
631
|
-
badge ? typeof badge === "string" ? /* @__PURE__ */ (0,
|
|
698
|
+
badge ? typeof badge === "string" ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Badge, { color: palette.accent, variant: "light", children: badge }) : badge : null
|
|
632
699
|
] }),
|
|
633
|
-
description ? /* @__PURE__ */ (0,
|
|
634
|
-
meta ? /* @__PURE__ */ (0,
|
|
635
|
-
href || onClick || ctaLabel ? /* @__PURE__ */ (0,
|
|
636
|
-
/* @__PURE__ */ (0,
|
|
637
|
-
/* @__PURE__ */ (0,
|
|
638
|
-
|
|
700
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
701
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Text, { size: "sm", c: "dimmed", className: classNames?.meta, children: meta }) : null,
|
|
702
|
+
href || onClick || ctaLabel ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core12.Group, { gap: 6, c: `${palette.accent}.7`, className: classNames?.action, children: [
|
|
703
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Text, { fw: 600, size: "sm", children: ctaLabel }),
|
|
704
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
705
|
+
import_core12.Anchor,
|
|
639
706
|
{
|
|
640
707
|
component: "span",
|
|
641
708
|
underline: "never",
|
|
@@ -652,8 +719,8 @@ function EditorialCard({
|
|
|
652
719
|
}
|
|
653
720
|
|
|
654
721
|
// src/ProductCard.tsx
|
|
655
|
-
var
|
|
656
|
-
var
|
|
722
|
+
var import_core13 = require("@mantine/core");
|
|
723
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
657
724
|
function ProductCard({
|
|
658
725
|
title,
|
|
659
726
|
description,
|
|
@@ -666,39 +733,39 @@ function ProductCard({
|
|
|
666
733
|
footer
|
|
667
734
|
}) {
|
|
668
735
|
const MoreIcon = GdsIcons.Menu;
|
|
669
|
-
return /* @__PURE__ */ (0,
|
|
736
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "md", children: [
|
|
670
737
|
media,
|
|
671
|
-
/* @__PURE__ */ (0,
|
|
672
|
-
/* @__PURE__ */ (0,
|
|
673
|
-
icon ? /* @__PURE__ */ (0,
|
|
674
|
-
/* @__PURE__ */ (0,
|
|
675
|
-
/* @__PURE__ */ (0,
|
|
676
|
-
description ? /* @__PURE__ */ (0,
|
|
738
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
739
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Group, { align: "flex-start", gap: "sm", wrap: "nowrap", children: [
|
|
740
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.ThemeIcon, { variant: "light", size: "xl", radius: "xl", "aria-hidden": true, children: icon }) : null,
|
|
741
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: 4, children: [
|
|
742
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Title, { order: 4, children: title }),
|
|
743
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", c: "dimmed", lineClamp: 3, children: description }) : null
|
|
677
744
|
] })
|
|
678
745
|
] }),
|
|
679
|
-
/* @__PURE__ */ (0,
|
|
680
|
-
typeof status === "string" ? /* @__PURE__ */ (0,
|
|
681
|
-
secondaryActions.length ? /* @__PURE__ */ (0,
|
|
682
|
-
/* @__PURE__ */ (0,
|
|
683
|
-
/* @__PURE__ */ (0,
|
|
684
|
-
(action) => action.href ? /* @__PURE__ */ (0,
|
|
746
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Group, { gap: "xs", align: "center", wrap: "nowrap", children: [
|
|
747
|
+
typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Badge, { variant: "light", children: status }) : status,
|
|
748
|
+
secondaryActions.length ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Menu, { position: "bottom-end", withinPortal: true, children: [
|
|
749
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Menu.Target, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.ActionIcon, { variant: "subtle", "aria-label": "More actions", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MoreIcon, { size: "1rem" }) }) }),
|
|
750
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Menu.Dropdown, { children: secondaryActions.map(
|
|
751
|
+
(action) => action.href ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Menu.Item, { component: "a", href: action.href, color: action.color, children: action.label }, action.label) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Menu.Item, { onClick: action.onClick, color: action.color, children: action.label }, action.label)
|
|
685
752
|
) })
|
|
686
753
|
] }) : null
|
|
687
754
|
] })
|
|
688
755
|
] }),
|
|
689
|
-
metadata.length ? /* @__PURE__ */ (0,
|
|
690
|
-
/* @__PURE__ */ (0,
|
|
691
|
-
/* @__PURE__ */ (0,
|
|
756
|
+
metadata.length ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Stack, { gap: 6, children: metadata.map((item) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Group, { justify: "space-between", gap: "sm", children: [
|
|
757
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", c: "dimmed", children: item.label }),
|
|
758
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", fw: 500, ta: "right", children: item.value })
|
|
692
759
|
] }, item.label)) }) : null,
|
|
693
|
-
primaryAction ? /* @__PURE__ */ (0,
|
|
760
|
+
primaryAction ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Group, { justify: "space-between", children: primaryAction }) : null,
|
|
694
761
|
footer
|
|
695
762
|
] }) });
|
|
696
763
|
}
|
|
697
764
|
|
|
698
765
|
// src/PublicProductCard.tsx
|
|
699
766
|
var import_react2 = require("react");
|
|
700
|
-
var
|
|
701
|
-
var
|
|
767
|
+
var import_core14 = require("@mantine/core");
|
|
768
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
702
769
|
var stateConfig = {
|
|
703
770
|
available: { label: "Available", color: "teal" },
|
|
704
771
|
limited: { label: "Limited", color: "yellow" },
|
|
@@ -715,29 +782,29 @@ function enhanceAction(action, disabled) {
|
|
|
715
782
|
});
|
|
716
783
|
}
|
|
717
784
|
function ImageFallback({ compact }) {
|
|
718
|
-
return /* @__PURE__ */ (0,
|
|
719
|
-
|
|
785
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.AspectRatio, { ratio: compact ? 16 / 9 : 4 / 3, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
786
|
+
import_core14.ThemeIcon,
|
|
720
787
|
{
|
|
721
788
|
size: "100%",
|
|
722
789
|
radius: "md",
|
|
723
790
|
variant: "light",
|
|
724
791
|
color: "gray",
|
|
725
792
|
"aria-label": "No product image available",
|
|
726
|
-
children: /* @__PURE__ */ (0,
|
|
793
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(GdsIcons.Gallery, { size: compact ? "1.5rem" : "2rem" })
|
|
727
794
|
}
|
|
728
795
|
) });
|
|
729
796
|
}
|
|
730
797
|
function LoadingCard({ compact }) {
|
|
731
|
-
return /* @__PURE__ */ (0,
|
|
732
|
-
/* @__PURE__ */ (0,
|
|
733
|
-
/* @__PURE__ */ (0,
|
|
734
|
-
/* @__PURE__ */ (0,
|
|
735
|
-
/* @__PURE__ */ (0,
|
|
736
|
-
/* @__PURE__ */ (0,
|
|
798
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Card, { withBorder: true, radius: "lg", padding: compact ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "md", children: [
|
|
799
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.AspectRatio, { ratio: compact ? 16 / 9 : 4 / 3, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Skeleton, { radius: "md" }) }),
|
|
800
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "xs", children: [
|
|
801
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Skeleton, { height: 20, radius: "sm", width: "70%" }),
|
|
802
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Skeleton, { height: 14, radius: "sm", width: "100%" }),
|
|
803
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Skeleton, { height: 14, radius: "sm", width: "85%" })
|
|
737
804
|
] }),
|
|
738
|
-
/* @__PURE__ */ (0,
|
|
739
|
-
/* @__PURE__ */ (0,
|
|
740
|
-
/* @__PURE__ */ (0,
|
|
805
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", align: "center", children: [
|
|
806
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Skeleton, { height: 18, radius: "sm", width: 72 }),
|
|
807
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Skeleton, { height: 36, radius: "md", width: 120 })
|
|
741
808
|
] })
|
|
742
809
|
] }) });
|
|
743
810
|
}
|
|
@@ -760,7 +827,7 @@ function PublicProductCard({
|
|
|
760
827
|
disabled = false
|
|
761
828
|
}) {
|
|
762
829
|
if (loading) {
|
|
763
|
-
return /* @__PURE__ */ (0,
|
|
830
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(LoadingCard, { compact });
|
|
764
831
|
}
|
|
765
832
|
const isActionDisabled = disabled || state === "sold-out";
|
|
766
833
|
const resolvedPrimaryAction = enhanceAction(primaryAction, isActionDisabled);
|
|
@@ -773,46 +840,46 @@ function PublicProductCard({
|
|
|
773
840
|
const pickupHelper = helperKind === "pickup" ? helperText : pickupNote;
|
|
774
841
|
const inventoryHelper = helperKind === "inventory" ? helperText : inventoryNote;
|
|
775
842
|
const hasSupportingRegion = Boolean(price || supportingHelper || pickupHelper || inventoryHelper);
|
|
776
|
-
return /* @__PURE__ */ (0,
|
|
777
|
-
image ?? /* @__PURE__ */ (0,
|
|
778
|
-
/* @__PURE__ */ (0,
|
|
779
|
-
/* @__PURE__ */ (0,
|
|
780
|
-
/* @__PURE__ */ (0,
|
|
781
|
-
description ? /* @__PURE__ */ (0,
|
|
843
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Card, { withBorder: true, radius: "lg", padding: compact ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: compact ? "sm" : "md", children: [
|
|
844
|
+
image ?? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ImageFallback, { compact }),
|
|
845
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", gap: "sm", children: [
|
|
846
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 4, style: { minWidth: 0, flex: 1 }, children: [
|
|
847
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Title, { order: compact ? 5 : 4, lineClamp: 2, children: title }),
|
|
848
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", lineClamp: compact ? 2 : 3, children: description }) : null
|
|
782
849
|
] }),
|
|
783
|
-
/* @__PURE__ */ (0,
|
|
850
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Badge, { variant: "light", color: stateBadge.color, children: stateBadge.label })
|
|
784
851
|
] }),
|
|
785
|
-
hasSupportingRegion ? /* @__PURE__ */ (0,
|
|
786
|
-
/* @__PURE__ */ (0,
|
|
787
|
-
price ? /* @__PURE__ */ (0,
|
|
788
|
-
supportingHelper ? /* @__PURE__ */ (0,
|
|
852
|
+
hasSupportingRegion ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", align: "flex-end", gap: "sm", wrap: "nowrap", children: [
|
|
853
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 2, style: { minWidth: 0, flex: 1 }, children: [
|
|
854
|
+
price ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { fw: 700, size: compact ? "md" : "lg", children: price }) : null,
|
|
855
|
+
supportingHelper ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "xs", c: "dimmed", children: supportingHelper }) : null
|
|
789
856
|
] }),
|
|
790
857
|
resolvedPrimaryAction
|
|
791
|
-
] }) : resolvedPrimaryAction ? /* @__PURE__ */ (0,
|
|
792
|
-
pickupHelper || inventoryHelper || metadata.length ? /* @__PURE__ */ (0,
|
|
793
|
-
pickupHelper ? /* @__PURE__ */ (0,
|
|
794
|
-
/* @__PURE__ */ (0,
|
|
795
|
-
/* @__PURE__ */ (0,
|
|
858
|
+
] }) : resolvedPrimaryAction ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Group, { justify: "flex-end", children: resolvedPrimaryAction }) : null,
|
|
859
|
+
pickupHelper || inventoryHelper || metadata.length ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 6, children: [
|
|
860
|
+
pickupHelper ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", gap: "sm", children: [
|
|
861
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: "Pickup" }),
|
|
862
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", fw: 500, ta: "right", children: pickupHelper })
|
|
796
863
|
] }) : null,
|
|
797
|
-
inventoryHelper ? /* @__PURE__ */ (0,
|
|
798
|
-
/* @__PURE__ */ (0,
|
|
799
|
-
/* @__PURE__ */ (0,
|
|
864
|
+
inventoryHelper ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", gap: "sm", children: [
|
|
865
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: "Availability" }),
|
|
866
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", fw: 500, ta: "right", children: inventoryHelper })
|
|
800
867
|
] }) : null,
|
|
801
|
-
metadata.map((item) => /* @__PURE__ */ (0,
|
|
802
|
-
/* @__PURE__ */ (0,
|
|
803
|
-
/* @__PURE__ */ (0,
|
|
868
|
+
metadata.map((item) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", gap: "sm", children: [
|
|
869
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: item.label }),
|
|
870
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", fw: 500, ta: "right", children: item.value })
|
|
804
871
|
] }, item.label))
|
|
805
872
|
] }) : null,
|
|
806
|
-
resolvedSecondaryAction ? /* @__PURE__ */ (0,
|
|
873
|
+
resolvedSecondaryAction ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Group, { justify: "flex-end", children: resolvedSecondaryAction }) : null
|
|
807
874
|
] }) });
|
|
808
875
|
}
|
|
809
876
|
|
|
810
877
|
// src/BrowseSurface.tsx
|
|
811
|
-
var
|
|
878
|
+
var import_core17 = require("@mantine/core");
|
|
812
879
|
|
|
813
880
|
// src/DataToolbar.tsx
|
|
814
|
-
var
|
|
815
|
-
var
|
|
881
|
+
var import_core15 = require("@mantine/core");
|
|
882
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
816
883
|
function DataToolbar({
|
|
817
884
|
searchSlot,
|
|
818
885
|
filterSlot,
|
|
@@ -821,20 +888,20 @@ function DataToolbar({
|
|
|
821
888
|
createAction,
|
|
822
889
|
activeFilters = []
|
|
823
890
|
}) {
|
|
824
|
-
return /* @__PURE__ */ (0,
|
|
825
|
-
/* @__PURE__ */ (0,
|
|
826
|
-
/* @__PURE__ */ (0,
|
|
891
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_core15.Stack, { gap: "sm", children: [
|
|
892
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_core15.Group, { justify: "space-between", align: "flex-start", gap: "sm", children: [
|
|
893
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_core15.Group, { flex: 1, align: "flex-start", gap: "sm", children: [
|
|
827
894
|
searchSlot,
|
|
828
895
|
filterSlot,
|
|
829
896
|
sortSlot
|
|
830
897
|
] }),
|
|
831
|
-
/* @__PURE__ */ (0,
|
|
898
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_core15.Group, { gap: "sm", children: [
|
|
832
899
|
resetAction,
|
|
833
900
|
createAction
|
|
834
901
|
] })
|
|
835
902
|
] }),
|
|
836
|
-
activeFilters.length ? /* @__PURE__ */ (0,
|
|
837
|
-
|
|
903
|
+
activeFilters.length ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_core15.Group, { gap: "xs", children: activeFilters.map((filter) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
904
|
+
import_core15.Badge,
|
|
838
905
|
{
|
|
839
906
|
variant: "light",
|
|
840
907
|
rightSection: filter.onRemove ? "\xD7" : void 0,
|
|
@@ -848,17 +915,17 @@ function DataToolbar({
|
|
|
848
915
|
}
|
|
849
916
|
|
|
850
917
|
// src/StateBlock.tsx
|
|
851
|
-
var
|
|
852
|
-
var
|
|
918
|
+
var import_core16 = require("@mantine/core");
|
|
919
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
853
920
|
var variantConfig = {
|
|
854
|
-
loading: { color: "violet", icon: /* @__PURE__ */ (0,
|
|
855
|
-
empty: { color: "gray", icon: /* @__PURE__ */ (0,
|
|
856
|
-
error: { color: "red", icon: /* @__PURE__ */ (0,
|
|
857
|
-
permission: { color: "orange", icon: /* @__PURE__ */ (0,
|
|
858
|
-
disabled: { color: "gray", icon: /* @__PURE__ */ (0,
|
|
859
|
-
success: { color: "teal", icon: /* @__PURE__ */ (0,
|
|
860
|
-
info: { color: "blue", icon: /* @__PURE__ */ (0,
|
|
861
|
-
"not-enough-data": { color: "yellow", icon: /* @__PURE__ */ (0,
|
|
921
|
+
loading: { color: "violet", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Loader, { size: "sm" }) },
|
|
922
|
+
empty: { color: "gray", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Inbox, { size: "1.1rem" }) },
|
|
923
|
+
error: { color: "red", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Danger, { size: "1.1rem" }) },
|
|
924
|
+
permission: { color: "orange", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Verify, { size: "1.1rem" }) },
|
|
925
|
+
disabled: { color: "gray", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Toggle, { size: "1.1rem" }) },
|
|
926
|
+
success: { color: "teal", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Success, { size: "1.1rem" }) },
|
|
927
|
+
info: { color: "blue", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Info, { size: "1.1rem" }) },
|
|
928
|
+
"not-enough-data": { color: "yellow", icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(GdsIcons.Analytics, { size: "1.1rem" }) }
|
|
862
929
|
};
|
|
863
930
|
function StateBlock({
|
|
864
931
|
variant,
|
|
@@ -869,8 +936,8 @@ function StateBlock({
|
|
|
869
936
|
compact = false
|
|
870
937
|
}) {
|
|
871
938
|
const config = variantConfig[variant];
|
|
872
|
-
return /* @__PURE__ */ (0,
|
|
873
|
-
|
|
939
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
940
|
+
import_core16.Stack,
|
|
874
941
|
{
|
|
875
942
|
align: compact ? "flex-start" : "center",
|
|
876
943
|
justify: "center",
|
|
@@ -878,10 +945,10 @@ function StateBlock({
|
|
|
878
945
|
py: compact ? "md" : "xl",
|
|
879
946
|
ta: compact ? "left" : "center",
|
|
880
947
|
children: [
|
|
881
|
-
/* @__PURE__ */ (0,
|
|
882
|
-
/* @__PURE__ */ (0,
|
|
883
|
-
/* @__PURE__ */ (0,
|
|
884
|
-
description ? /* @__PURE__ */ (0,
|
|
948
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.ThemeIcon, { variant: "light", color: config.color, size: compact ? "lg" : "xl", radius: "xl", children: icon ?? config.icon }),
|
|
949
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core16.Stack, { gap: 6, align: compact ? "flex-start" : "center", children: [
|
|
950
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Title, { order: compact ? 4 : 3, children: title }),
|
|
951
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Text, { c: "dimmed", maw: compact ? void 0 : 480, children: description }) : null
|
|
885
952
|
] }),
|
|
886
953
|
action
|
|
887
954
|
]
|
|
@@ -890,7 +957,7 @@ function StateBlock({
|
|
|
890
957
|
}
|
|
891
958
|
|
|
892
959
|
// src/BrowseSurface.tsx
|
|
893
|
-
var
|
|
960
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
894
961
|
function BrowseSurface({
|
|
895
962
|
eyebrow,
|
|
896
963
|
title,
|
|
@@ -924,22 +991,22 @@ function BrowseSurface({
|
|
|
924
991
|
}));
|
|
925
992
|
let body = content;
|
|
926
993
|
if (loading) {
|
|
927
|
-
body = /* @__PURE__ */ (0,
|
|
994
|
+
body = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(StateBlock, { variant: "loading", title: loadingTitle, description: loadingDescription, compact: true });
|
|
928
995
|
} else if (error) {
|
|
929
|
-
body = /* @__PURE__ */ (0,
|
|
996
|
+
body = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(StateBlock, { variant: "error", title: errorTitle, description: error, action: errorAction ?? emptyAction, compact: true });
|
|
930
997
|
} else if (empty) {
|
|
931
|
-
body = /* @__PURE__ */ (0,
|
|
998
|
+
body = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, action: emptyAction, compact: true });
|
|
932
999
|
}
|
|
933
|
-
return /* @__PURE__ */ (0,
|
|
934
|
-
/* @__PURE__ */ (0,
|
|
935
|
-
/* @__PURE__ */ (0,
|
|
936
|
-
/* @__PURE__ */ (0,
|
|
937
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
938
|
-
/* @__PURE__ */ (0,
|
|
939
|
-
description ? /* @__PURE__ */ (0,
|
|
1000
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { gap: "lg", children: [
|
|
1001
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Paper, { withBorder: true, radius: "xl", p: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { gap: "lg", children: [
|
|
1002
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Group, { justify: "space-between", align: "flex-start", gap: "md", children: [
|
|
1003
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { gap: "xs", maw: 760, children: [
|
|
1004
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "xs", fw: 700, tt: "uppercase", c: "dimmed", style: { letterSpacing: "0.18em" }, children: eyebrow }) : null,
|
|
1005
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Title, { order: 1, children: title }),
|
|
1006
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "lg", c: "dimmed", children: description }) : null
|
|
940
1007
|
] }),
|
|
941
|
-
/* @__PURE__ */ (0,
|
|
942
|
-
typeof resultCount === "number" ? /* @__PURE__ */ (0,
|
|
1008
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { align: "flex-end", gap: "xs", children: [
|
|
1009
|
+
typeof resultCount === "number" ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Badge, { size: "lg", radius: "xl", variant: "light", color: "violet", children: [
|
|
943
1010
|
resultCount,
|
|
944
1011
|
" ",
|
|
945
1012
|
resultLabel
|
|
@@ -947,10 +1014,10 @@ function BrowseSurface({
|
|
|
947
1014
|
primaryControls
|
|
948
1015
|
] })
|
|
949
1016
|
] }),
|
|
950
|
-
scopeOptions.length ? /* @__PURE__ */ (0,
|
|
951
|
-
/* @__PURE__ */ (0,
|
|
952
|
-
/* @__PURE__ */ (0,
|
|
953
|
-
|
|
1017
|
+
scopeOptions.length ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { gap: "xs", children: [
|
|
1018
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "sm", fw: 600, c: "dimmed", children: scopeLabel }),
|
|
1019
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Group, { gap: "xs", wrap: "wrap", children: scopeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1020
|
+
import_core17.Button,
|
|
954
1021
|
{
|
|
955
1022
|
variant: option.active ? "filled" : "default",
|
|
956
1023
|
color: option.active ? "violet" : "gray",
|
|
@@ -962,30 +1029,30 @@ function BrowseSurface({
|
|
|
962
1029
|
option.id
|
|
963
1030
|
)) })
|
|
964
1031
|
] }) : null,
|
|
965
|
-
locationControls ? /* @__PURE__ */ (0,
|
|
966
|
-
/* @__PURE__ */ (0,
|
|
1032
|
+
locationControls ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { gap: "xs", children: [
|
|
1033
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "sm", fw: 600, c: "dimmed", children: "Location" }),
|
|
967
1034
|
locationControls
|
|
968
1035
|
] }) : null,
|
|
969
|
-
toolbar || sortControl ? /* @__PURE__ */ (0,
|
|
970
|
-
toolbar ? /* @__PURE__ */ (0,
|
|
1036
|
+
toolbar || sortControl ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.SimpleGrid, { cols: { base: 1, lg: sortControl ? 2 : 1 }, spacing: "md", children: [
|
|
1037
|
+
toolbar ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
971
1038
|
DataToolbar,
|
|
972
1039
|
{
|
|
973
1040
|
...toolbar,
|
|
974
1041
|
activeFilters: toolbarFilters.length ? toolbarFilters : toolbar.fallbackActiveFilters
|
|
975
1042
|
}
|
|
976
|
-
) : /* @__PURE__ */ (0,
|
|
977
|
-
sortControl ? /* @__PURE__ */ (0,
|
|
978
|
-
/* @__PURE__ */ (0,
|
|
1043
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Box, {}),
|
|
1044
|
+
sortControl ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { gap: "xs", align: "stretch", children: [
|
|
1045
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "sm", fw: 600, c: "dimmed", children: "Sort" }),
|
|
979
1046
|
sortControl
|
|
980
1047
|
] }) : null
|
|
981
1048
|
] }) : null,
|
|
982
|
-
mobileFilters ? /* @__PURE__ */ (0,
|
|
983
|
-
/* @__PURE__ */ (0,
|
|
1049
|
+
mobileFilters ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { hiddenFrom: "lg", gap: "xs", children: [
|
|
1050
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "sm", fw: 600, c: "dimmed", children: "Filters" }),
|
|
984
1051
|
mobileFilters
|
|
985
1052
|
] }) : null,
|
|
986
|
-
filterDrawer ? /* @__PURE__ */ (0,
|
|
987
|
-
activeFilters.length ? /* @__PURE__ */ (0,
|
|
988
|
-
|
|
1053
|
+
filterDrawer ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Box, { hiddenFrom: "lg", children: filterDrawer }) : null,
|
|
1054
|
+
activeFilters.length ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Group, { gap: "xs", wrap: "wrap", children: activeFilters.map((filter) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1055
|
+
import_core17.Badge,
|
|
989
1056
|
{
|
|
990
1057
|
variant: "light",
|
|
991
1058
|
color: "violet",
|
|
@@ -1002,8 +1069,8 @@ function BrowseSurface({
|
|
|
1002
1069
|
}
|
|
1003
1070
|
|
|
1004
1071
|
// src/AccentPanel.tsx
|
|
1005
|
-
var
|
|
1006
|
-
var
|
|
1072
|
+
var import_core18 = require("@mantine/core");
|
|
1073
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1007
1074
|
var toneStyles = {
|
|
1008
1075
|
gray: {
|
|
1009
1076
|
bg: "light-dark(var(--mantine-color-gray-0), color-mix(in srgb, var(--mantine-color-gray-7) 88%, black))",
|
|
@@ -1059,29 +1126,29 @@ function AccentPanel({
|
|
|
1059
1126
|
children
|
|
1060
1127
|
}) {
|
|
1061
1128
|
const styles = resolveAccentPanelStyles(tone, variant);
|
|
1062
|
-
return /* @__PURE__ */ (0,
|
|
1063
|
-
title || badge ? /* @__PURE__ */ (0,
|
|
1064
|
-
title ? /* @__PURE__ */ (0,
|
|
1065
|
-
badge ? typeof badge === "string" ? /* @__PURE__ */ (0,
|
|
1129
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Paper, { withBorder: true, radius: "lg", p: "lg", style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_core18.Stack, { gap: "sm", children: [
|
|
1130
|
+
title || badge ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_core18.Group, { justify: "space-between", align: "flex-start", gap: "sm", wrap: "wrap", children: [
|
|
1131
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Title, { order: 4, c: "inherit", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Box, {}),
|
|
1132
|
+
badge ? typeof badge === "string" ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Badge, { color: tone === "amber" ? "yellow" : tone, variant: "filled", children: badge }) : badge : null
|
|
1066
1133
|
] }) : null,
|
|
1067
|
-
typeof children === "string" ? /* @__PURE__ */ (0,
|
|
1134
|
+
typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Text, { c: "inherit", children }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Box, { c: "inherit", children })
|
|
1068
1135
|
] }) });
|
|
1069
1136
|
}
|
|
1070
1137
|
|
|
1071
1138
|
// src/PublicShell.tsx
|
|
1072
|
-
var
|
|
1139
|
+
var import_core20 = require("@mantine/core");
|
|
1073
1140
|
|
|
1074
1141
|
// src/PublicNav.tsx
|
|
1075
|
-
var
|
|
1076
|
-
var
|
|
1142
|
+
var import_core19 = require("@mantine/core");
|
|
1143
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
1077
1144
|
function PublicNav({ items, activeId, renderLink }) {
|
|
1078
|
-
return /* @__PURE__ */ (0,
|
|
1145
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Group, { component: "nav", "aria-label": "Primary", gap: "lg", wrap: "nowrap", children: items.map((item) => {
|
|
1079
1146
|
const active = item.id === activeId;
|
|
1080
1147
|
if (renderLink) {
|
|
1081
|
-
return /* @__PURE__ */ (0,
|
|
1148
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { children: renderLink(item, active) }, item.id);
|
|
1082
1149
|
}
|
|
1083
|
-
return /* @__PURE__ */ (0,
|
|
1084
|
-
|
|
1150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
1151
|
+
import_core19.Anchor,
|
|
1085
1152
|
{
|
|
1086
1153
|
href: item.href,
|
|
1087
1154
|
"aria-current": active ? "page" : void 0,
|
|
@@ -1098,15 +1165,15 @@ function PublicNav({ items, activeId, renderLink }) {
|
|
|
1098
1165
|
}
|
|
1099
1166
|
|
|
1100
1167
|
// src/PublicShell.tsx
|
|
1101
|
-
var
|
|
1168
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
1102
1169
|
function InlineMobileNavigation({
|
|
1103
1170
|
mobileNavigation,
|
|
1104
1171
|
className,
|
|
1105
1172
|
mode
|
|
1106
1173
|
}) {
|
|
1107
|
-
return /* @__PURE__ */ (0,
|
|
1108
|
-
/* @__PURE__ */ (0,
|
|
1109
|
-
|
|
1174
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core20.Box, { component: "details", hiddenFrom: "sm", className, children: [
|
|
1175
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
1176
|
+
import_core20.Box,
|
|
1110
1177
|
{
|
|
1111
1178
|
component: "summary",
|
|
1112
1179
|
"aria-label": mode === "drawer" ? "Open site navigation drawer" : "Open site navigation",
|
|
@@ -1118,13 +1185,13 @@ function InlineMobileNavigation({
|
|
|
1118
1185
|
gap: "0.5rem"
|
|
1119
1186
|
},
|
|
1120
1187
|
children: [
|
|
1121
|
-
/* @__PURE__ */ (0,
|
|
1122
|
-
/* @__PURE__ */ (0,
|
|
1188
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Burger, { opened: false, "aria-hidden": true }),
|
|
1189
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Text, { size: "sm", fw: 600, children: "Menu" })
|
|
1123
1190
|
]
|
|
1124
1191
|
}
|
|
1125
1192
|
),
|
|
1126
|
-
/* @__PURE__ */ (0,
|
|
1127
|
-
|
|
1193
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1194
|
+
import_core20.Box,
|
|
1128
1195
|
{
|
|
1129
1196
|
mt: "sm",
|
|
1130
1197
|
p: "sm",
|
|
@@ -1133,7 +1200,7 @@ function InlineMobileNavigation({
|
|
|
1133
1200
|
border: "1px solid var(--mantine-color-default-border)",
|
|
1134
1201
|
background: mode === "drawer" ? "light-dark(var(--mantine-color-white), color-mix(in srgb, var(--mantine-color-dark-7) 92%, black))" : "var(--mantine-color-body)"
|
|
1135
1202
|
},
|
|
1136
|
-
children: /* @__PURE__ */ (0,
|
|
1203
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Stack, { gap: "sm", children: mobileNavigation })
|
|
1137
1204
|
}
|
|
1138
1205
|
)
|
|
1139
1206
|
] });
|
|
@@ -1154,30 +1221,30 @@ function PublicShell({
|
|
|
1154
1221
|
mobileNavigationMode = "sheet",
|
|
1155
1222
|
classNames
|
|
1156
1223
|
}) {
|
|
1157
|
-
const resolvedNavigation = navigation ?? (navItems ? /* @__PURE__ */ (0,
|
|
1224
|
+
const resolvedNavigation = navigation ?? (navItems ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PublicNav, { items: navItems, activeId: activeNavId }) : null);
|
|
1158
1225
|
const containerSize = maxContentWidth ?? (compact ? "md" : "lg");
|
|
1159
1226
|
const headerHeight = headerVariant === "compact" ? 64 : headerVariant === "branded-quiet" ? 88 : 72;
|
|
1160
1227
|
const mainPadding = headerVariant === "compact" ? "lg" : "xl";
|
|
1161
1228
|
const usesInlineMobileNavigation = Boolean(mobileNavigation) && mobileNavigationMode !== "sheet";
|
|
1162
1229
|
const usesSheetMobileNavigation = Boolean(mobileNavigation) && mobileNavigationMode === "sheet";
|
|
1163
|
-
return /* @__PURE__ */ (0,
|
|
1164
|
-
|
|
1230
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
1231
|
+
import_core20.AppShell,
|
|
1165
1232
|
{
|
|
1166
1233
|
className: classNames?.root,
|
|
1167
1234
|
header: { height: headerHeight },
|
|
1168
1235
|
footer: usesSheetMobileNavigation ? { height: 68 } : void 0,
|
|
1169
1236
|
padding: 0,
|
|
1170
1237
|
children: [
|
|
1171
|
-
/* @__PURE__ */ (0,
|
|
1172
|
-
|
|
1238
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.AppShell.Header, { withBorder: headerBordered, className: classNames?.header, "data-header-variant": headerVariant, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Container, { size: containerSize, h: "100%", py: headerVariant === "branded-quiet" ? "sm" : 0, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
1239
|
+
import_core20.Group,
|
|
1173
1240
|
{
|
|
1174
1241
|
h: "100%",
|
|
1175
1242
|
justify: "space-between",
|
|
1176
1243
|
wrap: "nowrap",
|
|
1177
1244
|
gap: headerVariant === "compact" ? "sm" : "lg",
|
|
1178
1245
|
children: [
|
|
1179
|
-
/* @__PURE__ */ (0,
|
|
1180
|
-
usesInlineMobileNavigation ? /* @__PURE__ */ (0,
|
|
1246
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core20.Group, { wrap: "nowrap", gap: headerVariant === "compact" ? "xs" : "sm", className: classNames?.brand, children: [
|
|
1247
|
+
usesInlineMobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1181
1248
|
InlineMobileNavigation,
|
|
1182
1249
|
{
|
|
1183
1250
|
mobileNavigation,
|
|
@@ -1185,17 +1252,17 @@ function PublicShell({
|
|
|
1185
1252
|
mode: mobileNavigationMode
|
|
1186
1253
|
}
|
|
1187
1254
|
) : null,
|
|
1188
|
-
/* @__PURE__ */ (0,
|
|
1255
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Box, { children: brand })
|
|
1189
1256
|
] }),
|
|
1190
|
-
/* @__PURE__ */ (0,
|
|
1191
|
-
/* @__PURE__ */ (0,
|
|
1257
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Group, { visibleFrom: "sm", gap: headerVariant === "compact" ? "md" : "lg", className: classNames?.navigation, children: resolvedNavigation }),
|
|
1258
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Group, { gap: "sm", className: classNames?.actions, children: actions })
|
|
1192
1259
|
]
|
|
1193
1260
|
}
|
|
1194
1261
|
) }) }),
|
|
1195
|
-
usesSheetMobileNavigation ? /* @__PURE__ */ (0,
|
|
1196
|
-
/* @__PURE__ */ (0,
|
|
1197
|
-
/* @__PURE__ */ (0,
|
|
1198
|
-
footer ? /* @__PURE__ */ (0,
|
|
1262
|
+
usesSheetMobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.AppShell.Footer, { withBorder: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Container, { size: containerSize, h: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Group, { h: "100%", justify: "space-around", wrap: "nowrap", children: mobileNavigation }) }) }) : null,
|
|
1263
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core20.AppShell.Main, { children: [
|
|
1264
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Container, { size: containerSize, py: mainPadding, className: classNames?.content, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Stack, { gap: "xl", children }) }),
|
|
1265
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Box, { component: typeof footer === "string" ? "footer" : "div", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Container, { size: containerSize, children: typeof footer === "string" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Text, { size: "sm", c: "dimmed", children: footer }) : footer }) }) : null
|
|
1199
1266
|
] })
|
|
1200
1267
|
]
|
|
1201
1268
|
}
|
|
@@ -1203,18 +1270,18 @@ function PublicShell({
|
|
|
1203
1270
|
}
|
|
1204
1271
|
|
|
1205
1272
|
// src/PublicSiteFooter.tsx
|
|
1206
|
-
var
|
|
1207
|
-
var
|
|
1273
|
+
var import_core21 = require("@mantine/core");
|
|
1274
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
1208
1275
|
function PublicSiteFooter({ children, meta }) {
|
|
1209
|
-
return /* @__PURE__ */ (0,
|
|
1210
|
-
children ? /* @__PURE__ */ (0,
|
|
1211
|
-
meta ? /* @__PURE__ */ (0,
|
|
1276
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core21.Stack, { component: "footer", gap: "xs", children: [
|
|
1277
|
+
children ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core21.Text, { size: "sm", children }) : null,
|
|
1278
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core21.Group, { gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core21.Text, { size: "xs", c: "dimmed", children: meta }) }) : null
|
|
1212
1279
|
] });
|
|
1213
1280
|
}
|
|
1214
1281
|
|
|
1215
1282
|
// src/PublicBrandFooter.tsx
|
|
1216
|
-
var
|
|
1217
|
-
var
|
|
1283
|
+
var import_core22 = require("@mantine/core");
|
|
1284
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1218
1285
|
function PublicBrandFooter({
|
|
1219
1286
|
media,
|
|
1220
1287
|
brandTitle,
|
|
@@ -1229,8 +1296,8 @@ function PublicBrandFooter({
|
|
|
1229
1296
|
const mediaSpan = layoutVariant === "immersive-media" ? 5 : 4;
|
|
1230
1297
|
const primarySpan = media ? layoutVariant === "balanced-quote" ? 4 : 4 : secondary ? 6 : 12;
|
|
1231
1298
|
const secondarySpan = media ? Math.max(3, 12 - mediaSpan - primarySpan) : Math.max(4, 12 - primarySpan);
|
|
1232
|
-
return /* @__PURE__ */ (0,
|
|
1233
|
-
|
|
1299
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
1300
|
+
import_core22.Paper,
|
|
1234
1301
|
{
|
|
1235
1302
|
component: "footer",
|
|
1236
1303
|
withBorder: true,
|
|
@@ -1238,19 +1305,19 @@ function PublicBrandFooter({
|
|
|
1238
1305
|
p: compact ? "lg" : "xl",
|
|
1239
1306
|
className: classNames?.root,
|
|
1240
1307
|
"data-layout-variant": layoutVariant,
|
|
1241
|
-
children: /* @__PURE__ */ (0,
|
|
1242
|
-
/* @__PURE__ */ (0,
|
|
1243
|
-
media ? /* @__PURE__ */ (0,
|
|
1244
|
-
/* @__PURE__ */ (0,
|
|
1245
|
-
brandTitle ? /* @__PURE__ */ (0,
|
|
1246
|
-
description ? /* @__PURE__ */ (0,
|
|
1247
|
-
actions ? /* @__PURE__ */ (0,
|
|
1308
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core22.Stack, { gap: "lg", children: [
|
|
1309
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core22.Grid, { gutter: compact ? "lg" : "xl", align: "flex-start", children: [
|
|
1310
|
+
media ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Grid.Col, { span: { base: 12, md: mediaSpan }, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Box, { className: classNames?.media, children: media }) }) : null,
|
|
1311
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Grid.Col, { span: { base: 12, md: primarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core22.Stack, { gap: compact ? "xs" : "sm", className: classNames?.primary, children: [
|
|
1312
|
+
brandTitle ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Title, { order: 4, children: brandTitle }) : null,
|
|
1313
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Text, { c: "dimmed", children: description }) : null,
|
|
1314
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Box, { children: actions }) : null
|
|
1248
1315
|
] }) }),
|
|
1249
|
-
secondary ? /* @__PURE__ */ (0,
|
|
1316
|
+
secondary ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Grid.Col, { span: { base: 12, md: secondarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Stack, { gap: compact ? "xs" : "sm", className: classNames?.secondary, children: secondary }) }) : null
|
|
1250
1317
|
] }),
|
|
1251
|
-
legal ? /* @__PURE__ */ (0,
|
|
1252
|
-
/* @__PURE__ */ (0,
|
|
1253
|
-
/* @__PURE__ */ (0,
|
|
1318
|
+
legal ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
|
|
1319
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Divider, {}),
|
|
1320
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Group, { justify: "space-between", gap: "sm", wrap: "wrap", className: classNames?.legal, children: typeof legal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Text, { size: "sm", c: "dimmed", children: legal }) : legal })
|
|
1254
1321
|
] }) : null
|
|
1255
1322
|
] })
|
|
1256
1323
|
}
|
|
@@ -1258,45 +1325,48 @@ function PublicBrandFooter({
|
|
|
1258
1325
|
}
|
|
1259
1326
|
|
|
1260
1327
|
// src/AuthShell.tsx
|
|
1261
|
-
var
|
|
1262
|
-
var
|
|
1263
|
-
function AuthShell({ title, description, brand, footer, helper, children }) {
|
|
1264
|
-
return /* @__PURE__ */ (0,
|
|
1265
|
-
brand ? /* @__PURE__ */ (0,
|
|
1266
|
-
|
|
1267
|
-
/* @__PURE__ */ (0,
|
|
1268
|
-
|
|
1269
|
-
|
|
1328
|
+
var import_core23 = require("@mantine/core");
|
|
1329
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1330
|
+
function AuthShell({ title, description, brand, headerActions, footer, helper, children }) {
|
|
1331
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Box, { py: { base: "xl", md: "4rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Container, { size: "xs", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Stack, { gap: "xl", children: [
|
|
1332
|
+
brand || headerActions ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Group, { justify: brand && headerActions ? "space-between" : "center", align: "center", children: [
|
|
1333
|
+
brand ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Box, { children: brand }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Box, {}),
|
|
1334
|
+
headerActions ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Group, { gap: "sm", children: headerActions }) : null
|
|
1335
|
+
] }) : null,
|
|
1336
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Card, { withBorder: true, radius: "lg", padding: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Stack, { gap: "lg", children: [
|
|
1337
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Stack, { gap: "xs", ta: "center", children: [
|
|
1338
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Title, { order: 2, children: title }),
|
|
1339
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Text, { c: "dimmed", size: "sm", children: description }) : null
|
|
1270
1340
|
] }),
|
|
1271
1341
|
children,
|
|
1272
|
-
helper ? /* @__PURE__ */ (0,
|
|
1342
|
+
helper ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Text, { size: "sm", c: "dimmed", ta: "center", children: helper }) : null
|
|
1273
1343
|
] }) }),
|
|
1274
|
-
footer ? /* @__PURE__ */ (0,
|
|
1344
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Text, { size: "sm", c: "dimmed", ta: "center", children: footer }) : null
|
|
1275
1345
|
] }) }) });
|
|
1276
1346
|
}
|
|
1277
1347
|
|
|
1278
1348
|
// src/ArticleShell.tsx
|
|
1279
|
-
var
|
|
1280
|
-
var
|
|
1349
|
+
var import_core24 = require("@mantine/core");
|
|
1350
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1281
1351
|
function ArticleShell({ eyebrow, title, lead, meta, sideRail, children }) {
|
|
1282
|
-
return /* @__PURE__ */ (0,
|
|
1283
|
-
/* @__PURE__ */ (0,
|
|
1284
|
-
/* @__PURE__ */ (0,
|
|
1285
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
1286
|
-
/* @__PURE__ */ (0,
|
|
1287
|
-
lead ? /* @__PURE__ */ (0,
|
|
1288
|
-
meta ? /* @__PURE__ */ (0,
|
|
1352
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Container, { size: "lg", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
|
|
1353
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Stack, { gap: "lg", maw: 760, flex: 1, children: [
|
|
1354
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Stack, { gap: "sm", children: [
|
|
1355
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Text, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
|
|
1356
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Title, { order: 1, children: title }),
|
|
1357
|
+
lead ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Text, { size: "lg", c: "dimmed", children: lead }) : null,
|
|
1358
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Group, { gap: "md", children: meta }) : null
|
|
1289
1359
|
] }),
|
|
1290
|
-
/* @__PURE__ */ (0,
|
|
1360
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Stack, { gap: "md", children })
|
|
1291
1361
|
] }),
|
|
1292
|
-
sideRail ? /* @__PURE__ */ (0,
|
|
1362
|
+
sideRail ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
|
|
1293
1363
|
] }) });
|
|
1294
1364
|
}
|
|
1295
1365
|
|
|
1296
1366
|
// src/DocsCodeBlock.tsx
|
|
1297
1367
|
var import_react3 = require("react");
|
|
1298
|
-
var
|
|
1299
|
-
var
|
|
1368
|
+
var import_core25 = require("@mantine/core");
|
|
1369
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1300
1370
|
function DocsCodeBlock({ code, language, title, withCopy = true }) {
|
|
1301
1371
|
const [copied, setCopied] = (0, import_react3.useState)(false);
|
|
1302
1372
|
const handleCopy = async () => {
|
|
@@ -1307,44 +1377,44 @@ function DocsCodeBlock({ code, language, title, withCopy = true }) {
|
|
|
1307
1377
|
setCopied(true);
|
|
1308
1378
|
window.setTimeout(() => setCopied(false), 1200);
|
|
1309
1379
|
};
|
|
1310
|
-
return /* @__PURE__ */ (0,
|
|
1311
|
-
title || withCopy ? /* @__PURE__ */ (0,
|
|
1312
|
-
/* @__PURE__ */ (0,
|
|
1313
|
-
title ? /* @__PURE__ */ (0,
|
|
1314
|
-
language ? /* @__PURE__ */ (0,
|
|
1380
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core25.Stack, { gap: "sm", children: [
|
|
1381
|
+
title || withCopy ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core25.Group, { justify: "space-between", align: "center", children: [
|
|
1382
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core25.Stack, { gap: 0, children: [
|
|
1383
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Text, { fw: 600, children: title }) : null,
|
|
1384
|
+
language ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Text, { size: "xs", c: "dimmed", children: language }) : null
|
|
1315
1385
|
] }),
|
|
1316
|
-
withCopy ? /* @__PURE__ */ (0,
|
|
1317
|
-
|
|
1386
|
+
withCopy ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1387
|
+
import_core25.ActionIcon,
|
|
1318
1388
|
{
|
|
1319
1389
|
variant: "subtle",
|
|
1320
1390
|
"aria-label": copied ? "Copied code block" : "Copy code block",
|
|
1321
1391
|
onClick: () => {
|
|
1322
1392
|
void handleCopy();
|
|
1323
1393
|
},
|
|
1324
|
-
children: /* @__PURE__ */ (0,
|
|
1394
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GdsIcons.Copy, { size: "1rem" })
|
|
1325
1395
|
}
|
|
1326
1396
|
) : null
|
|
1327
1397
|
] }) : null,
|
|
1328
|
-
/* @__PURE__ */ (0,
|
|
1398
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Code, { block: true, children: code })
|
|
1329
1399
|
] }) });
|
|
1330
1400
|
}
|
|
1331
1401
|
|
|
1332
1402
|
// src/CtaButtonGroup.tsx
|
|
1333
|
-
var
|
|
1334
|
-
var
|
|
1403
|
+
var import_core26 = require("@mantine/core");
|
|
1404
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1335
1405
|
function CtaButtonGroup({ primary, secondary, tertiary }) {
|
|
1336
|
-
return /* @__PURE__ */ (0,
|
|
1337
|
-
/* @__PURE__ */ (0,
|
|
1338
|
-
/* @__PURE__ */ (0,
|
|
1339
|
-
secondary ? /* @__PURE__ */ (0,
|
|
1406
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core26.Stack, { gap: "sm", children: [
|
|
1407
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core26.Group, { gap: "sm", align: "stretch", children: [
|
|
1408
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { children: primary }),
|
|
1409
|
+
secondary ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { children: secondary }) : null
|
|
1340
1410
|
] }),
|
|
1341
|
-
tertiary ? /* @__PURE__ */ (0,
|
|
1411
|
+
tertiary ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { children: tertiary }) : null
|
|
1342
1412
|
] });
|
|
1343
1413
|
}
|
|
1344
1414
|
|
|
1345
1415
|
// src/DocsPageShell.tsx
|
|
1346
|
-
var
|
|
1347
|
-
var
|
|
1416
|
+
var import_core27 = require("@mantine/core");
|
|
1417
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1348
1418
|
function DocsPageShell({
|
|
1349
1419
|
breadcrumbs = [],
|
|
1350
1420
|
title,
|
|
@@ -1355,27 +1425,27 @@ function DocsPageShell({
|
|
|
1355
1425
|
footerNext,
|
|
1356
1426
|
children
|
|
1357
1427
|
}) {
|
|
1358
|
-
return /* @__PURE__ */ (0,
|
|
1359
|
-
/* @__PURE__ */ (0,
|
|
1360
|
-
breadcrumbs.length ? /* @__PURE__ */ (0,
|
|
1361
|
-
(crumb) => crumb.href ? /* @__PURE__ */ (0,
|
|
1428
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Container, { size: "lg", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
|
|
1429
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Stack, { component: "article", gap: "lg", maw: 760, flex: 1, children: [
|
|
1430
|
+
breadcrumbs.length ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Breadcrumbs, { children: breadcrumbs.map(
|
|
1431
|
+
(crumb) => crumb.href ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Anchor, { href: crumb.href, children: crumb.label }, `${crumb.label}-${crumb.href}`) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Text, { children: crumb.label }, crumb.label)
|
|
1362
1432
|
) }) : null,
|
|
1363
|
-
/* @__PURE__ */ (0,
|
|
1364
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
1365
|
-
/* @__PURE__ */ (0,
|
|
1366
|
-
lead ? /* @__PURE__ */ (0,
|
|
1367
|
-
meta ? /* @__PURE__ */ (0,
|
|
1433
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Stack, { gap: "sm", children: [
|
|
1434
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Text, { size: "sm", fw: 700, c: "dimmed", children: eyebrow }) : null,
|
|
1435
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Title, { order: 1, children: title }),
|
|
1436
|
+
lead ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Text, { size: "lg", c: "dimmed", children: lead }) : null,
|
|
1437
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Group, { gap: "md", children: meta }) : null
|
|
1368
1438
|
] }),
|
|
1369
|
-
/* @__PURE__ */ (0,
|
|
1370
|
-
footerNext ? /* @__PURE__ */ (0,
|
|
1439
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Stack, { gap: "md", children }),
|
|
1440
|
+
footerNext ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Anchor, { href: footerNext.href, fw: 600, children: footerNext.label }) : null
|
|
1371
1441
|
] }),
|
|
1372
|
-
sideRail ? /* @__PURE__ */ (0,
|
|
1442
|
+
sideRail ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
|
|
1373
1443
|
] }) });
|
|
1374
1444
|
}
|
|
1375
1445
|
|
|
1376
1446
|
// src/EditorialHero.tsx
|
|
1377
|
-
var
|
|
1378
|
-
var
|
|
1447
|
+
var import_core28 = require("@mantine/core");
|
|
1448
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1379
1449
|
function resolveActionVariant(action, index, seenPrimary) {
|
|
1380
1450
|
const requested = action.variant ?? (index === 0 ? "primary" : "secondary");
|
|
1381
1451
|
if (requested === "primary" && !seenPrimary) {
|
|
@@ -1387,8 +1457,8 @@ function resolveActionVariant(action, index, seenPrimary) {
|
|
|
1387
1457
|
return { variant: "default", seenPrimary };
|
|
1388
1458
|
}
|
|
1389
1459
|
function HeroAction({ action, variant }) {
|
|
1390
|
-
const content = /* @__PURE__ */ (0,
|
|
1391
|
-
|
|
1460
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1461
|
+
import_core28.Anchor,
|
|
1392
1462
|
{
|
|
1393
1463
|
href: action.href,
|
|
1394
1464
|
onClick: action.onClick,
|
|
@@ -1412,8 +1482,8 @@ function HeroAction({ action, variant }) {
|
|
|
1412
1482
|
}
|
|
1413
1483
|
);
|
|
1414
1484
|
if (!action.href) {
|
|
1415
|
-
return /* @__PURE__ */ (0,
|
|
1416
|
-
|
|
1485
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1486
|
+
import_core28.Box,
|
|
1417
1487
|
{
|
|
1418
1488
|
component: "button",
|
|
1419
1489
|
type: "button",
|
|
@@ -1440,30 +1510,30 @@ function HeroAction({ action, variant }) {
|
|
|
1440
1510
|
return content;
|
|
1441
1511
|
}
|
|
1442
1512
|
function LoadingHero({ compact }) {
|
|
1443
|
-
return /* @__PURE__ */ (0,
|
|
1444
|
-
/* @__PURE__ */ (0,
|
|
1445
|
-
/* @__PURE__ */ (0,
|
|
1446
|
-
/* @__PURE__ */ (0,
|
|
1447
|
-
/* @__PURE__ */ (0,
|
|
1448
|
-
/* @__PURE__ */ (0,
|
|
1449
|
-
/* @__PURE__ */ (0,
|
|
1450
|
-
/* @__PURE__ */ (0,
|
|
1451
|
-
/* @__PURE__ */ (0,
|
|
1513
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Paper, { withBorder: true, radius: "xl", p: compact ? "lg" : "xl", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
|
|
1514
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Stack, { gap: "md", children: [
|
|
1515
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { height: 16, width: 96, radius: "xl" }),
|
|
1516
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { height: 48, width: "90%", radius: "md" }),
|
|
1517
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { height: 18, width: "100%", radius: "md" }),
|
|
1518
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { height: 18, width: "82%", radius: "md" }),
|
|
1519
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Group, { children: [
|
|
1520
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { height: 40, width: 140, radius: "md" }),
|
|
1521
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { height: 40, width: 140, radius: "md" })
|
|
1452
1522
|
] })
|
|
1453
1523
|
] }) }),
|
|
1454
|
-
/* @__PURE__ */ (0,
|
|
1524
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Skeleton, { radius: "lg" }) }) })
|
|
1455
1525
|
] }) });
|
|
1456
1526
|
}
|
|
1457
1527
|
function MediaFallback() {
|
|
1458
|
-
return /* @__PURE__ */ (0,
|
|
1459
|
-
|
|
1528
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1529
|
+
import_core28.ThemeIcon,
|
|
1460
1530
|
{
|
|
1461
1531
|
size: "100%",
|
|
1462
1532
|
radius: "lg",
|
|
1463
1533
|
color: "gray",
|
|
1464
1534
|
variant: "light",
|
|
1465
1535
|
"aria-label": "Hero media is unavailable",
|
|
1466
|
-
children: /* @__PURE__ */ (0,
|
|
1536
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(GdsIcons.Gallery, { size: "2.5rem" })
|
|
1467
1537
|
}
|
|
1468
1538
|
) });
|
|
1469
1539
|
}
|
|
@@ -1483,8 +1553,8 @@ function MediaFrame({
|
|
|
1483
1553
|
} else if (mediaFade === "soft-start") {
|
|
1484
1554
|
overlayBackground = "linear-gradient(90deg, light-dark(rgba(255,255,255,0.9), rgba(17,24,39,0.72)) 0%, rgba(255,255,255,0) 28%)";
|
|
1485
1555
|
}
|
|
1486
|
-
return /* @__PURE__ */ (0,
|
|
1487
|
-
|
|
1556
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
|
1557
|
+
import_core28.Box,
|
|
1488
1558
|
{
|
|
1489
1559
|
component: "figure",
|
|
1490
1560
|
m: 0,
|
|
@@ -1497,9 +1567,9 @@ function MediaFrame({
|
|
|
1497
1567
|
},
|
|
1498
1568
|
"aria-label": mediaAlt,
|
|
1499
1569
|
children: [
|
|
1500
|
-
media ?? /* @__PURE__ */ (0,
|
|
1501
|
-
media && overlayBackground ? /* @__PURE__ */ (0,
|
|
1502
|
-
|
|
1570
|
+
media ?? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(MediaFallback, {}),
|
|
1571
|
+
media && overlayBackground ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1572
|
+
import_core28.Box,
|
|
1503
1573
|
{
|
|
1504
1574
|
"aria-hidden": true,
|
|
1505
1575
|
style: {
|
|
@@ -1532,7 +1602,7 @@ function EditorialHero({
|
|
|
1532
1602
|
classNames
|
|
1533
1603
|
}) {
|
|
1534
1604
|
if (loading) {
|
|
1535
|
-
return /* @__PURE__ */ (0,
|
|
1605
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(LoadingHero, { compact });
|
|
1536
1606
|
}
|
|
1537
1607
|
const stackAlign = align === "center" ? "center" : "flex-start";
|
|
1538
1608
|
const textAlign = align === "center" ? "center" : "left";
|
|
@@ -1540,15 +1610,15 @@ function EditorialHero({
|
|
|
1540
1610
|
const renderedActions = actions.slice(0, 3).map((action, index) => {
|
|
1541
1611
|
const resolved = resolveActionVariant(action, index, seenPrimary);
|
|
1542
1612
|
seenPrimary = resolved.seenPrimary;
|
|
1543
|
-
return /* @__PURE__ */ (0,
|
|
1613
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(HeroAction, { action, variant: resolved.variant }, `${action.label}-${index}`);
|
|
1544
1614
|
});
|
|
1545
|
-
const textSlot = /* @__PURE__ */ (0,
|
|
1546
|
-
/* @__PURE__ */ (0,
|
|
1547
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
1548
|
-
/* @__PURE__ */ (0,
|
|
1549
|
-
description ? /* @__PURE__ */ (0,
|
|
1615
|
+
const textSlot = /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Stack, { gap: compact ? "md" : "lg", justify: "center", h: "100%", className: classNames?.content, children: [
|
|
1616
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Stack, { gap: "sm", align: stackAlign, children: [
|
|
1617
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Text, { size: "sm", fw: 700, c: "dimmed", ta: textAlign, children: eyebrow }) : null,
|
|
1618
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Title, { order: 1, maw: 760, ta: textAlign, children: title }),
|
|
1619
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Text, { size: compact ? "md" : "lg", c: "dimmed", maw: 720, ta: textAlign, children: description }) : null
|
|
1550
1620
|
] }),
|
|
1551
|
-
renderedActions.length ? /* @__PURE__ */ (0,
|
|
1621
|
+
renderedActions.length ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Box, { className: classNames?.actions, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1552
1622
|
CtaButtonGroup,
|
|
1553
1623
|
{
|
|
1554
1624
|
primary: renderedActions[0],
|
|
@@ -1556,8 +1626,8 @@ function EditorialHero({
|
|
|
1556
1626
|
tertiary: renderedActions[2]
|
|
1557
1627
|
}
|
|
1558
1628
|
) }) : null,
|
|
1559
|
-
meta.length ? /* @__PURE__ */ (0,
|
|
1560
|
-
|
|
1629
|
+
meta.length ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Group, { gap: "sm", wrap: "wrap", "aria-label": "Supporting details", className: classNames?.meta, children: meta.map((item) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
|
1630
|
+
import_core28.Group,
|
|
1561
1631
|
{
|
|
1562
1632
|
gap: 6,
|
|
1563
1633
|
px: "sm",
|
|
@@ -1568,17 +1638,17 @@ function EditorialHero({
|
|
|
1568
1638
|
},
|
|
1569
1639
|
children: [
|
|
1570
1640
|
item.icon,
|
|
1571
|
-
/* @__PURE__ */ (0,
|
|
1641
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Text, { size: "sm", c: "dimmed", children: item.label })
|
|
1572
1642
|
]
|
|
1573
1643
|
},
|
|
1574
1644
|
item.id
|
|
1575
1645
|
)) }) : null
|
|
1576
1646
|
] });
|
|
1577
|
-
const mediaSlot = error ? /* @__PURE__ */ (0,
|
|
1578
|
-
const textCol = /* @__PURE__ */ (0,
|
|
1579
|
-
const mediaCol = /* @__PURE__ */ (0,
|
|
1580
|
-
return /* @__PURE__ */ (0,
|
|
1581
|
-
|
|
1647
|
+
const mediaSlot = error ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(AccentPanel, { tone: "red", variant: "soft-outline", title: "Media unavailable", children: error }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(MediaFrame, { media, mediaAlt, mediaFade, className: classNames?.media });
|
|
1648
|
+
const textCol = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 1, md: mediaPosition === "left" ? 2 : 1 }, children: textSlot });
|
|
1649
|
+
const mediaCol = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 2, md: mediaPosition === "left" ? 1 : 2 }, children: mediaSlot });
|
|
1650
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1651
|
+
import_core28.Paper,
|
|
1582
1652
|
{
|
|
1583
1653
|
component: "section",
|
|
1584
1654
|
withBorder: true,
|
|
@@ -1586,7 +1656,7 @@ function EditorialHero({
|
|
|
1586
1656
|
p: compact ? "lg" : "xl",
|
|
1587
1657
|
className: classNames?.root,
|
|
1588
1658
|
style: surfaceVariant === "flat-public" ? { boxShadow: "none" } : void 0,
|
|
1589
|
-
children: /* @__PURE__ */ (0,
|
|
1659
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
|
|
1590
1660
|
textCol,
|
|
1591
1661
|
mediaCol
|
|
1592
1662
|
] })
|
|
@@ -1595,19 +1665,19 @@ function EditorialHero({
|
|
|
1595
1665
|
}
|
|
1596
1666
|
|
|
1597
1667
|
// src/FeatureBand.tsx
|
|
1598
|
-
var
|
|
1599
|
-
var
|
|
1668
|
+
var import_core29 = require("@mantine/core");
|
|
1669
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1600
1670
|
function FeatureBandSkeleton({
|
|
1601
1671
|
columns = 3,
|
|
1602
1672
|
bordered = true,
|
|
1603
1673
|
variant = "default"
|
|
1604
1674
|
}) {
|
|
1605
|
-
return /* @__PURE__ */ (0,
|
|
1606
|
-
/* @__PURE__ */ (0,
|
|
1607
|
-
/* @__PURE__ */ (0,
|
|
1608
|
-
/* @__PURE__ */ (0,
|
|
1609
|
-
/* @__PURE__ */ (0,
|
|
1610
|
-
/* @__PURE__ */ (0,
|
|
1675
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: Array.from({ length: columns }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core29.Stack, { gap: "md", children: [
|
|
1676
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Skeleton, { height: variant === "process" ? 28 : 42, width: variant === "process" ? 72 : 42, radius: "xl" }),
|
|
1677
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core29.Stack, { gap: "xs", children: [
|
|
1678
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Skeleton, { height: 20, width: "75%", radius: "md" }),
|
|
1679
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Skeleton, { height: 14, width: "100%", radius: "md" }),
|
|
1680
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Skeleton, { height: 14, width: "82%", radius: "md" })
|
|
1611
1681
|
] })
|
|
1612
1682
|
] }) }, index)) });
|
|
1613
1683
|
}
|
|
@@ -1620,10 +1690,10 @@ function FeatureBand({
|
|
|
1620
1690
|
variant = "default"
|
|
1621
1691
|
}) {
|
|
1622
1692
|
if (loading) {
|
|
1623
|
-
return /* @__PURE__ */ (0,
|
|
1693
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(FeatureBandSkeleton, { columns, bordered, variant });
|
|
1624
1694
|
}
|
|
1625
1695
|
if (!items.length) {
|
|
1626
|
-
return emptyState ? /* @__PURE__ */ (0,
|
|
1696
|
+
return emptyState ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: emptyState }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1627
1697
|
EmptyState,
|
|
1628
1698
|
{
|
|
1629
1699
|
title: "No supporting details available",
|
|
@@ -1631,9 +1701,9 @@ function FeatureBand({
|
|
|
1631
1701
|
}
|
|
1632
1702
|
);
|
|
1633
1703
|
}
|
|
1634
|
-
return /* @__PURE__ */ (0,
|
|
1635
|
-
variant === "process" ? /* @__PURE__ */ (0,
|
|
1636
|
-
|
|
1704
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Box, { component: "section", "aria-label": "Supporting features", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core29.Stack, { gap: "md", children: [
|
|
1705
|
+
variant === "process" ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1706
|
+
import_core29.Text,
|
|
1637
1707
|
{
|
|
1638
1708
|
fw: 800,
|
|
1639
1709
|
size: "sm",
|
|
@@ -1645,19 +1715,19 @@ function FeatureBand({
|
|
|
1645
1715
|
},
|
|
1646
1716
|
children: item.stepLabel ?? `Step ${index + 1}`
|
|
1647
1717
|
}
|
|
1648
|
-
) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ (0,
|
|
1649
|
-
/* @__PURE__ */ (0,
|
|
1650
|
-
/* @__PURE__ */ (0,
|
|
1651
|
-
item.description ? /* @__PURE__ */ (0,
|
|
1652
|
-
item.meta ? /* @__PURE__ */ (0,
|
|
1718
|
+
) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "violet", children: item.icon }) }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "gray", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(GdsIcons.Info, { size: "1.25rem" }) }) }),
|
|
1719
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core29.Stack, { gap: "xs", children: [
|
|
1720
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Title, { order: 4, children: item.title }),
|
|
1721
|
+
item.description ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Text, { c: "dimmed", children: item.description }) : null,
|
|
1722
|
+
item.meta ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Text, { size: "sm", c: "dimmed", children: item.meta }) : null
|
|
1653
1723
|
] })
|
|
1654
1724
|
] }) }, item.id)) }) });
|
|
1655
1725
|
}
|
|
1656
1726
|
|
|
1657
1727
|
// src/UploadDropzone.tsx
|
|
1658
1728
|
var import_react4 = require("react");
|
|
1659
|
-
var
|
|
1660
|
-
var
|
|
1729
|
+
var import_core30 = require("@mantine/core");
|
|
1730
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1661
1731
|
function UploadDropzone({
|
|
1662
1732
|
title,
|
|
1663
1733
|
description,
|
|
@@ -1676,8 +1746,8 @@ function UploadDropzone({
|
|
|
1676
1746
|
}
|
|
1677
1747
|
onFilesSelected(Array.from(files));
|
|
1678
1748
|
};
|
|
1679
|
-
return /* @__PURE__ */ (0,
|
|
1680
|
-
|
|
1749
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
1750
|
+
import_core30.Box,
|
|
1681
1751
|
{
|
|
1682
1752
|
onDragOver: (event) => {
|
|
1683
1753
|
event.preventDefault();
|
|
@@ -1696,7 +1766,7 @@ function UploadDropzone({
|
|
|
1696
1766
|
background: dragging ? "var(--mantine-color-violet-light)" : "transparent"
|
|
1697
1767
|
},
|
|
1698
1768
|
children: [
|
|
1699
|
-
/* @__PURE__ */ (0,
|
|
1769
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1700
1770
|
"input",
|
|
1701
1771
|
{
|
|
1702
1772
|
ref: inputRef,
|
|
@@ -1707,11 +1777,11 @@ function UploadDropzone({
|
|
|
1707
1777
|
onChange: (event) => forwardFiles(event.currentTarget.files)
|
|
1708
1778
|
}
|
|
1709
1779
|
),
|
|
1710
|
-
/* @__PURE__ */ (0,
|
|
1711
|
-
/* @__PURE__ */ (0,
|
|
1712
|
-
/* @__PURE__ */ (0,
|
|
1713
|
-
description ? /* @__PURE__ */ (0,
|
|
1714
|
-
/* @__PURE__ */ (0,
|
|
1780
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core30.Stack, { align: mode === "inline" ? "flex-start" : "center", ta: mode === "inline" ? "left" : "center", gap: "sm", children: [
|
|
1781
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(UploadIcon, { size: "1.5rem" }),
|
|
1782
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core30.Text, { fw: 600, children: title }),
|
|
1783
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core30.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
1784
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core30.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core30.Button, { variant: "light", onClick: () => inputRef.current?.click(), children: actionLabel }) })
|
|
1715
1785
|
] })
|
|
1716
1786
|
]
|
|
1717
1787
|
}
|
|
@@ -1719,22 +1789,22 @@ function UploadDropzone({
|
|
|
1719
1789
|
}
|
|
1720
1790
|
|
|
1721
1791
|
// src/MediaField.tsx
|
|
1722
|
-
var
|
|
1792
|
+
var import_core32 = require("@mantine/core");
|
|
1723
1793
|
|
|
1724
1794
|
// src/FormField.tsx
|
|
1725
|
-
var
|
|
1726
|
-
var
|
|
1795
|
+
var import_core31 = require("@mantine/core");
|
|
1796
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1727
1797
|
function FormField({ label, description, error, children }) {
|
|
1728
|
-
return /* @__PURE__ */ (0,
|
|
1729
|
-
typeof label === "string" ? /* @__PURE__ */ (0,
|
|
1730
|
-
description ? typeof description === "string" ? /* @__PURE__ */ (0,
|
|
1798
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Box, { component: "label", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core31.Stack, { gap: 4, children: [
|
|
1799
|
+
typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Text, { size: "xs", fw: 600, c: "dimmed", children: label }) : label,
|
|
1800
|
+
description ? typeof description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Text, { size: "xs", c: "dimmed", children: description }) : description : null,
|
|
1731
1801
|
children,
|
|
1732
|
-
error ? typeof error === "string" ? /* @__PURE__ */ (0,
|
|
1802
|
+
error ? typeof error === "string" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Text, { size: "xs", c: "red.7", children: error }) : error : null
|
|
1733
1803
|
] }) });
|
|
1734
1804
|
}
|
|
1735
1805
|
|
|
1736
1806
|
// src/MediaField.tsx
|
|
1737
|
-
var
|
|
1807
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1738
1808
|
var stateLabels = {
|
|
1739
1809
|
empty: { label: "Empty", color: "gray" },
|
|
1740
1810
|
selected: { label: "Selected", color: "blue" },
|
|
@@ -1762,32 +1832,32 @@ function MediaField({
|
|
|
1762
1832
|
mode = "stacked"
|
|
1763
1833
|
}) {
|
|
1764
1834
|
const stateBadge = stateLabels[state];
|
|
1765
|
-
const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */ (0,
|
|
1766
|
-
const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */ (0,
|
|
1767
|
-
return /* @__PURE__ */ (0,
|
|
1835
|
+
const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Button, { type: "button", variant: "light", color: "red", onClick: onRemove, children: "Remove" }) : null);
|
|
1836
|
+
const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Button, { type: "button", variant: "default", onClick: onReset, children: "Reset" }) : null);
|
|
1837
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1768
1838
|
FormField,
|
|
1769
1839
|
{
|
|
1770
1840
|
label,
|
|
1771
1841
|
description,
|
|
1772
1842
|
error,
|
|
1773
|
-
children: /* @__PURE__ */ (0,
|
|
1774
|
-
/* @__PURE__ */ (0,
|
|
1775
|
-
/* @__PURE__ */ (0,
|
|
1843
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core32.Stack, { gap: "md", children: [
|
|
1844
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Group, { justify: "flex-end", align: "center", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core32.Group, { gap: "xs", justify: "flex-end", children: [
|
|
1845
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Badge, { variant: "light", color: stateBadge.color, children: stateBadge.label }),
|
|
1776
1846
|
statusAction
|
|
1777
1847
|
] }) }),
|
|
1778
1848
|
preview ? preview : null,
|
|
1779
|
-
uploadControl || urlInput ? /* @__PURE__ */ (0,
|
|
1780
|
-
/* @__PURE__ */ (0,
|
|
1781
|
-
/* @__PURE__ */ (0,
|
|
1849
|
+
uploadControl || urlInput ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
|
|
1850
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Divider, {}),
|
|
1851
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core32.Stack, { gap: "sm", style: mode === "split" ? { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" } : void 0, children: [
|
|
1782
1852
|
uploadControl,
|
|
1783
1853
|
urlInput
|
|
1784
1854
|
] })
|
|
1785
1855
|
] }) : null,
|
|
1786
|
-
value ? /* @__PURE__ */ (0,
|
|
1787
|
-
helpText ? /* @__PURE__ */ (0,
|
|
1788
|
-
policyText ? /* @__PURE__ */ (0,
|
|
1856
|
+
value ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Text, { size: "sm", c: "dimmed", style: { wordBreak: "break-all" }, children: value }) : null,
|
|
1857
|
+
helpText ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Text, { size: "sm", c: "dimmed", children: helpText }) : null,
|
|
1858
|
+
policyText ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Text, { size: "sm", c: error ? "red.7" : "dimmed", children: policyText }) : null,
|
|
1789
1859
|
typeof error !== "string" && error ? error : null,
|
|
1790
|
-
resolvedRemoveAction || resolvedResetAction ? /* @__PURE__ */ (0,
|
|
1860
|
+
resolvedRemoveAction || resolvedResetAction ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core32.Group, { gap: "sm", children: [
|
|
1791
1861
|
resolvedResetAction,
|
|
1792
1862
|
retryAction,
|
|
1793
1863
|
resolvedRemoveAction
|
|
@@ -1798,50 +1868,50 @@ function MediaField({
|
|
|
1798
1868
|
}
|
|
1799
1869
|
|
|
1800
1870
|
// src/MediaCard.tsx
|
|
1801
|
-
var
|
|
1802
|
-
var
|
|
1871
|
+
var import_core33 = require("@mantine/core");
|
|
1872
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1803
1873
|
function MediaCard({ title, image, description, status, overlay, actions = [] }) {
|
|
1804
1874
|
const EyeIcon = GdsIcons.Eye;
|
|
1805
|
-
return /* @__PURE__ */ (0,
|
|
1806
|
-
/* @__PURE__ */ (0,
|
|
1875
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core33.Card, { withBorder: true, radius: "lg", padding: "md", children: [
|
|
1876
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core33.Card.Section, { pos: "relative", children: [
|
|
1807
1877
|
image,
|
|
1808
|
-
overlay ? /* @__PURE__ */ (0,
|
|
1878
|
+
overlay ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { style: { position: "absolute", inset: 12, display: "flex", justifyContent: "flex-end", alignItems: "flex-start" }, children: overlay }) : null
|
|
1809
1879
|
] }),
|
|
1810
|
-
/* @__PURE__ */ (0,
|
|
1811
|
-
/* @__PURE__ */ (0,
|
|
1812
|
-
/* @__PURE__ */ (0,
|
|
1813
|
-
/* @__PURE__ */ (0,
|
|
1814
|
-
description ? /* @__PURE__ */ (0,
|
|
1880
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core33.Stack, { gap: "sm", mt: "md", children: [
|
|
1881
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core33.Group, { justify: "space-between", align: "flex-start", children: [
|
|
1882
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core33.Stack, { gap: 4, children: [
|
|
1883
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core33.Title, { order: 4, children: title }),
|
|
1884
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core33.Text, { size: "sm", c: "dimmed", lineClamp: 2, children: description }) : null
|
|
1815
1885
|
] }),
|
|
1816
|
-
status ? /* @__PURE__ */ (0,
|
|
1886
|
+
status ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core33.Badge, { variant: "light", children: status }) : null
|
|
1817
1887
|
] }),
|
|
1818
|
-
actions.length ? /* @__PURE__ */ (0,
|
|
1888
|
+
actions.length ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core33.Group, { justify: "flex-end", gap: "xs", children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core33.ActionIcon, { variant: "light", "aria-label": action.label, onClick: action.onClick, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(EyeIcon, { size: "1rem" }) }, action.label)) }) : null
|
|
1819
1889
|
] })
|
|
1820
1890
|
] });
|
|
1821
1891
|
}
|
|
1822
1892
|
|
|
1823
1893
|
// src/AccessSummary.tsx
|
|
1824
|
-
var
|
|
1825
|
-
var
|
|
1894
|
+
var import_core34 = require("@mantine/core");
|
|
1895
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1826
1896
|
function AccessSummary({ title, roles, scope, blocked = false, description }) {
|
|
1827
|
-
return /* @__PURE__ */ (0,
|
|
1828
|
-
/* @__PURE__ */ (0,
|
|
1829
|
-
/* @__PURE__ */ (0,
|
|
1830
|
-
/* @__PURE__ */ (0,
|
|
1897
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core34.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core34.Stack, { gap: "sm", children: [
|
|
1898
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core34.Group, { justify: "space-between", align: "center", children: [
|
|
1899
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core34.Title, { order: 4, children: title }),
|
|
1900
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core34.Badge, { color: blocked ? "red" : "teal", variant: "light", children: blocked ? "Blocked" : "Allowed" })
|
|
1831
1901
|
] }),
|
|
1832
|
-
/* @__PURE__ */ (0,
|
|
1833
|
-
scope ? /* @__PURE__ */ (0,
|
|
1902
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core34.Group, { gap: "xs", children: roles.map((role) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core34.Badge, { variant: "outline", children: role }, role)) }),
|
|
1903
|
+
scope ? /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core34.Text, { size: "sm", c: "dimmed", children: [
|
|
1834
1904
|
"Scope: ",
|
|
1835
1905
|
scope
|
|
1836
1906
|
] }) : null,
|
|
1837
|
-
description ? /* @__PURE__ */ (0,
|
|
1907
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core34.Text, { size: "sm", children: description }) : null
|
|
1838
1908
|
] }) });
|
|
1839
1909
|
}
|
|
1840
1910
|
|
|
1841
1911
|
// src/AccessRecoveryPanel.tsx
|
|
1842
|
-
var
|
|
1912
|
+
var import_core35 = require("@mantine/core");
|
|
1843
1913
|
var import_gds_theme3 = require("@doneisbetter/gds-theme");
|
|
1844
|
-
var
|
|
1914
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
1845
1915
|
var stateBlockVariantByState = {
|
|
1846
1916
|
unauthenticated: "permission",
|
|
1847
1917
|
"expired-session": "info",
|
|
@@ -1910,7 +1980,7 @@ function ActionGroup({
|
|
|
1910
1980
|
if (actions.length === 0) {
|
|
1911
1981
|
return null;
|
|
1912
1982
|
}
|
|
1913
|
-
return /* @__PURE__ */ (0,
|
|
1983
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core35.Group, { gap: "sm", justify: "center", wrap: "wrap", children: actions.map((actionConfig, index) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1914
1984
|
SemanticButton,
|
|
1915
1985
|
{
|
|
1916
1986
|
action: actionConfig.action,
|
|
@@ -1944,14 +2014,14 @@ function AccessRecoveryPanel({
|
|
|
1944
2014
|
onBack,
|
|
1945
2015
|
supportAction
|
|
1946
2016
|
});
|
|
1947
|
-
return /* @__PURE__ */ (0,
|
|
2017
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1948
2018
|
StateBlock,
|
|
1949
2019
|
{
|
|
1950
2020
|
variant: stateBlockVariantByState[state],
|
|
1951
2021
|
compact,
|
|
1952
2022
|
title: title ?? t(`gds.accessRecovery.${state}.title`, defaultCopy.title),
|
|
1953
2023
|
description: description ?? t(`gds.accessRecovery.${state}.description`, defaultCopy.description),
|
|
1954
|
-
action: /* @__PURE__ */ (0,
|
|
2024
|
+
action: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1955
2025
|
ActionGroup,
|
|
1956
2026
|
{
|
|
1957
2027
|
primaryAction: primaryAction ?? defaults.primary,
|
|
@@ -1964,29 +2034,31 @@ function AccessRecoveryPanel({
|
|
|
1964
2034
|
}
|
|
1965
2035
|
|
|
1966
2036
|
// src/PageHeader.tsx
|
|
1967
|
-
var
|
|
1968
|
-
var
|
|
2037
|
+
var import_core36 = require("@mantine/core");
|
|
2038
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
1969
2039
|
function PageHeader({
|
|
1970
2040
|
title,
|
|
1971
2041
|
description,
|
|
2042
|
+
subtitle,
|
|
1972
2043
|
eyebrow,
|
|
1973
2044
|
actions,
|
|
1974
2045
|
eyebrowVariant = "neutral"
|
|
1975
2046
|
}) {
|
|
2047
|
+
const resolvedDescription = description ?? subtitle;
|
|
1976
2048
|
const eyebrowProps = eyebrowVariant === "ornamental" ? { tt: "uppercase", style: { letterSpacing: "0.12em" } } : {};
|
|
1977
|
-
return /* @__PURE__ */ (0,
|
|
1978
|
-
/* @__PURE__ */ (0,
|
|
1979
|
-
eyebrow && /* @__PURE__ */ (0,
|
|
1980
|
-
/* @__PURE__ */ (0,
|
|
1981
|
-
|
|
2049
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core36.Group, { justify: "space-between", align: "flex-start", gap: "lg", wrap: "wrap", children: [
|
|
2050
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core36.Stack, { gap: "xs", children: [
|
|
2051
|
+
eyebrow && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core36.Text, { size: "xs", fw: 700, c: "dimmed", ...eyebrowProps, children: eyebrow }),
|
|
2052
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core36.Title, { order: 1, children: title }),
|
|
2053
|
+
resolvedDescription && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core36.Text, { c: "dimmed", maw: 720, children: resolvedDescription })
|
|
1982
2054
|
] }),
|
|
1983
|
-
actions ? /* @__PURE__ */ (0,
|
|
2055
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core36.Box, { children: actions }) : null
|
|
1984
2056
|
] });
|
|
1985
2057
|
}
|
|
1986
2058
|
|
|
1987
2059
|
// src/FilterDrawer.tsx
|
|
1988
|
-
var
|
|
1989
|
-
var
|
|
2060
|
+
var import_core37 = require("@mantine/core");
|
|
2061
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
1990
2062
|
function FilterDrawer({
|
|
1991
2063
|
opened,
|
|
1992
2064
|
onClose,
|
|
@@ -2002,8 +2074,8 @@ function FilterDrawer({
|
|
|
2002
2074
|
}) {
|
|
2003
2075
|
const resolvedPrimaryAction = applyAction ?? primaryAction;
|
|
2004
2076
|
const resolvedSecondaryAction = resetAction ?? secondaryAction;
|
|
2005
|
-
return /* @__PURE__ */ (0,
|
|
2006
|
-
|
|
2077
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2078
|
+
import_core37.Drawer,
|
|
2007
2079
|
{
|
|
2008
2080
|
opened,
|
|
2009
2081
|
onClose,
|
|
@@ -2011,11 +2083,11 @@ function FilterDrawer({
|
|
|
2011
2083
|
position: mode === "bottom-sheet" ? "bottom" : "right",
|
|
2012
2084
|
size: mode === "bottom-sheet" ? "auto" : "md",
|
|
2013
2085
|
radius: mode === "bottom-sheet" ? "xl" : void 0,
|
|
2014
|
-
children: /* @__PURE__ */ (0,
|
|
2015
|
-
description ? /* @__PURE__ */ (0,
|
|
2086
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core37.Stack, { gap: "md", children: [
|
|
2087
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core37.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
2016
2088
|
children,
|
|
2017
|
-
resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ (0,
|
|
2018
|
-
/* @__PURE__ */ (0,
|
|
2089
|
+
resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core37.Group, { justify: "space-between", mt: "md", children: [
|
|
2090
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core37.Group, { gap: "sm", children: [
|
|
2019
2091
|
closeAction,
|
|
2020
2092
|
resolvedSecondaryAction
|
|
2021
2093
|
] }),
|
|
@@ -2027,8 +2099,8 @@ function FilterDrawer({
|
|
|
2027
2099
|
}
|
|
2028
2100
|
|
|
2029
2101
|
// src/PlaceholderPanel.tsx
|
|
2030
|
-
var
|
|
2031
|
-
var
|
|
2102
|
+
var import_core38 = require("@mantine/core");
|
|
2103
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2032
2104
|
function PlaceholderPanel({
|
|
2033
2105
|
title,
|
|
2034
2106
|
description,
|
|
@@ -2038,16 +2110,16 @@ function PlaceholderPanel({
|
|
|
2038
2110
|
mode
|
|
2039
2111
|
}) {
|
|
2040
2112
|
if (mode === "live" && children) {
|
|
2041
|
-
return /* @__PURE__ */ (0,
|
|
2113
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children });
|
|
2042
2114
|
}
|
|
2043
|
-
return /* @__PURE__ */ (0,
|
|
2044
|
-
badge ? /* @__PURE__ */ (0,
|
|
2045
|
-
/* @__PURE__ */ (0,
|
|
2046
|
-
/* @__PURE__ */ (0,
|
|
2047
|
-
/* @__PURE__ */ (0,
|
|
2115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core38.Card, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core38.Stack, { gap: "md", children: [
|
|
2116
|
+
badge ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core38.Badge, { variant: "light", color: "blue", w: "fit-content", children: badge }) : null,
|
|
2117
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core38.Stack, { gap: "xs", children: [
|
|
2118
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core38.Title, { order: 4, children: title }),
|
|
2119
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core38.Text, { c: "dimmed", children: description })
|
|
2048
2120
|
] }),
|
|
2049
|
-
footer ? /* @__PURE__ */ (0,
|
|
2050
|
-
/* @__PURE__ */ (0,
|
|
2121
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core38.Text, { size: "sm", children: footer }) : null,
|
|
2122
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2051
2123
|
StateBlock,
|
|
2052
2124
|
{
|
|
2053
2125
|
variant: "not-enough-data",
|
|
@@ -2060,8 +2132,8 @@ function PlaceholderPanel({
|
|
|
2060
2132
|
}
|
|
2061
2133
|
|
|
2062
2134
|
// src/SimpleDataTable.tsx
|
|
2063
|
-
var
|
|
2064
|
-
var
|
|
2135
|
+
var import_core39 = require("@mantine/core");
|
|
2136
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2065
2137
|
function SimpleDataTable({
|
|
2066
2138
|
columns,
|
|
2067
2139
|
rows,
|
|
@@ -2072,23 +2144,23 @@ function SimpleDataTable({
|
|
|
2072
2144
|
getRowKey
|
|
2073
2145
|
}) {
|
|
2074
2146
|
if (error) {
|
|
2075
|
-
return /* @__PURE__ */ (0,
|
|
2147
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(StateBlock, { variant: "error", title: "Unable to load data", description: error, compact: true });
|
|
2076
2148
|
}
|
|
2077
2149
|
if (loading) {
|
|
2078
|
-
return /* @__PURE__ */ (0,
|
|
2150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(StateBlock, { variant: "loading", title: "Loading data", description: "Please wait while the shared dataset is prepared.", compact: true });
|
|
2079
2151
|
}
|
|
2080
2152
|
if (!rows.length) {
|
|
2081
|
-
return /* @__PURE__ */ (0,
|
|
2153
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, compact: true });
|
|
2082
2154
|
}
|
|
2083
|
-
return /* @__PURE__ */ (0,
|
|
2084
|
-
/* @__PURE__ */ (0,
|
|
2085
|
-
/* @__PURE__ */ (0,
|
|
2155
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.ScrollArea, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core39.Table, { striped: true, highlightOnHover: true, withTableBorder: true, withColumnBorders: true, children: [
|
|
2156
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.Table.Thead, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.Table.Th, { children: column.header }, String(column.key))) }) }),
|
|
2157
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.Table.Tbody, { children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core39.Table.Td, { children: column.render ? column.render(row) : String(row[column.key] ?? "") }, String(column.key))) }, getRowKey ? getRowKey(row, index) : index)) })
|
|
2086
2158
|
] }) });
|
|
2087
2159
|
}
|
|
2088
2160
|
|
|
2089
2161
|
// src/StatsSection.tsx
|
|
2090
|
-
var
|
|
2091
|
-
var
|
|
2162
|
+
var import_core40 = require("@mantine/core");
|
|
2163
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2092
2164
|
function StatsSection({
|
|
2093
2165
|
title,
|
|
2094
2166
|
loading = false,
|
|
@@ -2100,11 +2172,11 @@ function StatsSection({
|
|
|
2100
2172
|
}) {
|
|
2101
2173
|
let content = children;
|
|
2102
2174
|
if (error) {
|
|
2103
|
-
content = /* @__PURE__ */ (0,
|
|
2175
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(StateBlock, { variant: "error", title: "Unable to load statistics", description: error, compact: true });
|
|
2104
2176
|
} else if (loading) {
|
|
2105
|
-
content = /* @__PURE__ */ (0,
|
|
2177
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(StateBlock, { variant: "loading", title: "Loading statistics", description: "This shared data surface is still synchronizing.", compact: true });
|
|
2106
2178
|
} else if (belowThreshold) {
|
|
2107
|
-
content = /* @__PURE__ */ (0,
|
|
2179
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
2108
2180
|
StateBlock,
|
|
2109
2181
|
{
|
|
2110
2182
|
variant: "not-enough-data",
|
|
@@ -2114,10 +2186,10 @@ function StatsSection({
|
|
|
2114
2186
|
}
|
|
2115
2187
|
);
|
|
2116
2188
|
} else if (placeholder) {
|
|
2117
|
-
content = /* @__PURE__ */ (0,
|
|
2189
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(PlaceholderPanel, { ...placeholder, mode: "placeholder" });
|
|
2118
2190
|
}
|
|
2119
|
-
return /* @__PURE__ */ (0,
|
|
2120
|
-
/* @__PURE__ */ (0,
|
|
2191
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core40.Stack, { gap: "md", children: [
|
|
2192
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core40.Title, { order: 3, children: title }),
|
|
2121
2193
|
content
|
|
2122
2194
|
] });
|
|
2123
2195
|
}
|
|
@@ -3432,6 +3504,7 @@ function getGdsMessages(locale) {
|
|
|
3432
3504
|
ArticleShell,
|
|
3433
3505
|
AuthShell,
|
|
3434
3506
|
BrowseSurface,
|
|
3507
|
+
ChoiceChip,
|
|
3435
3508
|
ConfirmDialog,
|
|
3436
3509
|
ConsumerDashboardGrid,
|
|
3437
3510
|
ConsumerSection,
|
|
@@ -3475,6 +3548,8 @@ function getGdsMessages(locale) {
|
|
|
3475
3548
|
fr,
|
|
3476
3549
|
gdsLocales,
|
|
3477
3550
|
getGdsMessages,
|
|
3551
|
+
getSemanticActionConfig,
|
|
3552
|
+
getSemanticActionLabel,
|
|
3478
3553
|
he,
|
|
3479
3554
|
hu,
|
|
3480
3555
|
it,
|