executable-stories-react 0.12.0 → 0.14.0
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/index.cjs +73 -52
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +73 -52
- package/dist/index.js.map +1 -1
- package/dist/interactive.cjs +737 -260
- package/dist/interactive.cjs.map +1 -1
- package/dist/interactive.d.cts +3 -1
- package/dist/interactive.d.ts +3 -1
- package/dist/interactive.js +698 -215
- package/dist/interactive.js.map +1 -1
- package/dist/report-island.global.js +65 -54
- package/dist/ssr.cjs +74 -53
- package/dist/ssr.cjs.map +1 -1
- package/dist/ssr.js +74 -53
- package/dist/ssr.js.map +1 -1
- package/dist/styles.css +1 -3
- package/dist/tailwind.css +2 -2
- package/package.json +24 -23
package/dist/index.cjs
CHANGED
|
@@ -433,7 +433,7 @@ function formatValue(value) {
|
|
|
433
433
|
function DocKv({ entry }) {
|
|
434
434
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("dl", { className: "my-2 flex flex-wrap items-baseline gap-x-2 text-sm", children: [
|
|
435
435
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dt", { className: "font-semibold text-muted-foreground", children: entry.label }),
|
|
436
|
-
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dd", { className: "font-mono text-foreground", children: formatValue(entry.value) })
|
|
436
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("dd", { className: "min-w-0 break-words font-mono text-foreground", children: formatValue(entry.value) })
|
|
437
437
|
] });
|
|
438
438
|
}
|
|
439
439
|
|
|
@@ -641,7 +641,7 @@ function DocHtml({ entry }) {
|
|
|
641
641
|
loading: "lazy",
|
|
642
642
|
title,
|
|
643
643
|
className: "block w-full border-0",
|
|
644
|
-
style: { height }
|
|
644
|
+
style: { height, colorScheme: "light", background: "#fff" }
|
|
645
645
|
}
|
|
646
646
|
)
|
|
647
647
|
] });
|
|
@@ -1403,57 +1403,68 @@ function ReportScenario({ scenario, hideTitle = false }) {
|
|
|
1403
1403
|
className: "gap-0 py-0",
|
|
1404
1404
|
children: [
|
|
1405
1405
|
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(CardHeader, { className: "px-4 py-3", children: [
|
|
1406
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
}
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
|
|
1445
|
-
|
|
1446
|
-
|
|
1447
|
-
|
|
1448
|
-
|
|
1449
|
-
|
|
1406
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
1407
|
+
"div",
|
|
1408
|
+
{
|
|
1409
|
+
className: cn(
|
|
1410
|
+
// Wraps rather than squeezing: on a phone the status/duration group
|
|
1411
|
+
// is ~160px, which leaves a title column a few characters wide.
|
|
1412
|
+
"flex flex-wrap items-start gap-x-4 gap-y-1",
|
|
1413
|
+
hideTitle ? "justify-end" : "justify-between"
|
|
1414
|
+
),
|
|
1415
|
+
children: [
|
|
1416
|
+
hideTitle ? null : /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("h3", { id: titleId, className: "flex min-w-0 flex-1 basis-48 items-center gap-2 text-sm font-medium text-foreground", children: [
|
|
1417
|
+
collapsible ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1418
|
+
"button",
|
|
1419
|
+
{
|
|
1420
|
+
type: "button",
|
|
1421
|
+
onClick: () => collapse.toggle(scenario.id),
|
|
1422
|
+
"aria-expanded": !collapsed,
|
|
1423
|
+
"aria-controls": bodyId,
|
|
1424
|
+
"aria-label": `Toggle ${scenario.title}`,
|
|
1425
|
+
className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground",
|
|
1426
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { "aria-hidden": true, className: cn("inline-block text-xs transition-transform", !collapsed && "rotate-90"), children: "\u25B8" })
|
|
1427
|
+
}
|
|
1428
|
+
) : null,
|
|
1429
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { "aria-hidden": true, className: cn("text-sm leading-none", meta.glyphColor), children: meta.glyph }),
|
|
1430
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { children: scenario.title })
|
|
1431
|
+
] }),
|
|
1432
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex shrink-0 items-center gap-2", children: [
|
|
1433
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ScenarioRunHistory, { scenarioId: scenario.id }),
|
|
1434
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ScenarioStaleness, { scenario }),
|
|
1435
|
+
scenario.durationMs > 0 ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "whitespace-nowrap font-mono text-[0.6875rem] text-muted-foreground", children: (0, import_duration3.formatDuration)(scenario.durationMs) }) : null,
|
|
1436
|
+
meta.showPill ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: meta.badgeVariant, "aria-label": `Status: ${label}`, children: label }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "sr-only", children: `Status: ${label}` }),
|
|
1437
|
+
actions ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(DropdownMenu, { children: [
|
|
1438
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1439
|
+
DropdownMenuTrigger,
|
|
1440
|
+
{
|
|
1441
|
+
"aria-label": `Actions for ${scenario.title}`,
|
|
1442
|
+
className: "cursor-pointer rounded p-1 text-muted-foreground hover:bg-muted hover:text-foreground [&_svg]:size-4",
|
|
1443
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react2.MoreHorizontalIcon, { "aria-hidden": true })
|
|
1444
|
+
}
|
|
1445
|
+
),
|
|
1446
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(DropdownMenuContent, { align: "end", children: [
|
|
1447
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(DropdownMenuItem, { onClick: () => actions.copyLink(scenario), children: [
|
|
1448
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react2.LinkIcon, {}),
|
|
1449
|
+
" Copy link"
|
|
1450
|
+
] }),
|
|
1451
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(DropdownMenuItem, { onClick: () => actions.copyMarkdown(scenario), children: [
|
|
1452
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react2.FileTextIcon, {}),
|
|
1453
|
+
" Copy as Markdown"
|
|
1454
|
+
] }),
|
|
1455
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(DropdownMenuItem, { onClick: () => actions.copyPrompt(scenario), children: [
|
|
1456
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react2.SparklesIcon, {}),
|
|
1457
|
+
" Explain with AI"
|
|
1458
|
+
] })
|
|
1459
|
+
] })
|
|
1460
|
+
] }) : null
|
|
1450
1461
|
] })
|
|
1451
|
-
]
|
|
1452
|
-
|
|
1453
|
-
|
|
1462
|
+
]
|
|
1463
|
+
}
|
|
1464
|
+
),
|
|
1454
1465
|
scenario.tags.length > 0 || (scenario.tickets?.length ?? 0) > 0 ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("ul", { "aria-label": "Tags and tickets", className: "flex flex-wrap gap-1.5", children: [
|
|
1455
1466
|
scenario.tags.map((t) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: "tag", children: t }) }, `tag-${t}`)),
|
|
1456
|
-
(scenario.tickets ?? []).map((ticket) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("li", { children: ticket.url ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("a", { href: ticket.url, target: "_blank", rel: "noreferrer noopener", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: "outline", children: ticket.id }) }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: "outline", children: ticket.id }) }, `ticket-${ticket.id}`))
|
|
1467
|
+
(scenario.tickets ?? []).map((ticket) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("li", { children: ticket.url ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("a", { href: ticket.url, target: "_blank", rel: "noreferrer noopener", className: "inline-flex min-h-6 items-center", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: "outline", children: ticket.id }) }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Badge, { variant: "outline", children: ticket.id }) }, `ticket-${ticket.id}`))
|
|
1457
1468
|
] }) : null
|
|
1458
1469
|
] }),
|
|
1459
1470
|
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(CardContent, { id: bodyId, hidden: collapsed, className: "px-4 pt-0 pb-4", children: [
|
|
@@ -1719,6 +1730,7 @@ function ReportSummaryView({ summary, className, ariaLabel }) {
|
|
|
1719
1730
|
|
|
1720
1731
|
// src/components/ReportMeta.tsx
|
|
1721
1732
|
var import_duration4 = require("executable-stories-core/utils/duration");
|
|
1733
|
+
var import_report_queries = require("executable-stories-core/report-queries");
|
|
1722
1734
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1723
1735
|
function ReportMeta() {
|
|
1724
1736
|
const report = useReport();
|
|
@@ -1762,7 +1774,9 @@ function ReportMeta() {
|
|
|
1762
1774
|
value: url ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("a", { href: url, target: "_blank", rel: "noreferrer noopener", className: linkClass, children: label }) : label
|
|
1763
1775
|
});
|
|
1764
1776
|
}
|
|
1765
|
-
|
|
1777
|
+
const slowest = (0, import_report_queries.slowestScenarios)(report, 5);
|
|
1778
|
+
const showSlowest = slowest.length >= 3;
|
|
1779
|
+
if (items.length === 0 && !showSlowest) return null;
|
|
1766
1780
|
return (
|
|
1767
1781
|
// Run metadata is useful but secondary to "what failed" — tuck it into a
|
|
1768
1782
|
// collapsed disclosure so it doesn't push the result down. Native <details>
|
|
@@ -1775,7 +1789,14 @@ function ReportMeta() {
|
|
|
1775
1789
|
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dl", { className: "flex flex-wrap gap-x-5 gap-y-2 border-t border-border px-4 py-3 text-muted-foreground", "aria-label": "Run metadata", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-baseline gap-1.5", children: [
|
|
1776
1790
|
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dt", { className: "font-medium", children: item.label }),
|
|
1777
1791
|
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dd", { className: "font-mono text-foreground", children: item.value })
|
|
1778
|
-
] }, item.label)) })
|
|
1792
|
+
] }, item.label)) }),
|
|
1793
|
+
showSlowest ? /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "border-t border-border px-4 py-3", children: [
|
|
1794
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "mb-1.5 font-medium text-muted-foreground", children: "Slowest scenarios" }),
|
|
1795
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("ol", { className: "flex flex-col gap-1", "aria-label": "Slowest scenarios", children: slowest.map((s) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("li", { className: "flex items-baseline justify-between gap-4", children: [
|
|
1796
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("a", { href: `#${s.id}`, className: "min-w-0 text-primary underline underline-offset-2", children: s.title }),
|
|
1797
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "shrink-0 font-mono tabular-nums text-muted-foreground", children: (0, import_duration4.formatDuration)(s.durationMs) })
|
|
1798
|
+
] }, s.id)) })
|
|
1799
|
+
] }) : null
|
|
1779
1800
|
] })
|
|
1780
1801
|
);
|
|
1781
1802
|
}
|