@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
|
@@ -316,27 +316,81 @@ var GdsVocabulary = {
|
|
|
316
316
|
refer: { id: "gds.action.refer", defaultMessage: "Refer", icon: GdsIcons.Refer, feedback: { icon: GdsIcons.Refer, color: "teal", messageId: "gds.feedback.referred" } },
|
|
317
317
|
evidence: { id: "gds.action.evidence", defaultMessage: "Evidence", icon: GdsIcons.Evidence, feedback: { icon: GdsIcons.Evidence, color: "teal", messageId: "gds.feedback.added" } }
|
|
318
318
|
};
|
|
319
|
+
function getSemanticActionConfig(action) {
|
|
320
|
+
return GdsVocabulary[action];
|
|
321
|
+
}
|
|
322
|
+
function getSemanticActionLabel(action, translate) {
|
|
323
|
+
const config = getSemanticActionConfig(action);
|
|
324
|
+
return translate ? translate(config.id, config.defaultMessage) : config.defaultMessage;
|
|
325
|
+
}
|
|
326
|
+
|
|
327
|
+
// src/ChoiceChip.tsx
|
|
328
|
+
import { Badge as Badge2 } from "@mantine/core";
|
|
329
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
330
|
+
function ChoiceChip({
|
|
331
|
+
label,
|
|
332
|
+
active = false,
|
|
333
|
+
href,
|
|
334
|
+
onClick,
|
|
335
|
+
component,
|
|
336
|
+
...props
|
|
337
|
+
}) {
|
|
338
|
+
const sharedProps = {
|
|
339
|
+
variant: active ? "filled" : "light",
|
|
340
|
+
size: "sm",
|
|
341
|
+
radius: "xl",
|
|
342
|
+
...props
|
|
343
|
+
};
|
|
344
|
+
if (href) {
|
|
345
|
+
const LinkComponent = component || "a";
|
|
346
|
+
return /* @__PURE__ */ jsx3(
|
|
347
|
+
Badge2,
|
|
348
|
+
{
|
|
349
|
+
component: LinkComponent,
|
|
350
|
+
href,
|
|
351
|
+
"aria-current": active ? "page" : void 0,
|
|
352
|
+
...sharedProps,
|
|
353
|
+
children: label
|
|
354
|
+
}
|
|
355
|
+
);
|
|
356
|
+
}
|
|
357
|
+
if (onClick || component) {
|
|
358
|
+
const ButtonComponent = component || "button";
|
|
359
|
+
return /* @__PURE__ */ jsx3(
|
|
360
|
+
Badge2,
|
|
361
|
+
{
|
|
362
|
+
component: ButtonComponent,
|
|
363
|
+
type: component ? void 0 : "button",
|
|
364
|
+
onClick,
|
|
365
|
+
"aria-pressed": onClick ? active : void 0,
|
|
366
|
+
...sharedProps,
|
|
367
|
+
children: label
|
|
368
|
+
}
|
|
369
|
+
);
|
|
370
|
+
}
|
|
371
|
+
return /* @__PURE__ */ jsx3(Badge2, { ...sharedProps, children: label });
|
|
372
|
+
}
|
|
319
373
|
|
|
320
374
|
// src/MetricCard.tsx
|
|
321
|
-
import { Badge as
|
|
322
|
-
import { jsx as
|
|
375
|
+
import { Badge as Badge3, Card, Group, Stack as Stack2, Text as Text2, ThemeIcon, Title as Title2 } from "@mantine/core";
|
|
376
|
+
import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
323
377
|
var trendColors = {
|
|
324
378
|
positive: "teal",
|
|
325
379
|
negative: "red",
|
|
326
380
|
neutral: "gray"
|
|
327
381
|
};
|
|
328
382
|
function MetricCard({ label, value, description, trend, icon, footer }) {
|
|
329
|
-
return /* @__PURE__ */
|
|
383
|
+
return /* @__PURE__ */ jsx4(Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ jsxs2(Stack2, { gap: "md", children: [
|
|
330
384
|
/* @__PURE__ */ jsxs2(Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
331
385
|
/* @__PURE__ */ jsxs2(Stack2, { gap: 4, children: [
|
|
332
|
-
/* @__PURE__ */
|
|
333
|
-
/* @__PURE__ */
|
|
386
|
+
/* @__PURE__ */ jsx4(Text2, { size: "sm", c: "dimmed", fw: 600, children: label }),
|
|
387
|
+
/* @__PURE__ */ jsx4(Title2, { order: 3, children: value })
|
|
334
388
|
] }),
|
|
335
|
-
icon ? /* @__PURE__ */
|
|
389
|
+
icon ? /* @__PURE__ */ jsx4(ThemeIcon, { variant: "light", size: "xl", radius: "xl", "aria-hidden": true, children: icon }) : null
|
|
336
390
|
] }),
|
|
337
391
|
description || trend ? /* @__PURE__ */ jsxs2(Group, { justify: "space-between", align: "center", gap: "sm", children: [
|
|
338
|
-
description ? /* @__PURE__ */
|
|
339
|
-
trend ? /* @__PURE__ */
|
|
392
|
+
description ? /* @__PURE__ */ jsx4(Text2, { size: "sm", c: "dimmed", flex: 1, children: description }) : /* @__PURE__ */ jsx4("span", {}),
|
|
393
|
+
trend ? /* @__PURE__ */ jsx4(Badge3, { color: trendColors[trend.tone ?? "neutral"], variant: "light", children: trend.label }) : null
|
|
340
394
|
] }) : null,
|
|
341
395
|
footer
|
|
342
396
|
] }) });
|
|
@@ -344,7 +398,7 @@ function MetricCard({ label, value, description, trend, icon, footer }) {
|
|
|
344
398
|
|
|
345
399
|
// src/ProgressCard.tsx
|
|
346
400
|
import { Card as Card2, Group as Group2, Progress, Stack as Stack3, Text as Text3, Title as Title3 } from "@mantine/core";
|
|
347
|
-
import { jsx as
|
|
401
|
+
import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
348
402
|
function ProgressCard({
|
|
349
403
|
label,
|
|
350
404
|
value,
|
|
@@ -353,31 +407,31 @@ function ProgressCard({
|
|
|
353
407
|
description,
|
|
354
408
|
action
|
|
355
409
|
}) {
|
|
356
|
-
return /* @__PURE__ */
|
|
410
|
+
return /* @__PURE__ */ jsx5(Card2, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ jsxs3(Stack3, { gap: "md", children: [
|
|
357
411
|
/* @__PURE__ */ jsxs3(Group2, { justify: "space-between", align: "flex-start", children: [
|
|
358
412
|
/* @__PURE__ */ jsxs3(Stack3, { gap: 4, children: [
|
|
359
|
-
/* @__PURE__ */
|
|
360
|
-
/* @__PURE__ */
|
|
413
|
+
/* @__PURE__ */ jsx5(Text3, { size: "sm", c: "dimmed", fw: 600, children: label }),
|
|
414
|
+
/* @__PURE__ */ jsx5(Title3, { order: 3, children: value })
|
|
361
415
|
] }),
|
|
362
416
|
action
|
|
363
417
|
] }),
|
|
364
|
-
description ? /* @__PURE__ */
|
|
418
|
+
description ? /* @__PURE__ */ jsx5(Text3, { size: "sm", c: "dimmed", children: description }) : null,
|
|
365
419
|
/* @__PURE__ */ jsxs3(Stack3, { gap: 6, children: [
|
|
366
420
|
/* @__PURE__ */ jsxs3(Group2, { justify: "space-between", gap: "sm", children: [
|
|
367
|
-
/* @__PURE__ */
|
|
421
|
+
/* @__PURE__ */ jsx5(Text3, { size: "sm", fw: 500, children: progressLabel ?? "Progress" }),
|
|
368
422
|
/* @__PURE__ */ jsxs3(Text3, { size: "sm", c: "dimmed", children: [
|
|
369
423
|
Math.round(progress),
|
|
370
424
|
"%"
|
|
371
425
|
] })
|
|
372
426
|
] }),
|
|
373
|
-
/* @__PURE__ */
|
|
427
|
+
/* @__PURE__ */ jsx5(Progress, { value: progress, radius: "xl", size: "md" })
|
|
374
428
|
] })
|
|
375
429
|
] }) });
|
|
376
430
|
}
|
|
377
431
|
|
|
378
432
|
// src/SectionPanel.tsx
|
|
379
433
|
import { Divider, Group as Group3, Paper, Stack as Stack4, Text as Text4, Title as Title4 } from "@mantine/core";
|
|
380
|
-
import { Fragment, jsx as
|
|
434
|
+
import { Fragment, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
381
435
|
var toneBackgrounds = {
|
|
382
436
|
default: "var(--mantine-color-body)",
|
|
383
437
|
supporting: "light-dark(var(--mantine-color-gray-0), color-mix(in srgb, var(--mantine-color-dark-7) 92%, black))",
|
|
@@ -393,23 +447,23 @@ function SectionPanel({
|
|
|
393
447
|
id,
|
|
394
448
|
divided = true
|
|
395
449
|
}) {
|
|
396
|
-
return /* @__PURE__ */
|
|
450
|
+
return /* @__PURE__ */ jsx6(Paper, { id, withBorder: true, radius: "xl", p: "lg", style: { background: toneBackgrounds[tone] }, children: /* @__PURE__ */ jsxs4(Stack4, { gap: "md", children: [
|
|
397
451
|
title || description || action ? /* @__PURE__ */ jsxs4(Fragment, { children: [
|
|
398
452
|
/* @__PURE__ */ jsxs4(Group3, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
|
|
399
453
|
title || description ? /* @__PURE__ */ jsxs4(Stack4, { gap: 4, children: [
|
|
400
|
-
title ? /* @__PURE__ */
|
|
401
|
-
description ? /* @__PURE__ */
|
|
454
|
+
title ? /* @__PURE__ */ jsx6(Title4, { order: 3, children: title }) : null,
|
|
455
|
+
description ? /* @__PURE__ */ jsx6(Text4, { size: "sm", c: "dimmed", children: description }) : null
|
|
402
456
|
] }) : null,
|
|
403
457
|
action
|
|
404
458
|
] }),
|
|
405
|
-
divided ? /* @__PURE__ */
|
|
459
|
+
divided ? /* @__PURE__ */ jsx6(Divider, {}) : null
|
|
406
460
|
] }) : null,
|
|
407
461
|
children
|
|
408
462
|
] }) });
|
|
409
463
|
}
|
|
410
464
|
|
|
411
465
|
// src/ConsumerSection.tsx
|
|
412
|
-
import { jsx as
|
|
466
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
413
467
|
function ConsumerSection({
|
|
414
468
|
title,
|
|
415
469
|
description,
|
|
@@ -417,22 +471,22 @@ function ConsumerSection({
|
|
|
417
471
|
children,
|
|
418
472
|
tone = "default"
|
|
419
473
|
}) {
|
|
420
|
-
return /* @__PURE__ */
|
|
474
|
+
return /* @__PURE__ */ jsx7(SectionPanel, { title, description, action, tone, children });
|
|
421
475
|
}
|
|
422
476
|
|
|
423
477
|
// src/ConsumerDashboardGrid.tsx
|
|
424
478
|
import { SimpleGrid } from "@mantine/core";
|
|
425
|
-
import { jsx as
|
|
479
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
426
480
|
function ConsumerDashboardGrid({
|
|
427
481
|
children,
|
|
428
482
|
columns = 3
|
|
429
483
|
}) {
|
|
430
|
-
return /* @__PURE__ */
|
|
484
|
+
return /* @__PURE__ */ jsx8(SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children });
|
|
431
485
|
}
|
|
432
486
|
|
|
433
487
|
// src/EditorialCard.tsx
|
|
434
|
-
import { Anchor, AspectRatio, Badge as
|
|
435
|
-
import { jsx as
|
|
488
|
+
import { Anchor, AspectRatio, Badge as Badge4, Box as Box2, Card as Card3, Group as Group4, Stack as Stack5, Text as Text5, Title as Title5 } from "@mantine/core";
|
|
489
|
+
import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
436
490
|
var tonePalette = {
|
|
437
491
|
default: {
|
|
438
492
|
accent: "violet",
|
|
@@ -452,7 +506,7 @@ var tonePalette = {
|
|
|
452
506
|
}
|
|
453
507
|
};
|
|
454
508
|
function EditorialMediaFallback({ compact }) {
|
|
455
|
-
return /* @__PURE__ */
|
|
509
|
+
return /* @__PURE__ */ jsx9(AspectRatio, { ratio: compact ? 16 / 10 : 4 / 3, children: /* @__PURE__ */ jsx9(
|
|
456
510
|
Box2,
|
|
457
511
|
{
|
|
458
512
|
style: {
|
|
@@ -463,7 +517,7 @@ function EditorialMediaFallback({ compact }) {
|
|
|
463
517
|
background: "var(--mantine-color-gray-0)",
|
|
464
518
|
borderRadius: "var(--mantine-radius-md)"
|
|
465
519
|
},
|
|
466
|
-
children: /* @__PURE__ */
|
|
520
|
+
children: /* @__PURE__ */ jsx9(GdsIcons.Gallery, { size: compact ? "1.5rem" : "2rem" })
|
|
467
521
|
}
|
|
468
522
|
) });
|
|
469
523
|
}
|
|
@@ -501,20 +555,20 @@ function EditorialCard({
|
|
|
501
555
|
cursor: href || onClick ? "pointer" : "default"
|
|
502
556
|
},
|
|
503
557
|
children: [
|
|
504
|
-
/* @__PURE__ */
|
|
558
|
+
/* @__PURE__ */ jsx9(Card3.Section, { className: classNames?.media, children: media ?? /* @__PURE__ */ jsx9(EditorialMediaFallback, { compact }) }),
|
|
505
559
|
/* @__PURE__ */ jsxs5(Stack5, { gap: "md", p: compact ? "md" : "lg", className: classNames?.body, children: [
|
|
506
560
|
/* @__PURE__ */ jsxs5(Group4, { justify: "space-between", align: "flex-start", gap: "sm", wrap: "wrap", children: [
|
|
507
561
|
/* @__PURE__ */ jsxs5(Stack5, { gap: 4, flex: 1, children: [
|
|
508
|
-
eyebrow ? /* @__PURE__ */
|
|
509
|
-
/* @__PURE__ */
|
|
562
|
+
eyebrow ? /* @__PURE__ */ jsx9(Text5, { size: "xs", fw: 700, c: "dimmed", children: eyebrow }) : null,
|
|
563
|
+
/* @__PURE__ */ jsx9(Title5, { order: compact ? 4 : 3, className: classNames?.title, children: title })
|
|
510
564
|
] }),
|
|
511
|
-
badge ? typeof badge === "string" ? /* @__PURE__ */
|
|
565
|
+
badge ? typeof badge === "string" ? /* @__PURE__ */ jsx9(Badge4, { color: palette.accent, variant: "light", children: badge }) : badge : null
|
|
512
566
|
] }),
|
|
513
|
-
description ? /* @__PURE__ */
|
|
514
|
-
meta ? /* @__PURE__ */
|
|
567
|
+
description ? /* @__PURE__ */ jsx9(Text5, { size: "sm", c: "dimmed", children: description }) : null,
|
|
568
|
+
meta ? /* @__PURE__ */ jsx9(Text5, { size: "sm", c: "dimmed", className: classNames?.meta, children: meta }) : null,
|
|
515
569
|
href || onClick || ctaLabel ? /* @__PURE__ */ jsxs5(Group4, { gap: 6, c: `${palette.accent}.7`, className: classNames?.action, children: [
|
|
516
|
-
/* @__PURE__ */
|
|
517
|
-
/* @__PURE__ */
|
|
570
|
+
/* @__PURE__ */ jsx9(Text5, { fw: 600, size: "sm", children: ctaLabel }),
|
|
571
|
+
/* @__PURE__ */ jsx9(
|
|
518
572
|
Anchor,
|
|
519
573
|
{
|
|
520
574
|
component: "span",
|
|
@@ -532,8 +586,8 @@ function EditorialCard({
|
|
|
532
586
|
}
|
|
533
587
|
|
|
534
588
|
// src/ProductCard.tsx
|
|
535
|
-
import { Badge as
|
|
536
|
-
import { jsx as
|
|
589
|
+
import { Badge as Badge5, Card as Card4, Group as Group5, Menu, Stack as Stack6, Text as Text6, ThemeIcon as ThemeIcon2, Title as Title6, ActionIcon } from "@mantine/core";
|
|
590
|
+
import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
537
591
|
function ProductCard({
|
|
538
592
|
title,
|
|
539
593
|
description,
|
|
@@ -546,39 +600,39 @@ function ProductCard({
|
|
|
546
600
|
footer
|
|
547
601
|
}) {
|
|
548
602
|
const MoreIcon = GdsIcons.Menu;
|
|
549
|
-
return /* @__PURE__ */
|
|
603
|
+
return /* @__PURE__ */ jsx10(Card4, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ jsxs6(Stack6, { gap: "md", children: [
|
|
550
604
|
media,
|
|
551
605
|
/* @__PURE__ */ jsxs6(Group5, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
552
606
|
/* @__PURE__ */ jsxs6(Group5, { align: "flex-start", gap: "sm", wrap: "nowrap", children: [
|
|
553
|
-
icon ? /* @__PURE__ */
|
|
607
|
+
icon ? /* @__PURE__ */ jsx10(ThemeIcon2, { variant: "light", size: "xl", radius: "xl", "aria-hidden": true, children: icon }) : null,
|
|
554
608
|
/* @__PURE__ */ jsxs6(Stack6, { gap: 4, children: [
|
|
555
|
-
/* @__PURE__ */
|
|
556
|
-
description ? /* @__PURE__ */
|
|
609
|
+
/* @__PURE__ */ jsx10(Title6, { order: 4, children: title }),
|
|
610
|
+
description ? /* @__PURE__ */ jsx10(Text6, { size: "sm", c: "dimmed", lineClamp: 3, children: description }) : null
|
|
557
611
|
] })
|
|
558
612
|
] }),
|
|
559
613
|
/* @__PURE__ */ jsxs6(Group5, { gap: "xs", align: "center", wrap: "nowrap", children: [
|
|
560
|
-
typeof status === "string" ? /* @__PURE__ */
|
|
614
|
+
typeof status === "string" ? /* @__PURE__ */ jsx10(Badge5, { variant: "light", children: status }) : status,
|
|
561
615
|
secondaryActions.length ? /* @__PURE__ */ jsxs6(Menu, { position: "bottom-end", withinPortal: true, children: [
|
|
562
|
-
/* @__PURE__ */
|
|
563
|
-
/* @__PURE__ */
|
|
564
|
-
(action) => action.href ? /* @__PURE__ */
|
|
616
|
+
/* @__PURE__ */ jsx10(Menu.Target, { children: /* @__PURE__ */ jsx10(ActionIcon, { variant: "subtle", "aria-label": "More actions", children: /* @__PURE__ */ jsx10(MoreIcon, { size: "1rem" }) }) }),
|
|
617
|
+
/* @__PURE__ */ jsx10(Menu.Dropdown, { children: secondaryActions.map(
|
|
618
|
+
(action) => action.href ? /* @__PURE__ */ jsx10(Menu.Item, { component: "a", href: action.href, color: action.color, children: action.label }, action.label) : /* @__PURE__ */ jsx10(Menu.Item, { onClick: action.onClick, color: action.color, children: action.label }, action.label)
|
|
565
619
|
) })
|
|
566
620
|
] }) : null
|
|
567
621
|
] })
|
|
568
622
|
] }),
|
|
569
|
-
metadata.length ? /* @__PURE__ */
|
|
570
|
-
/* @__PURE__ */
|
|
571
|
-
/* @__PURE__ */
|
|
623
|
+
metadata.length ? /* @__PURE__ */ jsx10(Stack6, { gap: 6, children: metadata.map((item) => /* @__PURE__ */ jsxs6(Group5, { justify: "space-between", gap: "sm", children: [
|
|
624
|
+
/* @__PURE__ */ jsx10(Text6, { size: "sm", c: "dimmed", children: item.label }),
|
|
625
|
+
/* @__PURE__ */ jsx10(Text6, { size: "sm", fw: 500, ta: "right", children: item.value })
|
|
572
626
|
] }, item.label)) }) : null,
|
|
573
|
-
primaryAction ? /* @__PURE__ */
|
|
627
|
+
primaryAction ? /* @__PURE__ */ jsx10(Group5, { justify: "space-between", children: primaryAction }) : null,
|
|
574
628
|
footer
|
|
575
629
|
] }) });
|
|
576
630
|
}
|
|
577
631
|
|
|
578
632
|
// src/PublicProductCard.tsx
|
|
579
633
|
import { cloneElement, isValidElement } from "react";
|
|
580
|
-
import { AspectRatio as AspectRatio2, Badge as
|
|
581
|
-
import { jsx as
|
|
634
|
+
import { AspectRatio as AspectRatio2, Badge as Badge6, Card as Card5, Group as Group6, Skeleton, Stack as Stack7, Text as Text7, ThemeIcon as ThemeIcon3, Title as Title7 } from "@mantine/core";
|
|
635
|
+
import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
582
636
|
var stateConfig = {
|
|
583
637
|
available: { label: "Available", color: "teal" },
|
|
584
638
|
limited: { label: "Limited", color: "yellow" },
|
|
@@ -595,7 +649,7 @@ function enhanceAction(action, disabled) {
|
|
|
595
649
|
});
|
|
596
650
|
}
|
|
597
651
|
function ImageFallback({ compact }) {
|
|
598
|
-
return /* @__PURE__ */
|
|
652
|
+
return /* @__PURE__ */ jsx11(AspectRatio2, { ratio: compact ? 16 / 9 : 4 / 3, children: /* @__PURE__ */ jsx11(
|
|
599
653
|
ThemeIcon3,
|
|
600
654
|
{
|
|
601
655
|
size: "100%",
|
|
@@ -603,21 +657,21 @@ function ImageFallback({ compact }) {
|
|
|
603
657
|
variant: "light",
|
|
604
658
|
color: "gray",
|
|
605
659
|
"aria-label": "No product image available",
|
|
606
|
-
children: /* @__PURE__ */
|
|
660
|
+
children: /* @__PURE__ */ jsx11(GdsIcons.Gallery, { size: compact ? "1.5rem" : "2rem" })
|
|
607
661
|
}
|
|
608
662
|
) });
|
|
609
663
|
}
|
|
610
664
|
function LoadingCard({ compact }) {
|
|
611
|
-
return /* @__PURE__ */
|
|
612
|
-
/* @__PURE__ */
|
|
665
|
+
return /* @__PURE__ */ jsx11(Card5, { withBorder: true, radius: "lg", padding: compact ? "md" : "lg", children: /* @__PURE__ */ jsxs7(Stack7, { gap: "md", children: [
|
|
666
|
+
/* @__PURE__ */ jsx11(AspectRatio2, { ratio: compact ? 16 / 9 : 4 / 3, children: /* @__PURE__ */ jsx11(Skeleton, { radius: "md" }) }),
|
|
613
667
|
/* @__PURE__ */ jsxs7(Stack7, { gap: "xs", children: [
|
|
614
|
-
/* @__PURE__ */
|
|
615
|
-
/* @__PURE__ */
|
|
616
|
-
/* @__PURE__ */
|
|
668
|
+
/* @__PURE__ */ jsx11(Skeleton, { height: 20, radius: "sm", width: "70%" }),
|
|
669
|
+
/* @__PURE__ */ jsx11(Skeleton, { height: 14, radius: "sm", width: "100%" }),
|
|
670
|
+
/* @__PURE__ */ jsx11(Skeleton, { height: 14, radius: "sm", width: "85%" })
|
|
617
671
|
] }),
|
|
618
672
|
/* @__PURE__ */ jsxs7(Group6, { justify: "space-between", align: "center", children: [
|
|
619
|
-
/* @__PURE__ */
|
|
620
|
-
/* @__PURE__ */
|
|
673
|
+
/* @__PURE__ */ jsx11(Skeleton, { height: 18, radius: "sm", width: 72 }),
|
|
674
|
+
/* @__PURE__ */ jsx11(Skeleton, { height: 36, radius: "md", width: 120 })
|
|
621
675
|
] })
|
|
622
676
|
] }) });
|
|
623
677
|
}
|
|
@@ -640,7 +694,7 @@ function PublicProductCard({
|
|
|
640
694
|
disabled = false
|
|
641
695
|
}) {
|
|
642
696
|
if (loading) {
|
|
643
|
-
return /* @__PURE__ */
|
|
697
|
+
return /* @__PURE__ */ jsx11(LoadingCard, { compact });
|
|
644
698
|
}
|
|
645
699
|
const isActionDisabled = disabled || state === "sold-out";
|
|
646
700
|
const resolvedPrimaryAction = enhanceAction(primaryAction, isActionDisabled);
|
|
@@ -653,43 +707,43 @@ function PublicProductCard({
|
|
|
653
707
|
const pickupHelper = helperKind === "pickup" ? helperText : pickupNote;
|
|
654
708
|
const inventoryHelper = helperKind === "inventory" ? helperText : inventoryNote;
|
|
655
709
|
const hasSupportingRegion = Boolean(price || supportingHelper || pickupHelper || inventoryHelper);
|
|
656
|
-
return /* @__PURE__ */
|
|
657
|
-
image ?? /* @__PURE__ */
|
|
710
|
+
return /* @__PURE__ */ jsx11(Card5, { withBorder: true, radius: "lg", padding: compact ? "md" : "lg", children: /* @__PURE__ */ jsxs7(Stack7, { gap: compact ? "sm" : "md", children: [
|
|
711
|
+
image ?? /* @__PURE__ */ jsx11(ImageFallback, { compact }),
|
|
658
712
|
/* @__PURE__ */ jsxs7(Group6, { justify: "space-between", align: "flex-start", wrap: "nowrap", gap: "sm", children: [
|
|
659
713
|
/* @__PURE__ */ jsxs7(Stack7, { gap: 4, style: { minWidth: 0, flex: 1 }, children: [
|
|
660
|
-
/* @__PURE__ */
|
|
661
|
-
description ? /* @__PURE__ */
|
|
714
|
+
/* @__PURE__ */ jsx11(Title7, { order: compact ? 5 : 4, lineClamp: 2, children: title }),
|
|
715
|
+
description ? /* @__PURE__ */ jsx11(Text7, { size: "sm", c: "dimmed", lineClamp: compact ? 2 : 3, children: description }) : null
|
|
662
716
|
] }),
|
|
663
|
-
/* @__PURE__ */
|
|
717
|
+
/* @__PURE__ */ jsx11(Badge6, { variant: "light", color: stateBadge.color, children: stateBadge.label })
|
|
664
718
|
] }),
|
|
665
719
|
hasSupportingRegion ? /* @__PURE__ */ jsxs7(Group6, { justify: "space-between", align: "flex-end", gap: "sm", wrap: "nowrap", children: [
|
|
666
720
|
/* @__PURE__ */ jsxs7(Stack7, { gap: 2, style: { minWidth: 0, flex: 1 }, children: [
|
|
667
|
-
price ? /* @__PURE__ */
|
|
668
|
-
supportingHelper ? /* @__PURE__ */
|
|
721
|
+
price ? /* @__PURE__ */ jsx11(Text7, { fw: 700, size: compact ? "md" : "lg", children: price }) : null,
|
|
722
|
+
supportingHelper ? /* @__PURE__ */ jsx11(Text7, { size: "xs", c: "dimmed", children: supportingHelper }) : null
|
|
669
723
|
] }),
|
|
670
724
|
resolvedPrimaryAction
|
|
671
|
-
] }) : resolvedPrimaryAction ? /* @__PURE__ */
|
|
725
|
+
] }) : resolvedPrimaryAction ? /* @__PURE__ */ jsx11(Group6, { justify: "flex-end", children: resolvedPrimaryAction }) : null,
|
|
672
726
|
pickupHelper || inventoryHelper || metadata.length ? /* @__PURE__ */ jsxs7(Stack7, { gap: 6, children: [
|
|
673
727
|
pickupHelper ? /* @__PURE__ */ jsxs7(Group6, { justify: "space-between", gap: "sm", children: [
|
|
674
|
-
/* @__PURE__ */
|
|
675
|
-
/* @__PURE__ */
|
|
728
|
+
/* @__PURE__ */ jsx11(Text7, { size: "sm", c: "dimmed", children: "Pickup" }),
|
|
729
|
+
/* @__PURE__ */ jsx11(Text7, { size: "sm", fw: 500, ta: "right", children: pickupHelper })
|
|
676
730
|
] }) : null,
|
|
677
731
|
inventoryHelper ? /* @__PURE__ */ jsxs7(Group6, { justify: "space-between", gap: "sm", children: [
|
|
678
|
-
/* @__PURE__ */
|
|
679
|
-
/* @__PURE__ */
|
|
732
|
+
/* @__PURE__ */ jsx11(Text7, { size: "sm", c: "dimmed", children: "Availability" }),
|
|
733
|
+
/* @__PURE__ */ jsx11(Text7, { size: "sm", fw: 500, ta: "right", children: inventoryHelper })
|
|
680
734
|
] }) : null,
|
|
681
735
|
metadata.map((item) => /* @__PURE__ */ jsxs7(Group6, { justify: "space-between", gap: "sm", children: [
|
|
682
|
-
/* @__PURE__ */
|
|
683
|
-
/* @__PURE__ */
|
|
736
|
+
/* @__PURE__ */ jsx11(Text7, { size: "sm", c: "dimmed", children: item.label }),
|
|
737
|
+
/* @__PURE__ */ jsx11(Text7, { size: "sm", fw: 500, ta: "right", children: item.value })
|
|
684
738
|
] }, item.label))
|
|
685
739
|
] }) : null,
|
|
686
|
-
resolvedSecondaryAction ? /* @__PURE__ */
|
|
740
|
+
resolvedSecondaryAction ? /* @__PURE__ */ jsx11(Group6, { justify: "flex-end", children: resolvedSecondaryAction }) : null
|
|
687
741
|
] }) });
|
|
688
742
|
}
|
|
689
743
|
|
|
690
744
|
// src/DataToolbar.tsx
|
|
691
|
-
import { Badge as
|
|
692
|
-
import { jsx as
|
|
745
|
+
import { Badge as Badge7, Group as Group7, Stack as Stack8 } from "@mantine/core";
|
|
746
|
+
import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
693
747
|
function DataToolbar({
|
|
694
748
|
searchSlot,
|
|
695
749
|
filterSlot,
|
|
@@ -710,8 +764,8 @@ function DataToolbar({
|
|
|
710
764
|
createAction
|
|
711
765
|
] })
|
|
712
766
|
] }),
|
|
713
|
-
activeFilters.length ? /* @__PURE__ */
|
|
714
|
-
|
|
767
|
+
activeFilters.length ? /* @__PURE__ */ jsx12(Group7, { gap: "xs", children: activeFilters.map((filter) => /* @__PURE__ */ jsx12(
|
|
768
|
+
Badge7,
|
|
715
769
|
{
|
|
716
770
|
variant: "light",
|
|
717
771
|
rightSection: filter.onRemove ? "\xD7" : void 0,
|
|
@@ -726,16 +780,16 @@ function DataToolbar({
|
|
|
726
780
|
|
|
727
781
|
// src/StateBlock.tsx
|
|
728
782
|
import { Loader, Stack as Stack9, Text as Text8, ThemeIcon as ThemeIcon4, Title as Title8 } from "@mantine/core";
|
|
729
|
-
import { jsx as
|
|
783
|
+
import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
730
784
|
var variantConfig = {
|
|
731
|
-
loading: { color: "violet", icon: /* @__PURE__ */
|
|
732
|
-
empty: { color: "gray", icon: /* @__PURE__ */
|
|
733
|
-
error: { color: "red", icon: /* @__PURE__ */
|
|
734
|
-
permission: { color: "orange", icon: /* @__PURE__ */
|
|
735
|
-
disabled: { color: "gray", icon: /* @__PURE__ */
|
|
736
|
-
success: { color: "teal", icon: /* @__PURE__ */
|
|
737
|
-
info: { color: "blue", icon: /* @__PURE__ */
|
|
738
|
-
"not-enough-data": { color: "yellow", icon: /* @__PURE__ */
|
|
785
|
+
loading: { color: "violet", icon: /* @__PURE__ */ jsx13(Loader, { size: "sm" }) },
|
|
786
|
+
empty: { color: "gray", icon: /* @__PURE__ */ jsx13(GdsIcons.Inbox, { size: "1.1rem" }) },
|
|
787
|
+
error: { color: "red", icon: /* @__PURE__ */ jsx13(GdsIcons.Danger, { size: "1.1rem" }) },
|
|
788
|
+
permission: { color: "orange", icon: /* @__PURE__ */ jsx13(GdsIcons.Verify, { size: "1.1rem" }) },
|
|
789
|
+
disabled: { color: "gray", icon: /* @__PURE__ */ jsx13(GdsIcons.Toggle, { size: "1.1rem" }) },
|
|
790
|
+
success: { color: "teal", icon: /* @__PURE__ */ jsx13(GdsIcons.Success, { size: "1.1rem" }) },
|
|
791
|
+
info: { color: "blue", icon: /* @__PURE__ */ jsx13(GdsIcons.Info, { size: "1.1rem" }) },
|
|
792
|
+
"not-enough-data": { color: "yellow", icon: /* @__PURE__ */ jsx13(GdsIcons.Analytics, { size: "1.1rem" }) }
|
|
739
793
|
};
|
|
740
794
|
function StateBlock({
|
|
741
795
|
variant,
|
|
@@ -755,10 +809,10 @@ function StateBlock({
|
|
|
755
809
|
py: compact ? "md" : "xl",
|
|
756
810
|
ta: compact ? "left" : "center",
|
|
757
811
|
children: [
|
|
758
|
-
/* @__PURE__ */
|
|
812
|
+
/* @__PURE__ */ jsx13(ThemeIcon4, { variant: "light", color: config.color, size: compact ? "lg" : "xl", radius: "xl", children: icon ?? config.icon }),
|
|
759
813
|
/* @__PURE__ */ jsxs9(Stack9, { gap: 6, align: compact ? "flex-start" : "center", children: [
|
|
760
|
-
/* @__PURE__ */
|
|
761
|
-
description ? /* @__PURE__ */
|
|
814
|
+
/* @__PURE__ */ jsx13(Title8, { order: compact ? 4 : 3, children: title }),
|
|
815
|
+
description ? /* @__PURE__ */ jsx13(Text8, { c: "dimmed", maw: compact ? void 0 : 480, children: description }) : null
|
|
762
816
|
] }),
|
|
763
817
|
action
|
|
764
818
|
]
|
|
@@ -767,8 +821,8 @@ function StateBlock({
|
|
|
767
821
|
}
|
|
768
822
|
|
|
769
823
|
// src/BrowseSurface.tsx
|
|
770
|
-
import { Badge as
|
|
771
|
-
import { jsx as
|
|
824
|
+
import { Badge as Badge8, Box as Box3, Button, Group as Group8, Paper as Paper2, SimpleGrid as SimpleGrid2, Stack as Stack10, Text as Text9, Title as Title9 } from "@mantine/core";
|
|
825
|
+
import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
772
826
|
function BrowseSurface({
|
|
773
827
|
eyebrow,
|
|
774
828
|
title,
|
|
@@ -802,22 +856,22 @@ function BrowseSurface({
|
|
|
802
856
|
}));
|
|
803
857
|
let body = content;
|
|
804
858
|
if (loading) {
|
|
805
|
-
body = /* @__PURE__ */
|
|
859
|
+
body = /* @__PURE__ */ jsx14(StateBlock, { variant: "loading", title: loadingTitle, description: loadingDescription, compact: true });
|
|
806
860
|
} else if (error) {
|
|
807
|
-
body = /* @__PURE__ */
|
|
861
|
+
body = /* @__PURE__ */ jsx14(StateBlock, { variant: "error", title: errorTitle, description: error, action: errorAction ?? emptyAction, compact: true });
|
|
808
862
|
} else if (empty) {
|
|
809
|
-
body = /* @__PURE__ */
|
|
863
|
+
body = /* @__PURE__ */ jsx14(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, action: emptyAction, compact: true });
|
|
810
864
|
}
|
|
811
865
|
return /* @__PURE__ */ jsxs10(Stack10, { gap: "lg", children: [
|
|
812
|
-
/* @__PURE__ */
|
|
866
|
+
/* @__PURE__ */ jsx14(Paper2, { withBorder: true, radius: "xl", p: "xl", children: /* @__PURE__ */ jsxs10(Stack10, { gap: "lg", children: [
|
|
813
867
|
/* @__PURE__ */ jsxs10(Group8, { justify: "space-between", align: "flex-start", gap: "md", children: [
|
|
814
868
|
/* @__PURE__ */ jsxs10(Stack10, { gap: "xs", maw: 760, children: [
|
|
815
|
-
eyebrow ? /* @__PURE__ */
|
|
816
|
-
/* @__PURE__ */
|
|
817
|
-
description ? /* @__PURE__ */
|
|
869
|
+
eyebrow ? /* @__PURE__ */ jsx14(Text9, { size: "xs", fw: 700, tt: "uppercase", c: "dimmed", style: { letterSpacing: "0.18em" }, children: eyebrow }) : null,
|
|
870
|
+
/* @__PURE__ */ jsx14(Title9, { order: 1, children: title }),
|
|
871
|
+
description ? /* @__PURE__ */ jsx14(Text9, { size: "lg", c: "dimmed", children: description }) : null
|
|
818
872
|
] }),
|
|
819
873
|
/* @__PURE__ */ jsxs10(Stack10, { align: "flex-end", gap: "xs", children: [
|
|
820
|
-
typeof resultCount === "number" ? /* @__PURE__ */ jsxs10(
|
|
874
|
+
typeof resultCount === "number" ? /* @__PURE__ */ jsxs10(Badge8, { size: "lg", radius: "xl", variant: "light", color: "violet", children: [
|
|
821
875
|
resultCount,
|
|
822
876
|
" ",
|
|
823
877
|
resultLabel
|
|
@@ -826,8 +880,8 @@ function BrowseSurface({
|
|
|
826
880
|
] })
|
|
827
881
|
] }),
|
|
828
882
|
scopeOptions.length ? /* @__PURE__ */ jsxs10(Stack10, { gap: "xs", children: [
|
|
829
|
-
/* @__PURE__ */
|
|
830
|
-
/* @__PURE__ */
|
|
883
|
+
/* @__PURE__ */ jsx14(Text9, { size: "sm", fw: 600, c: "dimmed", children: scopeLabel }),
|
|
884
|
+
/* @__PURE__ */ jsx14(Group8, { gap: "xs", wrap: "wrap", children: scopeOptions.map((option) => /* @__PURE__ */ jsx14(
|
|
831
885
|
Button,
|
|
832
886
|
{
|
|
833
887
|
variant: option.active ? "filled" : "default",
|
|
@@ -841,29 +895,29 @@ function BrowseSurface({
|
|
|
841
895
|
)) })
|
|
842
896
|
] }) : null,
|
|
843
897
|
locationControls ? /* @__PURE__ */ jsxs10(Stack10, { gap: "xs", children: [
|
|
844
|
-
/* @__PURE__ */
|
|
898
|
+
/* @__PURE__ */ jsx14(Text9, { size: "sm", fw: 600, c: "dimmed", children: "Location" }),
|
|
845
899
|
locationControls
|
|
846
900
|
] }) : null,
|
|
847
901
|
toolbar || sortControl ? /* @__PURE__ */ jsxs10(SimpleGrid2, { cols: { base: 1, lg: sortControl ? 2 : 1 }, spacing: "md", children: [
|
|
848
|
-
toolbar ? /* @__PURE__ */
|
|
902
|
+
toolbar ? /* @__PURE__ */ jsx14(
|
|
849
903
|
DataToolbar,
|
|
850
904
|
{
|
|
851
905
|
...toolbar,
|
|
852
906
|
activeFilters: toolbarFilters.length ? toolbarFilters : toolbar.fallbackActiveFilters
|
|
853
907
|
}
|
|
854
|
-
) : /* @__PURE__ */
|
|
908
|
+
) : /* @__PURE__ */ jsx14(Box3, {}),
|
|
855
909
|
sortControl ? /* @__PURE__ */ jsxs10(Stack10, { gap: "xs", align: "stretch", children: [
|
|
856
|
-
/* @__PURE__ */
|
|
910
|
+
/* @__PURE__ */ jsx14(Text9, { size: "sm", fw: 600, c: "dimmed", children: "Sort" }),
|
|
857
911
|
sortControl
|
|
858
912
|
] }) : null
|
|
859
913
|
] }) : null,
|
|
860
914
|
mobileFilters ? /* @__PURE__ */ jsxs10(Stack10, { hiddenFrom: "lg", gap: "xs", children: [
|
|
861
|
-
/* @__PURE__ */
|
|
915
|
+
/* @__PURE__ */ jsx14(Text9, { size: "sm", fw: 600, c: "dimmed", children: "Filters" }),
|
|
862
916
|
mobileFilters
|
|
863
917
|
] }) : null,
|
|
864
|
-
filterDrawer ? /* @__PURE__ */
|
|
865
|
-
activeFilters.length ? /* @__PURE__ */
|
|
866
|
-
|
|
918
|
+
filterDrawer ? /* @__PURE__ */ jsx14(Box3, { hiddenFrom: "lg", children: filterDrawer }) : null,
|
|
919
|
+
activeFilters.length ? /* @__PURE__ */ jsx14(Group8, { gap: "xs", wrap: "wrap", children: activeFilters.map((filter) => /* @__PURE__ */ jsx14(
|
|
920
|
+
Badge8,
|
|
867
921
|
{
|
|
868
922
|
variant: "light",
|
|
869
923
|
color: "violet",
|
|
@@ -880,8 +934,8 @@ function BrowseSurface({
|
|
|
880
934
|
}
|
|
881
935
|
|
|
882
936
|
// src/AccentPanel.tsx
|
|
883
|
-
import { Badge as
|
|
884
|
-
import { jsx as
|
|
937
|
+
import { Badge as Badge9, Box as Box4, Group as Group9, Paper as Paper3, Stack as Stack11, Text as Text10, Title as Title10 } from "@mantine/core";
|
|
938
|
+
import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
885
939
|
var toneStyles = {
|
|
886
940
|
gray: {
|
|
887
941
|
bg: "light-dark(var(--mantine-color-gray-0), color-mix(in srgb, var(--mantine-color-gray-7) 88%, black))",
|
|
@@ -937,25 +991,25 @@ function AccentPanel({
|
|
|
937
991
|
children
|
|
938
992
|
}) {
|
|
939
993
|
const styles = resolveAccentPanelStyles(tone, variant);
|
|
940
|
-
return /* @__PURE__ */
|
|
994
|
+
return /* @__PURE__ */ jsx15(Paper3, { withBorder: true, radius: "lg", p: "lg", style: styles, children: /* @__PURE__ */ jsxs11(Stack11, { gap: "sm", children: [
|
|
941
995
|
title || badge ? /* @__PURE__ */ jsxs11(Group9, { justify: "space-between", align: "flex-start", gap: "sm", wrap: "wrap", children: [
|
|
942
|
-
title ? /* @__PURE__ */
|
|
943
|
-
badge ? typeof badge === "string" ? /* @__PURE__ */
|
|
996
|
+
title ? /* @__PURE__ */ jsx15(Title10, { order: 4, c: "inherit", children: title }) : /* @__PURE__ */ jsx15(Box4, {}),
|
|
997
|
+
badge ? typeof badge === "string" ? /* @__PURE__ */ jsx15(Badge9, { color: tone === "amber" ? "yellow" : tone, variant: "filled", children: badge }) : badge : null
|
|
944
998
|
] }) : null,
|
|
945
|
-
typeof children === "string" ? /* @__PURE__ */
|
|
999
|
+
typeof children === "string" ? /* @__PURE__ */ jsx15(Text10, { c: "inherit", children }) : /* @__PURE__ */ jsx15(Box4, { c: "inherit", children })
|
|
946
1000
|
] }) });
|
|
947
1001
|
}
|
|
948
1002
|
|
|
949
1003
|
// src/PublicNav.tsx
|
|
950
1004
|
import { Anchor as Anchor2, Group as Group10 } from "@mantine/core";
|
|
951
|
-
import { jsx as
|
|
1005
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
952
1006
|
function PublicNav({ items, activeId, renderLink }) {
|
|
953
|
-
return /* @__PURE__ */
|
|
1007
|
+
return /* @__PURE__ */ jsx16(Group10, { component: "nav", "aria-label": "Primary", gap: "lg", wrap: "nowrap", children: items.map((item) => {
|
|
954
1008
|
const active = item.id === activeId;
|
|
955
1009
|
if (renderLink) {
|
|
956
|
-
return /* @__PURE__ */
|
|
1010
|
+
return /* @__PURE__ */ jsx16("span", { children: renderLink(item, active) }, item.id);
|
|
957
1011
|
}
|
|
958
|
-
return /* @__PURE__ */
|
|
1012
|
+
return /* @__PURE__ */ jsx16(
|
|
959
1013
|
Anchor2,
|
|
960
1014
|
{
|
|
961
1015
|
href: item.href,
|
|
@@ -974,7 +1028,7 @@ function PublicNav({ items, activeId, renderLink }) {
|
|
|
974
1028
|
|
|
975
1029
|
// src/PublicShell.tsx
|
|
976
1030
|
import { AppShell, Box as Box5, Burger, Container, Group as Group11, Stack as Stack12, Text as Text11 } from "@mantine/core";
|
|
977
|
-
import { jsx as
|
|
1031
|
+
import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
978
1032
|
function InlineMobileNavigation({
|
|
979
1033
|
mobileNavigation,
|
|
980
1034
|
className,
|
|
@@ -994,12 +1048,12 @@ function InlineMobileNavigation({
|
|
|
994
1048
|
gap: "0.5rem"
|
|
995
1049
|
},
|
|
996
1050
|
children: [
|
|
997
|
-
/* @__PURE__ */
|
|
998
|
-
/* @__PURE__ */
|
|
1051
|
+
/* @__PURE__ */ jsx17(Burger, { opened: false, "aria-hidden": true }),
|
|
1052
|
+
/* @__PURE__ */ jsx17(Text11, { size: "sm", fw: 600, children: "Menu" })
|
|
999
1053
|
]
|
|
1000
1054
|
}
|
|
1001
1055
|
),
|
|
1002
|
-
/* @__PURE__ */
|
|
1056
|
+
/* @__PURE__ */ jsx17(
|
|
1003
1057
|
Box5,
|
|
1004
1058
|
{
|
|
1005
1059
|
mt: "sm",
|
|
@@ -1009,7 +1063,7 @@ function InlineMobileNavigation({
|
|
|
1009
1063
|
border: "1px solid var(--mantine-color-default-border)",
|
|
1010
1064
|
background: mode === "drawer" ? "light-dark(var(--mantine-color-white), color-mix(in srgb, var(--mantine-color-dark-7) 92%, black))" : "var(--mantine-color-body)"
|
|
1011
1065
|
},
|
|
1012
|
-
children: /* @__PURE__ */
|
|
1066
|
+
children: /* @__PURE__ */ jsx17(Stack12, { gap: "sm", children: mobileNavigation })
|
|
1013
1067
|
}
|
|
1014
1068
|
)
|
|
1015
1069
|
] });
|
|
@@ -1030,7 +1084,7 @@ function PublicShell({
|
|
|
1030
1084
|
mobileNavigationMode = "sheet",
|
|
1031
1085
|
classNames
|
|
1032
1086
|
}) {
|
|
1033
|
-
const resolvedNavigation = navigation ?? (navItems ? /* @__PURE__ */
|
|
1087
|
+
const resolvedNavigation = navigation ?? (navItems ? /* @__PURE__ */ jsx17(PublicNav, { items: navItems, activeId: activeNavId }) : null);
|
|
1034
1088
|
const containerSize = maxContentWidth ?? (compact ? "md" : "lg");
|
|
1035
1089
|
const headerHeight = headerVariant === "compact" ? 64 : headerVariant === "branded-quiet" ? 88 : 72;
|
|
1036
1090
|
const mainPadding = headerVariant === "compact" ? "lg" : "xl";
|
|
@@ -1044,7 +1098,7 @@ function PublicShell({
|
|
|
1044
1098
|
footer: usesSheetMobileNavigation ? { height: 68 } : void 0,
|
|
1045
1099
|
padding: 0,
|
|
1046
1100
|
children: [
|
|
1047
|
-
/* @__PURE__ */
|
|
1101
|
+
/* @__PURE__ */ jsx17(AppShell.Header, { withBorder: headerBordered, className: classNames?.header, "data-header-variant": headerVariant, children: /* @__PURE__ */ jsx17(Container, { size: containerSize, h: "100%", py: headerVariant === "branded-quiet" ? "sm" : 0, children: /* @__PURE__ */ jsxs12(
|
|
1048
1102
|
Group11,
|
|
1049
1103
|
{
|
|
1050
1104
|
h: "100%",
|
|
@@ -1053,7 +1107,7 @@ function PublicShell({
|
|
|
1053
1107
|
gap: headerVariant === "compact" ? "sm" : "lg",
|
|
1054
1108
|
children: [
|
|
1055
1109
|
/* @__PURE__ */ jsxs12(Group11, { wrap: "nowrap", gap: headerVariant === "compact" ? "xs" : "sm", className: classNames?.brand, children: [
|
|
1056
|
-
usesInlineMobileNavigation ? /* @__PURE__ */
|
|
1110
|
+
usesInlineMobileNavigation ? /* @__PURE__ */ jsx17(
|
|
1057
1111
|
InlineMobileNavigation,
|
|
1058
1112
|
{
|
|
1059
1113
|
mobileNavigation,
|
|
@@ -1061,17 +1115,17 @@ function PublicShell({
|
|
|
1061
1115
|
mode: mobileNavigationMode
|
|
1062
1116
|
}
|
|
1063
1117
|
) : null,
|
|
1064
|
-
/* @__PURE__ */
|
|
1118
|
+
/* @__PURE__ */ jsx17(Box5, { children: brand })
|
|
1065
1119
|
] }),
|
|
1066
|
-
/* @__PURE__ */
|
|
1067
|
-
/* @__PURE__ */
|
|
1120
|
+
/* @__PURE__ */ jsx17(Group11, { visibleFrom: "sm", gap: headerVariant === "compact" ? "md" : "lg", className: classNames?.navigation, children: resolvedNavigation }),
|
|
1121
|
+
/* @__PURE__ */ jsx17(Group11, { gap: "sm", className: classNames?.actions, children: actions })
|
|
1068
1122
|
]
|
|
1069
1123
|
}
|
|
1070
1124
|
) }) }),
|
|
1071
|
-
usesSheetMobileNavigation ? /* @__PURE__ */
|
|
1125
|
+
usesSheetMobileNavigation ? /* @__PURE__ */ jsx17(AppShell.Footer, { withBorder: true, children: /* @__PURE__ */ jsx17(Container, { size: containerSize, h: "100%", children: /* @__PURE__ */ jsx17(Group11, { h: "100%", justify: "space-around", wrap: "nowrap", children: mobileNavigation }) }) }) : null,
|
|
1072
1126
|
/* @__PURE__ */ jsxs12(AppShell.Main, { children: [
|
|
1073
|
-
/* @__PURE__ */
|
|
1074
|
-
footer ? /* @__PURE__ */
|
|
1127
|
+
/* @__PURE__ */ jsx17(Container, { size: containerSize, py: mainPadding, className: classNames?.content, children: /* @__PURE__ */ jsx17(Stack12, { gap: "xl", children }) }),
|
|
1128
|
+
footer ? /* @__PURE__ */ jsx17(Box5, { component: typeof footer === "string" ? "footer" : "div", py: "xl", children: /* @__PURE__ */ jsx17(Container, { size: containerSize, children: typeof footer === "string" ? /* @__PURE__ */ jsx17(Text11, { size: "sm", c: "dimmed", children: footer }) : footer }) }) : null
|
|
1075
1129
|
] })
|
|
1076
1130
|
]
|
|
1077
1131
|
}
|
|
@@ -1080,17 +1134,17 @@ function PublicShell({
|
|
|
1080
1134
|
|
|
1081
1135
|
// src/PublicSiteFooter.tsx
|
|
1082
1136
|
import { Group as Group12, Stack as Stack13, Text as Text12 } from "@mantine/core";
|
|
1083
|
-
import { jsx as
|
|
1137
|
+
import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1084
1138
|
function PublicSiteFooter({ children, meta }) {
|
|
1085
1139
|
return /* @__PURE__ */ jsxs13(Stack13, { component: "footer", gap: "xs", children: [
|
|
1086
|
-
children ? /* @__PURE__ */
|
|
1087
|
-
meta ? /* @__PURE__ */
|
|
1140
|
+
children ? /* @__PURE__ */ jsx18(Text12, { size: "sm", children }) : null,
|
|
1141
|
+
meta ? /* @__PURE__ */ jsx18(Group12, { gap: "sm", children: /* @__PURE__ */ jsx18(Text12, { size: "xs", c: "dimmed", children: meta }) }) : null
|
|
1088
1142
|
] });
|
|
1089
1143
|
}
|
|
1090
1144
|
|
|
1091
1145
|
// src/PublicBrandFooter.tsx
|
|
1092
1146
|
import { Box as Box6, Divider as Divider2, Grid, Group as Group13, Paper as Paper4, Stack as Stack14, Text as Text13, Title as Title11 } from "@mantine/core";
|
|
1093
|
-
import { Fragment as Fragment2, jsx as
|
|
1147
|
+
import { Fragment as Fragment2, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1094
1148
|
function PublicBrandFooter({
|
|
1095
1149
|
media,
|
|
1096
1150
|
brandTitle,
|
|
@@ -1105,7 +1159,7 @@ function PublicBrandFooter({
|
|
|
1105
1159
|
const mediaSpan = layoutVariant === "immersive-media" ? 5 : 4;
|
|
1106
1160
|
const primarySpan = media ? layoutVariant === "balanced-quote" ? 4 : 4 : secondary ? 6 : 12;
|
|
1107
1161
|
const secondarySpan = media ? Math.max(3, 12 - mediaSpan - primarySpan) : Math.max(4, 12 - primarySpan);
|
|
1108
|
-
return /* @__PURE__ */
|
|
1162
|
+
return /* @__PURE__ */ jsx19(
|
|
1109
1163
|
Paper4,
|
|
1110
1164
|
{
|
|
1111
1165
|
component: "footer",
|
|
@@ -1116,17 +1170,17 @@ function PublicBrandFooter({
|
|
|
1116
1170
|
"data-layout-variant": layoutVariant,
|
|
1117
1171
|
children: /* @__PURE__ */ jsxs14(Stack14, { gap: "lg", children: [
|
|
1118
1172
|
/* @__PURE__ */ jsxs14(Grid, { gutter: compact ? "lg" : "xl", align: "flex-start", children: [
|
|
1119
|
-
media ? /* @__PURE__ */
|
|
1120
|
-
/* @__PURE__ */
|
|
1121
|
-
brandTitle ? /* @__PURE__ */
|
|
1122
|
-
description ? /* @__PURE__ */
|
|
1123
|
-
actions ? /* @__PURE__ */
|
|
1173
|
+
media ? /* @__PURE__ */ jsx19(Grid.Col, { span: { base: 12, md: mediaSpan }, children: /* @__PURE__ */ jsx19(Box6, { className: classNames?.media, children: media }) }) : null,
|
|
1174
|
+
/* @__PURE__ */ jsx19(Grid.Col, { span: { base: 12, md: primarySpan }, children: /* @__PURE__ */ jsxs14(Stack14, { gap: compact ? "xs" : "sm", className: classNames?.primary, children: [
|
|
1175
|
+
brandTitle ? /* @__PURE__ */ jsx19(Title11, { order: 4, children: brandTitle }) : null,
|
|
1176
|
+
description ? /* @__PURE__ */ jsx19(Text13, { c: "dimmed", children: description }) : null,
|
|
1177
|
+
actions ? /* @__PURE__ */ jsx19(Box6, { children: actions }) : null
|
|
1124
1178
|
] }) }),
|
|
1125
|
-
secondary ? /* @__PURE__ */
|
|
1179
|
+
secondary ? /* @__PURE__ */ jsx19(Grid.Col, { span: { base: 12, md: secondarySpan }, children: /* @__PURE__ */ jsx19(Stack14, { gap: compact ? "xs" : "sm", className: classNames?.secondary, children: secondary }) }) : null
|
|
1126
1180
|
] }),
|
|
1127
1181
|
legal ? /* @__PURE__ */ jsxs14(Fragment2, { children: [
|
|
1128
|
-
/* @__PURE__ */
|
|
1129
|
-
/* @__PURE__ */
|
|
1182
|
+
/* @__PURE__ */ jsx19(Divider2, {}),
|
|
1183
|
+
/* @__PURE__ */ jsx19(Group13, { justify: "space-between", gap: "sm", wrap: "wrap", className: classNames?.legal, children: typeof legal === "string" ? /* @__PURE__ */ jsx19(Text13, { size: "sm", c: "dimmed", children: legal }) : legal })
|
|
1130
1184
|
] }) : null
|
|
1131
1185
|
] })
|
|
1132
1186
|
}
|
|
@@ -1135,56 +1189,59 @@ function PublicBrandFooter({
|
|
|
1135
1189
|
|
|
1136
1190
|
// src/AuthShell.tsx
|
|
1137
1191
|
import { Box as Box7, Card as Card6, Container as Container2, Group as Group14, Stack as Stack15, Text as Text14, Title as Title12 } from "@mantine/core";
|
|
1138
|
-
import { jsx as
|
|
1139
|
-
function AuthShell({ title, description, brand, footer, helper, children }) {
|
|
1140
|
-
return /* @__PURE__ */
|
|
1141
|
-
brand ? /* @__PURE__ */
|
|
1142
|
-
|
|
1192
|
+
import { jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1193
|
+
function AuthShell({ title, description, brand, headerActions, footer, helper, children }) {
|
|
1194
|
+
return /* @__PURE__ */ jsx20(Box7, { py: { base: "xl", md: "4rem" }, children: /* @__PURE__ */ jsx20(Container2, { size: "xs", children: /* @__PURE__ */ jsxs15(Stack15, { gap: "xl", children: [
|
|
1195
|
+
brand || headerActions ? /* @__PURE__ */ jsxs15(Group14, { justify: brand && headerActions ? "space-between" : "center", align: "center", children: [
|
|
1196
|
+
brand ? /* @__PURE__ */ jsx20(Box7, { children: brand }) : /* @__PURE__ */ jsx20(Box7, {}),
|
|
1197
|
+
headerActions ? /* @__PURE__ */ jsx20(Group14, { gap: "sm", children: headerActions }) : null
|
|
1198
|
+
] }) : null,
|
|
1199
|
+
/* @__PURE__ */ jsx20(Card6, { withBorder: true, radius: "lg", padding: "xl", children: /* @__PURE__ */ jsxs15(Stack15, { gap: "lg", children: [
|
|
1143
1200
|
/* @__PURE__ */ jsxs15(Stack15, { gap: "xs", ta: "center", children: [
|
|
1144
|
-
/* @__PURE__ */
|
|
1145
|
-
description ? /* @__PURE__ */
|
|
1201
|
+
/* @__PURE__ */ jsx20(Title12, { order: 2, children: title }),
|
|
1202
|
+
description ? /* @__PURE__ */ jsx20(Text14, { c: "dimmed", size: "sm", children: description }) : null
|
|
1146
1203
|
] }),
|
|
1147
1204
|
children,
|
|
1148
|
-
helper ? /* @__PURE__ */
|
|
1205
|
+
helper ? /* @__PURE__ */ jsx20(Text14, { size: "sm", c: "dimmed", ta: "center", children: helper }) : null
|
|
1149
1206
|
] }) }),
|
|
1150
|
-
footer ? /* @__PURE__ */
|
|
1207
|
+
footer ? /* @__PURE__ */ jsx20(Text14, { size: "sm", c: "dimmed", ta: "center", children: footer }) : null
|
|
1151
1208
|
] }) }) });
|
|
1152
1209
|
}
|
|
1153
1210
|
|
|
1154
1211
|
// src/ArticleShell.tsx
|
|
1155
1212
|
import { Container as Container3, Group as Group15, Stack as Stack16, Text as Text15, Title as Title13 } from "@mantine/core";
|
|
1156
|
-
import { jsx as
|
|
1213
|
+
import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1157
1214
|
function ArticleShell({ eyebrow, title, lead, meta, sideRail, children }) {
|
|
1158
|
-
return /* @__PURE__ */
|
|
1215
|
+
return /* @__PURE__ */ jsx21(Container3, { size: "lg", py: "xl", children: /* @__PURE__ */ jsxs16(Group15, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
|
|
1159
1216
|
/* @__PURE__ */ jsxs16(Stack16, { gap: "lg", maw: 760, flex: 1, children: [
|
|
1160
1217
|
/* @__PURE__ */ jsxs16(Stack16, { gap: "sm", children: [
|
|
1161
|
-
eyebrow ? /* @__PURE__ */
|
|
1162
|
-
/* @__PURE__ */
|
|
1163
|
-
lead ? /* @__PURE__ */
|
|
1164
|
-
meta ? /* @__PURE__ */
|
|
1218
|
+
eyebrow ? /* @__PURE__ */ jsx21(Text15, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
|
|
1219
|
+
/* @__PURE__ */ jsx21(Title13, { order: 1, children: title }),
|
|
1220
|
+
lead ? /* @__PURE__ */ jsx21(Text15, { size: "lg", c: "dimmed", children: lead }) : null,
|
|
1221
|
+
meta ? /* @__PURE__ */ jsx21(Group15, { gap: "md", children: meta }) : null
|
|
1165
1222
|
] }),
|
|
1166
|
-
/* @__PURE__ */
|
|
1223
|
+
/* @__PURE__ */ jsx21(Stack16, { gap: "md", children })
|
|
1167
1224
|
] }),
|
|
1168
|
-
sideRail ? /* @__PURE__ */
|
|
1225
|
+
sideRail ? /* @__PURE__ */ jsx21(Stack16, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
|
|
1169
1226
|
] }) });
|
|
1170
1227
|
}
|
|
1171
1228
|
|
|
1172
1229
|
// src/CtaButtonGroup.tsx
|
|
1173
1230
|
import { Group as Group16, Stack as Stack17 } from "@mantine/core";
|
|
1174
|
-
import { jsx as
|
|
1231
|
+
import { jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1175
1232
|
function CtaButtonGroup({ primary, secondary, tertiary }) {
|
|
1176
1233
|
return /* @__PURE__ */ jsxs17(Stack17, { gap: "sm", children: [
|
|
1177
1234
|
/* @__PURE__ */ jsxs17(Group16, { gap: "sm", align: "stretch", children: [
|
|
1178
|
-
/* @__PURE__ */
|
|
1179
|
-
secondary ? /* @__PURE__ */
|
|
1235
|
+
/* @__PURE__ */ jsx22("div", { children: primary }),
|
|
1236
|
+
secondary ? /* @__PURE__ */ jsx22("div", { children: secondary }) : null
|
|
1180
1237
|
] }),
|
|
1181
|
-
tertiary ? /* @__PURE__ */
|
|
1238
|
+
tertiary ? /* @__PURE__ */ jsx22("div", { children: tertiary }) : null
|
|
1182
1239
|
] });
|
|
1183
1240
|
}
|
|
1184
1241
|
|
|
1185
1242
|
// src/DocsPageShell.tsx
|
|
1186
1243
|
import { Anchor as Anchor3, Breadcrumbs, Container as Container4, Group as Group17, Stack as Stack18, Text as Text16, Title as Title14 } from "@mantine/core";
|
|
1187
|
-
import { jsx as
|
|
1244
|
+
import { jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1188
1245
|
function DocsPageShell({
|
|
1189
1246
|
breadcrumbs = [],
|
|
1190
1247
|
title,
|
|
@@ -1195,27 +1252,27 @@ function DocsPageShell({
|
|
|
1195
1252
|
footerNext,
|
|
1196
1253
|
children
|
|
1197
1254
|
}) {
|
|
1198
|
-
return /* @__PURE__ */
|
|
1255
|
+
return /* @__PURE__ */ jsx23(Container4, { size: "lg", py: "xl", children: /* @__PURE__ */ jsxs18(Group17, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
|
|
1199
1256
|
/* @__PURE__ */ jsxs18(Stack18, { component: "article", gap: "lg", maw: 760, flex: 1, children: [
|
|
1200
|
-
breadcrumbs.length ? /* @__PURE__ */
|
|
1201
|
-
(crumb) => crumb.href ? /* @__PURE__ */
|
|
1257
|
+
breadcrumbs.length ? /* @__PURE__ */ jsx23(Breadcrumbs, { children: breadcrumbs.map(
|
|
1258
|
+
(crumb) => crumb.href ? /* @__PURE__ */ jsx23(Anchor3, { href: crumb.href, children: crumb.label }, `${crumb.label}-${crumb.href}`) : /* @__PURE__ */ jsx23(Text16, { children: crumb.label }, crumb.label)
|
|
1202
1259
|
) }) : null,
|
|
1203
1260
|
/* @__PURE__ */ jsxs18(Stack18, { gap: "sm", children: [
|
|
1204
|
-
eyebrow ? /* @__PURE__ */
|
|
1205
|
-
/* @__PURE__ */
|
|
1206
|
-
lead ? /* @__PURE__ */
|
|
1207
|
-
meta ? /* @__PURE__ */
|
|
1261
|
+
eyebrow ? /* @__PURE__ */ jsx23(Text16, { size: "sm", fw: 700, c: "dimmed", children: eyebrow }) : null,
|
|
1262
|
+
/* @__PURE__ */ jsx23(Title14, { order: 1, children: title }),
|
|
1263
|
+
lead ? /* @__PURE__ */ jsx23(Text16, { size: "lg", c: "dimmed", children: lead }) : null,
|
|
1264
|
+
meta ? /* @__PURE__ */ jsx23(Group17, { gap: "md", children: meta }) : null
|
|
1208
1265
|
] }),
|
|
1209
|
-
/* @__PURE__ */
|
|
1210
|
-
footerNext ? /* @__PURE__ */
|
|
1266
|
+
/* @__PURE__ */ jsx23(Stack18, { gap: "md", children }),
|
|
1267
|
+
footerNext ? /* @__PURE__ */ jsx23(Anchor3, { href: footerNext.href, fw: 600, children: footerNext.label }) : null
|
|
1211
1268
|
] }),
|
|
1212
|
-
sideRail ? /* @__PURE__ */
|
|
1269
|
+
sideRail ? /* @__PURE__ */ jsx23(Stack18, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
|
|
1213
1270
|
] }) });
|
|
1214
1271
|
}
|
|
1215
1272
|
|
|
1216
1273
|
// src/EditorialHero.tsx
|
|
1217
1274
|
import { Anchor as Anchor4, AspectRatio as AspectRatio3, Box as Box8, Grid as Grid2, Group as Group18, Paper as Paper5, Skeleton as Skeleton2, Stack as Stack19, Text as Text17, ThemeIcon as ThemeIcon5, Title as Title15 } from "@mantine/core";
|
|
1218
|
-
import { jsx as
|
|
1275
|
+
import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1219
1276
|
function resolveActionVariant(action, index, seenPrimary) {
|
|
1220
1277
|
const requested = action.variant ?? (index === 0 ? "primary" : "secondary");
|
|
1221
1278
|
if (requested === "primary" && !seenPrimary) {
|
|
@@ -1227,7 +1284,7 @@ function resolveActionVariant(action, index, seenPrimary) {
|
|
|
1227
1284
|
return { variant: "default", seenPrimary };
|
|
1228
1285
|
}
|
|
1229
1286
|
function HeroAction({ action, variant }) {
|
|
1230
|
-
const content = /* @__PURE__ */
|
|
1287
|
+
const content = /* @__PURE__ */ jsx24(
|
|
1231
1288
|
Anchor4,
|
|
1232
1289
|
{
|
|
1233
1290
|
href: action.href,
|
|
@@ -1252,7 +1309,7 @@ function HeroAction({ action, variant }) {
|
|
|
1252
1309
|
}
|
|
1253
1310
|
);
|
|
1254
1311
|
if (!action.href) {
|
|
1255
|
-
return /* @__PURE__ */
|
|
1312
|
+
return /* @__PURE__ */ jsx24(
|
|
1256
1313
|
Box8,
|
|
1257
1314
|
{
|
|
1258
1315
|
component: "button",
|
|
@@ -1280,22 +1337,22 @@ function HeroAction({ action, variant }) {
|
|
|
1280
1337
|
return content;
|
|
1281
1338
|
}
|
|
1282
1339
|
function LoadingHero({ compact }) {
|
|
1283
|
-
return /* @__PURE__ */
|
|
1284
|
-
/* @__PURE__ */
|
|
1285
|
-
/* @__PURE__ */
|
|
1286
|
-
/* @__PURE__ */
|
|
1287
|
-
/* @__PURE__ */
|
|
1288
|
-
/* @__PURE__ */
|
|
1340
|
+
return /* @__PURE__ */ jsx24(Paper5, { withBorder: true, radius: "xl", p: compact ? "lg" : "xl", children: /* @__PURE__ */ jsxs19(Grid2, { gutter: compact ? "lg" : "xl", align: "center", children: [
|
|
1341
|
+
/* @__PURE__ */ jsx24(Grid2.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ jsxs19(Stack19, { gap: "md", children: [
|
|
1342
|
+
/* @__PURE__ */ jsx24(Skeleton2, { height: 16, width: 96, radius: "xl" }),
|
|
1343
|
+
/* @__PURE__ */ jsx24(Skeleton2, { height: 48, width: "90%", radius: "md" }),
|
|
1344
|
+
/* @__PURE__ */ jsx24(Skeleton2, { height: 18, width: "100%", radius: "md" }),
|
|
1345
|
+
/* @__PURE__ */ jsx24(Skeleton2, { height: 18, width: "82%", radius: "md" }),
|
|
1289
1346
|
/* @__PURE__ */ jsxs19(Group18, { children: [
|
|
1290
|
-
/* @__PURE__ */
|
|
1291
|
-
/* @__PURE__ */
|
|
1347
|
+
/* @__PURE__ */ jsx24(Skeleton2, { height: 40, width: 140, radius: "md" }),
|
|
1348
|
+
/* @__PURE__ */ jsx24(Skeleton2, { height: 40, width: 140, radius: "md" })
|
|
1292
1349
|
] })
|
|
1293
1350
|
] }) }),
|
|
1294
|
-
/* @__PURE__ */
|
|
1351
|
+
/* @__PURE__ */ jsx24(Grid2.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ jsx24(AspectRatio3, { ratio: 16 / 11, children: /* @__PURE__ */ jsx24(Skeleton2, { radius: "lg" }) }) })
|
|
1295
1352
|
] }) });
|
|
1296
1353
|
}
|
|
1297
1354
|
function MediaFallback() {
|
|
1298
|
-
return /* @__PURE__ */
|
|
1355
|
+
return /* @__PURE__ */ jsx24(AspectRatio3, { ratio: 16 / 11, children: /* @__PURE__ */ jsx24(
|
|
1299
1356
|
ThemeIcon5,
|
|
1300
1357
|
{
|
|
1301
1358
|
size: "100%",
|
|
@@ -1303,7 +1360,7 @@ function MediaFallback() {
|
|
|
1303
1360
|
color: "gray",
|
|
1304
1361
|
variant: "light",
|
|
1305
1362
|
"aria-label": "Hero media is unavailable",
|
|
1306
|
-
children: /* @__PURE__ */
|
|
1363
|
+
children: /* @__PURE__ */ jsx24(GdsIcons.Gallery, { size: "2.5rem" })
|
|
1307
1364
|
}
|
|
1308
1365
|
) });
|
|
1309
1366
|
}
|
|
@@ -1337,8 +1394,8 @@ function MediaFrame({
|
|
|
1337
1394
|
},
|
|
1338
1395
|
"aria-label": mediaAlt,
|
|
1339
1396
|
children: [
|
|
1340
|
-
media ?? /* @__PURE__ */
|
|
1341
|
-
media && overlayBackground ? /* @__PURE__ */
|
|
1397
|
+
media ?? /* @__PURE__ */ jsx24(MediaFallback, {}),
|
|
1398
|
+
media && overlayBackground ? /* @__PURE__ */ jsx24(
|
|
1342
1399
|
Box8,
|
|
1343
1400
|
{
|
|
1344
1401
|
"aria-hidden": true,
|
|
@@ -1372,7 +1429,7 @@ function EditorialHero({
|
|
|
1372
1429
|
classNames
|
|
1373
1430
|
}) {
|
|
1374
1431
|
if (loading) {
|
|
1375
|
-
return /* @__PURE__ */
|
|
1432
|
+
return /* @__PURE__ */ jsx24(LoadingHero, { compact });
|
|
1376
1433
|
}
|
|
1377
1434
|
const stackAlign = align === "center" ? "center" : "flex-start";
|
|
1378
1435
|
const textAlign = align === "center" ? "center" : "left";
|
|
@@ -1380,15 +1437,15 @@ function EditorialHero({
|
|
|
1380
1437
|
const renderedActions = actions.slice(0, 3).map((action, index) => {
|
|
1381
1438
|
const resolved = resolveActionVariant(action, index, seenPrimary);
|
|
1382
1439
|
seenPrimary = resolved.seenPrimary;
|
|
1383
|
-
return /* @__PURE__ */
|
|
1440
|
+
return /* @__PURE__ */ jsx24(HeroAction, { action, variant: resolved.variant }, `${action.label}-${index}`);
|
|
1384
1441
|
});
|
|
1385
1442
|
const textSlot = /* @__PURE__ */ jsxs19(Stack19, { gap: compact ? "md" : "lg", justify: "center", h: "100%", className: classNames?.content, children: [
|
|
1386
1443
|
/* @__PURE__ */ jsxs19(Stack19, { gap: "sm", align: stackAlign, children: [
|
|
1387
|
-
eyebrow ? /* @__PURE__ */
|
|
1388
|
-
/* @__PURE__ */
|
|
1389
|
-
description ? /* @__PURE__ */
|
|
1444
|
+
eyebrow ? /* @__PURE__ */ jsx24(Text17, { size: "sm", fw: 700, c: "dimmed", ta: textAlign, children: eyebrow }) : null,
|
|
1445
|
+
/* @__PURE__ */ jsx24(Title15, { order: 1, maw: 760, ta: textAlign, children: title }),
|
|
1446
|
+
description ? /* @__PURE__ */ jsx24(Text17, { size: compact ? "md" : "lg", c: "dimmed", maw: 720, ta: textAlign, children: description }) : null
|
|
1390
1447
|
] }),
|
|
1391
|
-
renderedActions.length ? /* @__PURE__ */
|
|
1448
|
+
renderedActions.length ? /* @__PURE__ */ jsx24(Box8, { className: classNames?.actions, children: /* @__PURE__ */ jsx24(
|
|
1392
1449
|
CtaButtonGroup,
|
|
1393
1450
|
{
|
|
1394
1451
|
primary: renderedActions[0],
|
|
@@ -1396,7 +1453,7 @@ function EditorialHero({
|
|
|
1396
1453
|
tertiary: renderedActions[2]
|
|
1397
1454
|
}
|
|
1398
1455
|
) }) : null,
|
|
1399
|
-
meta.length ? /* @__PURE__ */
|
|
1456
|
+
meta.length ? /* @__PURE__ */ jsx24(Group18, { gap: "sm", wrap: "wrap", "aria-label": "Supporting details", className: classNames?.meta, children: meta.map((item) => /* @__PURE__ */ jsxs19(
|
|
1400
1457
|
Group18,
|
|
1401
1458
|
{
|
|
1402
1459
|
gap: 6,
|
|
@@ -1408,16 +1465,16 @@ function EditorialHero({
|
|
|
1408
1465
|
},
|
|
1409
1466
|
children: [
|
|
1410
1467
|
item.icon,
|
|
1411
|
-
/* @__PURE__ */
|
|
1468
|
+
/* @__PURE__ */ jsx24(Text17, { size: "sm", c: "dimmed", children: item.label })
|
|
1412
1469
|
]
|
|
1413
1470
|
},
|
|
1414
1471
|
item.id
|
|
1415
1472
|
)) }) : null
|
|
1416
1473
|
] });
|
|
1417
|
-
const mediaSlot = error ? /* @__PURE__ */
|
|
1418
|
-
const textCol = /* @__PURE__ */
|
|
1419
|
-
const mediaCol = /* @__PURE__ */
|
|
1420
|
-
return /* @__PURE__ */
|
|
1474
|
+
const mediaSlot = error ? /* @__PURE__ */ jsx24(AccentPanel, { tone: "red", variant: "soft-outline", title: "Media unavailable", children: error }) : /* @__PURE__ */ jsx24(MediaFrame, { media, mediaAlt, mediaFade, className: classNames?.media });
|
|
1475
|
+
const textCol = /* @__PURE__ */ jsx24(Grid2.Col, { span: { base: 12, md: 6 }, order: { base: 1, md: mediaPosition === "left" ? 2 : 1 }, children: textSlot });
|
|
1476
|
+
const mediaCol = /* @__PURE__ */ jsx24(Grid2.Col, { span: { base: 12, md: 6 }, order: { base: 2, md: mediaPosition === "left" ? 1 : 2 }, children: mediaSlot });
|
|
1477
|
+
return /* @__PURE__ */ jsx24(
|
|
1421
1478
|
Paper5,
|
|
1422
1479
|
{
|
|
1423
1480
|
component: "section",
|
|
@@ -1436,18 +1493,18 @@ function EditorialHero({
|
|
|
1436
1493
|
|
|
1437
1494
|
// src/FeatureBand.tsx
|
|
1438
1495
|
import { Box as Box9, Group as Group19, Paper as Paper6, SimpleGrid as SimpleGrid3, Skeleton as Skeleton3, Stack as Stack20, Text as Text18, ThemeIcon as ThemeIcon6, Title as Title16 } from "@mantine/core";
|
|
1439
|
-
import { Fragment as Fragment3, jsx as
|
|
1496
|
+
import { Fragment as Fragment3, jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1440
1497
|
function FeatureBandSkeleton({
|
|
1441
1498
|
columns = 3,
|
|
1442
1499
|
bordered = true,
|
|
1443
1500
|
variant = "default"
|
|
1444
1501
|
}) {
|
|
1445
|
-
return /* @__PURE__ */
|
|
1446
|
-
/* @__PURE__ */
|
|
1502
|
+
return /* @__PURE__ */ jsx25(SimpleGrid3, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: Array.from({ length: columns }).map((_, index) => /* @__PURE__ */ jsx25(Paper6, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ jsxs20(Stack20, { gap: "md", children: [
|
|
1503
|
+
/* @__PURE__ */ jsx25(Skeleton3, { height: variant === "process" ? 28 : 42, width: variant === "process" ? 72 : 42, radius: "xl" }),
|
|
1447
1504
|
/* @__PURE__ */ jsxs20(Stack20, { gap: "xs", children: [
|
|
1448
|
-
/* @__PURE__ */
|
|
1449
|
-
/* @__PURE__ */
|
|
1450
|
-
/* @__PURE__ */
|
|
1505
|
+
/* @__PURE__ */ jsx25(Skeleton3, { height: 20, width: "75%", radius: "md" }),
|
|
1506
|
+
/* @__PURE__ */ jsx25(Skeleton3, { height: 14, width: "100%", radius: "md" }),
|
|
1507
|
+
/* @__PURE__ */ jsx25(Skeleton3, { height: 14, width: "82%", radius: "md" })
|
|
1451
1508
|
] })
|
|
1452
1509
|
] }) }, index)) });
|
|
1453
1510
|
}
|
|
@@ -1460,10 +1517,10 @@ function FeatureBand({
|
|
|
1460
1517
|
variant = "default"
|
|
1461
1518
|
}) {
|
|
1462
1519
|
if (loading) {
|
|
1463
|
-
return /* @__PURE__ */
|
|
1520
|
+
return /* @__PURE__ */ jsx25(FeatureBandSkeleton, { columns, bordered, variant });
|
|
1464
1521
|
}
|
|
1465
1522
|
if (!items.length) {
|
|
1466
|
-
return emptyState ? /* @__PURE__ */
|
|
1523
|
+
return emptyState ? /* @__PURE__ */ jsx25(Fragment3, { children: emptyState }) : /* @__PURE__ */ jsx25(
|
|
1467
1524
|
EmptyState,
|
|
1468
1525
|
{
|
|
1469
1526
|
title: "No supporting details available",
|
|
@@ -1471,8 +1528,8 @@ function FeatureBand({
|
|
|
1471
1528
|
}
|
|
1472
1529
|
);
|
|
1473
1530
|
}
|
|
1474
|
-
return /* @__PURE__ */
|
|
1475
|
-
variant === "process" ? /* @__PURE__ */
|
|
1531
|
+
return /* @__PURE__ */ jsx25(Box9, { component: "section", "aria-label": "Supporting features", children: /* @__PURE__ */ jsx25(SimpleGrid3, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: items.map((item, index) => /* @__PURE__ */ jsx25(Paper6, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ jsxs20(Stack20, { gap: "md", children: [
|
|
1532
|
+
variant === "process" ? /* @__PURE__ */ jsx25(Group19, { children: /* @__PURE__ */ jsx25(
|
|
1476
1533
|
Text18,
|
|
1477
1534
|
{
|
|
1478
1535
|
fw: 800,
|
|
@@ -1485,30 +1542,30 @@ function FeatureBand({
|
|
|
1485
1542
|
},
|
|
1486
1543
|
children: item.stepLabel ?? `Step ${index + 1}`
|
|
1487
1544
|
}
|
|
1488
|
-
) }) : item.media ? item.media : item.icon ? /* @__PURE__ */
|
|
1545
|
+
) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ jsx25(Group19, { children: /* @__PURE__ */ jsx25(ThemeIcon6, { size: "xl", radius: "xl", variant: "light", color: "violet", children: item.icon }) }) : /* @__PURE__ */ jsx25(Group19, { children: /* @__PURE__ */ jsx25(ThemeIcon6, { size: "xl", radius: "xl", variant: "light", color: "gray", "aria-hidden": true, children: /* @__PURE__ */ jsx25(GdsIcons.Info, { size: "1.25rem" }) }) }),
|
|
1489
1546
|
/* @__PURE__ */ jsxs20(Stack20, { gap: "xs", children: [
|
|
1490
|
-
/* @__PURE__ */
|
|
1491
|
-
item.description ? /* @__PURE__ */
|
|
1492
|
-
item.meta ? /* @__PURE__ */
|
|
1547
|
+
/* @__PURE__ */ jsx25(Title16, { order: 4, children: item.title }),
|
|
1548
|
+
item.description ? /* @__PURE__ */ jsx25(Text18, { c: "dimmed", children: item.description }) : null,
|
|
1549
|
+
item.meta ? /* @__PURE__ */ jsx25(Text18, { size: "sm", c: "dimmed", children: item.meta }) : null
|
|
1493
1550
|
] })
|
|
1494
1551
|
] }) }, item.id)) }) });
|
|
1495
1552
|
}
|
|
1496
1553
|
|
|
1497
1554
|
// src/FormField.tsx
|
|
1498
1555
|
import { Box as Box10, Stack as Stack21, Text as Text19 } from "@mantine/core";
|
|
1499
|
-
import { jsx as
|
|
1556
|
+
import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
1500
1557
|
function FormField({ label, description, error, children }) {
|
|
1501
|
-
return /* @__PURE__ */
|
|
1502
|
-
typeof label === "string" ? /* @__PURE__ */
|
|
1503
|
-
description ? typeof description === "string" ? /* @__PURE__ */
|
|
1558
|
+
return /* @__PURE__ */ jsx26(Box10, { component: "label", children: /* @__PURE__ */ jsxs21(Stack21, { gap: 4, children: [
|
|
1559
|
+
typeof label === "string" ? /* @__PURE__ */ jsx26(Text19, { size: "xs", fw: 600, c: "dimmed", children: label }) : label,
|
|
1560
|
+
description ? typeof description === "string" ? /* @__PURE__ */ jsx26(Text19, { size: "xs", c: "dimmed", children: description }) : description : null,
|
|
1504
1561
|
children,
|
|
1505
|
-
error ? typeof error === "string" ? /* @__PURE__ */
|
|
1562
|
+
error ? typeof error === "string" ? /* @__PURE__ */ jsx26(Text19, { size: "xs", c: "red.7", children: error }) : error : null
|
|
1506
1563
|
] }) });
|
|
1507
1564
|
}
|
|
1508
1565
|
|
|
1509
1566
|
// src/MediaField.tsx
|
|
1510
|
-
import { Badge as
|
|
1511
|
-
import { Fragment as Fragment4, jsx as
|
|
1567
|
+
import { Badge as Badge10, Button as Button2, Divider as Divider3, Group as Group20, Paper as Paper7, Stack as Stack22, Text as Text20 } from "@mantine/core";
|
|
1568
|
+
import { Fragment as Fragment4, jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
1512
1569
|
var stateLabels = {
|
|
1513
1570
|
empty: { label: "Empty", color: "gray" },
|
|
1514
1571
|
selected: { label: "Selected", color: "blue" },
|
|
@@ -1536,30 +1593,30 @@ function MediaField({
|
|
|
1536
1593
|
mode = "stacked"
|
|
1537
1594
|
}) {
|
|
1538
1595
|
const stateBadge = stateLabels[state];
|
|
1539
|
-
const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */
|
|
1540
|
-
const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */
|
|
1541
|
-
return /* @__PURE__ */
|
|
1596
|
+
const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */ jsx27(Button2, { type: "button", variant: "light", color: "red", onClick: onRemove, children: "Remove" }) : null);
|
|
1597
|
+
const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */ jsx27(Button2, { type: "button", variant: "default", onClick: onReset, children: "Reset" }) : null);
|
|
1598
|
+
return /* @__PURE__ */ jsx27(
|
|
1542
1599
|
FormField,
|
|
1543
1600
|
{
|
|
1544
1601
|
label,
|
|
1545
1602
|
description,
|
|
1546
1603
|
error,
|
|
1547
|
-
children: /* @__PURE__ */
|
|
1548
|
-
/* @__PURE__ */
|
|
1549
|
-
/* @__PURE__ */
|
|
1604
|
+
children: /* @__PURE__ */ jsx27(Paper7, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ jsxs22(Stack22, { gap: "md", children: [
|
|
1605
|
+
/* @__PURE__ */ jsx27(Group20, { justify: "flex-end", align: "center", gap: "sm", children: /* @__PURE__ */ jsxs22(Group20, { gap: "xs", justify: "flex-end", children: [
|
|
1606
|
+
/* @__PURE__ */ jsx27(Badge10, { variant: "light", color: stateBadge.color, children: stateBadge.label }),
|
|
1550
1607
|
statusAction
|
|
1551
1608
|
] }) }),
|
|
1552
1609
|
preview ? preview : null,
|
|
1553
1610
|
uploadControl || urlInput ? /* @__PURE__ */ jsxs22(Fragment4, { children: [
|
|
1554
|
-
/* @__PURE__ */
|
|
1611
|
+
/* @__PURE__ */ jsx27(Divider3, {}),
|
|
1555
1612
|
/* @__PURE__ */ jsxs22(Stack22, { gap: "sm", style: mode === "split" ? { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" } : void 0, children: [
|
|
1556
1613
|
uploadControl,
|
|
1557
1614
|
urlInput
|
|
1558
1615
|
] })
|
|
1559
1616
|
] }) : null,
|
|
1560
|
-
value ? /* @__PURE__ */
|
|
1561
|
-
helpText ? /* @__PURE__ */
|
|
1562
|
-
policyText ? /* @__PURE__ */
|
|
1617
|
+
value ? /* @__PURE__ */ jsx27(Text20, { size: "sm", c: "dimmed", style: { wordBreak: "break-all" }, children: value }) : null,
|
|
1618
|
+
helpText ? /* @__PURE__ */ jsx27(Text20, { size: "sm", c: "dimmed", children: helpText }) : null,
|
|
1619
|
+
policyText ? /* @__PURE__ */ jsx27(Text20, { size: "sm", c: error ? "red.7" : "dimmed", children: policyText }) : null,
|
|
1563
1620
|
typeof error !== "string" && error ? error : null,
|
|
1564
1621
|
resolvedRemoveAction || resolvedResetAction ? /* @__PURE__ */ jsxs22(Group20, { gap: "sm", children: [
|
|
1565
1622
|
resolvedResetAction,
|
|
@@ -1572,70 +1629,72 @@ function MediaField({
|
|
|
1572
1629
|
}
|
|
1573
1630
|
|
|
1574
1631
|
// src/MediaCard.tsx
|
|
1575
|
-
import { ActionIcon as ActionIcon2, Badge as
|
|
1576
|
-
import { jsx as
|
|
1632
|
+
import { ActionIcon as ActionIcon2, Badge as Badge11, Card as Card7, Group as Group21, Stack as Stack23, Text as Text21, Title as Title17 } from "@mantine/core";
|
|
1633
|
+
import { jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
1577
1634
|
function MediaCard({ title, image, description, status, overlay, actions = [] }) {
|
|
1578
1635
|
const EyeIcon = GdsIcons.Eye;
|
|
1579
1636
|
return /* @__PURE__ */ jsxs23(Card7, { withBorder: true, radius: "lg", padding: "md", children: [
|
|
1580
1637
|
/* @__PURE__ */ jsxs23(Card7.Section, { pos: "relative", children: [
|
|
1581
1638
|
image,
|
|
1582
|
-
overlay ? /* @__PURE__ */
|
|
1639
|
+
overlay ? /* @__PURE__ */ jsx28("div", { style: { position: "absolute", inset: 12, display: "flex", justifyContent: "flex-end", alignItems: "flex-start" }, children: overlay }) : null
|
|
1583
1640
|
] }),
|
|
1584
1641
|
/* @__PURE__ */ jsxs23(Stack23, { gap: "sm", mt: "md", children: [
|
|
1585
1642
|
/* @__PURE__ */ jsxs23(Group21, { justify: "space-between", align: "flex-start", children: [
|
|
1586
1643
|
/* @__PURE__ */ jsxs23(Stack23, { gap: 4, children: [
|
|
1587
|
-
/* @__PURE__ */
|
|
1588
|
-
description ? /* @__PURE__ */
|
|
1644
|
+
/* @__PURE__ */ jsx28(Title17, { order: 4, children: title }),
|
|
1645
|
+
description ? /* @__PURE__ */ jsx28(Text21, { size: "sm", c: "dimmed", lineClamp: 2, children: description }) : null
|
|
1589
1646
|
] }),
|
|
1590
|
-
status ? /* @__PURE__ */
|
|
1647
|
+
status ? /* @__PURE__ */ jsx28(Badge11, { variant: "light", children: status }) : null
|
|
1591
1648
|
] }),
|
|
1592
|
-
actions.length ? /* @__PURE__ */
|
|
1649
|
+
actions.length ? /* @__PURE__ */ jsx28(Group21, { justify: "flex-end", gap: "xs", children: actions.map((action) => /* @__PURE__ */ jsx28(ActionIcon2, { variant: "light", "aria-label": action.label, onClick: action.onClick, children: /* @__PURE__ */ jsx28(EyeIcon, { size: "1rem" }) }, action.label)) }) : null
|
|
1593
1650
|
] })
|
|
1594
1651
|
] });
|
|
1595
1652
|
}
|
|
1596
1653
|
|
|
1597
1654
|
// src/AccessSummary.tsx
|
|
1598
|
-
import { Badge as
|
|
1599
|
-
import { jsx as
|
|
1655
|
+
import { Badge as Badge12, Card as Card8, Group as Group22, Stack as Stack24, Text as Text22, Title as Title18 } from "@mantine/core";
|
|
1656
|
+
import { jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
1600
1657
|
function AccessSummary({ title, roles, scope, blocked = false, description }) {
|
|
1601
|
-
return /* @__PURE__ */
|
|
1658
|
+
return /* @__PURE__ */ jsx29(Card8, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ jsxs24(Stack24, { gap: "sm", children: [
|
|
1602
1659
|
/* @__PURE__ */ jsxs24(Group22, { justify: "space-between", align: "center", children: [
|
|
1603
|
-
/* @__PURE__ */
|
|
1604
|
-
/* @__PURE__ */
|
|
1660
|
+
/* @__PURE__ */ jsx29(Title18, { order: 4, children: title }),
|
|
1661
|
+
/* @__PURE__ */ jsx29(Badge12, { color: blocked ? "red" : "teal", variant: "light", children: blocked ? "Blocked" : "Allowed" })
|
|
1605
1662
|
] }),
|
|
1606
|
-
/* @__PURE__ */
|
|
1663
|
+
/* @__PURE__ */ jsx29(Group22, { gap: "xs", children: roles.map((role) => /* @__PURE__ */ jsx29(Badge12, { variant: "outline", children: role }, role)) }),
|
|
1607
1664
|
scope ? /* @__PURE__ */ jsxs24(Text22, { size: "sm", c: "dimmed", children: [
|
|
1608
1665
|
"Scope: ",
|
|
1609
1666
|
scope
|
|
1610
1667
|
] }) : null,
|
|
1611
|
-
description ? /* @__PURE__ */
|
|
1668
|
+
description ? /* @__PURE__ */ jsx29(Text22, { size: "sm", children: description }) : null
|
|
1612
1669
|
] }) });
|
|
1613
1670
|
}
|
|
1614
1671
|
|
|
1615
1672
|
// src/PageHeader.tsx
|
|
1616
1673
|
import { Box as Box11, Group as Group23, Stack as Stack25, Text as Text23, Title as Title19 } from "@mantine/core";
|
|
1617
|
-
import { jsx as
|
|
1674
|
+
import { jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
1618
1675
|
function PageHeader({
|
|
1619
1676
|
title,
|
|
1620
1677
|
description,
|
|
1678
|
+
subtitle,
|
|
1621
1679
|
eyebrow,
|
|
1622
1680
|
actions,
|
|
1623
1681
|
eyebrowVariant = "neutral"
|
|
1624
1682
|
}) {
|
|
1683
|
+
const resolvedDescription = description ?? subtitle;
|
|
1625
1684
|
const eyebrowProps = eyebrowVariant === "ornamental" ? { tt: "uppercase", style: { letterSpacing: "0.12em" } } : {};
|
|
1626
1685
|
return /* @__PURE__ */ jsxs25(Group23, { justify: "space-between", align: "flex-start", gap: "lg", wrap: "wrap", children: [
|
|
1627
1686
|
/* @__PURE__ */ jsxs25(Stack25, { gap: "xs", children: [
|
|
1628
|
-
eyebrow && /* @__PURE__ */
|
|
1629
|
-
/* @__PURE__ */
|
|
1630
|
-
|
|
1687
|
+
eyebrow && /* @__PURE__ */ jsx30(Text23, { size: "xs", fw: 700, c: "dimmed", ...eyebrowProps, children: eyebrow }),
|
|
1688
|
+
/* @__PURE__ */ jsx30(Title19, { order: 1, children: title }),
|
|
1689
|
+
resolvedDescription && /* @__PURE__ */ jsx30(Text23, { c: "dimmed", maw: 720, children: resolvedDescription })
|
|
1631
1690
|
] }),
|
|
1632
|
-
actions ? /* @__PURE__ */
|
|
1691
|
+
actions ? /* @__PURE__ */ jsx30(Box11, { children: actions }) : null
|
|
1633
1692
|
] });
|
|
1634
1693
|
}
|
|
1635
1694
|
|
|
1636
1695
|
// src/FilterDrawer.tsx
|
|
1637
1696
|
import { Drawer, Group as Group24, Stack as Stack26, Text as Text24 } from "@mantine/core";
|
|
1638
|
-
import { jsx as
|
|
1697
|
+
import { jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
1639
1698
|
function FilterDrawer({
|
|
1640
1699
|
opened,
|
|
1641
1700
|
onClose,
|
|
@@ -1651,7 +1710,7 @@ function FilterDrawer({
|
|
|
1651
1710
|
}) {
|
|
1652
1711
|
const resolvedPrimaryAction = applyAction ?? primaryAction;
|
|
1653
1712
|
const resolvedSecondaryAction = resetAction ?? secondaryAction;
|
|
1654
|
-
return /* @__PURE__ */
|
|
1713
|
+
return /* @__PURE__ */ jsx31(
|
|
1655
1714
|
Drawer,
|
|
1656
1715
|
{
|
|
1657
1716
|
opened,
|
|
@@ -1661,7 +1720,7 @@ function FilterDrawer({
|
|
|
1661
1720
|
size: mode === "bottom-sheet" ? "auto" : "md",
|
|
1662
1721
|
radius: mode === "bottom-sheet" ? "xl" : void 0,
|
|
1663
1722
|
children: /* @__PURE__ */ jsxs26(Stack26, { gap: "md", children: [
|
|
1664
|
-
description ? /* @__PURE__ */
|
|
1723
|
+
description ? /* @__PURE__ */ jsx31(Text24, { size: "sm", c: "dimmed", children: description }) : null,
|
|
1665
1724
|
children,
|
|
1666
1725
|
resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ jsxs26(Group24, { justify: "space-between", mt: "md", children: [
|
|
1667
1726
|
/* @__PURE__ */ jsxs26(Group24, { gap: "sm", children: [
|
|
@@ -1676,8 +1735,8 @@ function FilterDrawer({
|
|
|
1676
1735
|
}
|
|
1677
1736
|
|
|
1678
1737
|
// src/PlaceholderPanel.tsx
|
|
1679
|
-
import { Badge as
|
|
1680
|
-
import { Fragment as Fragment5, jsx as
|
|
1738
|
+
import { Badge as Badge13, Card as Card9, Stack as Stack27, Text as Text25, Title as Title20 } from "@mantine/core";
|
|
1739
|
+
import { Fragment as Fragment5, jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
1681
1740
|
function PlaceholderPanel({
|
|
1682
1741
|
title,
|
|
1683
1742
|
description,
|
|
@@ -1687,16 +1746,16 @@ function PlaceholderPanel({
|
|
|
1687
1746
|
mode
|
|
1688
1747
|
}) {
|
|
1689
1748
|
if (mode === "live" && children) {
|
|
1690
|
-
return /* @__PURE__ */
|
|
1749
|
+
return /* @__PURE__ */ jsx32(Fragment5, { children });
|
|
1691
1750
|
}
|
|
1692
|
-
return /* @__PURE__ */
|
|
1693
|
-
badge ? /* @__PURE__ */
|
|
1751
|
+
return /* @__PURE__ */ jsx32(Card9, { children: /* @__PURE__ */ jsxs27(Stack27, { gap: "md", children: [
|
|
1752
|
+
badge ? /* @__PURE__ */ jsx32(Badge13, { variant: "light", color: "blue", w: "fit-content", children: badge }) : null,
|
|
1694
1753
|
/* @__PURE__ */ jsxs27(Stack27, { gap: "xs", children: [
|
|
1695
|
-
/* @__PURE__ */
|
|
1696
|
-
/* @__PURE__ */
|
|
1754
|
+
/* @__PURE__ */ jsx32(Title20, { order: 4, children: title }),
|
|
1755
|
+
/* @__PURE__ */ jsx32(Text25, { c: "dimmed", children: description })
|
|
1697
1756
|
] }),
|
|
1698
|
-
footer ? /* @__PURE__ */
|
|
1699
|
-
/* @__PURE__ */
|
|
1757
|
+
footer ? /* @__PURE__ */ jsx32(Text25, { size: "sm", children: footer }) : null,
|
|
1758
|
+
/* @__PURE__ */ jsx32(
|
|
1700
1759
|
StateBlock,
|
|
1701
1760
|
{
|
|
1702
1761
|
variant: "not-enough-data",
|
|
@@ -1710,7 +1769,7 @@ function PlaceholderPanel({
|
|
|
1710
1769
|
|
|
1711
1770
|
// src/SimpleDataTable.tsx
|
|
1712
1771
|
import { ScrollArea, Table } from "@mantine/core";
|
|
1713
|
-
import { jsx as
|
|
1772
|
+
import { jsx as jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
1714
1773
|
function SimpleDataTable({
|
|
1715
1774
|
columns,
|
|
1716
1775
|
rows,
|
|
@@ -1721,23 +1780,23 @@ function SimpleDataTable({
|
|
|
1721
1780
|
getRowKey
|
|
1722
1781
|
}) {
|
|
1723
1782
|
if (error) {
|
|
1724
|
-
return /* @__PURE__ */
|
|
1783
|
+
return /* @__PURE__ */ jsx33(StateBlock, { variant: "error", title: "Unable to load data", description: error, compact: true });
|
|
1725
1784
|
}
|
|
1726
1785
|
if (loading) {
|
|
1727
|
-
return /* @__PURE__ */
|
|
1786
|
+
return /* @__PURE__ */ jsx33(StateBlock, { variant: "loading", title: "Loading data", description: "Please wait while the shared dataset is prepared.", compact: true });
|
|
1728
1787
|
}
|
|
1729
1788
|
if (!rows.length) {
|
|
1730
|
-
return /* @__PURE__ */
|
|
1789
|
+
return /* @__PURE__ */ jsx33(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, compact: true });
|
|
1731
1790
|
}
|
|
1732
|
-
return /* @__PURE__ */
|
|
1733
|
-
/* @__PURE__ */
|
|
1734
|
-
/* @__PURE__ */
|
|
1791
|
+
return /* @__PURE__ */ jsx33(ScrollArea, { children: /* @__PURE__ */ jsxs28(Table, { striped: true, highlightOnHover: true, withTableBorder: true, withColumnBorders: true, children: [
|
|
1792
|
+
/* @__PURE__ */ jsx33(Table.Thead, { children: /* @__PURE__ */ jsx33(Table.Tr, { children: columns.map((column) => /* @__PURE__ */ jsx33(Table.Th, { children: column.header }, String(column.key))) }) }),
|
|
1793
|
+
/* @__PURE__ */ jsx33(Table.Tbody, { children: rows.map((row, index) => /* @__PURE__ */ jsx33(Table.Tr, { children: columns.map((column) => /* @__PURE__ */ jsx33(Table.Td, { children: column.render ? column.render(row) : String(row[column.key] ?? "") }, String(column.key))) }, getRowKey ? getRowKey(row, index) : index)) })
|
|
1735
1794
|
] }) });
|
|
1736
1795
|
}
|
|
1737
1796
|
|
|
1738
1797
|
// src/StatsSection.tsx
|
|
1739
1798
|
import { Stack as Stack28, Title as Title21 } from "@mantine/core";
|
|
1740
|
-
import { jsx as
|
|
1799
|
+
import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
1741
1800
|
function StatsSection({
|
|
1742
1801
|
title,
|
|
1743
1802
|
loading = false,
|
|
@@ -1749,11 +1808,11 @@ function StatsSection({
|
|
|
1749
1808
|
}) {
|
|
1750
1809
|
let content = children;
|
|
1751
1810
|
if (error) {
|
|
1752
|
-
content = /* @__PURE__ */
|
|
1811
|
+
content = /* @__PURE__ */ jsx34(StateBlock, { variant: "error", title: "Unable to load statistics", description: error, compact: true });
|
|
1753
1812
|
} else if (loading) {
|
|
1754
|
-
content = /* @__PURE__ */
|
|
1813
|
+
content = /* @__PURE__ */ jsx34(StateBlock, { variant: "loading", title: "Loading statistics", description: "This shared data surface is still synchronizing.", compact: true });
|
|
1755
1814
|
} else if (belowThreshold) {
|
|
1756
|
-
content = /* @__PURE__ */
|
|
1815
|
+
content = /* @__PURE__ */ jsx34(
|
|
1757
1816
|
StateBlock,
|
|
1758
1817
|
{
|
|
1759
1818
|
variant: "not-enough-data",
|
|
@@ -1763,10 +1822,10 @@ function StatsSection({
|
|
|
1763
1822
|
}
|
|
1764
1823
|
);
|
|
1765
1824
|
} else if (placeholder) {
|
|
1766
|
-
content = /* @__PURE__ */
|
|
1825
|
+
content = /* @__PURE__ */ jsx34(PlaceholderPanel, { ...placeholder, mode: "placeholder" });
|
|
1767
1826
|
}
|
|
1768
1827
|
return /* @__PURE__ */ jsxs29(Stack28, { gap: "md", children: [
|
|
1769
|
-
/* @__PURE__ */
|
|
1828
|
+
/* @__PURE__ */ jsx34(Title21, { order: 3, children: title }),
|
|
1770
1829
|
content
|
|
1771
1830
|
] });
|
|
1772
1831
|
}
|
|
@@ -3079,6 +3138,9 @@ export {
|
|
|
3079
3138
|
EmptyState,
|
|
3080
3139
|
GdsIcons,
|
|
3081
3140
|
GdsVocabulary,
|
|
3141
|
+
getSemanticActionConfig,
|
|
3142
|
+
getSemanticActionLabel,
|
|
3143
|
+
ChoiceChip,
|
|
3082
3144
|
MetricCard,
|
|
3083
3145
|
ProgressCard,
|
|
3084
3146
|
SectionPanel,
|