@clear-capabilities/agentic-security-scanner 0.145.0 → 0.147.5

package/dist/frontend/styles/architecture-view.css

@@ -0,0 +1,93 @@
+.arch-view {
+  width: 100%;
+  height: 100%;
+  min-height: 480px;
+}
+
+.arch-zone-label {
+  fill: var(--text-secondary);
+  font-family: var(--font-family);
+  font-size: var(--font-size-panel-title);
+  font-weight: 600;
+}
+
+.arch-zone-bg {
+  fill: var(--surface-panel);
+  stroke: var(--border-default);
+  stroke-width: var(--border-width);
+}
+
+.arch-node {
+  cursor: pointer;
+}
+
+.arch-node-box {
+  fill: var(--surface-elevated);
+  stroke: var(--border-default);
+  stroke-width: 1.5px;
+  rx: var(--radius-default);
+}
+
+.arch-node[data-selected="true"] .arch-node-box {
+  stroke: var(--accent-selection);
+  stroke-width: 2.5px;
+}
+
+.arch-node[data-dimmed="true"] {
+  opacity: 0.35;
+}
+
+.arch-node-label {
+  fill: var(--text-primary);
+  font-family: var(--font-family);
+  font-size: var(--font-size-node-title);
+}
+
+.arch-node-glyph {
+  fill: var(--text-secondary);
+  font-family: var(--font-mono);
+  font-size: 11px;
+}
+
+.arch-edge {
+  fill: none;
+  stroke-width: 2px;
+  cursor: pointer;
+}
+
+.arch-edge[data-dimmed="true"] {
+  opacity: 0.25;
+}
+
+.arch-edge[data-selected="true"] {
+  stroke-width: 3px;
+}
+
+.arch-edge-linestyle-dashed {
+  stroke-dasharray: 6 4;
+}
+
+.arch-edge-linestyle-dotted {
+  stroke-dasharray: 2 3;
+}
+
+.arch-edge-glyph {
+  font-family: var(--font-mono);
+  font-size: 11px;
+}
+
+/* Flow Summary panel (renderFlowSummary), rendered into the shell's context
+   rail — a plain HTML panel via el(), not part of the <svg> canvas above. */
+.flow-summary {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--space-2);
+  width: 100%;
+}
+
+.flow-summary h4 {
+  margin: 0;
+  font-size: var(--font-size-panel-title);
+  color: var(--text-primary);
+}

package/dist/frontend/styles/filter-rail.css

@@ -0,0 +1,34 @@
+.filter-rail-group {
+  margin-bottom: var(--space-2);
+}
+
+.filter-rail-group h4 {
+  font-size: var(--font-size-body);
+  text-transform: uppercase;
+  color: var(--text-secondary);
+  margin: 0 0 var(--space-1) 0;
+}
+
+.filter-chip {
+  display: inline-block;
+  margin: 2px;
+  padding: 2px 8px;
+  border-radius: var(--radius-default);
+  border: 1px solid var(--border-default);
+  background: transparent;
+  color: var(--text-secondary);
+  font-family: var(--font-family);
+  font-size: var(--font-size-code);
+  cursor: pointer;
+}
+
+.filter-chip[data-active="true"] {
+  border-color: var(--accent-selection);
+  color: var(--text-primary);
+  background: var(--surface-elevated);
+}
+
+.filter-chip:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}

package/dist/frontend/styles/inspector.css

@@ -0,0 +1,69 @@
+.inspector {
+  color: var(--text-primary);
+  font-size: var(--font-size-body);
+}
+
+.inspector-title {
+  font-size: var(--font-size-panel-title);
+  margin: 0 0 var(--space-1) 0;
+}
+
+.inspector-claim {
+  color: var(--text-primary);
+  font-weight: 500;
+  margin-bottom: var(--space-2);
+}
+
+.inspector-section-title {
+  font-size: var(--font-size-body);
+  text-transform: uppercase;
+  color: var(--text-secondary);
+  margin: var(--space-2) 0 var(--space-1) 0;
+}
+
+.inspector-empty {
+  color: var(--text-secondary);
+  font-style: italic;
+}
+
+.inspector-evidence-list,
+.inspector-limitations-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.inspector-evidence-item {
+  display: flex;
+  flex-direction: column;
+  padding: var(--space-1) 0;
+  border-bottom: var(--border-width) solid var(--border-default);
+}
+
+.inspector-evidence-location {
+  color: var(--text-secondary);
+  font-family: var(--font-mono);
+  font-size: var(--font-size-code);
+}
+
+.inspector-limitations-list li {
+  padding: 4px 0;
+  color: var(--status-unknown);
+}
+
+.inspector-verdicts {
+  margin-top: var(--space-2);
+}
+
+.inspector-verdict-row {
+  display: flex;
+  align-items: center;
+  gap: var(--space-1);
+  padding: 4px 0;
+}
+
+.inspector-verdict-badge {
+  border: 1.5px solid;
+  border-radius: var(--radius-default);
+  padding: 2px 8px;
+}

package/dist/frontend/styles/inventory-view.css

@@ -0,0 +1,74 @@
+.inventory-view {
+  width: 100%;
+  overflow-x: auto;
+}
+
+.inventory-subnav {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--space-1);
+  padding: var(--space-1) 0 var(--space-2) 0;
+}
+
+.inventory-subnav-button {
+  background: transparent;
+  border: var(--border-width) solid var(--border-default);
+  color: var(--text-secondary);
+  border-radius: var(--radius-default);
+  padding: 4px var(--space-1);
+  cursor: pointer;
+  font-family: var(--font-family);
+  font-size: var(--font-size-code);
+  white-space: nowrap;
+}
+.inventory-subnav-button[data-active="true"] {
+  color: var(--text-primary);
+  background: var(--surface-elevated);
+  box-shadow: inset 0 0 0 var(--border-width) var(--accent-selection);
+}
+.inventory-subnav-button:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}
+
+.inventory-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: var(--font-size-body);
+}
+
+.inventory-table th {
+  text-align: left;
+  padding: var(--space-1) var(--space-2);
+  color: var(--text-secondary);
+  font-size: var(--font-size-panel-title);
+  text-transform: uppercase;
+  border-bottom: var(--border-width) solid var(--border-default);
+  background: var(--surface-panel);
+  position: sticky;
+  top: 0;
+  cursor: pointer;
+}
+
+.inventory-row {
+  cursor: pointer;
+  border-bottom: var(--border-width) solid var(--border-default);
+}
+.inventory-row td {
+  padding: var(--space-1) var(--space-2);
+  color: var(--text-primary);
+}
+.inventory-row:hover {
+  background: var(--surface-elevated);
+}
+.inventory-row[data-selected="true"] {
+  box-shadow: inset 3px 0 0 var(--accent-selection);
+  background: var(--surface-elevated);
+}
+.inventory-row[data-visible="false"] {
+  display: none;
+}
+.inventory-row:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: -2px;
+}

package/dist/frontend/styles/privacy-view.css

@@ -0,0 +1,86 @@
+.privacy-view {
+  width: 100%;
+  overflow-x: auto;
+}
+
+.privacy-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: var(--font-size-body);
+}
+
+.privacy-table th {
+  text-align: left;
+  padding: var(--space-1) var(--space-2);
+  color: var(--text-secondary);
+  font-size: var(--font-size-panel-title);
+  text-transform: uppercase;
+  border-bottom: var(--border-width) solid var(--border-default);
+  background: var(--surface-panel);
+  position: sticky;
+  top: 0;
+}
+
+.privacy-row {
+  cursor: pointer;
+  border-bottom: var(--border-width) solid var(--border-default);
+}
+
+.privacy-row:hover {
+  background: var(--surface-elevated);
+}
+
+.privacy-row[data-selected="true"] {
+  box-shadow: inset 3px 0 0 var(--accent-selection);
+  background: var(--surface-elevated);
+}
+
+.privacy-row[data-visible="false"] {
+  display: none;
+}
+
+.privacy-field-cell {
+  padding: var(--space-1) var(--space-2);
+  color: var(--text-primary);
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.privacy-stage-cell {
+  padding: var(--space-1) var(--space-2);
+  color: var(--text-secondary);
+  vertical-align: top;
+}
+
+.privacy-stage-cell-empty {
+  color: var(--border-default);
+}
+
+.privacy-stage-cell-empty-label {
+  color: inherit;
+}
+
+.privacy-protection-cell {
+  padding: var(--space-1) var(--space-2);
+  vertical-align: top;
+  white-space: nowrap;
+}
+
+.privacy-governance-badge {
+  display: inline-block;
+  border: 1px solid var(--status-unknown);
+  color: var(--status-unknown);
+  border-radius: var(--radius-default);
+  padding: 1px 6px;
+  font-size: var(--font-size-code);
+  margin-top: 4px;
+}
+
+.privacy-class-badge {
+  display: inline-block;
+  border-radius: var(--radius-default);
+  padding: 1px 6px;
+  font-size: var(--font-size-code);
+  margin-right: 4px;
+  border: 1px solid var(--border-default);
+}

package/dist/frontend/styles/query-bar.css

@@ -0,0 +1,107 @@
+/* Query bar (PRD §15.2) — text input + saved-view chips, living inside the
+   shell's existing view-tabs row (shell.css's shell__view-tabs), and the
+   focus-control menu (PRD §15.3) appended into the context rail when a
+   node/flow is selected on Architecture View. */
+
+.shell__query-bar-slot {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+}
+
+.query-bar {
+  display: flex;
+  align-items: center;
+  gap: var(--space-1);
+}
+
+.query-bar__input {
+  width: 280px;
+  padding: 4px var(--space-1);
+  border-radius: var(--radius-default);
+  border: var(--border-width) solid var(--border-default);
+  background: var(--surface-elevated);
+  color: var(--text-primary);
+  font-family: var(--font-mono);
+  font-size: var(--font-size-code);
+}
+
+.query-bar__input[aria-invalid="true"] {
+  border-color: var(--status-unprotected);
+}
+
+.query-bar__input:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}
+
+.query-bar__error {
+  display: none;
+  color: var(--status-unprotected);
+  font-size: var(--font-size-code);
+  max-width: 260px;
+}
+
+.query-bar__error[data-visible="true"] {
+  display: block;
+}
+
+.query-bar__saved-views {
+  display: flex;
+  gap: 4px;
+}
+
+.query-bar__saved-view-chip {
+  display: inline-block;
+  padding: 2px 8px;
+  border-radius: var(--radius-default);
+  border: var(--border-width) solid var(--border-default);
+  background: transparent;
+  color: var(--text-secondary);
+  font-family: var(--font-family);
+  font-size: var(--font-size-code);
+  cursor: pointer;
+}
+
+.query-bar__saved-view-chip:hover {
+  border-color: var(--accent-selection);
+  color: var(--text-primary);
+}
+
+.query-bar__saved-view-chip:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}
+
+.focus-control-menu {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  margin-top: var(--space-1);
+}
+
+.focus-control-menu__button {
+  padding: 2px 8px;
+  border-radius: var(--radius-default);
+  border: var(--border-width) solid var(--border-default);
+  background: transparent;
+  color: var(--text-secondary);
+  font-family: var(--font-family);
+  font-size: var(--font-size-code);
+  cursor: pointer;
+}
+
+.focus-control-menu__button[data-focus-control="reset"] {
+  color: var(--text-primary);
+  border-color: var(--accent-selection);
+}
+
+.focus-control-menu__button:hover {
+  border-color: var(--accent-selection);
+  color: var(--text-primary);
+}
+
+.focus-control-menu__button:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}

package/dist/frontend/styles/shell.css

@@ -0,0 +1,155 @@
+/* AppShell layout — PRD §7.7 five persistent regions on an 8px spacing grid. */
+
+.shell {
+  display: grid;
+  grid-template-rows: var(--header-height) var(--view-tabs-height) 1fr var(--context-rail-height);
+  grid-template-columns: var(--left-rail-width) 1fr var(--right-inspector-width);
+  grid-template-areas:
+    "header header header"
+    "tabs   tabs   tabs"
+    "rail   canvas inspector"
+    "rail   context context";
+  height: 100vh;
+  width: 100vw;
+  background: var(--surface-canvas);
+}
+
+.shell__header {
+  grid-area: header;
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+  padding: 0 var(--space-2);
+  background: var(--surface-panel);
+  border-bottom: var(--border-width) solid var(--border-default);
+}
+
+.shell__header-title {
+  font-size: var(--font-size-view-title);
+  font-weight: 600;
+  color: var(--text-primary);
+}
+
+.shell__header-meta {
+  color: var(--text-secondary);
+  font-size: var(--font-size-body);
+}
+
+.shell__coverage-banner {
+  grid-area: header;
+  align-self: end;
+  justify-self: stretch;
+  margin: 0 var(--space-2) 0 var(--space-2);
+  display: none;
+}
+.shell__coverage-banner[data-visible="true"] {
+  display: block;
+  background: var(--status-unknown);
+  color: var(--status-banner-text);
+  padding: 4px var(--space-2);
+  border-radius: var(--radius-default);
+  font-size: var(--font-size-body);
+}
+
+.shell__view-tabs {
+  grid-area: tabs;
+  display: flex;
+  align-items: center;
+  gap: var(--space-1);
+  padding: 0 var(--space-2);
+  background: var(--surface-panel);
+  border-bottom: var(--border-width) solid var(--border-default);
+}
+
+.shell__view-tab {
+  background: transparent;
+  border: none;
+  color: var(--text-secondary);
+  font-family: var(--font-family);
+  font-size: var(--font-size-panel-title);
+  padding: var(--space-1) var(--space-2);
+  border-radius: var(--radius-default);
+  cursor: pointer;
+}
+.shell__view-tab[aria-selected="true"] {
+  color: var(--text-primary);
+  background: var(--surface-elevated);
+  box-shadow: inset 0 0 0 var(--border-width) var(--accent-selection);
+}
+.shell__view-tab:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}
+
+.shell__left-rail {
+  grid-area: rail;
+  background: var(--surface-panel);
+  border-right: var(--border-width) solid var(--border-default);
+  padding: var(--space-2);
+  overflow-y: auto;
+}
+
+.shell__canvas {
+  grid-area: canvas;
+  overflow: auto;
+  padding: var(--space-2);
+}
+
+.shell__inspector {
+  grid-area: inspector;
+  background: var(--surface-panel);
+  border-left: var(--border-width) solid var(--border-default);
+  padding: var(--space-2);
+  overflow-y: auto;
+}
+
+.shell__context-rail {
+  grid-area: context;
+  background: var(--surface-panel);
+  border-top: var(--border-width) solid var(--border-default);
+  padding: 0 var(--space-2);
+  display: flex;
+  align-items: center;
+  color: var(--text-secondary);
+  font-size: var(--font-size-body);
+}
+
+.shell__inspector-toggle {
+  display: none;
+  background: transparent;
+  border: var(--border-width) solid var(--border-default);
+  color: var(--text-primary);
+  border-radius: var(--radius-default);
+  padding: 4px var(--space-1);
+  cursor: pointer;
+  font-family: var(--font-family);
+  font-size: var(--font-size-body);
+}
+.shell__inspector-toggle:focus-visible {
+  outline: 2px solid var(--accent-selection);
+  outline-offset: 2px;
+}
+
+@media (max-width: 1280px) {
+  .shell {
+    grid-template-columns: var(--left-rail-collapsed-width) 1fr 0;
+  }
+  .shell__inspector-toggle {
+    display: inline-flex;
+    align-items: center;
+  }
+  .shell__inspector {
+    position: fixed;
+    top: calc(var(--header-height) + var(--view-tabs-height));
+    right: 0;
+    bottom: var(--context-rail-height);
+    width: min(360px, 90vw);
+    z-index: 20;
+    box-shadow: -4px 0 16px rgba(0, 0, 0, 0.4);
+    transform: translateX(100%);
+    transition: transform var(--motion-duration) ease-out;
+  }
+  .shell__inspector[data-overlay-open="true"] {
+    transform: translateX(0);
+  }
+}