Fix legend container overflow

[attatrol]

Description

Fixes maximum height calculation for legends anchored to the container (yref: "container"). Previously, legends would overflow outside the available container space. This fix ensures that when a legend is positioned relative to the container, its maximum height is constrained to the available space based on the y position and yanchor settings.

Resolves #7072

Changes

• Updated computeLegendDimensions function in src/components/legend/draw.js to calculate and constrain maxheight when yref === 'container'

Demo Video:

Code used for visual testing

const data = Array.from({ length: 20 }, (_, i) => ({
  x: [1, 2, 3],
  y: [40 + i, 50 + i, 60 + i],
  name: `long trace name #${i}`,
  type: "scatter"
}));

const layout = {
  width: 1000,
  height: 400,
  margin: {
    l: 0,
    t: 120,
    r: 0,
    b: 120,
    autoexpand: false
  },
  legend: {
    orientation: "v",
    xref: "container",
    yref: "container",
    xanchor: "left",
    yanchor: "top",
    x: 0.05,
    y: 0.25,
    bgcolor: "lightgrey"
  }
};

Plotly.newPlot("myDiv", data, layout);

Before:

https://github.com/user-attachments/assets/4508457e-037f-47fb-a554-e8dbcc80d15e

After:

https://github.com/user-attachments/assets/0450cbde-debc-43a0-ab01-c6c1cacdc747

Testing

• Start the dev dashboard with npm start
• Search for the legend_overflow_height mock
• Scroll vertically in the legend component
• Check that the legend respects the boundaries of the container and doesn't overflow outside the available space

[alexshoe]

@emilykl @camdecoster Fixed the merge conflict for this one and made some minor changes for readability + reducing redundancy. Filled in the description too so that it matches the standard.