[LineChart] Support `orientation` (similar to BarChart)

[techniq]

Currently AreaChart and LineChart expect a horizontal (left/right) layout, but can easily be updated to support a vertical (top/bottom) layout, similar to BarChart (the orientation values might make sense to invert compared to BarChart as it's the chart layout and not the marks)

You can accomplish this manually with Chart / Line / etc...

<div class="h-[600px] w-[400px] p-4 border rounded-sm">
  <Chart
    data={dateSeriesData}
    x="value"
    xNice
    y="date"
    padding={{ left: 16, bottom: 24 }}
    tooltip={{ mode: 'quadtree-y' }}
  >
    <Layer type={shared.renderContext}>
      <Axis placement="left" grid rule />
      <Axis placement="bottom" rule />
      <Spline class="stroke-2 stroke-primary" />
      <Highlight points lines />
    </Layer>

    <Tooltip.Root>
      {#snippet children({ data })}
        <Tooltip.Header value={data.date} format="day" />
        <Tooltip.List>
          <Tooltip.Item label="value" value={data.value} />
        </Tooltip.List>
      {/snippet}
    </Tooltip.Root>
  </Chart>
</div>

CleanShot.2025-09-15.at.16.15.45.mp4

Have supporting this with <LineChart x="value" y="date" orientation="vertical"> to streamline the setup, easily support multiple series, etc would be optimal.

This will mostly just adding a few conditions to use x instead of y, and use quadtree-y instead of quadtree-x tooltip mode.

-Set x instead of y accessors: spline props, points props, labels props, highlight props, chart props, etc

• Use quadtrree-y instead of quadtree-x tooltip mode

[techniq]

Available in 2.0.0-next.39