GeezerVison

Description

Make hoverlabel.align take effect in x unified and y unified hover labels. The unified label draws its items through the legend, and the legend always anchored item text at the start. Each item now reads the hoverlabel.align value of its point, so the layout value and the trace values both apply. With 'right', the item text aligns to the right edge of the label. 'left' and 'auto' keep the current output.

The title of the label stays left-aligned. I can align it with the items too if you prefer.

Closes #8100.

Changes

• Anchor the text of unified hover items that have hoverlabel.align: 'right' at the right edge of the label
• Add a test to hover_test.js for the layout value and a trace value
• Add draftlog

Screenshots

Repro from the issue, layout.hoverlabel.align: 'right'

Before	After

Testing

• npm run test-jasmine -- hover legend --nowatch passes (357 specs). The new spec fails on main.
• Open Plotly devtools and paste the following into the browser devtools console, then hover over a category:

  const gd = Tabs.fresh();
  Plotly.newPlot(
      gd,
      [
          { type: 'bar', x: ['A', 'B', 'C'], y: [3944, 2810, 1675], name: 'Series 1' },
          { type: 'bar', x: ['A', 'B', 'C'], y: [-266, -1020, -85], name: 'Series 2' },
          { type: 'bar', x: ['A', 'B', 'C'], y: [-44, -310, -7], name: 'Series 3' }
      ],
      { barmode: 'relative', hovermode: 'x unified', hoverlabel: { align: 'right' } }
  );