@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/server.js
CHANGED
|
@@ -25,6 +25,7 @@ __export(server_exports, {
|
|
|
25
25
|
ArticleShell: () => ArticleShell,
|
|
26
26
|
AuthShell: () => AuthShell,
|
|
27
27
|
BrowseSurface: () => BrowseSurface,
|
|
28
|
+
ChoiceChip: () => ChoiceChip,
|
|
28
29
|
ConsumerDashboardGrid: () => ConsumerDashboardGrid,
|
|
29
30
|
ConsumerSection: () => ConsumerSection,
|
|
30
31
|
CtaButtonGroup: () => CtaButtonGroup,
|
|
@@ -62,6 +63,8 @@ __export(server_exports, {
|
|
|
62
63
|
fr: () => fr,
|
|
63
64
|
gdsLocales: () => gdsLocales,
|
|
64
65
|
getGdsMessages: () => getGdsMessages,
|
|
66
|
+
getSemanticActionConfig: () => getSemanticActionConfig,
|
|
67
|
+
getSemanticActionLabel: () => getSemanticActionLabel,
|
|
65
68
|
he: () => he,
|
|
66
69
|
hu: () => hu,
|
|
67
70
|
it: () => it,
|
|
@@ -273,10 +276,64 @@ var GdsVocabulary = {
|
|
|
273
276
|
refer: { id: "gds.action.refer", defaultMessage: "Refer", icon: GdsIcons.Refer, feedback: { icon: GdsIcons.Refer, color: "teal", messageId: "gds.feedback.referred" } },
|
|
274
277
|
evidence: { id: "gds.action.evidence", defaultMessage: "Evidence", icon: GdsIcons.Evidence, feedback: { icon: GdsIcons.Evidence, color: "teal", messageId: "gds.feedback.added" } }
|
|
275
278
|
};
|
|
279
|
+
function getSemanticActionConfig(action) {
|
|
280
|
+
return GdsVocabulary[action];
|
|
281
|
+
}
|
|
282
|
+
function getSemanticActionLabel(action, translate) {
|
|
283
|
+
const config = getSemanticActionConfig(action);
|
|
284
|
+
return translate ? translate(config.id, config.defaultMessage) : config.defaultMessage;
|
|
285
|
+
}
|
|
276
286
|
|
|
277
|
-
// src/
|
|
287
|
+
// src/ChoiceChip.tsx
|
|
278
288
|
var import_core = require("@mantine/core");
|
|
279
289
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
290
|
+
function ChoiceChip({
|
|
291
|
+
label,
|
|
292
|
+
active = false,
|
|
293
|
+
href,
|
|
294
|
+
onClick,
|
|
295
|
+
component,
|
|
296
|
+
...props
|
|
297
|
+
}) {
|
|
298
|
+
const sharedProps = {
|
|
299
|
+
variant: active ? "filled" : "light",
|
|
300
|
+
size: "sm",
|
|
301
|
+
radius: "xl",
|
|
302
|
+
...props
|
|
303
|
+
};
|
|
304
|
+
if (href) {
|
|
305
|
+
const LinkComponent = component || "a";
|
|
306
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
307
|
+
import_core.Badge,
|
|
308
|
+
{
|
|
309
|
+
component: LinkComponent,
|
|
310
|
+
href,
|
|
311
|
+
"aria-current": active ? "page" : void 0,
|
|
312
|
+
...sharedProps,
|
|
313
|
+
children: label
|
|
314
|
+
}
|
|
315
|
+
);
|
|
316
|
+
}
|
|
317
|
+
if (onClick || component) {
|
|
318
|
+
const ButtonComponent = component || "button";
|
|
319
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
320
|
+
import_core.Badge,
|
|
321
|
+
{
|
|
322
|
+
component: ButtonComponent,
|
|
323
|
+
type: component ? void 0 : "button",
|
|
324
|
+
onClick,
|
|
325
|
+
"aria-pressed": onClick ? active : void 0,
|
|
326
|
+
...sharedProps,
|
|
327
|
+
children: label
|
|
328
|
+
}
|
|
329
|
+
);
|
|
330
|
+
}
|
|
331
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Badge, { ...sharedProps, children: label });
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
// src/StatusBadge.tsx
|
|
335
|
+
var import_core2 = require("@mantine/core");
|
|
336
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
280
337
|
var statusColorMap = {
|
|
281
338
|
success: "green",
|
|
282
339
|
warning: "yellow",
|
|
@@ -285,49 +342,49 @@ var statusColorMap = {
|
|
|
285
342
|
neutral: "gray"
|
|
286
343
|
};
|
|
287
344
|
function StatusBadge({ status, children, ...props }) {
|
|
288
|
-
return /* @__PURE__ */ (0,
|
|
345
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Badge, { color: statusColorMap[status], variant: "light", ...props, children });
|
|
289
346
|
}
|
|
290
347
|
|
|
291
348
|
// src/EmptyState.tsx
|
|
292
|
-
var
|
|
293
|
-
var
|
|
349
|
+
var import_core3 = require("@mantine/core");
|
|
350
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
294
351
|
function EmptyState({ icon, title, description, action }) {
|
|
295
|
-
return /* @__PURE__ */ (0,
|
|
296
|
-
icon && /* @__PURE__ */ (0,
|
|
297
|
-
/* @__PURE__ */ (0,
|
|
298
|
-
/* @__PURE__ */ (0,
|
|
299
|
-
action && /* @__PURE__ */ (0,
|
|
352
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Stack, { align: "center", justify: "center", gap: "md", py: "xl", ta: "center", children: [
|
|
353
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Box, { c: "dimmed", children: icon }),
|
|
354
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Title, { order: 3, children: title }),
|
|
355
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Text, { c: "dimmed", maw: 400, children: description }),
|
|
356
|
+
action && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Box, { mt: "md", children: action })
|
|
300
357
|
] });
|
|
301
358
|
}
|
|
302
359
|
|
|
303
360
|
// src/MetricCard.tsx
|
|
304
|
-
var
|
|
305
|
-
var
|
|
361
|
+
var import_core4 = require("@mantine/core");
|
|
362
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
306
363
|
var trendColors = {
|
|
307
364
|
positive: "teal",
|
|
308
365
|
negative: "red",
|
|
309
366
|
neutral: "gray"
|
|
310
367
|
};
|
|
311
368
|
function MetricCard({ label, value, description, trend, icon, footer }) {
|
|
312
|
-
return /* @__PURE__ */ (0,
|
|
313
|
-
/* @__PURE__ */ (0,
|
|
314
|
-
/* @__PURE__ */ (0,
|
|
315
|
-
/* @__PURE__ */ (0,
|
|
316
|
-
/* @__PURE__ */ (0,
|
|
369
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Stack, { gap: "md", children: [
|
|
370
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
371
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Stack, { gap: 4, children: [
|
|
372
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { size: "sm", c: "dimmed", fw: 600, children: label }),
|
|
373
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Title, { order: 3, children: value })
|
|
317
374
|
] }),
|
|
318
|
-
icon ? /* @__PURE__ */ (0,
|
|
375
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.ThemeIcon, { variant: "light", size: "xl", radius: "xl", "aria-hidden": true, children: icon }) : null
|
|
319
376
|
] }),
|
|
320
|
-
description || trend ? /* @__PURE__ */ (0,
|
|
321
|
-
description ? /* @__PURE__ */ (0,
|
|
322
|
-
trend ? /* @__PURE__ */ (0,
|
|
377
|
+
description || trend ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Group, { justify: "space-between", align: "center", gap: "sm", children: [
|
|
378
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { size: "sm", c: "dimmed", flex: 1, children: description }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", {}),
|
|
379
|
+
trend ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Badge, { color: trendColors[trend.tone ?? "neutral"], variant: "light", children: trend.label }) : null
|
|
323
380
|
] }) : null,
|
|
324
381
|
footer
|
|
325
382
|
] }) });
|
|
326
383
|
}
|
|
327
384
|
|
|
328
385
|
// src/ProgressCard.tsx
|
|
329
|
-
var
|
|
330
|
-
var
|
|
386
|
+
var import_core5 = require("@mantine/core");
|
|
387
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
331
388
|
function ProgressCard({
|
|
332
389
|
label,
|
|
333
390
|
value,
|
|
@@ -336,31 +393,31 @@ function ProgressCard({
|
|
|
336
393
|
description,
|
|
337
394
|
action
|
|
338
395
|
}) {
|
|
339
|
-
return /* @__PURE__ */ (0,
|
|
340
|
-
/* @__PURE__ */ (0,
|
|
341
|
-
/* @__PURE__ */ (0,
|
|
342
|
-
/* @__PURE__ */ (0,
|
|
343
|
-
/* @__PURE__ */ (0,
|
|
396
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Stack, { gap: "md", children: [
|
|
397
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Group, { justify: "space-between", align: "flex-start", children: [
|
|
398
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Stack, { gap: 4, children: [
|
|
399
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Text, { size: "sm", c: "dimmed", fw: 600, children: label }),
|
|
400
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Title, { order: 3, children: value })
|
|
344
401
|
] }),
|
|
345
402
|
action
|
|
346
403
|
] }),
|
|
347
|
-
description ? /* @__PURE__ */ (0,
|
|
348
|
-
/* @__PURE__ */ (0,
|
|
349
|
-
/* @__PURE__ */ (0,
|
|
350
|
-
/* @__PURE__ */ (0,
|
|
351
|
-
/* @__PURE__ */ (0,
|
|
404
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
405
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Stack, { gap: 6, children: [
|
|
406
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Group, { justify: "space-between", gap: "sm", children: [
|
|
407
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Text, { size: "sm", fw: 500, children: progressLabel ?? "Progress" }),
|
|
408
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Text, { size: "sm", c: "dimmed", children: [
|
|
352
409
|
Math.round(progress),
|
|
353
410
|
"%"
|
|
354
411
|
] })
|
|
355
412
|
] }),
|
|
356
|
-
/* @__PURE__ */ (0,
|
|
413
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Progress, { value: progress, radius: "xl", size: "md" })
|
|
357
414
|
] })
|
|
358
415
|
] }) });
|
|
359
416
|
}
|
|
360
417
|
|
|
361
418
|
// src/SectionPanel.tsx
|
|
362
|
-
var
|
|
363
|
-
var
|
|
419
|
+
var import_core6 = require("@mantine/core");
|
|
420
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
364
421
|
var toneBackgrounds = {
|
|
365
422
|
default: "var(--mantine-color-body)",
|
|
366
423
|
supporting: "light-dark(var(--mantine-color-gray-0), color-mix(in srgb, var(--mantine-color-dark-7) 92%, black))",
|
|
@@ -376,23 +433,23 @@ function SectionPanel({
|
|
|
376
433
|
id,
|
|
377
434
|
divided = true
|
|
378
435
|
}) {
|
|
379
|
-
return /* @__PURE__ */ (0,
|
|
380
|
-
title || description || action ? /* @__PURE__ */ (0,
|
|
381
|
-
/* @__PURE__ */ (0,
|
|
382
|
-
title || description ? /* @__PURE__ */ (0,
|
|
383
|
-
title ? /* @__PURE__ */ (0,
|
|
384
|
-
description ? /* @__PURE__ */ (0,
|
|
436
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Paper, { id, withBorder: true, radius: "xl", p: "lg", style: { background: toneBackgrounds[tone] }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core6.Stack, { gap: "md", children: [
|
|
437
|
+
title || description || action ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
|
|
438
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core6.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
|
|
439
|
+
title || description ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core6.Stack, { gap: 4, children: [
|
|
440
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Title, { order: 3, children: title }) : null,
|
|
441
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Text, { size: "sm", c: "dimmed", children: description }) : null
|
|
385
442
|
] }) : null,
|
|
386
443
|
action
|
|
387
444
|
] }),
|
|
388
|
-
divided ? /* @__PURE__ */ (0,
|
|
445
|
+
divided ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Divider, {}) : null
|
|
389
446
|
] }) : null,
|
|
390
447
|
children
|
|
391
448
|
] }) });
|
|
392
449
|
}
|
|
393
450
|
|
|
394
451
|
// src/ConsumerSection.tsx
|
|
395
|
-
var
|
|
452
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
396
453
|
function ConsumerSection({
|
|
397
454
|
title,
|
|
398
455
|
description,
|
|
@@ -400,22 +457,22 @@ function ConsumerSection({
|
|
|
400
457
|
children,
|
|
401
458
|
tone = "default"
|
|
402
459
|
}) {
|
|
403
|
-
return /* @__PURE__ */ (0,
|
|
460
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SectionPanel, { title, description, action, tone, children });
|
|
404
461
|
}
|
|
405
462
|
|
|
406
463
|
// src/ConsumerDashboardGrid.tsx
|
|
407
|
-
var
|
|
408
|
-
var
|
|
464
|
+
var import_core7 = require("@mantine/core");
|
|
465
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
409
466
|
function ConsumerDashboardGrid({
|
|
410
467
|
children,
|
|
411
468
|
columns = 3
|
|
412
469
|
}) {
|
|
413
|
-
return /* @__PURE__ */ (0,
|
|
470
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children });
|
|
414
471
|
}
|
|
415
472
|
|
|
416
473
|
// src/ProductCard.tsx
|
|
417
|
-
var
|
|
418
|
-
var
|
|
474
|
+
var import_core8 = require("@mantine/core");
|
|
475
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
419
476
|
function ProductCard({
|
|
420
477
|
title,
|
|
421
478
|
description,
|
|
@@ -428,38 +485,38 @@ function ProductCard({
|
|
|
428
485
|
footer
|
|
429
486
|
}) {
|
|
430
487
|
const MoreIcon = GdsIcons.Menu;
|
|
431
|
-
return /* @__PURE__ */ (0,
|
|
488
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Stack, { gap: "md", children: [
|
|
432
489
|
media,
|
|
433
|
-
/* @__PURE__ */ (0,
|
|
434
|
-
/* @__PURE__ */ (0,
|
|
435
|
-
icon ? /* @__PURE__ */ (0,
|
|
436
|
-
/* @__PURE__ */ (0,
|
|
437
|
-
/* @__PURE__ */ (0,
|
|
438
|
-
description ? /* @__PURE__ */ (0,
|
|
490
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
491
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Group, { align: "flex-start", gap: "sm", wrap: "nowrap", children: [
|
|
492
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.ThemeIcon, { variant: "light", size: "xl", radius: "xl", "aria-hidden": true, children: icon }) : null,
|
|
493
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Stack, { gap: 4, children: [
|
|
494
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Title, { order: 4, children: title }),
|
|
495
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Text, { size: "sm", c: "dimmed", lineClamp: 3, children: description }) : null
|
|
439
496
|
] })
|
|
440
497
|
] }),
|
|
441
|
-
/* @__PURE__ */ (0,
|
|
442
|
-
typeof status === "string" ? /* @__PURE__ */ (0,
|
|
443
|
-
secondaryActions.length ? /* @__PURE__ */ (0,
|
|
444
|
-
/* @__PURE__ */ (0,
|
|
445
|
-
/* @__PURE__ */ (0,
|
|
446
|
-
(action) => action.href ? /* @__PURE__ */ (0,
|
|
498
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Group, { gap: "xs", align: "center", wrap: "nowrap", children: [
|
|
499
|
+
typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Badge, { variant: "light", children: status }) : status,
|
|
500
|
+
secondaryActions.length ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Menu, { position: "bottom-end", withinPortal: true, children: [
|
|
501
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Menu.Target, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.ActionIcon, { variant: "subtle", "aria-label": "More actions", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MoreIcon, { size: "1rem" }) }) }),
|
|
502
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Menu.Dropdown, { children: secondaryActions.map(
|
|
503
|
+
(action) => action.href ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Menu.Item, { component: "a", href: action.href, color: action.color, children: action.label }, action.label) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Menu.Item, { onClick: action.onClick, color: action.color, children: action.label }, action.label)
|
|
447
504
|
) })
|
|
448
505
|
] }) : null
|
|
449
506
|
] })
|
|
450
507
|
] }),
|
|
451
|
-
metadata.length ? /* @__PURE__ */ (0,
|
|
452
|
-
/* @__PURE__ */ (0,
|
|
453
|
-
/* @__PURE__ */ (0,
|
|
508
|
+
metadata.length ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Stack, { gap: 6, children: metadata.map((item) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Group, { justify: "space-between", gap: "sm", children: [
|
|
509
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Text, { size: "sm", c: "dimmed", children: item.label }),
|
|
510
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Text, { size: "sm", fw: 500, ta: "right", children: item.value })
|
|
454
511
|
] }, item.label)) }) : null,
|
|
455
|
-
primaryAction ? /* @__PURE__ */ (0,
|
|
512
|
+
primaryAction ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Group, { justify: "space-between", children: primaryAction }) : null,
|
|
456
513
|
footer
|
|
457
514
|
] }) });
|
|
458
515
|
}
|
|
459
516
|
|
|
460
517
|
// src/EditorialCard.tsx
|
|
461
|
-
var
|
|
462
|
-
var
|
|
518
|
+
var import_core9 = require("@mantine/core");
|
|
519
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
463
520
|
var tonePalette = {
|
|
464
521
|
default: {
|
|
465
522
|
accent: "violet",
|
|
@@ -479,8 +536,8 @@ var tonePalette = {
|
|
|
479
536
|
}
|
|
480
537
|
};
|
|
481
538
|
function EditorialMediaFallback({ compact }) {
|
|
482
|
-
return /* @__PURE__ */ (0,
|
|
483
|
-
|
|
539
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.AspectRatio, { ratio: compact ? 16 / 10 : 4 / 3, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
540
|
+
import_core9.Box,
|
|
484
541
|
{
|
|
485
542
|
style: {
|
|
486
543
|
display: "grid",
|
|
@@ -490,7 +547,7 @@ function EditorialMediaFallback({ compact }) {
|
|
|
490
547
|
background: "var(--mantine-color-gray-0)",
|
|
491
548
|
borderRadius: "var(--mantine-radius-md)"
|
|
492
549
|
},
|
|
493
|
-
children: /* @__PURE__ */ (0,
|
|
550
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(GdsIcons.Gallery, { size: compact ? "1.5rem" : "2rem" })
|
|
494
551
|
}
|
|
495
552
|
) });
|
|
496
553
|
}
|
|
@@ -513,8 +570,8 @@ function EditorialCard({
|
|
|
513
570
|
const featured = variant === "featured";
|
|
514
571
|
const palette = tonePalette[tone];
|
|
515
572
|
const interactiveProps = href ? { component: "a", href } : onClick ? { component: "button", onClick, type: "button" } : {};
|
|
516
|
-
return /* @__PURE__ */ (0,
|
|
517
|
-
|
|
573
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
|
|
574
|
+
import_core9.Card,
|
|
518
575
|
{
|
|
519
576
|
className: classNames?.root,
|
|
520
577
|
withBorder: true,
|
|
@@ -528,21 +585,21 @@ function EditorialCard({
|
|
|
528
585
|
cursor: href || onClick ? "pointer" : "default"
|
|
529
586
|
},
|
|
530
587
|
children: [
|
|
531
|
-
/* @__PURE__ */ (0,
|
|
532
|
-
/* @__PURE__ */ (0,
|
|
533
|
-
/* @__PURE__ */ (0,
|
|
534
|
-
/* @__PURE__ */ (0,
|
|
535
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
536
|
-
/* @__PURE__ */ (0,
|
|
588
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Card.Section, { className: classNames?.media, children: media ?? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(EditorialMediaFallback, { compact }) }),
|
|
589
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core9.Stack, { gap: "md", p: compact ? "md" : "lg", className: classNames?.body, children: [
|
|
590
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core9.Group, { justify: "space-between", align: "flex-start", gap: "sm", wrap: "wrap", children: [
|
|
591
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core9.Stack, { gap: 4, flex: 1, children: [
|
|
592
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Text, { size: "xs", fw: 700, c: "dimmed", children: eyebrow }) : null,
|
|
593
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Title, { order: compact ? 4 : 3, className: classNames?.title, children: title })
|
|
537
594
|
] }),
|
|
538
|
-
badge ? typeof badge === "string" ? /* @__PURE__ */ (0,
|
|
595
|
+
badge ? typeof badge === "string" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Badge, { color: palette.accent, variant: "light", children: badge }) : badge : null
|
|
539
596
|
] }),
|
|
540
|
-
description ? /* @__PURE__ */ (0,
|
|
541
|
-
meta ? /* @__PURE__ */ (0,
|
|
542
|
-
href || onClick || ctaLabel ? /* @__PURE__ */ (0,
|
|
543
|
-
/* @__PURE__ */ (0,
|
|
544
|
-
/* @__PURE__ */ (0,
|
|
545
|
-
|
|
597
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
598
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Text, { size: "sm", c: "dimmed", className: classNames?.meta, children: meta }) : null,
|
|
599
|
+
href || onClick || ctaLabel ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core9.Group, { gap: 6, c: `${palette.accent}.7`, className: classNames?.action, children: [
|
|
600
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Text, { fw: 600, size: "sm", children: ctaLabel }),
|
|
601
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
602
|
+
import_core9.Anchor,
|
|
546
603
|
{
|
|
547
604
|
component: "span",
|
|
548
605
|
underline: "never",
|
|
@@ -560,8 +617,8 @@ function EditorialCard({
|
|
|
560
617
|
|
|
561
618
|
// src/PublicProductCard.tsx
|
|
562
619
|
var import_react = require("react");
|
|
563
|
-
var
|
|
564
|
-
var
|
|
620
|
+
var import_core10 = require("@mantine/core");
|
|
621
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
565
622
|
var stateConfig = {
|
|
566
623
|
available: { label: "Available", color: "teal" },
|
|
567
624
|
limited: { label: "Limited", color: "yellow" },
|
|
@@ -578,29 +635,29 @@ function enhanceAction(action, disabled) {
|
|
|
578
635
|
});
|
|
579
636
|
}
|
|
580
637
|
function ImageFallback({ compact }) {
|
|
581
|
-
return /* @__PURE__ */ (0,
|
|
582
|
-
|
|
638
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.AspectRatio, { ratio: compact ? 16 / 9 : 4 / 3, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
639
|
+
import_core10.ThemeIcon,
|
|
583
640
|
{
|
|
584
641
|
size: "100%",
|
|
585
642
|
radius: "md",
|
|
586
643
|
variant: "light",
|
|
587
644
|
color: "gray",
|
|
588
645
|
"aria-label": "No product image available",
|
|
589
|
-
children: /* @__PURE__ */ (0,
|
|
646
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(GdsIcons.Gallery, { size: compact ? "1.5rem" : "2rem" })
|
|
590
647
|
}
|
|
591
648
|
) });
|
|
592
649
|
}
|
|
593
650
|
function LoadingCard({ compact }) {
|
|
594
|
-
return /* @__PURE__ */ (0,
|
|
595
|
-
/* @__PURE__ */ (0,
|
|
596
|
-
/* @__PURE__ */ (0,
|
|
597
|
-
/* @__PURE__ */ (0,
|
|
598
|
-
/* @__PURE__ */ (0,
|
|
599
|
-
/* @__PURE__ */ (0,
|
|
651
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Card, { withBorder: true, radius: "lg", padding: compact ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Stack, { gap: "md", children: [
|
|
652
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.AspectRatio, { ratio: compact ? 16 / 9 : 4 / 3, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Skeleton, { radius: "md" }) }),
|
|
653
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Stack, { gap: "xs", children: [
|
|
654
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Skeleton, { height: 20, radius: "sm", width: "70%" }),
|
|
655
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Skeleton, { height: 14, radius: "sm", width: "100%" }),
|
|
656
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Skeleton, { height: 14, radius: "sm", width: "85%" })
|
|
600
657
|
] }),
|
|
601
|
-
/* @__PURE__ */ (0,
|
|
602
|
-
/* @__PURE__ */ (0,
|
|
603
|
-
/* @__PURE__ */ (0,
|
|
658
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Group, { justify: "space-between", align: "center", children: [
|
|
659
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Skeleton, { height: 18, radius: "sm", width: 72 }),
|
|
660
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Skeleton, { height: 36, radius: "md", width: 120 })
|
|
604
661
|
] })
|
|
605
662
|
] }) });
|
|
606
663
|
}
|
|
@@ -623,7 +680,7 @@ function PublicProductCard({
|
|
|
623
680
|
disabled = false
|
|
624
681
|
}) {
|
|
625
682
|
if (loading) {
|
|
626
|
-
return /* @__PURE__ */ (0,
|
|
683
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(LoadingCard, { compact });
|
|
627
684
|
}
|
|
628
685
|
const isActionDisabled = disabled || state === "sold-out";
|
|
629
686
|
const resolvedPrimaryAction = enhanceAction(primaryAction, isActionDisabled);
|
|
@@ -636,46 +693,46 @@ function PublicProductCard({
|
|
|
636
693
|
const pickupHelper = helperKind === "pickup" ? helperText : pickupNote;
|
|
637
694
|
const inventoryHelper = helperKind === "inventory" ? helperText : inventoryNote;
|
|
638
695
|
const hasSupportingRegion = Boolean(price || supportingHelper || pickupHelper || inventoryHelper);
|
|
639
|
-
return /* @__PURE__ */ (0,
|
|
640
|
-
image ?? /* @__PURE__ */ (0,
|
|
641
|
-
/* @__PURE__ */ (0,
|
|
642
|
-
/* @__PURE__ */ (0,
|
|
643
|
-
/* @__PURE__ */ (0,
|
|
644
|
-
description ? /* @__PURE__ */ (0,
|
|
696
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Card, { withBorder: true, radius: "lg", padding: compact ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Stack, { gap: compact ? "sm" : "md", children: [
|
|
697
|
+
image ?? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ImageFallback, { compact }),
|
|
698
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", gap: "sm", children: [
|
|
699
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Stack, { gap: 4, style: { minWidth: 0, flex: 1 }, children: [
|
|
700
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Title, { order: compact ? 5 : 4, lineClamp: 2, children: title }),
|
|
701
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", c: "dimmed", lineClamp: compact ? 2 : 3, children: description }) : null
|
|
645
702
|
] }),
|
|
646
|
-
/* @__PURE__ */ (0,
|
|
703
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Badge, { variant: "light", color: stateBadge.color, children: stateBadge.label })
|
|
647
704
|
] }),
|
|
648
|
-
hasSupportingRegion ? /* @__PURE__ */ (0,
|
|
649
|
-
/* @__PURE__ */ (0,
|
|
650
|
-
price ? /* @__PURE__ */ (0,
|
|
651
|
-
supportingHelper ? /* @__PURE__ */ (0,
|
|
705
|
+
hasSupportingRegion ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Group, { justify: "space-between", align: "flex-end", gap: "sm", wrap: "nowrap", children: [
|
|
706
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Stack, { gap: 2, style: { minWidth: 0, flex: 1 }, children: [
|
|
707
|
+
price ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { fw: 700, size: compact ? "md" : "lg", children: price }) : null,
|
|
708
|
+
supportingHelper ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "xs", c: "dimmed", children: supportingHelper }) : null
|
|
652
709
|
] }),
|
|
653
710
|
resolvedPrimaryAction
|
|
654
|
-
] }) : resolvedPrimaryAction ? /* @__PURE__ */ (0,
|
|
655
|
-
pickupHelper || inventoryHelper || metadata.length ? /* @__PURE__ */ (0,
|
|
656
|
-
pickupHelper ? /* @__PURE__ */ (0,
|
|
657
|
-
/* @__PURE__ */ (0,
|
|
658
|
-
/* @__PURE__ */ (0,
|
|
711
|
+
] }) : resolvedPrimaryAction ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Group, { justify: "flex-end", children: resolvedPrimaryAction }) : null,
|
|
712
|
+
pickupHelper || inventoryHelper || metadata.length ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Stack, { gap: 6, children: [
|
|
713
|
+
pickupHelper ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Group, { justify: "space-between", gap: "sm", children: [
|
|
714
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", c: "dimmed", children: "Pickup" }),
|
|
715
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", fw: 500, ta: "right", children: pickupHelper })
|
|
659
716
|
] }) : null,
|
|
660
|
-
inventoryHelper ? /* @__PURE__ */ (0,
|
|
661
|
-
/* @__PURE__ */ (0,
|
|
662
|
-
/* @__PURE__ */ (0,
|
|
717
|
+
inventoryHelper ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Group, { justify: "space-between", gap: "sm", children: [
|
|
718
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", c: "dimmed", children: "Availability" }),
|
|
719
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", fw: 500, ta: "right", children: inventoryHelper })
|
|
663
720
|
] }) : null,
|
|
664
|
-
metadata.map((item) => /* @__PURE__ */ (0,
|
|
665
|
-
/* @__PURE__ */ (0,
|
|
666
|
-
/* @__PURE__ */ (0,
|
|
721
|
+
metadata.map((item) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core10.Group, { justify: "space-between", gap: "sm", children: [
|
|
722
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", c: "dimmed", children: item.label }),
|
|
723
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Text, { size: "sm", fw: 500, ta: "right", children: item.value })
|
|
667
724
|
] }, item.label))
|
|
668
725
|
] }) : null,
|
|
669
|
-
resolvedSecondaryAction ? /* @__PURE__ */ (0,
|
|
726
|
+
resolvedSecondaryAction ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Group, { justify: "flex-end", children: resolvedSecondaryAction }) : null
|
|
670
727
|
] }) });
|
|
671
728
|
}
|
|
672
729
|
|
|
673
730
|
// src/BrowseSurface.tsx
|
|
674
|
-
var
|
|
731
|
+
var import_core13 = require("@mantine/core");
|
|
675
732
|
|
|
676
733
|
// src/DataToolbar.tsx
|
|
677
|
-
var
|
|
678
|
-
var
|
|
734
|
+
var import_core11 = require("@mantine/core");
|
|
735
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
679
736
|
function DataToolbar({
|
|
680
737
|
searchSlot,
|
|
681
738
|
filterSlot,
|
|
@@ -684,20 +741,20 @@ function DataToolbar({
|
|
|
684
741
|
createAction,
|
|
685
742
|
activeFilters = []
|
|
686
743
|
}) {
|
|
687
|
-
return /* @__PURE__ */ (0,
|
|
688
|
-
/* @__PURE__ */ (0,
|
|
689
|
-
/* @__PURE__ */ (0,
|
|
744
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Stack, { gap: "sm", children: [
|
|
745
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { justify: "space-between", align: "flex-start", gap: "sm", children: [
|
|
746
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { flex: 1, align: "flex-start", gap: "sm", children: [
|
|
690
747
|
searchSlot,
|
|
691
748
|
filterSlot,
|
|
692
749
|
sortSlot
|
|
693
750
|
] }),
|
|
694
|
-
/* @__PURE__ */ (0,
|
|
751
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", children: [
|
|
695
752
|
resetAction,
|
|
696
753
|
createAction
|
|
697
754
|
] })
|
|
698
755
|
] }),
|
|
699
|
-
activeFilters.length ? /* @__PURE__ */ (0,
|
|
700
|
-
|
|
756
|
+
activeFilters.length ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Group, { gap: "xs", children: activeFilters.map((filter) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
757
|
+
import_core11.Badge,
|
|
701
758
|
{
|
|
702
759
|
variant: "light",
|
|
703
760
|
rightSection: filter.onRemove ? "\xD7" : void 0,
|
|
@@ -711,17 +768,17 @@ function DataToolbar({
|
|
|
711
768
|
}
|
|
712
769
|
|
|
713
770
|
// src/StateBlock.tsx
|
|
714
|
-
var
|
|
715
|
-
var
|
|
771
|
+
var import_core12 = require("@mantine/core");
|
|
772
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
716
773
|
var variantConfig = {
|
|
717
|
-
loading: { color: "violet", icon: /* @__PURE__ */ (0,
|
|
718
|
-
empty: { color: "gray", icon: /* @__PURE__ */ (0,
|
|
719
|
-
error: { color: "red", icon: /* @__PURE__ */ (0,
|
|
720
|
-
permission: { color: "orange", icon: /* @__PURE__ */ (0,
|
|
721
|
-
disabled: { color: "gray", icon: /* @__PURE__ */ (0,
|
|
722
|
-
success: { color: "teal", icon: /* @__PURE__ */ (0,
|
|
723
|
-
info: { color: "blue", icon: /* @__PURE__ */ (0,
|
|
724
|
-
"not-enough-data": { color: "yellow", icon: /* @__PURE__ */ (0,
|
|
774
|
+
loading: { color: "violet", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Loader, { size: "sm" }) },
|
|
775
|
+
empty: { color: "gray", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Inbox, { size: "1.1rem" }) },
|
|
776
|
+
error: { color: "red", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Danger, { size: "1.1rem" }) },
|
|
777
|
+
permission: { color: "orange", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Verify, { size: "1.1rem" }) },
|
|
778
|
+
disabled: { color: "gray", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Toggle, { size: "1.1rem" }) },
|
|
779
|
+
success: { color: "teal", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Success, { size: "1.1rem" }) },
|
|
780
|
+
info: { color: "blue", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Info, { size: "1.1rem" }) },
|
|
781
|
+
"not-enough-data": { color: "yellow", icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(GdsIcons.Analytics, { size: "1.1rem" }) }
|
|
725
782
|
};
|
|
726
783
|
function StateBlock({
|
|
727
784
|
variant,
|
|
@@ -732,8 +789,8 @@ function StateBlock({
|
|
|
732
789
|
compact = false
|
|
733
790
|
}) {
|
|
734
791
|
const config = variantConfig[variant];
|
|
735
|
-
return /* @__PURE__ */ (0,
|
|
736
|
-
|
|
792
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
793
|
+
import_core12.Stack,
|
|
737
794
|
{
|
|
738
795
|
align: compact ? "flex-start" : "center",
|
|
739
796
|
justify: "center",
|
|
@@ -741,10 +798,10 @@ function StateBlock({
|
|
|
741
798
|
py: compact ? "md" : "xl",
|
|
742
799
|
ta: compact ? "left" : "center",
|
|
743
800
|
children: [
|
|
744
|
-
/* @__PURE__ */ (0,
|
|
745
|
-
/* @__PURE__ */ (0,
|
|
746
|
-
/* @__PURE__ */ (0,
|
|
747
|
-
description ? /* @__PURE__ */ (0,
|
|
801
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.ThemeIcon, { variant: "light", color: config.color, size: compact ? "lg" : "xl", radius: "xl", children: icon ?? config.icon }),
|
|
802
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core12.Stack, { gap: 6, align: compact ? "flex-start" : "center", children: [
|
|
803
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Title, { order: compact ? 4 : 3, children: title }),
|
|
804
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Text, { c: "dimmed", maw: compact ? void 0 : 480, children: description }) : null
|
|
748
805
|
] }),
|
|
749
806
|
action
|
|
750
807
|
]
|
|
@@ -753,7 +810,7 @@ function StateBlock({
|
|
|
753
810
|
}
|
|
754
811
|
|
|
755
812
|
// src/BrowseSurface.tsx
|
|
756
|
-
var
|
|
813
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
757
814
|
function BrowseSurface({
|
|
758
815
|
eyebrow,
|
|
759
816
|
title,
|
|
@@ -787,22 +844,22 @@ function BrowseSurface({
|
|
|
787
844
|
}));
|
|
788
845
|
let body = content;
|
|
789
846
|
if (loading) {
|
|
790
|
-
body = /* @__PURE__ */ (0,
|
|
847
|
+
body = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(StateBlock, { variant: "loading", title: loadingTitle, description: loadingDescription, compact: true });
|
|
791
848
|
} else if (error) {
|
|
792
|
-
body = /* @__PURE__ */ (0,
|
|
849
|
+
body = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(StateBlock, { variant: "error", title: errorTitle, description: error, action: errorAction ?? emptyAction, compact: true });
|
|
793
850
|
} else if (empty) {
|
|
794
|
-
body = /* @__PURE__ */ (0,
|
|
851
|
+
body = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, action: emptyAction, compact: true });
|
|
795
852
|
}
|
|
796
|
-
return /* @__PURE__ */ (0,
|
|
797
|
-
/* @__PURE__ */ (0,
|
|
798
|
-
/* @__PURE__ */ (0,
|
|
799
|
-
/* @__PURE__ */ (0,
|
|
800
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
801
|
-
/* @__PURE__ */ (0,
|
|
802
|
-
description ? /* @__PURE__ */ (0,
|
|
853
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "lg", children: [
|
|
854
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Paper, { withBorder: true, radius: "xl", p: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "lg", children: [
|
|
855
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Group, { justify: "space-between", align: "flex-start", gap: "md", children: [
|
|
856
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "xs", maw: 760, children: [
|
|
857
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "xs", fw: 700, tt: "uppercase", c: "dimmed", style: { letterSpacing: "0.18em" }, children: eyebrow }) : null,
|
|
858
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Title, { order: 1, children: title }),
|
|
859
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "lg", c: "dimmed", children: description }) : null
|
|
803
860
|
] }),
|
|
804
|
-
/* @__PURE__ */ (0,
|
|
805
|
-
typeof resultCount === "number" ? /* @__PURE__ */ (0,
|
|
861
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { align: "flex-end", gap: "xs", children: [
|
|
862
|
+
typeof resultCount === "number" ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Badge, { size: "lg", radius: "xl", variant: "light", color: "violet", children: [
|
|
806
863
|
resultCount,
|
|
807
864
|
" ",
|
|
808
865
|
resultLabel
|
|
@@ -810,10 +867,10 @@ function BrowseSurface({
|
|
|
810
867
|
primaryControls
|
|
811
868
|
] })
|
|
812
869
|
] }),
|
|
813
|
-
scopeOptions.length ? /* @__PURE__ */ (0,
|
|
814
|
-
/* @__PURE__ */ (0,
|
|
815
|
-
/* @__PURE__ */ (0,
|
|
816
|
-
|
|
870
|
+
scopeOptions.length ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "xs", children: [
|
|
871
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", fw: 600, c: "dimmed", children: scopeLabel }),
|
|
872
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Group, { gap: "xs", wrap: "wrap", children: scopeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
873
|
+
import_core13.Button,
|
|
817
874
|
{
|
|
818
875
|
variant: option.active ? "filled" : "default",
|
|
819
876
|
color: option.active ? "violet" : "gray",
|
|
@@ -825,30 +882,30 @@ function BrowseSurface({
|
|
|
825
882
|
option.id
|
|
826
883
|
)) })
|
|
827
884
|
] }) : null,
|
|
828
|
-
locationControls ? /* @__PURE__ */ (0,
|
|
829
|
-
/* @__PURE__ */ (0,
|
|
885
|
+
locationControls ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "xs", children: [
|
|
886
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", fw: 600, c: "dimmed", children: "Location" }),
|
|
830
887
|
locationControls
|
|
831
888
|
] }) : null,
|
|
832
|
-
toolbar || sortControl ? /* @__PURE__ */ (0,
|
|
833
|
-
toolbar ? /* @__PURE__ */ (0,
|
|
889
|
+
toolbar || sortControl ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.SimpleGrid, { cols: { base: 1, lg: sortControl ? 2 : 1 }, spacing: "md", children: [
|
|
890
|
+
toolbar ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
834
891
|
DataToolbar,
|
|
835
892
|
{
|
|
836
893
|
...toolbar,
|
|
837
894
|
activeFilters: toolbarFilters.length ? toolbarFilters : toolbar.fallbackActiveFilters
|
|
838
895
|
}
|
|
839
|
-
) : /* @__PURE__ */ (0,
|
|
840
|
-
sortControl ? /* @__PURE__ */ (0,
|
|
841
|
-
/* @__PURE__ */ (0,
|
|
896
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Box, {}),
|
|
897
|
+
sortControl ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: "xs", align: "stretch", children: [
|
|
898
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", fw: 600, c: "dimmed", children: "Sort" }),
|
|
842
899
|
sortControl
|
|
843
900
|
] }) : null
|
|
844
901
|
] }) : null,
|
|
845
|
-
mobileFilters ? /* @__PURE__ */ (0,
|
|
846
|
-
/* @__PURE__ */ (0,
|
|
902
|
+
mobileFilters ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { hiddenFrom: "lg", gap: "xs", children: [
|
|
903
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { size: "sm", fw: 600, c: "dimmed", children: "Filters" }),
|
|
847
904
|
mobileFilters
|
|
848
905
|
] }) : null,
|
|
849
|
-
filterDrawer ? /* @__PURE__ */ (0,
|
|
850
|
-
activeFilters.length ? /* @__PURE__ */ (0,
|
|
851
|
-
|
|
906
|
+
filterDrawer ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Box, { hiddenFrom: "lg", children: filterDrawer }) : null,
|
|
907
|
+
activeFilters.length ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Group, { gap: "xs", wrap: "wrap", children: activeFilters.map((filter) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
908
|
+
import_core13.Badge,
|
|
852
909
|
{
|
|
853
910
|
variant: "light",
|
|
854
911
|
color: "violet",
|
|
@@ -865,8 +922,8 @@ function BrowseSurface({
|
|
|
865
922
|
}
|
|
866
923
|
|
|
867
924
|
// src/AccentPanel.tsx
|
|
868
|
-
var
|
|
869
|
-
var
|
|
925
|
+
var import_core14 = require("@mantine/core");
|
|
926
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
870
927
|
var toneStyles = {
|
|
871
928
|
gray: {
|
|
872
929
|
bg: "light-dark(var(--mantine-color-gray-0), color-mix(in srgb, var(--mantine-color-gray-7) 88%, black))",
|
|
@@ -922,29 +979,29 @@ function AccentPanel({
|
|
|
922
979
|
children
|
|
923
980
|
}) {
|
|
924
981
|
const styles = resolveAccentPanelStyles(tone, variant);
|
|
925
|
-
return /* @__PURE__ */ (0,
|
|
926
|
-
title || badge ? /* @__PURE__ */ (0,
|
|
927
|
-
title ? /* @__PURE__ */ (0,
|
|
928
|
-
badge ? typeof badge === "string" ? /* @__PURE__ */ (0,
|
|
982
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "lg", p: "lg", style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "sm", children: [
|
|
983
|
+
title || badge ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", align: "flex-start", gap: "sm", wrap: "wrap", children: [
|
|
984
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Title, { order: 4, c: "inherit", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Box, {}),
|
|
985
|
+
badge ? typeof badge === "string" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Badge, { color: tone === "amber" ? "yellow" : tone, variant: "filled", children: badge }) : badge : null
|
|
929
986
|
] }) : null,
|
|
930
|
-
typeof children === "string" ? /* @__PURE__ */ (0,
|
|
987
|
+
typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { c: "inherit", children }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Box, { c: "inherit", children })
|
|
931
988
|
] }) });
|
|
932
989
|
}
|
|
933
990
|
|
|
934
991
|
// src/PublicShell.tsx
|
|
935
|
-
var
|
|
992
|
+
var import_core16 = require("@mantine/core");
|
|
936
993
|
|
|
937
994
|
// src/PublicNav.tsx
|
|
938
|
-
var
|
|
939
|
-
var
|
|
995
|
+
var import_core15 = require("@mantine/core");
|
|
996
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
940
997
|
function PublicNav({ items, activeId, renderLink }) {
|
|
941
|
-
return /* @__PURE__ */ (0,
|
|
998
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_core15.Group, { component: "nav", "aria-label": "Primary", gap: "lg", wrap: "nowrap", children: items.map((item) => {
|
|
942
999
|
const active = item.id === activeId;
|
|
943
1000
|
if (renderLink) {
|
|
944
|
-
return /* @__PURE__ */ (0,
|
|
1001
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { children: renderLink(item, active) }, item.id);
|
|
945
1002
|
}
|
|
946
|
-
return /* @__PURE__ */ (0,
|
|
947
|
-
|
|
1003
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1004
|
+
import_core15.Anchor,
|
|
948
1005
|
{
|
|
949
1006
|
href: item.href,
|
|
950
1007
|
"aria-current": active ? "page" : void 0,
|
|
@@ -961,15 +1018,15 @@ function PublicNav({ items, activeId, renderLink }) {
|
|
|
961
1018
|
}
|
|
962
1019
|
|
|
963
1020
|
// src/PublicShell.tsx
|
|
964
|
-
var
|
|
1021
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
965
1022
|
function InlineMobileNavigation({
|
|
966
1023
|
mobileNavigation,
|
|
967
1024
|
className,
|
|
968
1025
|
mode
|
|
969
1026
|
}) {
|
|
970
|
-
return /* @__PURE__ */ (0,
|
|
971
|
-
/* @__PURE__ */ (0,
|
|
972
|
-
|
|
1027
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core16.Box, { component: "details", hiddenFrom: "sm", className, children: [
|
|
1028
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
1029
|
+
import_core16.Box,
|
|
973
1030
|
{
|
|
974
1031
|
component: "summary",
|
|
975
1032
|
"aria-label": mode === "drawer" ? "Open site navigation drawer" : "Open site navigation",
|
|
@@ -981,13 +1038,13 @@ function InlineMobileNavigation({
|
|
|
981
1038
|
gap: "0.5rem"
|
|
982
1039
|
},
|
|
983
1040
|
children: [
|
|
984
|
-
/* @__PURE__ */ (0,
|
|
985
|
-
/* @__PURE__ */ (0,
|
|
1041
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Burger, { opened: false, "aria-hidden": true }),
|
|
1042
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Text, { size: "sm", fw: 600, children: "Menu" })
|
|
986
1043
|
]
|
|
987
1044
|
}
|
|
988
1045
|
),
|
|
989
|
-
/* @__PURE__ */ (0,
|
|
990
|
-
|
|
1046
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1047
|
+
import_core16.Box,
|
|
991
1048
|
{
|
|
992
1049
|
mt: "sm",
|
|
993
1050
|
p: "sm",
|
|
@@ -996,7 +1053,7 @@ function InlineMobileNavigation({
|
|
|
996
1053
|
border: "1px solid var(--mantine-color-default-border)",
|
|
997
1054
|
background: mode === "drawer" ? "light-dark(var(--mantine-color-white), color-mix(in srgb, var(--mantine-color-dark-7) 92%, black))" : "var(--mantine-color-body)"
|
|
998
1055
|
},
|
|
999
|
-
children: /* @__PURE__ */ (0,
|
|
1056
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Stack, { gap: "sm", children: mobileNavigation })
|
|
1000
1057
|
}
|
|
1001
1058
|
)
|
|
1002
1059
|
] });
|
|
@@ -1017,30 +1074,30 @@ function PublicShell({
|
|
|
1017
1074
|
mobileNavigationMode = "sheet",
|
|
1018
1075
|
classNames
|
|
1019
1076
|
}) {
|
|
1020
|
-
const resolvedNavigation = navigation ?? (navItems ? /* @__PURE__ */ (0,
|
|
1077
|
+
const resolvedNavigation = navigation ?? (navItems ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(PublicNav, { items: navItems, activeId: activeNavId }) : null);
|
|
1021
1078
|
const containerSize = maxContentWidth ?? (compact ? "md" : "lg");
|
|
1022
1079
|
const headerHeight = headerVariant === "compact" ? 64 : headerVariant === "branded-quiet" ? 88 : 72;
|
|
1023
1080
|
const mainPadding = headerVariant === "compact" ? "lg" : "xl";
|
|
1024
1081
|
const usesInlineMobileNavigation = Boolean(mobileNavigation) && mobileNavigationMode !== "sheet";
|
|
1025
1082
|
const usesSheetMobileNavigation = Boolean(mobileNavigation) && mobileNavigationMode === "sheet";
|
|
1026
|
-
return /* @__PURE__ */ (0,
|
|
1027
|
-
|
|
1083
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
1084
|
+
import_core16.AppShell,
|
|
1028
1085
|
{
|
|
1029
1086
|
className: classNames?.root,
|
|
1030
1087
|
header: { height: headerHeight },
|
|
1031
1088
|
footer: usesSheetMobileNavigation ? { height: 68 } : void 0,
|
|
1032
1089
|
padding: 0,
|
|
1033
1090
|
children: [
|
|
1034
|
-
/* @__PURE__ */ (0,
|
|
1035
|
-
|
|
1091
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.AppShell.Header, { withBorder: headerBordered, className: classNames?.header, "data-header-variant": headerVariant, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Container, { size: containerSize, h: "100%", py: headerVariant === "branded-quiet" ? "sm" : 0, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
1092
|
+
import_core16.Group,
|
|
1036
1093
|
{
|
|
1037
1094
|
h: "100%",
|
|
1038
1095
|
justify: "space-between",
|
|
1039
1096
|
wrap: "nowrap",
|
|
1040
1097
|
gap: headerVariant === "compact" ? "sm" : "lg",
|
|
1041
1098
|
children: [
|
|
1042
|
-
/* @__PURE__ */ (0,
|
|
1043
|
-
usesInlineMobileNavigation ? /* @__PURE__ */ (0,
|
|
1099
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core16.Group, { wrap: "nowrap", gap: headerVariant === "compact" ? "xs" : "sm", className: classNames?.brand, children: [
|
|
1100
|
+
usesInlineMobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1044
1101
|
InlineMobileNavigation,
|
|
1045
1102
|
{
|
|
1046
1103
|
mobileNavigation,
|
|
@@ -1048,17 +1105,17 @@ function PublicShell({
|
|
|
1048
1105
|
mode: mobileNavigationMode
|
|
1049
1106
|
}
|
|
1050
1107
|
) : null,
|
|
1051
|
-
/* @__PURE__ */ (0,
|
|
1108
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Box, { children: brand })
|
|
1052
1109
|
] }),
|
|
1053
|
-
/* @__PURE__ */ (0,
|
|
1054
|
-
/* @__PURE__ */ (0,
|
|
1110
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Group, { visibleFrom: "sm", gap: headerVariant === "compact" ? "md" : "lg", className: classNames?.navigation, children: resolvedNavigation }),
|
|
1111
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Group, { gap: "sm", className: classNames?.actions, children: actions })
|
|
1055
1112
|
]
|
|
1056
1113
|
}
|
|
1057
1114
|
) }) }),
|
|
1058
|
-
usesSheetMobileNavigation ? /* @__PURE__ */ (0,
|
|
1059
|
-
/* @__PURE__ */ (0,
|
|
1060
|
-
/* @__PURE__ */ (0,
|
|
1061
|
-
footer ? /* @__PURE__ */ (0,
|
|
1115
|
+
usesSheetMobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.AppShell.Footer, { withBorder: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Container, { size: containerSize, h: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Group, { h: "100%", justify: "space-around", wrap: "nowrap", children: mobileNavigation }) }) }) : null,
|
|
1116
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core16.AppShell.Main, { children: [
|
|
1117
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Container, { size: containerSize, py: mainPadding, className: classNames?.content, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Stack, { gap: "xl", children }) }),
|
|
1118
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Box, { component: typeof footer === "string" ? "footer" : "div", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Container, { size: containerSize, children: typeof footer === "string" ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Text, { size: "sm", c: "dimmed", children: footer }) : footer }) }) : null
|
|
1062
1119
|
] })
|
|
1063
1120
|
]
|
|
1064
1121
|
}
|
|
@@ -1066,18 +1123,18 @@ function PublicShell({
|
|
|
1066
1123
|
}
|
|
1067
1124
|
|
|
1068
1125
|
// src/PublicSiteFooter.tsx
|
|
1069
|
-
var
|
|
1070
|
-
var
|
|
1126
|
+
var import_core17 = require("@mantine/core");
|
|
1127
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1071
1128
|
function PublicSiteFooter({ children, meta }) {
|
|
1072
|
-
return /* @__PURE__ */ (0,
|
|
1073
|
-
children ? /* @__PURE__ */ (0,
|
|
1074
|
-
meta ? /* @__PURE__ */ (0,
|
|
1129
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Stack, { component: "footer", gap: "xs", children: [
|
|
1130
|
+
children ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "sm", children }) : null,
|
|
1131
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Group, { gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Text, { size: "xs", c: "dimmed", children: meta }) }) : null
|
|
1075
1132
|
] });
|
|
1076
1133
|
}
|
|
1077
1134
|
|
|
1078
1135
|
// src/PublicBrandFooter.tsx
|
|
1079
|
-
var
|
|
1080
|
-
var
|
|
1136
|
+
var import_core18 = require("@mantine/core");
|
|
1137
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1081
1138
|
function PublicBrandFooter({
|
|
1082
1139
|
media,
|
|
1083
1140
|
brandTitle,
|
|
@@ -1092,8 +1149,8 @@ function PublicBrandFooter({
|
|
|
1092
1149
|
const mediaSpan = layoutVariant === "immersive-media" ? 5 : 4;
|
|
1093
1150
|
const primarySpan = media ? layoutVariant === "balanced-quote" ? 4 : 4 : secondary ? 6 : 12;
|
|
1094
1151
|
const secondarySpan = media ? Math.max(3, 12 - mediaSpan - primarySpan) : Math.max(4, 12 - primarySpan);
|
|
1095
|
-
return /* @__PURE__ */ (0,
|
|
1096
|
-
|
|
1152
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
1153
|
+
import_core18.Paper,
|
|
1097
1154
|
{
|
|
1098
1155
|
component: "footer",
|
|
1099
1156
|
withBorder: true,
|
|
@@ -1101,19 +1158,19 @@ function PublicBrandFooter({
|
|
|
1101
1158
|
p: compact ? "lg" : "xl",
|
|
1102
1159
|
className: classNames?.root,
|
|
1103
1160
|
"data-layout-variant": layoutVariant,
|
|
1104
|
-
children: /* @__PURE__ */ (0,
|
|
1105
|
-
/* @__PURE__ */ (0,
|
|
1106
|
-
media ? /* @__PURE__ */ (0,
|
|
1107
|
-
/* @__PURE__ */ (0,
|
|
1108
|
-
brandTitle ? /* @__PURE__ */ (0,
|
|
1109
|
-
description ? /* @__PURE__ */ (0,
|
|
1110
|
-
actions ? /* @__PURE__ */ (0,
|
|
1161
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_core18.Stack, { gap: "lg", children: [
|
|
1162
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_core18.Grid, { gutter: compact ? "lg" : "xl", align: "flex-start", children: [
|
|
1163
|
+
media ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Grid.Col, { span: { base: 12, md: mediaSpan }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Box, { className: classNames?.media, children: media }) }) : null,
|
|
1164
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Grid.Col, { span: { base: 12, md: primarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_core18.Stack, { gap: compact ? "xs" : "sm", className: classNames?.primary, children: [
|
|
1165
|
+
brandTitle ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Title, { order: 4, children: brandTitle }) : null,
|
|
1166
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Text, { c: "dimmed", children: description }) : null,
|
|
1167
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Box, { children: actions }) : null
|
|
1111
1168
|
] }) }),
|
|
1112
|
-
secondary ? /* @__PURE__ */ (0,
|
|
1169
|
+
secondary ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Grid.Col, { span: { base: 12, md: secondarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Stack, { gap: compact ? "xs" : "sm", className: classNames?.secondary, children: secondary }) }) : null
|
|
1113
1170
|
] }),
|
|
1114
|
-
legal ? /* @__PURE__ */ (0,
|
|
1115
|
-
/* @__PURE__ */ (0,
|
|
1116
|
-
/* @__PURE__ */ (0,
|
|
1171
|
+
legal ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
|
|
1172
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Divider, {}),
|
|
1173
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Group, { justify: "space-between", gap: "sm", wrap: "wrap", className: classNames?.legal, children: typeof legal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_core18.Text, { size: "sm", c: "dimmed", children: legal }) : legal })
|
|
1117
1174
|
] }) : null
|
|
1118
1175
|
] })
|
|
1119
1176
|
}
|
|
@@ -1121,57 +1178,60 @@ function PublicBrandFooter({
|
|
|
1121
1178
|
}
|
|
1122
1179
|
|
|
1123
1180
|
// src/AuthShell.tsx
|
|
1124
|
-
var
|
|
1125
|
-
var
|
|
1126
|
-
function AuthShell({ title, description, brand, footer, helper, children }) {
|
|
1127
|
-
return /* @__PURE__ */ (0,
|
|
1128
|
-
brand ? /* @__PURE__ */ (0,
|
|
1129
|
-
|
|
1130
|
-
/* @__PURE__ */ (0,
|
|
1131
|
-
|
|
1132
|
-
|
|
1181
|
+
var import_core19 = require("@mantine/core");
|
|
1182
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
1183
|
+
function AuthShell({ title, description, brand, headerActions, footer, helper, children }) {
|
|
1184
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Box, { py: { base: "xl", md: "4rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Container, { size: "xs", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core19.Stack, { gap: "xl", children: [
|
|
1185
|
+
brand || headerActions ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core19.Group, { justify: brand && headerActions ? "space-between" : "center", align: "center", children: [
|
|
1186
|
+
brand ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Box, { children: brand }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Box, {}),
|
|
1187
|
+
headerActions ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Group, { gap: "sm", children: headerActions }) : null
|
|
1188
|
+
] }) : null,
|
|
1189
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Card, { withBorder: true, radius: "lg", padding: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core19.Stack, { gap: "lg", children: [
|
|
1190
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core19.Stack, { gap: "xs", ta: "center", children: [
|
|
1191
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Title, { order: 2, children: title }),
|
|
1192
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Text, { c: "dimmed", size: "sm", children: description }) : null
|
|
1133
1193
|
] }),
|
|
1134
1194
|
children,
|
|
1135
|
-
helper ? /* @__PURE__ */ (0,
|
|
1195
|
+
helper ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Text, { size: "sm", c: "dimmed", ta: "center", children: helper }) : null
|
|
1136
1196
|
] }) }),
|
|
1137
|
-
footer ? /* @__PURE__ */ (0,
|
|
1197
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core19.Text, { size: "sm", c: "dimmed", ta: "center", children: footer }) : null
|
|
1138
1198
|
] }) }) });
|
|
1139
1199
|
}
|
|
1140
1200
|
|
|
1141
1201
|
// src/ArticleShell.tsx
|
|
1142
|
-
var
|
|
1143
|
-
var
|
|
1202
|
+
var import_core20 = require("@mantine/core");
|
|
1203
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
1144
1204
|
function ArticleShell({ eyebrow, title, lead, meta, sideRail, children }) {
|
|
1145
|
-
return /* @__PURE__ */ (0,
|
|
1146
|
-
/* @__PURE__ */ (0,
|
|
1147
|
-
/* @__PURE__ */ (0,
|
|
1148
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
1149
|
-
/* @__PURE__ */ (0,
|
|
1150
|
-
lead ? /* @__PURE__ */ (0,
|
|
1151
|
-
meta ? /* @__PURE__ */ (0,
|
|
1205
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Container, { size: "lg", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core20.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
|
|
1206
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core20.Stack, { gap: "lg", maw: 760, flex: 1, children: [
|
|
1207
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core20.Stack, { gap: "sm", children: [
|
|
1208
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Text, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
|
|
1209
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Title, { order: 1, children: title }),
|
|
1210
|
+
lead ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Text, { size: "lg", c: "dimmed", children: lead }) : null,
|
|
1211
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Group, { gap: "md", children: meta }) : null
|
|
1152
1212
|
] }),
|
|
1153
|
-
/* @__PURE__ */ (0,
|
|
1213
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Stack, { gap: "md", children })
|
|
1154
1214
|
] }),
|
|
1155
|
-
sideRail ? /* @__PURE__ */ (0,
|
|
1215
|
+
sideRail ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core20.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
|
|
1156
1216
|
] }) });
|
|
1157
1217
|
}
|
|
1158
1218
|
|
|
1159
1219
|
// src/CtaButtonGroup.tsx
|
|
1160
|
-
var
|
|
1161
|
-
var
|
|
1220
|
+
var import_core21 = require("@mantine/core");
|
|
1221
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
1162
1222
|
function CtaButtonGroup({ primary, secondary, tertiary }) {
|
|
1163
|
-
return /* @__PURE__ */ (0,
|
|
1164
|
-
/* @__PURE__ */ (0,
|
|
1165
|
-
/* @__PURE__ */ (0,
|
|
1166
|
-
secondary ? /* @__PURE__ */ (0,
|
|
1223
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core21.Stack, { gap: "sm", children: [
|
|
1224
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core21.Group, { gap: "sm", align: "stretch", children: [
|
|
1225
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { children: primary }),
|
|
1226
|
+
secondary ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { children: secondary }) : null
|
|
1167
1227
|
] }),
|
|
1168
|
-
tertiary ? /* @__PURE__ */ (0,
|
|
1228
|
+
tertiary ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { children: tertiary }) : null
|
|
1169
1229
|
] });
|
|
1170
1230
|
}
|
|
1171
1231
|
|
|
1172
1232
|
// src/DocsPageShell.tsx
|
|
1173
|
-
var
|
|
1174
|
-
var
|
|
1233
|
+
var import_core22 = require("@mantine/core");
|
|
1234
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1175
1235
|
function DocsPageShell({
|
|
1176
1236
|
breadcrumbs = [],
|
|
1177
1237
|
title,
|
|
@@ -1182,27 +1242,27 @@ function DocsPageShell({
|
|
|
1182
1242
|
footerNext,
|
|
1183
1243
|
children
|
|
1184
1244
|
}) {
|
|
1185
|
-
return /* @__PURE__ */ (0,
|
|
1186
|
-
/* @__PURE__ */ (0,
|
|
1187
|
-
breadcrumbs.length ? /* @__PURE__ */ (0,
|
|
1188
|
-
(crumb) => crumb.href ? /* @__PURE__ */ (0,
|
|
1245
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Container, { size: "lg", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core22.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
|
|
1246
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core22.Stack, { component: "article", gap: "lg", maw: 760, flex: 1, children: [
|
|
1247
|
+
breadcrumbs.length ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Breadcrumbs, { children: breadcrumbs.map(
|
|
1248
|
+
(crumb) => crumb.href ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Anchor, { href: crumb.href, children: crumb.label }, `${crumb.label}-${crumb.href}`) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Text, { children: crumb.label }, crumb.label)
|
|
1189
1249
|
) }) : null,
|
|
1190
|
-
/* @__PURE__ */ (0,
|
|
1191
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
1192
|
-
/* @__PURE__ */ (0,
|
|
1193
|
-
lead ? /* @__PURE__ */ (0,
|
|
1194
|
-
meta ? /* @__PURE__ */ (0,
|
|
1250
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core22.Stack, { gap: "sm", children: [
|
|
1251
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Text, { size: "sm", fw: 700, c: "dimmed", children: eyebrow }) : null,
|
|
1252
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Title, { order: 1, children: title }),
|
|
1253
|
+
lead ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Text, { size: "lg", c: "dimmed", children: lead }) : null,
|
|
1254
|
+
meta ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Group, { gap: "md", children: meta }) : null
|
|
1195
1255
|
] }),
|
|
1196
|
-
/* @__PURE__ */ (0,
|
|
1197
|
-
footerNext ? /* @__PURE__ */ (0,
|
|
1256
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Stack, { gap: "md", children }),
|
|
1257
|
+
footerNext ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Anchor, { href: footerNext.href, fw: 600, children: footerNext.label }) : null
|
|
1198
1258
|
] }),
|
|
1199
|
-
sideRail ? /* @__PURE__ */ (0,
|
|
1259
|
+
sideRail ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core22.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
|
|
1200
1260
|
] }) });
|
|
1201
1261
|
}
|
|
1202
1262
|
|
|
1203
1263
|
// src/EditorialHero.tsx
|
|
1204
|
-
var
|
|
1205
|
-
var
|
|
1264
|
+
var import_core23 = require("@mantine/core");
|
|
1265
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1206
1266
|
function resolveActionVariant(action, index, seenPrimary) {
|
|
1207
1267
|
const requested = action.variant ?? (index === 0 ? "primary" : "secondary");
|
|
1208
1268
|
if (requested === "primary" && !seenPrimary) {
|
|
@@ -1214,8 +1274,8 @@ function resolveActionVariant(action, index, seenPrimary) {
|
|
|
1214
1274
|
return { variant: "default", seenPrimary };
|
|
1215
1275
|
}
|
|
1216
1276
|
function HeroAction({ action, variant }) {
|
|
1217
|
-
const content = /* @__PURE__ */ (0,
|
|
1218
|
-
|
|
1277
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1278
|
+
import_core23.Anchor,
|
|
1219
1279
|
{
|
|
1220
1280
|
href: action.href,
|
|
1221
1281
|
onClick: action.onClick,
|
|
@@ -1239,8 +1299,8 @@ function HeroAction({ action, variant }) {
|
|
|
1239
1299
|
}
|
|
1240
1300
|
);
|
|
1241
1301
|
if (!action.href) {
|
|
1242
|
-
return /* @__PURE__ */ (0,
|
|
1243
|
-
|
|
1302
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1303
|
+
import_core23.Box,
|
|
1244
1304
|
{
|
|
1245
1305
|
component: "button",
|
|
1246
1306
|
type: "button",
|
|
@@ -1267,30 +1327,30 @@ function HeroAction({ action, variant }) {
|
|
|
1267
1327
|
return content;
|
|
1268
1328
|
}
|
|
1269
1329
|
function LoadingHero({ compact }) {
|
|
1270
|
-
return /* @__PURE__ */ (0,
|
|
1271
|
-
/* @__PURE__ */ (0,
|
|
1272
|
-
/* @__PURE__ */ (0,
|
|
1273
|
-
/* @__PURE__ */ (0,
|
|
1274
|
-
/* @__PURE__ */ (0,
|
|
1275
|
-
/* @__PURE__ */ (0,
|
|
1276
|
-
/* @__PURE__ */ (0,
|
|
1277
|
-
/* @__PURE__ */ (0,
|
|
1278
|
-
/* @__PURE__ */ (0,
|
|
1330
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Paper, { withBorder: true, radius: "xl", p: compact ? "lg" : "xl", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
|
|
1331
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Stack, { gap: "md", children: [
|
|
1332
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { height: 16, width: 96, radius: "xl" }),
|
|
1333
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { height: 48, width: "90%", radius: "md" }),
|
|
1334
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { height: 18, width: "100%", radius: "md" }),
|
|
1335
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { height: 18, width: "82%", radius: "md" }),
|
|
1336
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Group, { children: [
|
|
1337
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { height: 40, width: 140, radius: "md" }),
|
|
1338
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { height: 40, width: 140, radius: "md" })
|
|
1279
1339
|
] })
|
|
1280
1340
|
] }) }),
|
|
1281
|
-
/* @__PURE__ */ (0,
|
|
1341
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Skeleton, { radius: "lg" }) }) })
|
|
1282
1342
|
] }) });
|
|
1283
1343
|
}
|
|
1284
1344
|
function MediaFallback() {
|
|
1285
|
-
return /* @__PURE__ */ (0,
|
|
1286
|
-
|
|
1345
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1346
|
+
import_core23.ThemeIcon,
|
|
1287
1347
|
{
|
|
1288
1348
|
size: "100%",
|
|
1289
1349
|
radius: "lg",
|
|
1290
1350
|
color: "gray",
|
|
1291
1351
|
variant: "light",
|
|
1292
1352
|
"aria-label": "Hero media is unavailable",
|
|
1293
|
-
children: /* @__PURE__ */ (0,
|
|
1353
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(GdsIcons.Gallery, { size: "2.5rem" })
|
|
1294
1354
|
}
|
|
1295
1355
|
) });
|
|
1296
1356
|
}
|
|
@@ -1310,8 +1370,8 @@ function MediaFrame({
|
|
|
1310
1370
|
} else if (mediaFade === "soft-start") {
|
|
1311
1371
|
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%)";
|
|
1312
1372
|
}
|
|
1313
|
-
return /* @__PURE__ */ (0,
|
|
1314
|
-
|
|
1373
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
1374
|
+
import_core23.Box,
|
|
1315
1375
|
{
|
|
1316
1376
|
component: "figure",
|
|
1317
1377
|
m: 0,
|
|
@@ -1324,9 +1384,9 @@ function MediaFrame({
|
|
|
1324
1384
|
},
|
|
1325
1385
|
"aria-label": mediaAlt,
|
|
1326
1386
|
children: [
|
|
1327
|
-
media ?? /* @__PURE__ */ (0,
|
|
1328
|
-
media && overlayBackground ? /* @__PURE__ */ (0,
|
|
1329
|
-
|
|
1387
|
+
media ?? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MediaFallback, {}),
|
|
1388
|
+
media && overlayBackground ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1389
|
+
import_core23.Box,
|
|
1330
1390
|
{
|
|
1331
1391
|
"aria-hidden": true,
|
|
1332
1392
|
style: {
|
|
@@ -1359,7 +1419,7 @@ function EditorialHero({
|
|
|
1359
1419
|
classNames
|
|
1360
1420
|
}) {
|
|
1361
1421
|
if (loading) {
|
|
1362
|
-
return /* @__PURE__ */ (0,
|
|
1422
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(LoadingHero, { compact });
|
|
1363
1423
|
}
|
|
1364
1424
|
const stackAlign = align === "center" ? "center" : "flex-start";
|
|
1365
1425
|
const textAlign = align === "center" ? "center" : "left";
|
|
@@ -1367,15 +1427,15 @@ function EditorialHero({
|
|
|
1367
1427
|
const renderedActions = actions.slice(0, 3).map((action, index) => {
|
|
1368
1428
|
const resolved = resolveActionVariant(action, index, seenPrimary);
|
|
1369
1429
|
seenPrimary = resolved.seenPrimary;
|
|
1370
|
-
return /* @__PURE__ */ (0,
|
|
1430
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(HeroAction, { action, variant: resolved.variant }, `${action.label}-${index}`);
|
|
1371
1431
|
});
|
|
1372
|
-
const textSlot = /* @__PURE__ */ (0,
|
|
1373
|
-
/* @__PURE__ */ (0,
|
|
1374
|
-
eyebrow ? /* @__PURE__ */ (0,
|
|
1375
|
-
/* @__PURE__ */ (0,
|
|
1376
|
-
description ? /* @__PURE__ */ (0,
|
|
1432
|
+
const textSlot = /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Stack, { gap: compact ? "md" : "lg", justify: "center", h: "100%", className: classNames?.content, children: [
|
|
1433
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Stack, { gap: "sm", align: stackAlign, children: [
|
|
1434
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Text, { size: "sm", fw: 700, c: "dimmed", ta: textAlign, children: eyebrow }) : null,
|
|
1435
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Title, { order: 1, maw: 760, ta: textAlign, children: title }),
|
|
1436
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Text, { size: compact ? "md" : "lg", c: "dimmed", maw: 720, ta: textAlign, children: description }) : null
|
|
1377
1437
|
] }),
|
|
1378
|
-
renderedActions.length ? /* @__PURE__ */ (0,
|
|
1438
|
+
renderedActions.length ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Box, { className: classNames?.actions, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1379
1439
|
CtaButtonGroup,
|
|
1380
1440
|
{
|
|
1381
1441
|
primary: renderedActions[0],
|
|
@@ -1383,8 +1443,8 @@ function EditorialHero({
|
|
|
1383
1443
|
tertiary: renderedActions[2]
|
|
1384
1444
|
}
|
|
1385
1445
|
) }) : null,
|
|
1386
|
-
meta.length ? /* @__PURE__ */ (0,
|
|
1387
|
-
|
|
1446
|
+
meta.length ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Group, { gap: "sm", wrap: "wrap", "aria-label": "Supporting details", className: classNames?.meta, children: meta.map((item) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
1447
|
+
import_core23.Group,
|
|
1388
1448
|
{
|
|
1389
1449
|
gap: 6,
|
|
1390
1450
|
px: "sm",
|
|
@@ -1395,17 +1455,17 @@ function EditorialHero({
|
|
|
1395
1455
|
},
|
|
1396
1456
|
children: [
|
|
1397
1457
|
item.icon,
|
|
1398
|
-
/* @__PURE__ */ (0,
|
|
1458
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Text, { size: "sm", c: "dimmed", children: item.label })
|
|
1399
1459
|
]
|
|
1400
1460
|
},
|
|
1401
1461
|
item.id
|
|
1402
1462
|
)) }) : null
|
|
1403
1463
|
] });
|
|
1404
|
-
const mediaSlot = error ? /* @__PURE__ */ (0,
|
|
1405
|
-
const textCol = /* @__PURE__ */ (0,
|
|
1406
|
-
const mediaCol = /* @__PURE__ */ (0,
|
|
1407
|
-
return /* @__PURE__ */ (0,
|
|
1408
|
-
|
|
1464
|
+
const mediaSlot = error ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(AccentPanel, { tone: "red", variant: "soft-outline", title: "Media unavailable", children: error }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MediaFrame, { media, mediaAlt, mediaFade, className: classNames?.media });
|
|
1465
|
+
const textCol = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 1, md: mediaPosition === "left" ? 2 : 1 }, children: textSlot });
|
|
1466
|
+
const mediaCol = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core23.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 2, md: mediaPosition === "left" ? 1 : 2 }, children: mediaSlot });
|
|
1467
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1468
|
+
import_core23.Paper,
|
|
1409
1469
|
{
|
|
1410
1470
|
component: "section",
|
|
1411
1471
|
withBorder: true,
|
|
@@ -1413,7 +1473,7 @@ function EditorialHero({
|
|
|
1413
1473
|
p: compact ? "lg" : "xl",
|
|
1414
1474
|
className: classNames?.root,
|
|
1415
1475
|
style: surfaceVariant === "flat-public" ? { boxShadow: "none" } : void 0,
|
|
1416
|
-
children: /* @__PURE__ */ (0,
|
|
1476
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core23.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
|
|
1417
1477
|
textCol,
|
|
1418
1478
|
mediaCol
|
|
1419
1479
|
] })
|
|
@@ -1422,19 +1482,19 @@ function EditorialHero({
|
|
|
1422
1482
|
}
|
|
1423
1483
|
|
|
1424
1484
|
// src/FeatureBand.tsx
|
|
1425
|
-
var
|
|
1426
|
-
var
|
|
1485
|
+
var import_core24 = require("@mantine/core");
|
|
1486
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1427
1487
|
function FeatureBandSkeleton({
|
|
1428
1488
|
columns = 3,
|
|
1429
1489
|
bordered = true,
|
|
1430
1490
|
variant = "default"
|
|
1431
1491
|
}) {
|
|
1432
|
-
return /* @__PURE__ */ (0,
|
|
1433
|
-
/* @__PURE__ */ (0,
|
|
1434
|
-
/* @__PURE__ */ (0,
|
|
1435
|
-
/* @__PURE__ */ (0,
|
|
1436
|
-
/* @__PURE__ */ (0,
|
|
1437
|
-
/* @__PURE__ */ (0,
|
|
1492
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: Array.from({ length: columns }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Stack, { gap: "md", children: [
|
|
1493
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Skeleton, { height: variant === "process" ? 28 : 42, width: variant === "process" ? 72 : 42, radius: "xl" }),
|
|
1494
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Stack, { gap: "xs", children: [
|
|
1495
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Skeleton, { height: 20, width: "75%", radius: "md" }),
|
|
1496
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Skeleton, { height: 14, width: "100%", radius: "md" }),
|
|
1497
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Skeleton, { height: 14, width: "82%", radius: "md" })
|
|
1438
1498
|
] })
|
|
1439
1499
|
] }) }, index)) });
|
|
1440
1500
|
}
|
|
@@ -1447,10 +1507,10 @@ function FeatureBand({
|
|
|
1447
1507
|
variant = "default"
|
|
1448
1508
|
}) {
|
|
1449
1509
|
if (loading) {
|
|
1450
|
-
return /* @__PURE__ */ (0,
|
|
1510
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(FeatureBandSkeleton, { columns, bordered, variant });
|
|
1451
1511
|
}
|
|
1452
1512
|
if (!items.length) {
|
|
1453
|
-
return emptyState ? /* @__PURE__ */ (0,
|
|
1513
|
+
return emptyState ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: emptyState }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1454
1514
|
EmptyState,
|
|
1455
1515
|
{
|
|
1456
1516
|
title: "No supporting details available",
|
|
@@ -1458,9 +1518,9 @@ function FeatureBand({
|
|
|
1458
1518
|
}
|
|
1459
1519
|
);
|
|
1460
1520
|
}
|
|
1461
|
-
return /* @__PURE__ */ (0,
|
|
1462
|
-
variant === "process" ? /* @__PURE__ */ (0,
|
|
1463
|
-
|
|
1521
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Box, { component: "section", "aria-label": "Supporting features", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Stack, { gap: "md", children: [
|
|
1522
|
+
variant === "process" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1523
|
+
import_core24.Text,
|
|
1464
1524
|
{
|
|
1465
1525
|
fw: 800,
|
|
1466
1526
|
size: "sm",
|
|
@@ -1472,32 +1532,32 @@ function FeatureBand({
|
|
|
1472
1532
|
},
|
|
1473
1533
|
children: item.stepLabel ?? `Step ${index + 1}`
|
|
1474
1534
|
}
|
|
1475
|
-
) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ (0,
|
|
1476
|
-
/* @__PURE__ */ (0,
|
|
1477
|
-
/* @__PURE__ */ (0,
|
|
1478
|
-
item.description ? /* @__PURE__ */ (0,
|
|
1479
|
-
item.meta ? /* @__PURE__ */ (0,
|
|
1535
|
+
) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "violet", children: item.icon }) }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "gray", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(GdsIcons.Info, { size: "1.25rem" }) }) }),
|
|
1536
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core24.Stack, { gap: "xs", children: [
|
|
1537
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Title, { order: 4, children: item.title }),
|
|
1538
|
+
item.description ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Text, { c: "dimmed", children: item.description }) : null,
|
|
1539
|
+
item.meta ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core24.Text, { size: "sm", c: "dimmed", children: item.meta }) : null
|
|
1480
1540
|
] })
|
|
1481
1541
|
] }) }, item.id)) }) });
|
|
1482
1542
|
}
|
|
1483
1543
|
|
|
1484
1544
|
// src/MediaField.tsx
|
|
1485
|
-
var
|
|
1545
|
+
var import_core26 = require("@mantine/core");
|
|
1486
1546
|
|
|
1487
1547
|
// src/FormField.tsx
|
|
1488
|
-
var
|
|
1489
|
-
var
|
|
1548
|
+
var import_core25 = require("@mantine/core");
|
|
1549
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1490
1550
|
function FormField({ label, description, error, children }) {
|
|
1491
|
-
return /* @__PURE__ */ (0,
|
|
1492
|
-
typeof label === "string" ? /* @__PURE__ */ (0,
|
|
1493
|
-
description ? typeof description === "string" ? /* @__PURE__ */ (0,
|
|
1551
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Box, { component: "label", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core25.Stack, { gap: 4, children: [
|
|
1552
|
+
typeof label === "string" ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Text, { size: "xs", fw: 600, c: "dimmed", children: label }) : label,
|
|
1553
|
+
description ? typeof description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Text, { size: "xs", c: "dimmed", children: description }) : description : null,
|
|
1494
1554
|
children,
|
|
1495
|
-
error ? typeof error === "string" ? /* @__PURE__ */ (0,
|
|
1555
|
+
error ? typeof error === "string" ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core25.Text, { size: "xs", c: "red.7", children: error }) : error : null
|
|
1496
1556
|
] }) });
|
|
1497
1557
|
}
|
|
1498
1558
|
|
|
1499
1559
|
// src/MediaField.tsx
|
|
1500
|
-
var
|
|
1560
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1501
1561
|
var stateLabels = {
|
|
1502
1562
|
empty: { label: "Empty", color: "gray" },
|
|
1503
1563
|
selected: { label: "Selected", color: "blue" },
|
|
@@ -1525,32 +1585,32 @@ function MediaField({
|
|
|
1525
1585
|
mode = "stacked"
|
|
1526
1586
|
}) {
|
|
1527
1587
|
const stateBadge = stateLabels[state];
|
|
1528
|
-
const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */ (0,
|
|
1529
|
-
const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */ (0,
|
|
1530
|
-
return /* @__PURE__ */ (0,
|
|
1588
|
+
const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Button, { type: "button", variant: "light", color: "red", onClick: onRemove, children: "Remove" }) : null);
|
|
1589
|
+
const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Button, { type: "button", variant: "default", onClick: onReset, children: "Reset" }) : null);
|
|
1590
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1531
1591
|
FormField,
|
|
1532
1592
|
{
|
|
1533
1593
|
label,
|
|
1534
1594
|
description,
|
|
1535
1595
|
error,
|
|
1536
|
-
children: /* @__PURE__ */ (0,
|
|
1537
|
-
/* @__PURE__ */ (0,
|
|
1538
|
-
/* @__PURE__ */ (0,
|
|
1596
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core26.Stack, { gap: "md", children: [
|
|
1597
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Group, { justify: "flex-end", align: "center", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core26.Group, { gap: "xs", justify: "flex-end", children: [
|
|
1598
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Badge, { variant: "light", color: stateBadge.color, children: stateBadge.label }),
|
|
1539
1599
|
statusAction
|
|
1540
1600
|
] }) }),
|
|
1541
1601
|
preview ? preview : null,
|
|
1542
|
-
uploadControl || urlInput ? /* @__PURE__ */ (0,
|
|
1543
|
-
/* @__PURE__ */ (0,
|
|
1544
|
-
/* @__PURE__ */ (0,
|
|
1602
|
+
uploadControl || urlInput ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
|
|
1603
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Divider, {}),
|
|
1604
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core26.Stack, { gap: "sm", style: mode === "split" ? { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" } : void 0, children: [
|
|
1545
1605
|
uploadControl,
|
|
1546
1606
|
urlInput
|
|
1547
1607
|
] })
|
|
1548
1608
|
] }) : null,
|
|
1549
|
-
value ? /* @__PURE__ */ (0,
|
|
1550
|
-
helpText ? /* @__PURE__ */ (0,
|
|
1551
|
-
policyText ? /* @__PURE__ */ (0,
|
|
1609
|
+
value ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Text, { size: "sm", c: "dimmed", style: { wordBreak: "break-all" }, children: value }) : null,
|
|
1610
|
+
helpText ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Text, { size: "sm", c: "dimmed", children: helpText }) : null,
|
|
1611
|
+
policyText ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core26.Text, { size: "sm", c: error ? "red.7" : "dimmed", children: policyText }) : null,
|
|
1552
1612
|
typeof error !== "string" && error ? error : null,
|
|
1553
|
-
resolvedRemoveAction || resolvedResetAction ? /* @__PURE__ */ (0,
|
|
1613
|
+
resolvedRemoveAction || resolvedResetAction ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core26.Group, { gap: "sm", children: [
|
|
1554
1614
|
resolvedResetAction,
|
|
1555
1615
|
retryAction,
|
|
1556
1616
|
resolvedRemoveAction
|
|
@@ -1561,70 +1621,72 @@ function MediaField({
|
|
|
1561
1621
|
}
|
|
1562
1622
|
|
|
1563
1623
|
// src/MediaCard.tsx
|
|
1564
|
-
var
|
|
1565
|
-
var
|
|
1624
|
+
var import_core27 = require("@mantine/core");
|
|
1625
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1566
1626
|
function MediaCard({ title, image, description, status, overlay, actions = [] }) {
|
|
1567
1627
|
const EyeIcon = GdsIcons.Eye;
|
|
1568
|
-
return /* @__PURE__ */ (0,
|
|
1569
|
-
/* @__PURE__ */ (0,
|
|
1628
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Card, { withBorder: true, radius: "lg", padding: "md", children: [
|
|
1629
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Card.Section, { pos: "relative", children: [
|
|
1570
1630
|
image,
|
|
1571
|
-
overlay ? /* @__PURE__ */ (0,
|
|
1631
|
+
overlay ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { style: { position: "absolute", inset: 12, display: "flex", justifyContent: "flex-end", alignItems: "flex-start" }, children: overlay }) : null
|
|
1572
1632
|
] }),
|
|
1573
|
-
/* @__PURE__ */ (0,
|
|
1574
|
-
/* @__PURE__ */ (0,
|
|
1575
|
-
/* @__PURE__ */ (0,
|
|
1576
|
-
/* @__PURE__ */ (0,
|
|
1577
|
-
description ? /* @__PURE__ */ (0,
|
|
1633
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Stack, { gap: "sm", mt: "md", children: [
|
|
1634
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Group, { justify: "space-between", align: "flex-start", children: [
|
|
1635
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core27.Stack, { gap: 4, children: [
|
|
1636
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Title, { order: 4, children: title }),
|
|
1637
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Text, { size: "sm", c: "dimmed", lineClamp: 2, children: description }) : null
|
|
1578
1638
|
] }),
|
|
1579
|
-
status ? /* @__PURE__ */ (0,
|
|
1639
|
+
status ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Badge, { variant: "light", children: status }) : null
|
|
1580
1640
|
] }),
|
|
1581
|
-
actions.length ? /* @__PURE__ */ (0,
|
|
1641
|
+
actions.length ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.Group, { justify: "flex-end", gap: "xs", children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core27.ActionIcon, { variant: "light", "aria-label": action.label, onClick: action.onClick, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(EyeIcon, { size: "1rem" }) }, action.label)) }) : null
|
|
1582
1642
|
] })
|
|
1583
1643
|
] });
|
|
1584
1644
|
}
|
|
1585
1645
|
|
|
1586
1646
|
// src/AccessSummary.tsx
|
|
1587
|
-
var
|
|
1588
|
-
var
|
|
1647
|
+
var import_core28 = require("@mantine/core");
|
|
1648
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1589
1649
|
function AccessSummary({ title, roles, scope, blocked = false, description }) {
|
|
1590
|
-
return /* @__PURE__ */ (0,
|
|
1591
|
-
/* @__PURE__ */ (0,
|
|
1592
|
-
/* @__PURE__ */ (0,
|
|
1593
|
-
/* @__PURE__ */ (0,
|
|
1650
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Stack, { gap: "sm", children: [
|
|
1651
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Group, { justify: "space-between", align: "center", children: [
|
|
1652
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Title, { order: 4, children: title }),
|
|
1653
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Badge, { color: blocked ? "red" : "teal", variant: "light", children: blocked ? "Blocked" : "Allowed" })
|
|
1594
1654
|
] }),
|
|
1595
|
-
/* @__PURE__ */ (0,
|
|
1596
|
-
scope ? /* @__PURE__ */ (0,
|
|
1655
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Group, { gap: "xs", children: roles.map((role) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Badge, { variant: "outline", children: role }, role)) }),
|
|
1656
|
+
scope ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core28.Text, { size: "sm", c: "dimmed", children: [
|
|
1597
1657
|
"Scope: ",
|
|
1598
1658
|
scope
|
|
1599
1659
|
] }) : null,
|
|
1600
|
-
description ? /* @__PURE__ */ (0,
|
|
1660
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core28.Text, { size: "sm", children: description }) : null
|
|
1601
1661
|
] }) });
|
|
1602
1662
|
}
|
|
1603
1663
|
|
|
1604
1664
|
// src/PageHeader.tsx
|
|
1605
|
-
var
|
|
1606
|
-
var
|
|
1665
|
+
var import_core29 = require("@mantine/core");
|
|
1666
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1607
1667
|
function PageHeader({
|
|
1608
1668
|
title,
|
|
1609
1669
|
description,
|
|
1670
|
+
subtitle,
|
|
1610
1671
|
eyebrow,
|
|
1611
1672
|
actions,
|
|
1612
1673
|
eyebrowVariant = "neutral"
|
|
1613
1674
|
}) {
|
|
1675
|
+
const resolvedDescription = description ?? subtitle;
|
|
1614
1676
|
const eyebrowProps = eyebrowVariant === "ornamental" ? { tt: "uppercase", style: { letterSpacing: "0.12em" } } : {};
|
|
1615
|
-
return /* @__PURE__ */ (0,
|
|
1616
|
-
/* @__PURE__ */ (0,
|
|
1617
|
-
eyebrow && /* @__PURE__ */ (0,
|
|
1618
|
-
/* @__PURE__ */ (0,
|
|
1619
|
-
|
|
1677
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core29.Group, { justify: "space-between", align: "flex-start", gap: "lg", wrap: "wrap", children: [
|
|
1678
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core29.Stack, { gap: "xs", children: [
|
|
1679
|
+
eyebrow && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Text, { size: "xs", fw: 700, c: "dimmed", ...eyebrowProps, children: eyebrow }),
|
|
1680
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Title, { order: 1, children: title }),
|
|
1681
|
+
resolvedDescription && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Text, { c: "dimmed", maw: 720, children: resolvedDescription })
|
|
1620
1682
|
] }),
|
|
1621
|
-
actions ? /* @__PURE__ */ (0,
|
|
1683
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core29.Box, { children: actions }) : null
|
|
1622
1684
|
] });
|
|
1623
1685
|
}
|
|
1624
1686
|
|
|
1625
1687
|
// src/FilterDrawer.tsx
|
|
1626
|
-
var
|
|
1627
|
-
var
|
|
1688
|
+
var import_core30 = require("@mantine/core");
|
|
1689
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1628
1690
|
function FilterDrawer({
|
|
1629
1691
|
opened,
|
|
1630
1692
|
onClose,
|
|
@@ -1640,8 +1702,8 @@ function FilterDrawer({
|
|
|
1640
1702
|
}) {
|
|
1641
1703
|
const resolvedPrimaryAction = applyAction ?? primaryAction;
|
|
1642
1704
|
const resolvedSecondaryAction = resetAction ?? secondaryAction;
|
|
1643
|
-
return /* @__PURE__ */ (0,
|
|
1644
|
-
|
|
1705
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1706
|
+
import_core30.Drawer,
|
|
1645
1707
|
{
|
|
1646
1708
|
opened,
|
|
1647
1709
|
onClose,
|
|
@@ -1649,11 +1711,11 @@ function FilterDrawer({
|
|
|
1649
1711
|
position: mode === "bottom-sheet" ? "bottom" : "right",
|
|
1650
1712
|
size: mode === "bottom-sheet" ? "auto" : "md",
|
|
1651
1713
|
radius: mode === "bottom-sheet" ? "xl" : void 0,
|
|
1652
|
-
children: /* @__PURE__ */ (0,
|
|
1653
|
-
description ? /* @__PURE__ */ (0,
|
|
1714
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core30.Stack, { gap: "md", children: [
|
|
1715
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core30.Text, { size: "sm", c: "dimmed", children: description }) : null,
|
|
1654
1716
|
children,
|
|
1655
|
-
resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ (0,
|
|
1656
|
-
/* @__PURE__ */ (0,
|
|
1717
|
+
resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core30.Group, { justify: "space-between", mt: "md", children: [
|
|
1718
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core30.Group, { gap: "sm", children: [
|
|
1657
1719
|
closeAction,
|
|
1658
1720
|
resolvedSecondaryAction
|
|
1659
1721
|
] }),
|
|
@@ -1665,8 +1727,8 @@ function FilterDrawer({
|
|
|
1665
1727
|
}
|
|
1666
1728
|
|
|
1667
1729
|
// src/PlaceholderPanel.tsx
|
|
1668
|
-
var
|
|
1669
|
-
var
|
|
1730
|
+
var import_core31 = require("@mantine/core");
|
|
1731
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1670
1732
|
function PlaceholderPanel({
|
|
1671
1733
|
title,
|
|
1672
1734
|
description,
|
|
@@ -1676,16 +1738,16 @@ function PlaceholderPanel({
|
|
|
1676
1738
|
mode
|
|
1677
1739
|
}) {
|
|
1678
1740
|
if (mode === "live" && children) {
|
|
1679
|
-
return /* @__PURE__ */ (0,
|
|
1741
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children });
|
|
1680
1742
|
}
|
|
1681
|
-
return /* @__PURE__ */ (0,
|
|
1682
|
-
badge ? /* @__PURE__ */ (0,
|
|
1683
|
-
/* @__PURE__ */ (0,
|
|
1684
|
-
/* @__PURE__ */ (0,
|
|
1685
|
-
/* @__PURE__ */ (0,
|
|
1743
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Card, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core31.Stack, { gap: "md", children: [
|
|
1744
|
+
badge ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Badge, { variant: "light", color: "blue", w: "fit-content", children: badge }) : null,
|
|
1745
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core31.Stack, { gap: "xs", children: [
|
|
1746
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Title, { order: 4, children: title }),
|
|
1747
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Text, { c: "dimmed", children: description })
|
|
1686
1748
|
] }),
|
|
1687
|
-
footer ? /* @__PURE__ */ (0,
|
|
1688
|
-
/* @__PURE__ */ (0,
|
|
1749
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_core31.Text, { size: "sm", children: footer }) : null,
|
|
1750
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1689
1751
|
StateBlock,
|
|
1690
1752
|
{
|
|
1691
1753
|
variant: "not-enough-data",
|
|
@@ -1698,8 +1760,8 @@ function PlaceholderPanel({
|
|
|
1698
1760
|
}
|
|
1699
1761
|
|
|
1700
1762
|
// src/SimpleDataTable.tsx
|
|
1701
|
-
var
|
|
1702
|
-
var
|
|
1763
|
+
var import_core32 = require("@mantine/core");
|
|
1764
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1703
1765
|
function SimpleDataTable({
|
|
1704
1766
|
columns,
|
|
1705
1767
|
rows,
|
|
@@ -1710,23 +1772,23 @@ function SimpleDataTable({
|
|
|
1710
1772
|
getRowKey
|
|
1711
1773
|
}) {
|
|
1712
1774
|
if (error) {
|
|
1713
|
-
return /* @__PURE__ */ (0,
|
|
1775
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(StateBlock, { variant: "error", title: "Unable to load data", description: error, compact: true });
|
|
1714
1776
|
}
|
|
1715
1777
|
if (loading) {
|
|
1716
|
-
return /* @__PURE__ */ (0,
|
|
1778
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(StateBlock, { variant: "loading", title: "Loading data", description: "Please wait while the shared dataset is prepared.", compact: true });
|
|
1717
1779
|
}
|
|
1718
1780
|
if (!rows.length) {
|
|
1719
|
-
return /* @__PURE__ */ (0,
|
|
1781
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, compact: true });
|
|
1720
1782
|
}
|
|
1721
|
-
return /* @__PURE__ */ (0,
|
|
1722
|
-
/* @__PURE__ */ (0,
|
|
1723
|
-
/* @__PURE__ */ (0,
|
|
1783
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.ScrollArea, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core32.Table, { striped: true, highlightOnHover: true, withTableBorder: true, withColumnBorders: true, children: [
|
|
1784
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Table.Thead, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Table.Th, { children: column.header }, String(column.key))) }) }),
|
|
1785
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Table.Tbody, { children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core32.Table.Td, { children: column.render ? column.render(row) : String(row[column.key] ?? "") }, String(column.key))) }, getRowKey ? getRowKey(row, index) : index)) })
|
|
1724
1786
|
] }) });
|
|
1725
1787
|
}
|
|
1726
1788
|
|
|
1727
1789
|
// src/StatsSection.tsx
|
|
1728
|
-
var
|
|
1729
|
-
var
|
|
1790
|
+
var import_core33 = require("@mantine/core");
|
|
1791
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1730
1792
|
function StatsSection({
|
|
1731
1793
|
title,
|
|
1732
1794
|
loading = false,
|
|
@@ -1738,11 +1800,11 @@ function StatsSection({
|
|
|
1738
1800
|
}) {
|
|
1739
1801
|
let content = children;
|
|
1740
1802
|
if (error) {
|
|
1741
|
-
content = /* @__PURE__ */ (0,
|
|
1803
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StateBlock, { variant: "error", title: "Unable to load statistics", description: error, compact: true });
|
|
1742
1804
|
} else if (loading) {
|
|
1743
|
-
content = /* @__PURE__ */ (0,
|
|
1805
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StateBlock, { variant: "loading", title: "Loading statistics", description: "This shared data surface is still synchronizing.", compact: true });
|
|
1744
1806
|
} else if (belowThreshold) {
|
|
1745
|
-
content = /* @__PURE__ */ (0,
|
|
1807
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1746
1808
|
StateBlock,
|
|
1747
1809
|
{
|
|
1748
1810
|
variant: "not-enough-data",
|
|
@@ -1752,10 +1814,10 @@ function StatsSection({
|
|
|
1752
1814
|
}
|
|
1753
1815
|
);
|
|
1754
1816
|
} else if (placeholder) {
|
|
1755
|
-
content = /* @__PURE__ */ (0,
|
|
1817
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PlaceholderPanel, { ...placeholder, mode: "placeholder" });
|
|
1756
1818
|
}
|
|
1757
|
-
return /* @__PURE__ */ (0,
|
|
1758
|
-
/* @__PURE__ */ (0,
|
|
1819
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core33.Stack, { gap: "md", children: [
|
|
1820
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core33.Title, { order: 3, children: title }),
|
|
1759
1821
|
content
|
|
1760
1822
|
] });
|
|
1761
1823
|
}
|
|
@@ -3069,6 +3131,7 @@ function getGdsMessages(locale) {
|
|
|
3069
3131
|
ArticleShell,
|
|
3070
3132
|
AuthShell,
|
|
3071
3133
|
BrowseSurface,
|
|
3134
|
+
ChoiceChip,
|
|
3072
3135
|
ConsumerDashboardGrid,
|
|
3073
3136
|
ConsumerSection,
|
|
3074
3137
|
CtaButtonGroup,
|
|
@@ -3106,6 +3169,8 @@ function getGdsMessages(locale) {
|
|
|
3106
3169
|
fr,
|
|
3107
3170
|
gdsLocales,
|
|
3108
3171
|
getGdsMessages,
|
|
3172
|
+
getSemanticActionConfig,
|
|
3173
|
+
getSemanticActionLabel,
|
|
3109
3174
|
he,
|
|
3110
3175
|
hu,
|
|
3111
3176
|
it,
|