P2-14: inspector source/origin row

e2e/canvas.spec.ts

@@ -18,6 +18,13 @@ test('palette click creates a dashed draft and Apply posts the intent', async ({
   await expect(page.locator('.resource-node.draft')).toHaveCount(0)
 })
 
+test('clicking a node shows its origin in the inspector source row', async ({ page }) => {
+  await page.goto('/')
+  await page.getByText('web', { exact: true }).click()
+  await expect(page.locator('.source-row')).toBeVisible()
+  await expect(page.locator('.source-row')).toContainText('terraform')
+})
+
 test('context menu marks a node for removal', async ({ page }) => {
   await page.goto('/')
   await page.getByText('web', { exact: true }).click({ button: 'right' })

packages/ui/src/Inspector.tsx

@@ -1,4 +1,5 @@
 import { useStore } from './store.js'
+import { SourceIcon } from './icons.js'
 
 function Value({ v }: { v: unknown }) {
   if (v === undefined) return <code>—</code>
@@ -56,6 +57,12 @@ export function Inspector() {
         <span className={`status-pill status-${node.status}`}>{node.status}</span>
         <span className="type-pill">{node.type}</span>
       </div>
+      {node.origin && (
+        <div className="source-row">
+          <SourceIcon origin={node.origin} />
+          <span>{node.origin}</span>
+        </div>
+      )}
       <div className="inspector-actions">
         {!(node.id in modifies) && (
           <button onClick={() => requestModify(node.id, '')}>Modify</button>

packages/ui/src/icons.tsx

@@ -27,3 +27,24 @@ export function ResourceIcon({ type }: { type: string }) {
     </svg>
   )
 }
+
+// Provider/origin glyph — distinct from ResourceIcon (which keys off the
+// resource *type*). 'terraform' gets a layered-squares glyph evoking stacked
+// state layers; any other provider id (e.g. a future live-scan origin) falls
+// back to a generic database/cloud glyph. SVG only, never emoji.
+export function SourceIcon({ origin }: { origin: string }) {
+  const isTerraform = origin === 'terraform'
+  return (
+    <svg width="14" height="14" viewBox="0 0 16 16" stroke="currentColor" strokeWidth="1.4" className="icon">
+      {isTerraform
+        ? <>
+            <rect x="2" y="2" width="7" height="7" fill="none" />
+            <rect x="7" y="7" width="7" height="7" fill="none" />
+          </>
+        : <>
+            <path d="M4 5.5a4 4 0 118 0" fill="none" />
+            <path d="M3.5 5.5A2.5 2.5 0 001 8a2.5 2.5 0 002.5 2.5h9A2.5 2.5 0 0015 8a2.5 2.5 0 00-2.5-2.5" fill="none" />
+          </>}
+    </svg>
+  )
+}

packages/ui/src/styles.css

@@ -39,6 +39,8 @@ body { margin: 0; font-family: ui-sans-serif, system-ui, sans-serif; }
 .status-pill.status-update { background: #fef9c3; }
 .status-pill.status-delete { background: #fee2e2; }
 .status-pill.status-replace { background: #f3e8ff; }
+.source-row { display: flex; align-items: center; gap: 6px; margin: 6px 0;
+  font-size: 11px; color: #64748b; }
 .inspector-actions { display: flex; gap: 6px; margin: 8px 0; }
 .inspector-actions button { font-size: 12px; padding: 4px 8px; border: 1px solid #e2e8f0;
   border-radius: 6px; background: #fff; cursor: pointer; }