Add cross-tab layout projection from Block Layout to Linear Layout

index.html

@@ -100,6 +100,7 @@ <h3>Tensor Shape</h3>
           <div id="validation-warnings" class="validation-warnings"></div>
 
           <button type="submit">Update Visualization</button>
+          <button type="button" id="show-linear-layout">Show in Linear Layout</button>
         </form>
 
         <div class="controls" data-controls></div>

src/core/LinearLayout.ts

@@ -117,6 +117,35 @@ interface BitDescriptor {
   bit: number
 }
 
+export interface LayoutSnapshotMetadata {
+  sourceLayoutType: string
+  sourceTabId?: string
+  tensorShape?: number[]
+  description?: string
+  generatedAt?: string
+  colorInputDimension?: string
+}
+
+export interface LayoutMatrixSnapshot {
+  inputDimensions: Array<{ name: string; size: number }>
+  outputDimensions: Array<{ name: string; size: number }>
+  matrix: number[][]
+  metadata?: LayoutSnapshotMetadata
+}
+
+function cloneMetadata(metadata?: LayoutSnapshotMetadata): LayoutSnapshotMetadata | undefined {
+  if (!metadata) {
+    return undefined
+  }
+  const cloned: LayoutSnapshotMetadata = {
+    ...metadata,
+  }
+  if (metadata.tensorShape) {
+    cloned.tensorShape = [...metadata.tensorShape]
+  }
+  return cloned
+}
+
 function assertPowerOfTwo(value: number, context: string): void {
   if (!Number.isInteger(value) || value <= 0 || (value & (value - 1)) !== 0) {
     throw new Error(`${context} must be a positive power of two, got ${value}`)
@@ -475,6 +504,26 @@ export class LinearLayout {
     return new LinearLayout(basesArray, outDimPairs)
   }
 
+  toMatrixSnapshot(metadata?: LayoutSnapshotMetadata): LayoutMatrixSnapshot {
+    const inputSpecs = this.getInputDimensionSpecs()
+    const outputSpecs = this.getOutputDimensionSpecs()
+    if (inputSpecs.length === 0 || outputSpecs.length === 0) {
+      return {
+        inputDimensions: [],
+        outputDimensions: [],
+        matrix: [],
+        metadata: cloneMetadata(metadata),
+      }
+    }
+    const matrix = basesToMatrix(this.bases, inputSpecs, outputSpecs)
+    return {
+      inputDimensions: inputSpecs.map((spec) => ({ name: spec.name, size: spec.size })),
+      outputDimensions: outputSpecs.map((spec) => ({ name: spec.name, size: spec.size })),
+      matrix,
+      metadata: cloneMetadata(metadata),
+    }
+  }
+
   /**
    * Apply the linear layout: compute L(inputs)
    * Uses XOR to combine bases according to input bit patterns
@@ -682,6 +731,77 @@ export class LinearLayout {
     return result
   }
 
+  /**
+   * Return a layout whose output dimensions follow the preferred order.
+   * Any dimensions not mentioned in preferredOrder retain their existing
+   * relative ordering and are appended to the end.
+   */
+  reorderOutputs(preferredOrder: string[]): LinearLayout {
+    const currentOrder = this.getOutDimNames()
+    if (currentOrder.length <= 1) {
+      return this
+    }
+
+    const normalizedPreference = preferredOrder
+      .map((name) => name.trim())
+      .filter((name) => name.length > 0)
+
+    const finalOrder: string[] = []
+    const seen = new Set<string>()
+    const appendIfPresent = (name: string): void => {
+      if (seen.has(name)) {
+        return
+      }
+      if (!currentOrder.includes(name)) {
+        return
+      }
+      seen.add(name)
+      finalOrder.push(name)
+    }
+
+    normalizedPreference.forEach(appendIfPresent)
+    currentOrder.forEach(appendIfPresent)
+
+    if (finalOrder.length !== currentOrder.length) {
+      // Should not happen because we append all remaining dimensions.
+      return this
+    }
+
+    let hasChanges = false
+    for (let i = 0; i < finalOrder.length; i++) {
+      if (finalOrder[i] !== currentOrder[i]) {
+        hasChanges = true
+        break
+      }
+    }
+    if (!hasChanges) {
+      return this
+    }
+
+    const currentIndex = new Map<string, number>()
+    currentOrder.forEach((name, index) => currentIndex.set(name, index))
+
+    const reorderedBases: Array<[string, number[][]]> = []
+    for (const [inDim, dimBases] of this.bases.entries()) {
+      const remappedBases = dimBases.map((basisVector) => {
+        return finalOrder.map((outName) => {
+          const originalIndex = currentIndex.get(outName)
+          if (originalIndex === undefined) {
+            return 0
+          }
+          return basisVector[originalIndex] ?? 0
+        })
+      })
+      reorderedBases.push([inDim, remappedBases])
+    }
+
+    const reorderedOutDims = finalOrder.map(
+      (name) => [name, this.getOutDimSize(name)] as [string, number]
+    )
+
+    return new LinearLayout(reorderedBases, reorderedOutDims)
+  }
+
   private getInputDimensionSpecs(): DimensionSpec[] {
     return this.getInDimNames().map((name) => ({
       name,

src/core/filterSnapshotDimensions.test.ts

@@ -0,0 +1,96 @@
+import { describe, it, expect } from 'vitest'
+import type { LayoutMatrixSnapshot } from './LinearLayout'
+import { filterSnapshotDimensions } from './filterSnapshotDimensions'
+
+const buildSnapshot = (): LayoutMatrixSnapshot => ({
+  inputDimensions: [
+    { name: 'reg', size: 4 },
+    { name: 'lane', size: 2 },
+  ],
+  outputDimensions: [
+    { name: 'dim0', size: 4 },
+    { name: 'dim1', size: 2 },
+  ],
+  matrix: [
+    [1, 0, 1],
+    [0, 1, 0],
+    [1, 1, 0],
+    [0, 0, 1],
+  ],
+})
+
+describe('filterSnapshotDimensions', () => {
+  it('clones the snapshot when no dimensions are removed', () => {
+    const snapshot = buildSnapshot()
+    const { snapshot: filtered, removedInputDimensions, removedOutputDimensions } =
+      filterSnapshotDimensions(snapshot)
+
+    expect(removedInputDimensions).toHaveLength(0)
+    expect(removedOutputDimensions).toHaveLength(0)
+    expect(filtered).not.toBe(snapshot)
+    expect(filtered.inputDimensions).toEqual(snapshot.inputDimensions)
+    expect(filtered.outputDimensions).toEqual(snapshot.outputDimensions)
+    expect(filtered.matrix).toEqual(snapshot.matrix)
+  })
+
+  it('removes size-1 dimensions and leaves remaining matrix intact', () => {
+    const snapshot: LayoutMatrixSnapshot = {
+      inputDimensions: [
+        { name: 'reg', size: 2 },
+        { name: 'warp', size: 1 },
+      ],
+      outputDimensions: [
+        { name: 'dim0', size: 4 },
+        { name: 'dim1', size: 1 },
+      ],
+      matrix: [
+        [1],
+        [0],
+      ],
+    }
+
+    const { snapshot: filtered, removedInputDimensions, removedOutputDimensions } =
+      filterSnapshotDimensions(snapshot)
+
+    expect(filtered.inputDimensions).toEqual([{ name: 'reg', size: 2 }])
+    expect(filtered.outputDimensions).toEqual([{ name: 'dim0', size: 4 }])
+    expect(filtered.matrix).toEqual([
+      [1],
+      [0],
+    ])
+    expect(removedInputDimensions).toEqual(['warp'])
+    expect(removedOutputDimensions).toEqual(['dim1'])
+  })
+
+  it('drops matrix rows and columns when removing larger dimensions via custom min size', () => {
+    const snapshot: LayoutMatrixSnapshot = {
+      inputDimensions: [
+        { name: 'reg', size: 4 },
+        { name: 'lane', size: 2 },
+      ],
+      outputDimensions: [
+        { name: 'dim0', size: 8 },
+        { name: 'dim1', size: 2 },
+      ],
+      matrix: [
+        [1, 0, 0],
+        [0, 1, 0],
+        [1, 1, 0],
+        [0, 0, 1],
+      ],
+    }
+
+    const { snapshot: filtered, removedInputDimensions, removedOutputDimensions } =
+      filterSnapshotDimensions(snapshot, 4)
+
+    expect(filtered.inputDimensions).toEqual([{ name: 'reg', size: 4 }])
+    expect(filtered.outputDimensions).toEqual([{ name: 'dim0', size: 8 }])
+    expect(filtered.matrix).toEqual([
+      [1, 0],
+      [0, 1],
+      [1, 1],
+    ])
+    expect(removedInputDimensions).toEqual(['lane'])
+    expect(removedOutputDimensions).toEqual(['dim1'])
+  })
+})

src/core/filterSnapshotDimensions.ts

@@ -0,0 +1,111 @@
+import type { LayoutMatrixSnapshot } from './LinearLayout'
+
+export interface SnapshotFilterResult {
+  snapshot: LayoutMatrixSnapshot
+  removedInputDimensions: string[]
+  removedOutputDimensions: string[]
+}
+
+/**
+ * Remove dimensions smaller than the provided minimum size from a layout snapshot.
+ * Returns the filtered snapshot along with the dimension names that were removed.
+ */
+export function filterSnapshotDimensions(
+  snapshot: LayoutMatrixSnapshot,
+  minSize = 2
+): SnapshotFilterResult {
+  if (minSize <= 1) {
+    return {
+      snapshot: cloneSnapshot(snapshot),
+      removedInputDimensions: [],
+      removedOutputDimensions: [],
+    }
+  }
+
+  const keepDimension = (dimension: { size: number }): boolean => dimension.size >= minSize
+  const removedInputDimensions = snapshot.inputDimensions
+    .filter((dimension) => !keepDimension(dimension))
+    .map((dimension) => dimension.name)
+  const removedOutputDimensions = snapshot.outputDimensions
+    .filter((dimension) => !keepDimension(dimension))
+    .map((dimension) => dimension.name)
+
+  if (removedInputDimensions.length === 0 && removedOutputDimensions.length === 0) {
+    return {
+      snapshot: cloneSnapshot(snapshot),
+      removedInputDimensions,
+      removedOutputDimensions,
+    }
+  }
+
+  const columnIndexesToKeep = collectBitIndexes(snapshot.inputDimensions, keepDimension)
+  const rowIndexesToKeep = collectBitIndexes(snapshot.outputDimensions, keepDimension)
+  const filteredMatrix = buildFilteredMatrix(snapshot.matrix, rowIndexesToKeep, columnIndexesToKeep)
+
+  return {
+    snapshot: {
+      metadata: snapshot.metadata,
+      inputDimensions: snapshot.inputDimensions.filter(keepDimension).map(cloneDimension),
+      outputDimensions: snapshot.outputDimensions.filter(keepDimension).map(cloneDimension),
+      matrix: filteredMatrix,
+    },
+    removedInputDimensions,
+    removedOutputDimensions,
+  }
+}
+
+function cloneSnapshot(snapshot: LayoutMatrixSnapshot): LayoutMatrixSnapshot {
+  return {
+    metadata: snapshot.metadata,
+    inputDimensions: snapshot.inputDimensions.map(cloneDimension),
+    outputDimensions: snapshot.outputDimensions.map(cloneDimension),
+    matrix: snapshot.matrix.map((row) => [...row]),
+  }
+}
+
+function cloneDimension<T extends { name: string; size: number }>(dimension: T): T {
+  return { ...dimension }
+}
+
+function collectBitIndexes(
+  dimensions: Array<{ size: number }>,
+  keepDimension: (dimension: { size: number }) => boolean
+): number[] {
+  const indexes: number[] = []
+  let cursor = 0
+  for (const dimension of dimensions) {
+    const bitWidth = getBitWidth(dimension.size)
+    if (keepDimension(dimension)) {
+      for (let i = 0; i < bitWidth; i++) {
+        indexes.push(cursor + i)
+      }
+    }
+    cursor += bitWidth
+  }
+  return indexes
+}
+
+function getBitWidth(size: number): number {
+  if (!Number.isFinite(size) || size <= 0) {
+    return 0
+  }
+  const width = Math.log2(size)
+  return Number.isInteger(width) ? width : 0
+}
+
+function buildFilteredMatrix(
+  matrix: number[][],
+  rowIndexes: number[],
+  columnIndexes: number[]
+): number[][] {
+  if (rowIndexes.length === matrix.length && matrix.length > 0) {
+    if (columnIndexes.length === (matrix[0]?.length ?? 0)) {
+      return matrix.map((row) => [...row])
+    }
+  }
+
+  return rowIndexes.map((rowIndex) => {
+    const sourceRow = matrix[rowIndex] ?? []
+    return columnIndexes.map((columnIndex) => sourceRow[columnIndex] ?? 0)
+  })
+}