import type { AlgorithmDefinition } from '@/lib/visualizations/types';

export const monotonicStackAlgorithm: AlgorithmDefinition = {
  id: 'monotonic-stack-nge',
  title: 'Next Greater Element',
  slug: 'monotonic-stack',
  pattern: {
    name: 'Monotonic Stack',
    description:
      'Use a stack to maintain elements in monotonic order, efficiently finding next greater/smaller elements.',
  },
  problemStatement:
    'For each element in an array, find the next element to its right that is greater. If none exists, return -1.',
  intuition:
    'The stack maintains indices of elements waiting for their "next greater". When we encounter a larger element, we resolve all smaller waiting elements by popping them.',
  code: {
    language: 'python',
    code: `def next_greater_element(nums: list[int]) -> list[int]:
    n = len(nums)
    result = [-1] * n
    stack = []  # stores indices

    for i in range(n):
        # Pop all smaller elements - current is their answer
        while stack and nums[i] > nums[stack[-1]]:
            idx = stack.pop()
            result[idx] = nums[i]
        stack.append(i)

    return result`,
  },
  initialExample: {
    input: { nums: [4, 5, 2, 10, 8] },
    expected: [5, 10, 10, -1, -1],
  },
  steps: [
    // Phase 1: Problem (2 steps)
    {
      id: 'problem-1',
      phase: 'problem',
      explanation:
        'Given array [4, 5, 2, 10, 8], for each element find the next greater element to its right. If none exists, use -1.',
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'dimmed' },
              { value: -1, index: 1, state: 'dimmed' },
              { value: -1, index: 2, state: 'dimmed' },
              { value: -1, index: 3, state: 'dimmed' },
              { value: -1, index: 4, state: 'dimmed' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [],
        calculations: [],
      },
    },
    {
      id: 'problem-2',
      phase: 'problem',
      explanation:
        'A brute force approach checks every pair: for each element, scan right to find a larger one. This is O(n^2). Can we do better?',
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'highlighted' },
              { value: 5, index: 1, state: 'comparing' },
              { value: 2, index: 2, state: 'dimmed' },
              { value: 10, index: 3, state: 'dimmed' },
              { value: 8, index: 4, state: 'dimmed' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'dimmed' },
              { value: -1, index: 1, state: 'dimmed' },
              { value: -1, index: 2, state: 'dimmed' },
              { value: -1, index: 3, state: 'dimmed' },
              { value: -1, index: 4, state: 'dimmed' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [],
        calculations: [],
      },
    },

    // Phase 2: Intuition (3 steps)
    {
      id: 'intuition-1',
      phase: 'intuition',
      explanation:
        'Key insight: When we see a large element, it becomes the "next greater" for ALL smaller elements we have seen that are still waiting.',
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'highlighted' },
              { value: 5, index: 1, state: 'highlighted' },
              { value: 2, index: 2, state: 'highlighted' },
              { value: 10, index: 3, state: 'success' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'dimmed' },
              { value: -1, index: 1, state: 'dimmed' },
              { value: -1, index: 2, state: 'dimmed' },
              { value: -1, index: 3, state: 'dimmed' },
              { value: -1, index: 4, state: 'dimmed' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [],
        calculations: [],
      },
    },
    {
      id: 'intuition-2',
      phase: 'intuition',
      explanation:
        'We use a stack to track elements waiting for their answer. When we find a larger element, we pop and resolve all smaller waiting elements.',
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'dimmed' },
              { value: -1, index: 1, state: 'dimmed' },
              { value: -1, index: 2, state: 'dimmed' },
              { value: -1, index: 3, state: 'dimmed' },
              { value: -1, index: 4, state: 'dimmed' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [
              { id: 's0', value: 0, state: 'normal' },
              { id: 's1', value: 1, state: 'normal' },
              { id: 's2', value: 2, state: 'highlighted' },
            ],
          },
        ],
        pointers: [],
        variables: [],
        calculations: [],
      },
    },
    {
      id: 'intuition-3',
      phase: 'intuition',
      explanation:
        'The stack maintains a monotonically DECREASING sequence - elements get smaller as we go up. This ensures we pop in the right order.',
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'highlighted' },
              { value: 5, index: 1, state: 'highlighted' },
              { value: 2, index: 2, state: 'highlighted' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'dimmed' },
              { value: -1, index: 1, state: 'dimmed' },
              { value: -1, index: 2, state: 'dimmed' },
              { value: -1, index: 3, state: 'dimmed' },
              { value: -1, index: 4, state: 'dimmed' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [
              { id: 's0', value: 0, state: 'normal' },
              { id: 's1', value: 1, state: 'normal' },
              { id: 's2', value: 2, state: 'normal' },
            ],
          },
        ],
        pointers: [],
        variables: [],
        calculations: [],
      },
    },

    // Phase 3: Code walkthrough (4 steps)
    {
      id: 'code-1',
      phase: 'code',
      explanation:
        'Initialize result array with -1 (default when no greater element exists) and an empty stack to track indices.',
      codeLine: 3,
      codeHighlightLines: [2, 3, 4],
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'normal' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [{ id: 'n', name: 'n', value: 5 }],
        calculations: [],
      },
    },
    {
      id: 'code-2',
      phase: 'code',
      explanation:
        'Iterate through each element. For each position i, we check if current element is greater than elements at stack indices.',
      codeLine: 6,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'normal' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [{ id: 'n', name: 'n', value: 5 }],
        calculations: [],
      },
    },
    {
      id: 'code-3',
      phase: 'code',
      explanation:
        'While stack is not empty AND current element > element at stack top: pop the index and set its result to current element.',
      codeLine: 8,
      codeHighlightLines: [8, 9, 10],
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'normal' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [{ id: 'n', name: 'n', value: 5 }],
        calculations: [],
      },
    },
    {
      id: 'code-4',
      phase: 'code',
      explanation:
        'After resolving smaller elements, push current index onto stack. It will wait for its own "next greater" element.',
      codeLine: 11,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'normal' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [{ id: 'n', name: 'n', value: 5 }],
        calculations: [],
      },
    },

    // Phase 4: Execution (~10 steps)
    {
      id: 'exec-1',
      phase: 'execution',
      explanation: 'i=0: Stack is empty, so we just push index 0. Value 4 waits for its next greater element.',
      codeLine: 11,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'highlighted' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: -1, index: 0, state: 'normal' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [{ id: 's0', value: 0, state: 'pushing' }],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 0, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 0 },
          { id: 'current', name: 'nums[i]', value: 4 },
        ],
        calculations: [],
      },
    },
    {
      id: 'exec-2',
      phase: 'execution',
      explanation: 'i=1: Current value 5 > nums[stack top] = nums[0] = 4. Pop index 0 and set result[0] = 5.',
      codeLine: 9,
      decision: {
        question: 'Is 5 > nums[0]?',
        answer: '5 > 4 = true',
        action: 'Pop index 0, set result[0] = 5',
      },
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'comparing' },
              { value: 5, index: 1, state: 'highlighted' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [{ id: 's0', value: 0, state: 'popped' }],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 1, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 1 },
          { id: 'current', name: 'nums[i]', value: 5 },
          { id: 'idx', name: 'popped idx', value: 0 },
        ],
        calculations: [
          { id: 'calc-1', expression: 'result[0]', result: '5', position: 'above' },
        ],
      },
    },
    {
      id: 'exec-3',
      phase: 'execution',
      explanation: 'Stack is now empty. Push index 1. Value 5 waits for its next greater element.',
      codeLine: 11,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'highlighted' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [{ id: 's1', value: 1, state: 'pushing' }],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 1, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 1 },
          { id: 'current', name: 'nums[i]', value: 5 },
        ],
        calculations: [],
      },
    },
    {
      id: 'exec-4',
      phase: 'execution',
      explanation: 'i=2: Current value 2 < nums[stack top] = nums[1] = 5. No pop needed, just push index 2.',
      codeLine: 11,
      decision: {
        question: 'Is 2 > nums[1]?',
        answer: '2 > 5 = false',
        action: 'Skip while loop, push index 2',
      },
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'highlighted' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: -1, index: 1, state: 'normal' },
              { value: -1, index: 2, state: 'normal' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [
              { id: 's1', value: 1, state: 'normal' },
              { id: 's2', value: 2, state: 'pushing' },
            ],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 2, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 2 },
          { id: 'current', name: 'nums[i]', value: 2 },
        ],
        calculations: [],
      },
    },
    {
      id: 'exec-5',
      phase: 'execution',
      explanation: 'i=3: Current value 10 > nums[stack top] = nums[2] = 2. Pop index 2, set result[2] = 10.',
      codeLine: 9,
      decision: {
        question: 'Is 10 > nums[2]?',
        answer: '10 > 2 = true',
        action: 'Pop index 2, set result[2] = 10',
      },
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'comparing' },
              { value: 10, index: 3, state: 'highlighted' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: -1, index: 1, state: 'normal' },
              { value: 10, index: 2, state: 'success' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [
              { id: 's1', value: 1, state: 'normal' },
              { id: 's2', value: 2, state: 'popped' },
            ],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 3, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 3 },
          { id: 'current', name: 'nums[i]', value: 10 },
          { id: 'idx', name: 'popped idx', value: 2 },
        ],
        calculations: [
          { id: 'calc-2', expression: 'result[2]', result: '10', position: 'above' },
        ],
      },
    },
    {
      id: 'exec-6',
      phase: 'execution',
      explanation: 'Stack top is now index 1. Current 10 > nums[1] = 5. Pop index 1, set result[1] = 10.',
      codeLine: 9,
      decision: {
        question: 'Is 10 > nums[1]?',
        answer: '10 > 5 = true',
        action: 'Pop index 1, set result[1] = 10',
      },
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'comparing' },
              { value: 2, index: 2, state: 'dimmed' },
              { value: 10, index: 3, state: 'highlighted' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: 10, index: 1, state: 'success' },
              { value: 10, index: 2, state: 'success' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [{ id: 's1', value: 1, state: 'popped' }],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 3, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 3 },
          { id: 'current', name: 'nums[i]', value: 10 },
          { id: 'idx', name: 'popped idx', value: 1 },
        ],
        calculations: [
          { id: 'calc-3', expression: 'result[1]', result: '10', position: 'above' },
        ],
      },
    },
    {
      id: 'exec-7',
      phase: 'execution',
      explanation: 'Stack is now empty. Push index 3. Value 10 waits for its next greater element.',
      codeLine: 11,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'dimmed' },
              { value: 2, index: 2, state: 'dimmed' },
              { value: 10, index: 3, state: 'highlighted' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: 10, index: 1, state: 'success' },
              { value: 10, index: 2, state: 'success' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [{ id: 's3', value: 3, state: 'pushing' }],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 3, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 3 },
          { id: 'current', name: 'nums[i]', value: 10 },
        ],
        calculations: [],
      },
    },
    {
      id: 'exec-8',
      phase: 'execution',
      explanation: 'i=4: Current value 8 < nums[stack top] = nums[3] = 10. No pop needed, just push index 4.',
      codeLine: 11,
      decision: {
        question: 'Is 8 > nums[3]?',
        answer: '8 > 10 = false',
        action: 'Skip while loop, push index 4',
      },
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'dimmed' },
              { value: 2, index: 2, state: 'dimmed' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'highlighted' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: 10, index: 1, state: 'success' },
              { value: 10, index: 2, state: 'success' },
              { value: -1, index: 3, state: 'normal' },
              { value: -1, index: 4, state: 'normal' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [
              { id: 's3', value: 3, state: 'normal' },
              { id: 's4', value: 4, state: 'pushing' },
            ],
          },
        ],
        pointers: [{ id: 'i', name: 'i', index: 4, color: 'default', showValue: true }],
        variables: [
          { id: 'i', name: 'i', value: 4 },
          { id: 'current', name: 'nums[i]', value: 8 },
        ],
        calculations: [],
      },
    },
    {
      id: 'exec-9',
      phase: 'execution',
      explanation: 'Loop complete. Elements remaining in stack (indices 3, 4) have no next greater element - their result stays -1.',
      codeLine: 13,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'dimmed' },
              { value: 5, index: 1, state: 'dimmed' },
              { value: 2, index: 2, state: 'dimmed' },
              { value: 10, index: 3, state: 'highlighted' },
              { value: 8, index: 4, state: 'highlighted' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: 10, index: 1, state: 'success' },
              { value: 10, index: 2, state: 'success' },
              { value: -1, index: 3, state: 'comparing' },
              { value: -1, index: 4, state: 'comparing' },
            ],
          },
        ],
        stacks: [
          {
            id: 'stack',
            label: 'Stack',
            elements: [
              { id: 's3', value: 3, state: 'normal' },
              { id: 's4', value: 4, state: 'normal' },
            ],
          },
        ],
        pointers: [],
        variables: [],
        calculations: [],
      },
    },
    {
      id: 'exec-10',
      phase: 'execution',
      explanation: 'Final result: [5, 10, 10, -1, -1]. Each element found its next greater, or -1 if none exists. Time: O(n), Space: O(n).',
      codeLine: 13,
      dataState: {
        arrays: [
          {
            id: 'input',
            label: 'Input Array',
            elements: [
              { value: 4, index: 0, state: 'normal' },
              { value: 5, index: 1, state: 'normal' },
              { value: 2, index: 2, state: 'normal' },
              { value: 10, index: 3, state: 'normal' },
              { value: 8, index: 4, state: 'normal' },
            ],
          },
          {
            id: 'result',
            label: 'Result',
            elements: [
              { value: 5, index: 0, state: 'success' },
              { value: 10, index: 1, state: 'success' },
              { value: 10, index: 2, state: 'success' },
              { value: -1, index: 3, state: 'success' },
              { value: -1, index: 4, state: 'success' },
            ],
          },
        ],
        stacks: [{ id: 'stack', label: 'Stack', elements: [] }],
        pointers: [],
        variables: [
          { id: 'result', name: 'result', value: '[5, 10, 10, -1, -1]' },
        ],
        calculations: [],
      },
    },
  ],
};
