@inversifyjs/http-insights-ui 0.2.0 → 0.3.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.
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#070b12;--glow:#0072bd47;--surface:#0e1622eb;--surface-solid:#101826;--line:#a8c6e224;--line-strong:#a8c6e24d;--grid:#a8c6e20b;--text:#e7eef6;--muted:#8ea3b8;--faint:#6d8296;--accent:#2b93e0;--accent-strong:#1478c4;--on-accent:#f5faff;--hover:#92bee412;--shadow:0 20px 50px #00000047;--switch:#a8c6e214;--switch-active:#1a2738;--overlay:#04080e9e;--font:"IBM Plex Sans", "Segoe UI", sans-serif;--display:Outfit, "IBM Plex Sans", sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#eef3f8;--glow:#0072bd2e;--surface:#fffffff0;--surface-solid:#fff;--line:#102a481a;--line-strong:#102a482e;--grid:#102a480b;--text:#102033;--muted:#5b7084;--faint:#7a8ea2;--accent:#0072bd;--accent-strong:#005f9e;--on-accent:#fff;--hover:#0072bd0f;--shadow:0 16px 40px #16304e14;--switch:#102a480d;--switch-active:#fff;--overlay:#10203359}*{box-sizing:border-box}[hidden]{display:none!important}html,body{min-height:100%;margin:0}body{font-family:var(--font);color:var(--text);background-color:var(--bg);background-image:radial-gradient(880px 380px at 50% -140px, var(--glow), transparent 70%), linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background-position:top;background-size:auto,64px 64px,64px 64px}::selection{background:color-mix(in srgb, var(--accent) 32%, transparent)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.topbar{z-index:2;border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--bg) 82%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:sticky;top:0}.topbar-inner{justify-content:space-between;align-items:center;width:min(920px,100% - 48px);height:64px;margin:0 auto;display:flex}.brand{align-items:center;gap:10px;min-width:0;display:flex}.mark{border-radius:7px;flex:none;width:28px;height:28px;display:block}.brand-name{font-family:var(--display);letter-spacing:-.03em;font-size:15px;font-weight:600}.theme-switch{border:1px solid var(--line);background:var(--switch);border-radius:999px;padding:3px;display:flex}.theme-switch button{color:var(--muted);font:500 12px/1 var(--font);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;border-radius:999px;padding:8px 12px}.theme-switch button[aria-pressed=true]{background:var(--switch-active);color:var(--text);box-shadow:0 1px 2px #00000029}.page{width:min(920px,100% - 48px);margin:0 auto;padding:44px 0 88px}.page.page-detail{width:min(1080px,100% - 48px)}h1{font-family:var(--display);letter-spacing:-.04em;margin:0;font-size:32px;font-weight:600;line-height:1.1}.lede{color:var(--muted);margin:8px 0 0;font-size:15px}.search{border:1px solid var(--line-strong);background:var(--surface-solid);height:52px;box-shadow:var(--shadow);border-radius:12px;align-items:center;gap:6px;margin-top:24px;padding:0 6px 0 16px;display:flex}.search:has(input:focus){border-color:color-mix(in srgb, var(--accent) 75%, var(--line-strong));box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 20%, transparent), var(--shadow)}.search input{min-width:0;color:var(--text);font:15px/1.4 var(--mono);background:0 0;border:0;outline:0;flex:1}.search input::placeholder{color:var(--faint);font-family:var(--font)}.search input::-webkit-search-cancel-button{appearance:none}.search input:-webkit-autofill{-webkit-text-fill-color:var(--text);box-shadow:0 0 0 1000px var(--surface-solid) inset}.clear,.submit{cursor:pointer;border:0;flex:none;place-items:center;display:grid}.clear{width:32px;height:32px;color:var(--muted);background:0 0;border-radius:999px}.clear:hover{background:var(--hover);color:var(--text)}.clear svg,.submit svg{width:16px;height:16px}.submit{background:var(--accent);width:40px;height:40px;color:var(--on-accent);border-radius:9px}.submit:hover{background:var(--accent-strong)}.filters-button,.modal-close,.filter-chip button,.method-option{color:var(--muted);cursor:pointer;background:0 0;border:0;flex:none;place-items:center;display:grid}.filters-button{width:40px;height:40px;color:var(--text);border-radius:9px}.filters-button:hover,.filters-button[aria-expanded=true]{background:var(--hover)}.filters-button.is-active{color:var(--accent)}.theme-switch button:focus-visible,.clear:focus-visible,.submit:focus-visible,.filters-button:focus-visible,.modal-close:focus-visible,.filter-chip button:focus-visible,.method-option:focus-visible,.error-trace-copy:focus-visible,.status-filter input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.filter-chips{flex-wrap:wrap;gap:8px;margin:12px 0 0;padding:0;list-style:none;display:flex}.filter-chip{border:1px solid var(--line-strong);background:var(--surface-solid);height:30px;color:var(--text);border-radius:999px;align-items:center;gap:4px;padding:0 4px 0 12px;font-size:13px;display:inline-flex}.filter-chip button{border-radius:999px;width:22px;height:22px}.filter-chip button:hover,.modal-close:hover{background:var(--hover);color:var(--text)}body:has(.modal-backdrop){overflow:hidden}.modal-backdrop{z-index:30;background:var(--overlay);place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal{border:1px solid var(--line-strong);background:var(--surface-solid);width:min(440px,100%);max-height:min(640px,100%);box-shadow:var(--shadow);color:var(--text);border-radius:16px;padding:20px 20px 24px;overflow:auto}.modal:focus{outline:none}.modal-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;display:flex}.modal h2{font-family:var(--display);letter-spacing:-.03em;margin:0;font-size:18px;font-weight:600}.modal-close{border-radius:999px;width:32px;height:32px}.modal-actions{justify-content:flex-end;margin-top:22px;display:flex}.modal-apply{background:var(--accent);color:var(--on-accent);cursor:pointer;font:500 13px/1 var(--font);border:0;border-radius:9px;height:36px;padding:0 14px}.modal-apply:hover{background:var(--accent-strong)}.modal-apply:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.method-filter{border:0;margin:0;padding:0}.method-filter legend,.status-filter label{color:var(--muted);margin-bottom:10px;padding:0;font-size:13px;display:block}.method-options{flex-wrap:wrap;gap:8px;display:flex}.method-option{border-radius:8px;padding:2px}.method-option[aria-pressed=true]{outline:2px solid var(--text);outline-offset:1px}.status-filter{margin-top:20px}.status-filter input{border:1px solid var(--line-strong);background:var(--bg);width:100%;height:42px;color:var(--text);font:14px/1.4 var(--font);border-radius:10px;padding:0 12px}.status-filter input::placeholder{color:var(--faint)}.status-options{border:1px solid var(--line);background:var(--bg);border-radius:10px;max-height:220px;margin:8px 0 0;padding:4px;list-style:none;overflow:auto}.status-options [role=option]{cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:8px 10px;font-size:14px;display:flex}.status-options [role=option][data-active=true]{background:var(--hover)}.status-code{min-width:3ch;font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:600}.status-empty{color:var(--muted);padding:8px 10px;font-size:13px}.meta{color:var(--muted);letter-spacing:.01em;margin:16px 2px 10px;font-size:13px}.panel{border:1px solid var(--line);background:var(--surface);box-shadow:inset 0 1px 0 #ffffff0a, var(--shadow);border-radius:14px;overflow:hidden}.calls{border-collapse:collapse;table-layout:fixed;width:100%}.calls th,.calls td{text-align:left;vertical-align:middle;padding:0 16px}.calls th:first-child,.calls td:first-child{width:7.5rem;padding-left:14px}.calls th:nth-child(3),.calls td:nth-child(3){width:15.5rem;overflow:hidden}.calls td:nth-child(3) .status-pill{text-overflow:ellipsis;vertical-align:middle;max-width:100%;line-height:26px;display:inline-block;overflow:hidden}.calls th:last-child,.calls td:last-child{text-align:right;width:8.75rem;padding-right:18px}.calls th{border-bottom:1px solid var(--line);height:42px;color:var(--faint);letter-spacing:.08em;text-transform:uppercase;font-size:11px;font-weight:500}.calls td{border-top:1px solid var(--line);height:56px}.calls tbody tr:first-child td{border-top:0}.calls tbody tr:hover td{background:var(--hover)}.call-row{cursor:pointer}.call-link{color:inherit;text-decoration:none}.call-link:focus-visible,.back-link:focus-visible,.section-menu button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.method{color:#fff;width:5.6rem;height:26px;font-family:var(--mono);letter-spacing:.04em;border-radius:6px;justify-content:center;align-items:center;font-size:11px;font-weight:600;display:inline-flex}.method[data-method=GET]{background:#4c9eeb}.method[data-method=POST]{background:#1f9a62}.method[data-method=PUT]{color:#2a1c04;background:#f5a524}.method[data-method=DELETE]{background:#e24b4b}.method[data-method=PATCH]{color:#04241e;background:#2fbfa8}.method[data-method=HEAD]{background:#8b5cf6}.method[data-method=OPTIONS]{background:#3d6ea8}.method[data-method=OTHER]{background:#607080}.url{color:var(--text);font-family:var(--mono);letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.duration{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap;font-size:13px}.duration-value{color:var(--text);font-weight:500}.duration-unit{color:var(--muted)}.empty{border:1px dashed var(--line-strong);color:var(--muted);text-align:center;border-radius:14px;margin:16px 0 0;padding:56px 20px}.sentinel{height:1px}.status{color:var(--muted);text-align:center;margin:16px 0 0}.text-button{background:var(--accent);color:var(--on-accent);cursor:pointer;font:500 13px/1 var(--font);border:0;border-radius:9px;margin-top:14px;padding:10px 14px}.text-button:hover{background:var(--accent-strong)}.text-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.back-link{color:var(--muted);align-items:center;gap:6px;font-size:13px;text-decoration:none;display:inline-flex}.back-link:hover{color:var(--text)}.call-summary{align-items:center;gap:12px;margin-top:18px;display:flex}.call-summary h1{min-width:0;font-family:var(--mono);letter-spacing:-.02em;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:22px;font-weight:500;overflow:hidden}.call-summary .status-pill,.call-summary .duration{flex:none}.status-pill{color:#fff;height:26px;font-family:var(--mono);letter-spacing:.02em;white-space:nowrap;border-radius:6px;align-items:center;padding:0 10px;font-size:12px;font-weight:600;display:inline-flex}.status-pill[data-class="1"],.status-pill[data-class=other]{background:#607080}.status-pill[data-class="2"]{background:#1f9a62}.status-pill[data-class="3"]{background:#4c9eeb}.status-pill[data-class="4"]{color:#2a1c04;background:#f5a524}.status-pill[data-class="5"]{background:#e24b4b}.call-layout{grid-template-columns:196px minmax(0,1fr);align-items:start;gap:16px;margin-top:22px;display:grid}.section-menu{border:1px solid var(--line);background:var(--surface);border-radius:14px;flex-direction:column;gap:4px;padding:8px;display:flex;position:sticky;top:80px}.section-menu button{color:var(--muted);cursor:pointer;font:500 14px/1.2 var(--font);text-align:left;background:0 0;border:0;border-radius:9px;padding:10px 12px}.section-menu button:hover:not(:disabled){background:var(--hover);color:var(--text)}.section-menu button[aria-selected=true]{background:color-mix(in srgb, var(--accent) 16%, transparent);box-shadow:inset 2px 0 0 var(--accent);color:var(--text)}.section-menu button:disabled{color:var(--faint);cursor:not-allowed;opacity:.5}.detail-panel{padding:20px 22px 24px}.waterfall{min-width:0}.timeline-swatch{border-radius:999px;flex:none;width:8px;height:8px}.waterfall-plot{min-width:0;position:relative}.waterfall-plot canvas{cursor:crosshair;width:100%;display:block}.timeline-tooltip{z-index:1;border:1px solid var(--line-strong);background:var(--surface-solid);max-width:240px;box-shadow:var(--shadow);pointer-events:none;border-radius:8px;padding:8px 10px;position:absolute}.timeline-tooltip p{margin:0;font-size:12px}.timeline-tooltip p+p{color:var(--muted);margin-top:4px}.timeline-legend{flex-wrap:wrap;gap:8px 14px;margin:12px 0 0;padding:0;list-style:none;display:flex}.timeline-legend li{color:var(--muted);align-items:center;gap:6px;font-size:12px;display:inline-flex}.detail-panel h2{font-family:var(--display);letter-spacing:-.03em;margin:0 0 16px;font-size:18px;font-weight:600}.detail-panel h3{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:22px 0 10px;font-size:12px;font-weight:600}.facts{grid-template-columns:120px minmax(0,1fr);gap:10px 16px;margin:0;display:grid}.facts dt{color:var(--faint);letter-spacing:.08em;text-transform:uppercase;font-size:11px;font-weight:500}.facts dd{overflow-wrap:anywhere;min-width:0;font-family:var(--mono);margin:0;font-size:13px}.headers{border-collapse:collapse;width:100%}.headers th,.headers td{border-top:1px solid var(--line);text-align:left;vertical-align:top;padding:9px 0}.headers tr:first-child th,.headers tr:first-child td{border-top:0}.headers th{width:38%;color:var(--faint);font-family:var(--mono);padding-right:16px;font-size:12px;font-weight:500}.headers td{overflow-wrap:anywhere;font-family:var(--mono);font-size:13px}.detail-empty{color:var(--muted);margin:0;font-size:14px}.stage-list{flex-direction:column;display:flex}.stage{border-top:1px solid var(--line);padding:14px 0}.stage:first-child{border-top:0;padding-top:0}.stage-title{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.stage-name{font-family:var(--mono);margin:0;font-size:14px;font-weight:500}.stage-meta{flex-wrap:wrap;gap:8px;margin:8px 0 0;display:flex}.stage-meta span{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:12px}.outcome[data-outcome=allowed]{color:#1f9a62}.outcome[data-outcome=denied]{color:#e24b4b}.outcome[data-outcome=unknown]{color:var(--muted)}.stage-time{color:var(--faint);font-family:var(--mono);margin:8px 0 0;font-size:12px}.error-block{color:var(--text);font-family:var(--mono);white-space:pre-wrap;background:#e24b4b24;border-radius:8px;margin:10px 0 0;padding:10px 12px;font-size:12px;overflow:auto}.error-report{margin-top:10px}.error-message{color:#e24b4b;font-family:var(--mono);margin:0;font-size:12px;font-weight:500}.error-traces{flex-direction:column;gap:8px;margin:8px 0 0;padding:0;list-style:none;display:flex}.error-trace{border:1px solid var(--line);background:color-mix(in srgb, var(--surface-solid) 88%, transparent);border-radius:8px;overflow:hidden}.error-trace-location{border-bottom:1px solid var(--line);font-family:var(--mono);flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:8px 12px;font-size:12px;display:flex}.error-trace-index{color:var(--faint)}.error-trace-function{color:var(--text);font-weight:500}.error-trace-location-file{align-items:center;gap:4px;min-width:0;display:inline-flex}.error-trace-place{color:var(--muted)}.error-trace-copy{width:22px;height:22px;color:var(--faint);cursor:pointer;background:0 0;border:0;border-radius:6px;flex:none;place-items:center;margin:0;padding:0;display:inline-grid}.error-trace-copy:hover{background:var(--hover);color:var(--text)}.error-trace-copy.is-copied{color:var(--accent)}.error-trace-code{font-family:var(--mono);margin:0;padding:8px 0;font-size:12px;line-height:1.55;overflow:auto}.error-trace-statement{color:var(--muted);white-space:pre;padding:1px 12px;display:block}.error-trace-statement.is-current{color:var(--text);background:#e24b4b2e;box-shadow:inset 2px 0 #e24b4b}@media (width<=640px){.topbar-inner,.page,.page.page-detail{width:min(1080px,100% - 32px)}.page{padding-top:32px}h1{font-size:28px}.calls th:first-child,.calls td:first-child{width:6.4rem;padding-left:10px;padding-right:8px}.method{width:4.9rem;font-size:10px}.calls .status-reason{display:none}.calls th:nth-child(3),.calls td:nth-child(3){width:4.75rem;padding-left:8px;padding-right:8px}.calls th:last-child,.calls td:last-child{width:6.5rem;padding-right:12px}.call-summary{flex-wrap:wrap}.call-summary h1{flex-basis:100%;order:1;font-size:16px}.call-layout{grid-template-columns:1fr}.section-menu{flex-direction:row;position:static;overflow-x:auto}.section-menu button{flex:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
|
package/dist/index.html
CHANGED
|
@@ -40,8 +40,8 @@
|
|
|
40
40
|
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&family=Outfit:wght@500;600&display=swap"
|
|
41
41
|
rel="stylesheet"
|
|
42
42
|
/>
|
|
43
|
-
<script type="module" crossorigin src="/.inversify/http-insights-ui/assets/index-
|
|
44
|
-
<link rel="stylesheet" crossorigin href="/.inversify/http-insights-ui/assets/index-
|
|
43
|
+
<script type="module" crossorigin src="/.inversify/http-insights-ui/assets/index-AW6PJHc7.js"></script>
|
|
44
|
+
<link rel="stylesheet" crossorigin href="/.inversify/http-insights-ui/assets/index-CilfjRp-.css">
|
|
45
45
|
</head>
|
|
46
46
|
<body>
|
|
47
47
|
<div id="root"></div>
|
package/package.json
CHANGED
|
@@ -42,30 +42,30 @@
|
|
|
42
42
|
"url": "git+https://github.com/inversify/monorepo.git"
|
|
43
43
|
},
|
|
44
44
|
"type": "module",
|
|
45
|
-
"version": "0.
|
|
45
|
+
"version": "0.3.0",
|
|
46
46
|
"devDependencies": {
|
|
47
47
|
"@eslint/js": "10.0.1",
|
|
48
48
|
"@inversifyjs/foundation-eslint-config": "0.3.0",
|
|
49
49
|
"@inversifyjs/foundation-prettier-config": "0.1.1",
|
|
50
50
|
"@inversifyjs/foundation-typescript-config": "0.2.0",
|
|
51
|
-
"@tanstack/react-query": "5.104.
|
|
51
|
+
"@tanstack/react-query": "5.104.5",
|
|
52
52
|
"@testing-library/react": "16.3.3",
|
|
53
53
|
"@types/node": "24.19.2",
|
|
54
54
|
"@types/react": "19.3.0",
|
|
55
55
|
"@types/react-dom": "19.3.0",
|
|
56
56
|
"@vitejs/plugin-react": "6.1.2",
|
|
57
57
|
"@vitest/coverage-v8": "5.0.5",
|
|
58
|
-
"eslint": "10.
|
|
58
|
+
"eslint": "10.13.0",
|
|
59
59
|
"globals": "17.13.0",
|
|
60
60
|
"jsdom": "30.1.3",
|
|
61
|
-
"lucide-react": "1.
|
|
61
|
+
"lucide-react": "1.61.0",
|
|
62
62
|
"prettier": "3.9.10",
|
|
63
63
|
"react": "19.3.1",
|
|
64
64
|
"react-dom": "19.3.1",
|
|
65
65
|
"react-router": "8.5.0",
|
|
66
66
|
"rimraf": "6.1.3",
|
|
67
67
|
"typescript": "6.0.3",
|
|
68
|
-
"vite": "8.3.
|
|
68
|
+
"vite": "8.3.5",
|
|
69
69
|
"vitest": "5.0.5"
|
|
70
70
|
},
|
|
71
71
|
"scripts": {
|